main
2 Commits
| Author | SHA1 | Message | Date | |
|---|---|---|---|---|
| 3bc7d4c355 |
Everything the console can do, on the phone
The phone app shipped with the API layer and the timeline copied from the
console but none of its dialogs, so several things it appeared to offer did
nothing at all:
- Tapping a WhatsApp exchange in the trail called an onOpenChat that was
never passed. The entry rendered, said "Open the conversation — all 7
messages", and there was no conversation to open.
- No screen had a New lead button. The entry activity, its permissions and
its form were all present and unreachable.
- An agent chip opened nothing; the call transcript and the recording were
unreachable; `call_transcript` was rendered as a field value, which is two
thousand characters cut at a hundred and fifty.
- The record showed its first three groups and truncated every long value
mid-sentence. There was no way to see the other sixty-odd fields.
- The action bar rendered only the stage's `do` actions, so Mark Lost, the
re-quote, the reminders and every recovery lever were unreachable — four
stages offered a partner agent one button and no way to drop a lead the
system was working.
- `nudgeFor` was called as nudgeFor(stage.uid, roles) rather than
nudgeFor(stage, lead), so `stage.uid` was undefined, the switch fell
through, and the way out of a stalled lead was never offered.
- The journey rail marked every step left of the current one as done, which
claims steps that never happened: a lead whose documents arrived from
Qualified skips Contacted, and a callback sends it backwards.
The dialogs are COPIED from the console rather than rewritten — the
conversation, the call, the agent card, the lead file, the new-lead form, and
the support desk — for the same reason api/ and Timeline.jsx already were: the
functionality has to be identical, and a second implementation is a second
account of the same lead.
What makes that work on a phone is one CSS block rather than six components.
They all render the console's prose__scrim / prose__dlg chrome, so app.css
re-points that chrome at phone width into a bottom sheet: full width, rounded
top, a grab handle via ::before so the copied markup is untouched, and
env(safe-area-inset-bottom) under the last row. Every dialog in the app becomes
phone-native at once, including the two ClampText was already opening. Above
700px the console's centred dialog is kept, which is right for a tablet.
Also here: the secondary actions get a sheet of their own, grouped by what they
ARE (optional, "lead not moving?", the way out) rather than listed as equals;
the record's long values fold instead of being cut, and the whole file opens
with a filter; the rail reads the audit for which steps this lead actually
entered; the overview grows the sign-off band for the role that owns it; and
the drawer grows Ask the desk for ops.
Verified: build clean, lint unchanged at the app's own baseline of 15, every
class the copied dialogs use resolves in the bundled CSS, and every dialog's
prop contract matches its call site. Not verified in a browser — no browser
tooling in this session.
Co-Authored-By: Claude Opus 5 (1M context) <noreply@anthropic.com>
|
|||
| 6455579cc2 |
The Lead Desk, written for a phone
A separate app from the desktop console, talking to the same platform with the same client. Not a breakpoint on the old one: the two answer different questions. The console answers "what is the state of the book?" across a wide grid; a phone answers "what needs me, and what happened to this one?" in a column you scroll with a thumb. The old console at 390px showed why. Tables scrolled sideways, nine queues stacked above the content ate the first screenful, and the action you came to perform sat below the fold. So every row of every table is a CARD — customer, stage, when it is due, who is holding it, and one line about what is happening. Everything else is one tap away. The queues live in a drawer. The action a lead is waiting on is pinned to the bottom of the screen, where a thumb already is. Shared with the console, because a divergence would be two apps disagreeing about the same lead: the whole api/ layer, ActivityForm, and Timeline — whose audit-row merging (one submission writes three rows) is hard-won and must not be reimplemented twice. Written fresh: the shell, the three screens, and the stylesheet. The colour rule is unchanged and is the product in four colours: blue the AI holds it, amber a person, teal the customer, red risk and nothing else. A PWA, so Add to Home Screen gives a full-screen app; the layout pads for the notch and the home indicator. Verified at 402x874: login, overview, drawer, a queue, and a lead, with no horizontal overflow on any of them. Co-Authored-By: Claude Opus 5 (1M context) <noreply@anthropic.com> |
