# Applicant projects

A React block (a whole screen) in [Beamline](https://beamline.io/)'s [Government & legal](https://beamline.io/components/apps/government-legal) app. Live demo: https://beamline.io/components/applicant-projects

An applicant's permits on a city's portal in one place. Projects through saved views (theirs, their company's, expiring within 30 days) and a search, drafts kept apart from submitted applications with when they were saved and a way to continue, submitted ones with reference, address, permit, status and expiry. Everything waiting on the applicant grouped by the work it takes (pay, with the total across permits; upload; answer corrections; ask for inspections) rather than by project, overdue items said. Inspections across projects by state, on a plan of the town and in a list, a pin and its row marked together. Each submitted permit says the next thing it needs from the applicant (late in red, with how many more things wait) or, when nothing does, its next inspection. With a map base (the map prop) the inspections sit on real streets; without one, on a plain town plan.

## Use it for

- A contractor's or resident's home on a permitting or licensing portal.
- Any portal where work waiting on someone is better grouped by kind than by case.

## Not for

- One permit in depth ([permit-record](https://beamline.io/components/permit-record)).
- The city's own review queue.

## Anatomy

- tabs: Projects, To do with its count, Inspections
- projects: saved view and search; drafts with saved date and Continue; submitted with reference, address, permit, status, updated or expiring
- to do: groups by work with icon and count; pay total; each item with its permit, amount and due date
- inspections: states with counts; the town plan with pins; the list with date, window and state

## States

- draft
- expiring soon
- overdue
- nothing waiting
- requested
- confirmed
- passed
- failed

## Keyboard

- Tab through views, projects, items and pins; Enter on a pin marks its row

## Props

| Prop | Type | Default | Description |
| --- | --- | --- | --- |
| `me` (required) | `string` | — | Who is signed in, and their company. |
| `company` (required) | `string` | — |  |
| `projects` (required) | `ApplicantProject[]` | — |  |
| `actions` (required) | `ApplicantAction[]` | — |  |
| `inspections` (required) | `SiteInspection[]` | — |  |
| `today` (required) | `number` | — | Today, for what counts as expiring soon (within 30 days). |
| `defaultTab` | `"inspections" \| "projects" \| "todo"` | — |  |
| `defaultView` | `ProjectView` | — |  |
| `map` | `{ base: MapBase; view?: [x, y, width, height] }` | — | A real map for the inspections (a base from your map data, cropped to `view` in its units); inspections with lon/lat are placed on it. Without it they sit on a plain town plan by x/y. |
| `onOpen` | `((id: string) => void)` | — |  |
| `className` | `string` | — | Classes on the documented visual root; no override by default. |
| `style` | `CSSProperties` | — | Inline styles on the documented visual root; no overrides by default. |
| `ref` | `Ref<HTMLDivElement>` | — | Receives the documented native target or imperative handle; omitted by default. |

## Built from

- tabs
- [segmented-control](https://beamline.io/components/segmented-control)
- [search-field](https://beamline.io/components/search-field)
- badge
- button
- [chip-group](https://beamline.io/components/chip-group)

## Dependencies

`lucide-react`

## Import

```tsx
import { ApplicantProjects } from "@beamline/applicant-projects";
```

## Get it

Applicant projects is part of Beamline UI. Install the parts you need in your React app as compiled packages or editable source. [Get Beamline](https://beamline.io/checkout?pack=complete) · [Connect your agent](https://beamline.io/connect)

## More in Government & legal

- [Permit application](https://beamline.io/components/permit-application): A permit application filled in over several sittings on a city's portal. Steps with how many answers each still misses; the draft saved as you go and…
- [Permit services](https://beamline.io/components/permit-services): Where a permit starts on a city's permitting portal. The work's address resolved to the city (its permits are here) or the county around it (that office…
- [Permit fees](https://beamline.io/components/permit-fees): An applicant's permit fees on a city's portal. What's owed across how many permits and how much of it is overdue; every unpaid invoice with its permit…
- [Permit record](https://beamline.io/components/permit-record): A submitted permit seen by the applicant. The overview leads with what's waiting on them: the corrections to answer before the next version goes in, each…
- [Parcel record](https://beamline.io/components/parcel-record): A property's parcel on a permitting portal. The lot drawn to scale as a site plan: the street, the property lines with their lengths, the dashed setback…
- [Document review](https://beamline.io/components/document-review): A PDF going through review: the document in the viewer with every comment pinned to its place, the reviewers' threads beside it (open or resolved, one…
- [Signing request](https://beamline.io/components/signing-request): A document sent for signature, its signature page drawn in miniature with each side's block in order. Sides sign as numbered stages that move earlier or…
- [Playbook check](https://beamline.io/components/playbook-check): A document's changes checked against a versioned playbook (a rulebook of what's acceptable). Each change shows what it was and is now, then two records…
- [Audit room](https://beamline.io/components/audit-room): A compliance audit seen by the company preparing it or by the auditor reviewing it. Evidence keeps the company's readiness (not ready, flagged, ready for…
- [Agency book](https://beamline.io/components/agency-book): An insurance agency's book in two places. Estimated commission: the report named an estimate (not received or earned), as of a time; each source system…
- [Applicant company](https://beamline.io/components/applicant-company): A contractor's company on a permitting portal. Its identity with the licence and insurance it applies under, each said valid, expiring within 60 days…
- [Lease renewals](https://beamline.io/components/lease-renewals): Leases coming up for renewal. The window leads: every tracked lease placed on the days ahead at its end date, coloured by whose step it is (yours, the…
- [Queue display](https://beamline.io/components/queue-display): The screen in a waiting room, read from across the room. It draws only a public projection of the queue (ticket codes and counters, never a name or a…
- [Visitor journey](https://beamline.io/components/visitor-journey): A visitor's way into a walk-in queue, on their phone. Branches first: each card names its address, whether it's open (until when, closing soon, full, or…

Part of [Beamline UI: polished, editable React components and complete screens for custom applications](https://beamline.io/). [Build your own style from any look; tokens, fonts, radii, motion; not only colours](https://beamline.io/docs/customize).
