# Flight logbook

A React block (a whole screen) in [Beamline](https://beamline.io/)'s [Salon & fitness](https://beamline.io/components/apps/salon-fitness) app. Live demo: https://beamline.io/components/flight-logbook

A pilot's logbook. Total time (with hours brought forward from earlier logbooks), PIC, night, the last 90 days and how many entries are still incomplete. Entries as a logbook page: one flight per line with date, route, aircraft, a column per time the pilot shows, landings (night ones marked) and remarks, each missing value marked where it belongs. The open flight sits under the page: each time beside what its track log measured; an entry with something missing opens ready to complete, a complete one reads as text with Edit; a track value is offered with Use for an empty time (or Use the track's times for all of them at once) and, where a value was recorded, said to differ while the recorded value stays. On a phone the page is a list of flights. Currency as current, due soon or lapsed with the date, and the alternative ways to keep each one, met or counted step by step. Endorsements: signed ones read only with who signed, and a new one is filled from a template, previewed and signed on a signature pad. Fields: which optional fields show and whether times read as decimal or hours and minutes, said to change the display only, with a hidden field that still holds values said.

## Use it for

- A pilot or instructor keeping a flight logbook: completing entries, checking currency and signing endorsements.
- Any personal record of hours with recency rules and signed attestations (dive logs, driving hours, clinical hours).

## Not for

- One recorded flight's tracks, photos and sharing ([flight-record](https://beamline.io/components/flight-record)).
- Planning a route ([flight-route](https://beamline.io/components/flight-route)).

## Anatomy

- totals: total time (brought forward included), PIC, night and the last 90 days (a phone keeps total time), entries to complete
- tabs: Entries, Currency, Endorsements, Fields
- entries: the logbook page (date, route, aircraft, the shown time columns, landings, remarks; Missing in place) or, on a phone, a list; the open flight under it: times beside the track log (Use, Use the track's times, track differs, a tick where they agree), landings, remarks; Edit and Done
- currency: each item with status and date, and its ways with met or steps
- endorsements: signed and unsigned ones; New endorsement with template, student, aircraft, preview, signature and Sign
- fields: Times read as; each optional field's switch; the hidden-but-kept note; display only

## States

- entry missing fields
- track offered
- track differs
- complete
- current
- due soon
- lapsed
- signed
- decimal
- hours and minutes
- hidden with values

## Keyboard

- Tab through the list, then the entry's fields; Enter takes an hours:minutes value

## Props

| Prop | Type | Default | Description |
| --- | --- | --- | --- |
| `entries` (required) | `LogEntry[]` | — |  |
| `onEntryChange` | `((entry: LogEntry) => void)` | — |  |
| `settings` (required) | `LogbookSettings` | — |  |
| `onSettingsChange` | `((s: LogbookSettings) => void)` | — |  |
| `currency` (required) | `CurrencyItem[]` | — |  |
| `endorsements` (required) | `Endorsement[]` | — |  |
| `templates` (required) | `EndorsementTemplate[]` | — |  |
| `onEndorse` | `((e: Endorsement) => void)` | — |  |
| `instructor` (required) | `string` | — | Who signs endorsements: the instructor using the logbook. |
| `today` (required) | `string` | — | "Today" as YYYY-MM-DD. |
| `entry` | `string \| null` | — |  |
| `defaultEntry` | `string \| null` | — |  |
| `onEntrySelect` | `((id: string \| null) => void)` | — |  |
| `tab` | `LogbookTab` | — |  |
| `defaultTab` | `LogbookTab` | — |  |
| `onTabChange` | `((t: LogbookTab) => 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. |
| `carried` | `Partial<Record<TimeField, number>>` | — | Hours brought forward from earlier logbooks, per column; the totals include them. |

## Built from

- tabs
- [number-field](https://beamline.io/components/number-field)
- input
- textarea
- [segmented-control](https://beamline.io/components/segmented-control)
- switch
- select
- [signature-pad](https://beamline.io/components/signature-pad)
- badge
- button

## Dependencies

`lucide-react`

## Import

```tsx
import { FlightLogbook } from "@beamline/flight-logbook";
```

## Get it

Flight logbook 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 Salon & fitness

- [Workout planner](https://beamline.io/components/workout-planner): A training plan a person lives in: the program's next session with its estimate and Start, an exercise replaced for this session only or for every later…
- [Workout logger](https://beamline.io/components/workout-logger): A live training session: every exercise's sets as target-table rows with a done column; marking a set done fills its shape and starts the rest by itself…
- [Training progress](https://beamline.io/components/training-progress): A person's training history: the headline counts (weeks in a row, days since the last workout, workouts this month), a month calendar that names each…
- [Program setup](https://beamline.io/components/program-setup): A training program's setup and living settings: the intake (one question per step, the week drawn as you answer, a failed generation keeping every…
- [Protocol builder](https://beamline.io/components/protocol-builder): A practitioner's reusable protocol and the client copies made from it. Foods and habits each carry a written intent (Include, Reduce, Exclude) in its…
- [Nutrition library](https://beamline.io/components/nutrition-library): A nutrition practice's library. Recipes: ingredients with grams and servings, nutrients per serving summed (energy, protein, carbohydrate, fat, fibre), a…
- [Packages & memberships](https://beamline.io/components/packages-memberships): Prepaid packages and series, built: the packages down the side (version and how many sold, or not on sale yet), the open one beside them. Its price is a…
- [Client forms](https://beamline.io/components/client-forms): A salon's or spa's client forms and who they ask: the forms down the side with where each stands (on, set up and off, not set up yet), the open one…
- [Instructor finder](https://beamline.io/components/instructor-finder): Finding a flight instructor. Search by name or airfield, filter by what you want to learn (each subject with how many teach it nearby), by distance, and…

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).