II  Work 02  Etainement
2023 to 2026 Web app Built alone

On-sale monitor

A read-only, real-time dashboard that turns the buyer extension's telemetry into live tables, with per-buyer and per-event waiting-room roll-ups for watching an on-sale as it happens.

Role
Built by Scott.
Stack
React · Firestore · Firebase Auth and Hosting · Vite
Where
Etainement, one of the larger US brokers · proprietary
Code
Walkthrough on request
Page load Sign in Queue Queue: Users Queue: Events Cart Confirmation Checkout errors Filter · Pause EVENT VENUE ACTIVE AVG START COUNT 30 LOW 30 HIGH 30 AVG 30 LOWEST Events with activity in the last 30 minutes · 7:02 PM Hartwell Tour · Sat 7:00 PM Northside Arena 14 2,418 212 612 9,870 3,104 188 Linden & Co. · Sat 7:00 PM Riverfront Hall 9 1,106 96 240 6,320 1,920 95 Autumn Series · Sat 7:00 PM Grand Pavilion 6 3,980 58 1,540 12,110 5,640 1,002 Marlowe Live · Sat 7:00 PM Civic Theatre 3 780 31 410 2,960 1,260 331 Cordelia · Sat 7:00 PM Westgate Field 11 5,230 170 2,002 18,640 7,415 1,690 The Quarry · Sat 7:00 PM Harbour Stage 2 640 14 290 1,880 905 290 ACTIVE QUEUES · 14 a.okafor 3 m.reyes 2 j.lindqvist 2 s.park 2 + 4 more 5
Queue: Events a few minutes into a seeded on-sale, the buyer list open on one row. Synthetic buyers, events, and venues.

What it does

The last box in the flow, and a leaf.

Placeholder. The extension records each step of a purchase: event page load, sign-in, waiting-room position, cart attempt, checkout error, order confirmation. A copy of every record lands as a document in Firestore. The monitor signs a viewer in, listens to one collection at a time, and renders the newest records as rows, one tab per record type.

Placeholder. Nothing is polled and nothing is written back. A row appears when its document does. A keyword filter and a pause button are the only controls.

BUYER'S PAGE a cart, an error, a confirmation CONTENT SCRIPT notices it; stamps the browser's time WORKER one record, two destinations INGESTION stamps the upload time; writes one document FIRESTORE pushes it to every listener LISTENER one tab, one collection, newest first REDUCE latest per buyer, account, event TABLE a row appears; roll-ups recomputed t1 · sent, browser clock t2 · uploaded, server clock the live half: push, no polling WAREHOUSE The system of record; the portal's world. Rows are ordered by t2. The gap from document to screen is not recorded anywhere; the write-up quotes no latency figure. BUYER'S PAGE a cart, an error, a confirmation CONTENT SCRIPT notices it; stamps the browser's time t1 · browser clock EXTENSION WORKER one record, two destinations INGESTION ENDPOINT stamps the upload time; writes one document t2 · server clock FIRESTORE pushes it to every listener LISTENER one tab, one collection, newest first REDUCE latest per buyer, account, event TABLE a row appears; roll-ups recomputed The worker also sends every record to the warehouse.
From a buyer's page to the screen. Two clocks stamp the record on the way; rows are ordered by the second.

What was hard

Rebuilding who is in which queue from a stream of positions.

Placeholder. The waiting room produces a stream of position records per browser tab. The monitor has to turn that into "who is in which queue right now, and how well placed are they". Group by buyer, account, and event and keep the newest; count the groups seen in the last three minutes as active; track count, lowest, highest, and average over thirty; and the lowest users-ahead within the hour, because on-sales start on the hour.

Placeholder. This took the most iteration of anything in the project, and was pulled out into pure functions in the 2026 rewrite. Its honest limit: the key leaves out the tab, so one buyer with two tabs on one account collapses into one queue.

THE ON-SALE HOUR · NOW IS 7:02 PM current hour: lowest users ahead last 30 minutes: count, low, high, average 3 minutes: active 6:00 6:15 6:30 6:45 7:00 RAW POSITION RECORDS · ONE PER CHANGE OF THE USERS-AHEAD NUMBER, PER TAB a.okafor · acct 1 · Hartwell a.okafor · acct 2 · Hartwell m.reyes · acct 1 · Hartwell j.lindqvist · acct 1 · Linden ringed: the newest record per key, the only one that survives group by buyer, account, event; keep the latest PER BUYER · QUEUE: USERS a.okafor 2 active 3 · 612 · 9,870 · 3,104 188 m.reyes 1 active 1 · 1,210 · 1,210 · 1,210 1,210 j.lindqvist 1 active 2 · 240 · 6,320 · 3,280 95 active · count, low, high, avg (30 min) · lowest ahead (hour) PER EVENT · QUEUE: EVENTS Hartwell Tour 3 active a.okafor 2, m.reyes 1 2,418 Linden & Co. 1 active j.lindqvist 1 1,106 active · who, how many · average starting position from the hourly window THE ON-SALE HOUR · NOW 7:02 PM 6:00 6:30 7:00 hour · lowest ahead 30 min · stats 3 min · active RAW RECORDS, ONE PER TAB a.okafor · acct 1 a.okafor · acct 2 m.reyes · acct 1 j.lindqvist · acct 1 latest per buyer, account, event PER BUYER a.okafor 2 active low 612 · high 9,870 m.reyes 1 active low 1,210 · high 1,210 j.lindqvist 1 active low 240 · high 6,320 lowest ahead this hour: 188 · 1,210 · 95 PER EVENT Hartwell Tour 3 active a.okafor 2, m.reyes 1 Linden & Co. 1 active j.lindqvist 1 average starting position from the hourly window
Raw records to the latest per key to two roll-ups, with the three windows on the hour.
Walkthrough on requestNext: Pricing portalBack to Etainement in II Work