feat(web): screens from docs/mock — focus flow, today, meds, doctor, profile

- /flow renders the dialog engine's current step as a mock screen (consent,
  age, onboarding and scales with progress, mood 0–10, free text, dose
  reminder, crisis with hotlines and breathing, safety plan), so every
  engine scenario gets the design without duplicating its logic
- today / meds / doctor / profile / messages tabs; navy sidebar and
  emergency rail on desktop, emergency block and tab bar on phones
- API: GET /me/{token}/today (today's doses, week marks, next visit, demo
  clock time); demo ЕМИАС sign-in seeds the persona's synthetic profile and
  prescription from the dashboard fixtures

Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
This commit is contained in:
2026-10-04 08:11:45 +03:00
co-authored by Claude Opus 5.5
parent b8a93ce9d4
commit b4b1bc51c8
28 changed files with 3795 additions and 1770 deletions
+115
View File
@@ -0,0 +1,115 @@
import { createContext, useCallback, useContext, useEffect, useMemo, useRef, useState, type ReactNode } from "react";
import { api } from "../api/client";
import type { DialogEvent, Reply } from "../api/types";
import { useSession } from "../session/SessionContext";
import { sessionStore, type ChatEntry, type DialogSnapshot } from "../session/store";
/*
* One conversation with the dialog engine per signed-in patient, shared by every screen:
* focus screens render `pending` (the latest unanswered batch), «Сообщения» renders `entries`.
* The engine owns the logic (consent, onboarding, scales, check-ins, meds, crisis) — exactly as in Telegram.
*/
const OUTBOX_POLL_MS = 6000;
let seq = 0;
const newId = () => `${Date.now().toString(36)}-${(seq++).toString(36)}`;
const asEntries = (replies: Reply[]): ChatEntry[] => replies.map((reply) => ({ id: newId(), from: "assistant", reply }));
interface DialogApi extends DialogSnapshot {
busy: boolean;
error: boolean;
started: boolean;
/** Sends an event; `echo` is what the patient «said» (button label / text) for the history. */
send: (event: DialogEvent, echo?: string) => Promise<boolean>;
start: () => Promise<boolean>;
markRead: () => void;
}
const Ctx = createContext<DialogApi | null>(null);
const EMPTY: DialogSnapshot = { entries: [], pending: [], unread: 0 };
export function DialogProvider({ children }: { children: ReactNode }) {
const { session } = useSession();
const token = session?.token ?? null;
const [owner, setOwner] = useState(token);
const [snap, setSnap] = useState<DialogSnapshot>(() => (token ? sessionStore.loadDialog(token) : EMPTY));
const [busy, setBusy] = useState(false);
const [error, setError] = useState(false);
const tokenRef = useRef(token);
tokenRef.current = token;
// Switching accounts: reset to that token's snapshot during render, so it is never saved under another token.
if (owner !== token) {
setOwner(token);
setSnap(token ? sessionStore.loadDialog(token) : EMPTY);
setError(false);
}
useEffect(() => {
if (token && owner === token) sessionStore.saveDialog(token, snap);
}, [token, owner, snap]);
const send = useCallback(
async (event: DialogEvent, echo?: string) => {
const t = tokenRef.current;
if (!t) return false;
setBusy(true);
setError(false);
try {
const replies = await api.sendEvent(t, event);
setSnap((prev) => ({
entries: [
...prev.entries,
...(echo ? [{ id: newId(), from: "patient" as const, text: echo }] : []),
...asEntries(replies),
],
pending: replies,
unread: 0,
}));
return true;
} catch {
setError(true);
return false;
} finally {
setBusy(false);
}
},
[],
);
const start = useCallback(() => send({ type: "start" }), [send]);
const markRead = useCallback(() => setSnap((prev) => (prev.unread ? { ...prev, unread: 0 } : prev)), []);
// System-initiated messages (reminders, check-ins, scales) arrive through the outbox.
useEffect(() => {
if (!token) return;
const timer = window.setInterval(() => {
api
.outbox(token)
.then((replies) => {
if (!replies.length || tokenRef.current !== token) return;
setSnap((prev) => ({
entries: [...prev.entries, ...asEntries(replies)],
pending: replies,
unread: prev.unread + replies.length,
}));
})
.catch(() => undefined);
}, OUTBOX_POLL_MS);
return () => window.clearInterval(timer);
}, [token]);
const value = useMemo<DialogApi>(
() => ({ ...snap, busy, error, started: snap.entries.length > 0, send, start, markRead }),
[snap, busy, error, send, start, markRead],
);
return <Ctx.Provider value={value}>{children}</Ctx.Provider>;
}
export function useDialog(): DialogApi {
const value = useContext(Ctx);
if (!value) throw new Error("useDialog outside DialogProvider");
return value;
}