The bar that three agents kept splitting by hand is now part of Gantt

⁠Build log series⁠: Each round I give an AI that has never seen Gunjo (@gunjo/ui) the public npm package and the gunjo.jp docs and nothing else, then ask for a working screen. ⁠This was the first staff-facing air round⁠, an ⁠operations control center and aircraft rotation console⁠ covering the operations board, tail rotations, and irregular operations alerts.

After passenger-facing flight booking in #112, this moved to the staff side. The question I cared about: ⁠would aircraft rotation, where each aircraft's day is a chain of flight, turnaround, and maintenance, become the third case for the missing segmented Gantt bar, which is recorded on issue #354 and was standing at two of three?⁠

Result: 4/5, and the third Gantt segments case fired

The screen passed tsc and build, fit at 375px, and produced no console errors across metrics, the operations board, rotations, and irregular operations alerts. The agent reported:

⁠Five of the six surfaces worked with no changes.⁠ StatGroup for metrics, ActionQueue for irregular operations ("this is exactly the component, written for triaging operational disruption"), DataTable for the operations board with renderCard on mobile, and Drawer with MetadataList and RouteStops to open a rotation. ⁠The only real gap was the aircraft rotation timeline.⁠ ⁠Gantt is the right family of components, but it had to be bent. There is no segments[].⁠ A GanttItem is a single {start, end, tone, label}, so one bar cannot hold the internal split of flight, turnaround, and maintenance. "⁠I approximated each aircraft's day with several adjacent bars.⁠ Handling rotations natively needs segments:{start,end,tone,label,kind}[] inside one item, along with the idea of a turnaround."

⁠Three rounds in a row.⁠ Crew rosters in #107 (depot departure, train, turnback, depot return), the inspection plan in #108 (intake, overhaul, release), and aircraft rotation here (flight, turnaround, maintenance). ⁠Three separate agents independently hand-rolled their way around the same thing: one bar that needed to be divided.⁠ The rule of three fired, so I extended Gantt.

What I built: segments[] on Gantt

{ id, rowId, start, end, label, segments: [
  { start, end, tone: "info", label: "NH055 HND-CTS", kind: "flight" },
  { start, end, tone: "muted", kind: "turnaround" },    // the gap renders as the bar's own track
  { start, end, tone: "warning", label: "Line maintenance", kind: "maintenance" },
]}

• One bar now holds internal spans with their own tones, so ⁠an aircraft rotation (flight, turnaround, flight, maintenance), a crew duty (depot departure, running the train, depot return), and a shop visit (intake, overhaul, release)⁠ each fit in a single item. The gap for a turnaround shows as the bar's underlying track.
• kind and label fold into the accessible name of the bar. ⁠It is backward compatible⁠: an item with no segments renders as the single fill it always did.
• That closes half of issue #354 in PR#360, verified on a real render with three aircraft carrying five, three, and three segments, laid out left to right by their times, with every segment folded into the accessible name and no errors.

⁠The other half is the time axis.⁠ The agent also pointed out that the Gantt axis runs in day columns with no hour ticks, so the agent hand-rolled a time ruler for a single day of rotations. An axisUnit:"hour" mode is a separate request that I hold with lower confidence: crew rosters in #107 and these rotations put it at two of three. It stays on issue #354 until the next intraday screen confirms it.

⁠What I built under src this round: Gantt segments, on its third case.⁠ ⁠ActionQueue was rediscovered for irregular operations, its fifth consecutive round.⁠

What I took away: mode-specific staff foundations also settle under the rule of three

Foundations shared across industries, such as StatGroup, AmountBreakdown, ActionQueue, and ListCard, pay off everywhere at once. ⁠Gantt segments are the other shape: a foundation specific to industries that schedule resources over time.⁠ Rail crew rosters, rail vehicle inspections, and airline rotations produced the same wish across two industries and three screens, and the third settled it. SeatMap (two of three), TransitItinerary (one of three), and Stringline (one of three) follow the same accumulate-across-modes pattern. ⁠The rule of three sorts both kinds at the same threshold.⁠ And because the agent designed the API down to segments[], turning it into a component was transcription rather than guesswork.

Next up: build log #114

• A second staff-facing air screen, crew pairing or stand management, or the next mode: bus, taxi, or trucking, on either the staff or the passenger side. I keep watching for a third SeatMap case and second cases for Stringline and TransitItinerary.

The run

• ⁠gunjo.jp⁠ / ⁠Gantt⁠ / ⁠ActionQueue⁠ / the by-use-case table ⁠/docs/by-use-case⁠ / npm @gunjo/ui / ⁠GitHub⁠ / previous rounds #1 through #112
• ⁠GunjoUI by UIXHERO⁠

A bar hand-rolled on three screens went into Gantt the same day. Mode-specific foundations settle under the same rule as shared ones.