Component Showcase

Org & Team

Tabatha starts as a solo attention tool, but the same clock and context data rolls up into orgs, teams, and a five-level work hierarchy. These are the surfaces that make one person's focus legible to their manager, and one manager's roster legible to everyone on it.

Org & team surfaces

14 components ยท every string lifted verbatim from source

Tabatha runs across more than one browser, machine, and person, and these are the surfaces where that shows. They answer a narrow set of questions: who is working right now, on what, and which shifts were left open by a machine that never clocked out. Live Stints and AbandonedStints exist because of a real failure mode - an install that dies mid-stint leaves a clock running forever, and a ghost shift is worse than a missing one. The schedule surfaces cover the agreement side: required hours, shortfalls, and the requests that change them.

Team Activity

Live status of members in organisations you own / teams you manage. Updates in real time.

P
Priya Raman org:owner ยท team:manager
๐Ÿ–ฅWork Chromeยท๐ŸŽฏ Q1 Report ยท 1h 20m
๐Ÿ’ปStudio Desktopยทโ˜• on break
T
Tomรกs Okafor team:manager
๐Ÿ’ผBusiness Profileยทโธ Learning React
๐Ÿ“ฑPhoneยทno status
W
Wren Halliday org:user
๐ŸŒTabatha Webยท๐ŸŸข clocked in
๐Ÿ Home Laptopยทoffline
๐Ÿ‘ฅ
TeamActivityPanel roster
One row per member, one chip per install of theirs. A manager sees who is clocked in, on break, or drifting, without asking. Chips that miss a heartbeat for five minutes dim to transparent rather than lying about live state.
src/settings/TeamActivityPanel.jsx
Focus states
๐ŸŽฏ Q1 Report ยท 1h 20m
โธ Learning React
โš  over on Q1 Report
Clock states
โ˜• on break
๐ŸŸข clocked in
โšช clocked out
Fallbacks
idle
offline
no status
๐Ÿ”–
StatusChip, all 9 states
A strict precedence ladder: focus state beats clock state, clock state beats presence, and presence beats nothing at all. Only the last three render muted, so a live member never reads as grey.
src/settings/TeamActivityPanel.jsx (StatusChip)
Team Activity

Invite minting and team activity are available to organisation owners and team managers. Ask an owner or manager to send you an invite, or redeem an invite token to join a team.

๐Ÿ”’
Non-manager gate
Read access is enforced server-side, so a regular member would otherwise see an empty panel that looks broken. This note makes the absence deliberate and tells them the way in.
src/settings/TeamActivityPanel.jsx (!canSeeTeamActivity)
Generate Invite Token

Mint a one-shot token for a new member to join. They paste it into Settings โ†’ Team Invite Token on their install.

Organisation
Team (optional)
Role
Expires in (hours)
โœ“ Token generated
Expires Jul 23, 2026, 2:30 PM. Share with the new member โ€” they paste into Settings โ†’ Team Invite Token.
๐ŸŽŸ
Generate Invite Token
Minting runs through a security-definer RPC, so only owners and managers can produce a token. One shot, scoped to an org plus optional team, with an explicit role and expiry rather than an open door.
src/settings/TeamActivityPanel.jsx (handleMint)
Pending Invites
tbta_7Q4XKD2M9VFHRN1P user expires Jul 23 14:30
tbta_B3ZC8LWY6TJK5RQA manager expires Jul 17 08:05
๐Ÿ“ฎ
Pending Invites
Unredeemed, unexpired tokens only. The expiry turns amber inside the last 24 hours so a stale invite gets noticed before it dies, and Revoke kills it for anyone still holding it.
src/settings/TeamActivityPanel.jsx (loadPendingInvites)
Organizations
๐Ÿข Northwindowner
๐Ÿข Fluxuser

No organizations yet. Create one below, or use an invite token to join an existing one.

Teams
๐Ÿ‘ฅ Platformmanager

No teams yet.

๐Ÿข
Organizations + Teams
Membership rows with the caller's role, plus both empty states shown together. Creating an org makes you its owner, which is what unlocks the invite minting panel below it in Settings.
src/settings/index.jsx (Cloud Sync section)
๐Ÿข 2๐ŸŽฏ 4๐Ÿ‘ค 6๐Ÿ“ 9โœ๏ธ 23
โ–พ๐Ÿข Northwind OP ยท 2 init
โ–พ๐ŸŽฏ Q1 Financial Close 3c
โ–พ๐Ÿ‘ค Meridian Foods2p
โ–พ๐Ÿ“ Revenue Model4t
โœ๏ธQ1 revenue chartsactive
โœ๏ธReconcile Jan ledgeractive
โ–ธ๐Ÿ“ Board Deck3t
โ–ธ๐Ÿ‘ค Halcyon Group1p
ยท๐ŸŽฏ Platform Migration 0c
โ–ธ๐Ÿข Flux OP ยท 2 init
๐Ÿ“‹ Unassigned Clients (2)
โ–ธ๐Ÿ‘คSelf1p
ยท๐Ÿ‘คLarkspur Studio0p
๐Ÿ“‚ Unassigned Projects (1)
ยท๐Ÿ“Inbox Triage0t
๐Ÿ›๏ธ

No operations yet. Create one to organize your work hierarchy.

Operations โ†’ Initiatives โ†’ Clients โ†’ Projects โ†’ Tasks

๐ŸŒฒ
InitiativesPanel org tree
The full five-level hierarchy in one collapsible tree, with cascade counts at every node and dedicated buckets for clients and projects that never got a parent. Indentation is level times 16 plus 8, so depth is readable at a glance.
src/home/InitiativesPanel.jsx
๐Ÿ‘คMeridian Foods
2 projectsโ–ผ
Projects
๐Ÿ“ Revenue Model4 tasks
โ˜Q1 revenue charts
โ˜‘๏ธPull Q4 actuals
๐Ÿ“ Board Deck3 tasks
โ˜Draft narrative slide
Completed (4)
โ˜‘๏ธPull Q4 actuals
โ˜‘๏ธConfirm audit window
๐Ÿ‘ค

No clients yet. Add one to start organizing.

๐Ÿ“

No projects yet. Add one and optionally link a client.

โœ…

All tasks complete! Add a new one to keep going.

๐Ÿ—‚
ProjectsClientsPanel
The flat CRUD view over the same hierarchy the tree renders. Three tabs with live counts, inline add, expandable clients that reveal their projects and tasks, and a dimmed Completed shelf so finished work stays visible without competing.
src/home/ProjectsClientsPanel.jsx
4 install(s) ยท 2 offline
๐Ÿ’ผ
Work Chrome this install business ๐Ÿ–ฅ a91f3c
๐ŸŸข clocked in (live) ยท since 9:02 AM Jul 16 ยท last seen 2:41 PM
๐Ÿ’ป
Studio Desktop professional ๐Ÿ–ฅ 6b0d27
โ˜• on break (live) ยท since 8:30 AM Jul 16 ยท last seen 2:39 PM
๐Ÿ–ฅ
Install 9f2a1c work ๐Ÿ–ฅ c4e118
โšช abandoned ยท since 9:02 AM Jul 14 ยท last seen 5:47 PM
This shift was abandoned. Set when it should have ended (defaults to its last heartbeat). The stint is reconstructed and attributed to your matching real profile.
๐Ÿ 
Home Laptop personal ๐Ÿ–ฅ 7d92ab
โšช abandoned (was on break) ยท since 1:15 PM Jul 13 ยท last seen 4:02 PM
๐Ÿ“ฑ
Phone personal ๐Ÿ–ฅ 22ff81
โšช clocked out ยท last seen 11:20 AM
๐Ÿ–ฅ๏ธ

No install activity yet. Once you clock in, your installs appear here.

๐Ÿ“ก
Live Stints panel
Every install this user owns, sorted live shift first, then abandoned, then idle. This is the fix for ghost stints: an install that clocked in and vanished leaves a row nothing else could reach, so Reconcile rebuilds the shift from its last heartbeat instead of double-counting hours.
src/workshifts/index.jsx (LiveStintsView)
โš  Unfinished shifts

2 abandoned shifts to resolve

Another of your installs was left clocked in without clocking out. Fix the end times or discard them before starting a new shift.
โšช Install 9f2a1c Work ๐Ÿ–ฅ c4e118
Abandoned ยท clocked in Jul 14, 9:02 AM ยท last seen Jul 14, 5:47 PM
Set when this shift should have ended (defaults to its last heartbeat). It's reconstructed into your history and attributed to your matching real install.
โšช Home Laptop Personal ๐Ÿ–ฅ 7d92ab
Abandoned while on break ยท clocked in Jul 13, 1:15 PM ยท last seen Jul 13, 4:02 PM
Set when this shift should have ended (defaults to its last heartbeat). It's reconstructed into your history and attributed to your matching real install.
๐Ÿ‘ป
AbandonedStintsModal
The same reconciliation, surfaced at the moment it matters: clocking in again. Freshness is re-checked on open, so an install that came back online is never accused of being abandoned, and the user can always skip through.
src/components/ui/AbandonedStintsModal.jsx
P2Q1 Report๐ŸŽฏ
P5Learning React
Pโ€”Vacation Planning
+3 moreโ€ฆ
No queued intents
๐Ÿ”—
OtherProfilesStrip
Your other installs as chips in the header, each expanding into a read-only view of that device's intent queue. Stale ghosts collapse into one dashed "offline" chip that routes to Live Stints, instead of cluttering the strip with day-old frozen state.
src/components/OtherProfilesStrip.jsx
Connected, with active app
๐Ÿ’ปVisual Studio Code
revenueModel.ts ยท northwind-finance
Connected, no app yet
Desktop Connected
Disconnected
Desktop offline
๐Ÿ–ง
CompanionStatus
The extension's read on the desktop companion: a glowing dot when the local socket is up, plus the foreground app and its window title. This is what keeps Tabatha from calling you idle while you are heads-down in another program.
src/components/CompanionStatus.jsx

๐Ÿ“‹ My Work Profile

๐Ÿ• Dedicated hours ๐Ÿงญ Self-managed
Your weekly schedule is set by your manager. Propose changes below โ€” they take effect once approved.

Required hours

Daily: 8h Weekly: 40h

๐Ÿ—“ Weekly schedule ยท 40h/wk

โœ…Monday09:00 โ†’ 17:00
โœ…Tuesday09:00 โ†’ 17:00
โœ…Wednesday09:00 โ†’ 17:00
โœ…Thursday09:00 โ†’ 17:00
โœ…Friday09:00 โ†’ 17:00
โฌœSaturdayOff
โฌœSundayOff
๐Ÿ—“
Schedule, 3 modes
SELF, MANAGE, and REQUESTS behind one mode switch, gated by role. A dedicated-hours member cannot edit their own grid, only propose a change; a self-managed one sets their own hours but still owes the minimums.
src/workshifts/ScheduleView.jsx
No shortfalls on record. ๐ŸŽ‰
Daily floor ยท Jul 14 ยท missing 1h 20m โš  unresolved
Daily floor ยท Jul 11 ยท missing 45mโœ“ made up
Weekly floor ยท Jul 6 ยท missing 2hโ†’ shifted
Daily floor ยท Jul 3 ยท missing 3h 10mโœ“ excused
Dez Marchetti ยท Make up 1h on Jul 18
Filed Jul 15, 4:12 PM by Dez Marchetti โ€” โ€œClient call ran into my evening block.โ€
๐Ÿ“ญ

No pending change requests.

โš–๏ธ
ShortfallList + Requests inbox
Missed hours are recorded, not silently forgiven. Each shortfall carries an amber border until it is made up, shifted, or excused with a reason, and a manager clears the resulting proposals from one inbox.
src/workshifts/ScheduleView.jsx (ShortfallList, RequestsInbox)