Departures

An airport departures board for your agents: each row flips letter by letter as work boards, runs, gets delayed or lands, hand-offs show as connecting flights, and the one waiting on you glows amber with an Approve button.

akatimeline·lanes·schedule

Install

Run this in any project set up for the shadcn CLI. It copies the Departures source into your components folder, so the code is yours to change.

npx shadcn@latest add https://devl.dev/r/departures.json

Use it

Import it and render it. Every prop has a typed default, so it works straight away, and you pass your own data when you’re ready.

import { Departures } from "@/components/departures";

export default function Page() {
  return <Departures />;
}

Built with

A free React component in the Mission Control collection, written in TypeScript with Tailwind CSS on coss ui. MIT licensed.

coss ui: button
npm: lucide-react, motion

Props

Read from the Departures source. Everything is optional unless it says required.

Prop	Type	Default
departuresrequired	Departure[]	—
title	string	"Departures"
time	string	—
onApprove	(id: string) => void	—
className	string	—

More in Mission Control

022

Run List

Keep an eye on every background agent from one calm list, with live clocks, counts by status and a click to see the last few steps or sign off the work.

024

Constellation

Your agents and the tools they reach for, drawn as a small constellation: each call and its answer travel the line as a spark, busy lines glow brighter, and an agent that needs you turns amber with Approve right underneath.

025

Spawn Tree

See which agent started which, with each one's time and cost ticking on its card and every branch adding up what it spent.

026

Conveyor

A job queue on a little conveyor belt: jobs drop on, ride into whichever worker frees up and land in Done or Failed, and when a rate limit hits the belt stops while the backlog chart shows the pile-up and the drain.

Prop

Type

Default

departuresrequired

Departure[]

—

title

string

"Departures"

time

string

—

onApprove

(id: string) => void

—

className

string

—