improvement: lab/clinic commiunication flow completely overhauled. no more shit.

frontend/src/components/ui/treatment/TreatmentWorkspace.tsx

@@ -5,6 +5,12 @@ import { useTranslations } from 'next-intl';
 import { useRouter } from '@/i18n/navigation';
 import { Button } from '@/components/ui/shared/Button';
 import { Checkbox } from '@/components/ui/shared/Checkbox';
+import { PatientSearchCombobox } from '@/components/ui/patient/PatientSearchCombobox';
+import {
+  TreatmentLabCasesPanel,
+  type TreatmentLabCasesScope,
+} from '@/components/ui/treatment/TreatmentLabCasesPanel';
+import { TreatmentRailSection } from '@/components/ui/treatment/TreatmentRailSection';
 import { AppointmentsStrip } from '@/components/ui/treatment/AppointmentsStrip';
 import { FdiToothChart } from '@/components/ui/treatment/FdiToothChart';
 import { LabCasesDispatchPanel } from '@/components/ui/treatment/LabCasesDispatchPanel';
@@ -22,7 +28,9 @@ import {
 } from '@/components/appointments/appointmentTime';
 import { appointmentsApi } from '@/lib/api/appointments';
 import { treatmentCatalogApi } from '@/lib/api/treatment-catalog';
+import { prosthesisCatalogApi } from '@/lib/api/prosthesis-catalog';
 import { treatmentsApi } from '@/lib/api/treatments';
+import { notificationsApi } from '@/lib/api/notifications';
 import { pickAutoAppointment } from '@/components/shared/treatmentSelection';
 import {
   areDetailsPersistable,
@@ -35,14 +43,17 @@ import type { LabDispatchAttentionItem } from '@/components/treatment/labDispatc
 import { collectLabDispatchAttention } from '@/components/treatment/labDispatchAttention';
 import { canEditTreatment, canViewTreatment, canAccessDashboardRoute } from '@/components/shared/permissions';
 import { scrollWithinMainScrollContainer } from '@/components/shared/scrollWithinMain';
-import { useMarkTabReadOnVisit } from '@/lib/hooks/useTabBadgeCounts';
-import { notificationsApi } from '@/lib/api/notifications';
+import { useMarkTabReadOnVisit, useTabBadgeCounts } from '@/lib/hooks/useTabBadgeCounts';
+import { tabBadgesChangedEventName } from '@/lib/tabBadgeUtils';
 import { notifyTabBadgesChanged } from '@/lib/tabBadgeUtils';
+import { useAuth } from '@/lib/hooks/useAuth';
 import { getUserFacingError } from '@/components/shared/formatApiError';
 import { useToast } from '@/lib/hooks/useToast';
+import { usePatientSearchQuery } from '@/lib/hooks/usePatientSearchQuery';
 import type { Organization } from '@/types/organization';
+import type { Patient } from '@/types/patient';
 import type { AppointmentRecord } from '@/types/appointment';
-import type { TreatmentCatalogEntry } from '@/types/treatment-catalog';
+import type { ProsthesisCatalogEntry, TreatmentCatalogEntry } from '@/types/treatment-catalog';
 import type {
   FdiToothId,
   LabCaseDraft,
@@ -53,6 +64,7 @@ import type {
   TreatmentAppointment,
   TreatmentDetailDraft,
 } from '@/types/treatment';
+import type { PatientLabCaseSummary } from '@/types/lab-case-activity';
 
 type WorkspaceMode = 'live' | 'historical';
 
@@ -274,11 +286,16 @@ export function TreatmentWorkspace({
 }: TreatmentWorkspaceProps) {
   const t = useTranslations('treatment');
   const tErrors = useTranslations('errors');
+  const tPatients = useTranslations('patients');
   const router = useRouter();
+  const { user } = useAuth();
   const { showError, showSuccess, messages: toastMessages } = useToast();
+  const locale = user?.language ?? 'en';
   const canView = canViewTreatment(currentOrganization);
   const canEdit = canEditTreatment(currentOrganization);
   useMarkTabReadOnVisit();
+  const tabBadgeCounts = useTabBadgeCounts();
+  const initialLabCasesScopeSetRef = useRef(false);
 
   const [stripHidden, setStripHidden] = useState(false);
   const todayStart = useMemo(() => startOfLocalDay(new Date()), []);
@@ -292,10 +309,29 @@ export function TreatmentWorkspace({
   const [history, setHistory] = useState<PastTreatment[]>([]);
   const [historyLoading, setHistoryLoading] = useState(false);
   const [historyPatientId, setHistoryPatientId] = useState<string | null>(null);
+  const [patientLabCases, setPatientLabCases] = useState<PatientLabCaseSummary[]>([]);
+  const [patientLabCasesLoading, setPatientLabCasesLoading] = useState(false);
+  const [unreadLabCases, setUnreadLabCases] = useState<PatientLabCaseSummary[]>([]);
+  const [unreadLabCasesLoading, setUnreadLabCasesLoading] = useState(false);
+  const [labCasesScope, setLabCasesScope] = useState<TreatmentLabCasesScope>('patient');
+  const [selectedRailLabCaseId, setSelectedRailLabCaseId] = useState<string | null>(null);
+  const [searchedPatient, setSearchedPatient] = useState<Pick<
+    Patient,
+    'id' | 'firstName' | 'lastName'
+  > | null>(null);
+  const [patientSearchBusy, setPatientSearchBusy] = useState(false);
+
+  const {
+    search: patientSearch,
+    setSearch: setPatientSearch,
+    patients: patientSearchResults,
+    loading: patientSearchLoading,
+  } = usePatientSearchQuery(canView);
 
   const [orgs, setOrgs] = useState<LinkedOrganizationOption[]>([]);
   const [labDependentCodes, setLabDependentCodes] = useState<Set<string>>(new Set());
   const [treatmentCatalog, setTreatmentCatalog] = useState<TreatmentCatalogEntry[]>([]);
+  const [prosthesisCatalog, setProsthesisCatalog] = useState<ProsthesisCatalogEntry[]>([]);
   const treatmentDropdownCatalog = useMemo(
     () => treatmentCatalog.filter((entry) => entry.availableInTreatment),
     [treatmentCatalog],
@@ -357,11 +393,6 @@ export function TreatmentWorkspace({
     return match?.id ?? null;
   }, [labCaseDrafts, activeDetailId]);
 
-  useEffect(() => {
-    if (!activeSentLabCaseId) return;
-    void notificationsApi.markCaseRead(activeSentLabCaseId).then(() => notifyTabBadgesChanged());
-  }, [activeSentLabCaseId]);
-
   const isDirty = useMemo(
     () => isDetailsDirty(details, savedSnapshot),
     [details, savedSnapshot],
@@ -374,6 +405,55 @@ export function TreatmentWorkspace({
     [appointments, selectedAppointmentId],
   );
 
+  const activePatient = useMemo(() => {
+    if (selectedAppointment) {
+      return {
+        id: selectedAppointment.patientId,
+        firstName: selectedAppointment.patientFirstName,
+        lastName: selectedAppointment.patientLastName,
+        purpose: selectedAppointment.purpose,
+      };
+    }
+    if (searchedPatient) {
+      return {
+        id: searchedPatient.id,
+        firstName: searchedPatient.firstName,
+        lastName: searchedPatient.lastName,
+        purpose: undefined as string | undefined,
+      };
+    }
+    return null;
+  }, [selectedAppointment, searchedPatient]);
+
+  const activePatientId = activePatient?.id ?? null;
+  const activePatientName = activePatient
+    ? `${activePatient.firstName} ${activePatient.lastName}`
+    : null;
+
+  const unreadUpdatesCount = unreadLabCases.length;
+  const otherPatientsUnreadCount = useMemo(
+    () => unreadLabCases.filter((item) => item.patientId !== activePatientId).length,
+    [unreadLabCases, activePatientId],
+  );
+  const displayedLabCases = labCasesScope === 'updates' ? unreadLabCases : patientLabCases;
+  const labCasesListLoading =
+    labCasesScope === 'updates'
+      ? unreadLabCasesLoading && unreadLabCases.length === 0
+      : patientLabCasesLoading && patientLabCases.length === 0;
+  const showLabShipmentsSection = Boolean(activePatient) || unreadUpdatesCount > 0;
+  const labShipmentsSubtitle =
+    labCasesScope === 'updates'
+      ? t('labShipmentsUpdatesScope')
+      : activePatientName
+        ? t('labShipmentsPatientScope', { patientName: activePatientName })
+        : t('labShipmentsSubtitle');
+
+  useEffect(() => {
+    if (selectedAppointment && searchedPatient?.id === selectedAppointment.patientId) {
+      setSearchedPatient(null);
+    }
+  }, [selectedAppointment, searchedPatient?.id]);
+
   const isViewingPastDay = useMemo(
     () => compareLocalDayStart(selectedDay, todayStart) < 0,
     [selectedDay, todayStart],
@@ -429,10 +509,6 @@ export function TreatmentWorkspace({
 
   const isBrowsing = selectedPreviewId !== null;
 
-  const previewHeading = isBrowsing
-    ? t('previewBrowsingTitle')
-    : t('previewCurrentDraft');
-
   const labAttentionItems = useMemo(
     () =>
       collectLabDispatchAttention(
@@ -557,13 +633,15 @@ export function TreatmentWorkspace({
     let cancelled = false;
     void (async () => {
       try {
-        const [orgsResponse, catalogResponse] = await Promise.all([
+        const [orgsResponse, catalogResponse, prosthesisResponse] = await Promise.all([
           treatmentsApi.listLinkedOrganizations(),
           treatmentCatalogApi.list(),
+          prosthesisCatalogApi.list(),
         ]);
         if (cancelled) return;
         setOrgs(orgsResponse.data);
         setTreatmentCatalog(catalogResponse.data);
+        setProsthesisCatalog(prosthesisResponse.data);
         setLabDependentCodes(
           new Set(catalogResponse.data.filter((entry) => entry.labDependent).map((entry) => entry.code)),
         );
@@ -579,21 +657,85 @@ export function TreatmentWorkspace({
   }, [showError, t]);
 
   useEffect(() => {
-    if (!selectedAppointment?.patientId) {
+    if (!activePatientId) {
       setHistoryPatientId(null);
       setHistory([]);
       setHistoryLoading(false);
+      setPatientLabCases([]);
+      setPatientLabCasesLoading(false);
+      setSelectedRailLabCaseId(null);
       return;
     }
-    const nextPatientId = selectedAppointment.patientId;
     setHistoryPatientId((prev) => {
-      if (prev !== nextPatientId) {
+      if (prev !== activePatientId) {
         setHistory([]);
         setHistoryLoading(true);
       }
-      return nextPatientId;
+      return activePatientId;
     });
-  }, [selectedAppointment?.patientId]);
+  }, [activePatientId]);
+
+  const refreshPatientLabCases = useCallback(
+    async (patientId: string, options?: { silent?: boolean }) => {
+      const silent = options?.silent ?? false;
+      if (!silent) setPatientLabCasesLoading(true);
+      try {
+        const response = await treatmentsApi.listPatientLabCases(patientId);
+        setPatientLabCases(response.data ?? []);
+      } catch {
+        if (!silent) setPatientLabCases([]);
+      } finally {
+        if (!silent) setPatientLabCasesLoading(false);
+      }
+    },
+    [],
+  );
+
+  const refreshUnreadLabCases = useCallback(async (options?: { silent?: boolean }) => {
+    const silent = options?.silent ?? false;
+    if (!silent) setUnreadLabCasesLoading(true);
+    try {
+      const response = await treatmentsApi.listUnreadLabCases();
+      setUnreadLabCases(response.data ?? []);
+    } catch {
+      if (!silent) setUnreadLabCases([]);
+    } finally {
+      if (!silent) setUnreadLabCasesLoading(false);
+    }
+  }, []);
+
+  const handleLabCaseMarkedRead = useCallback((labCaseId: string) => {
+    setPatientLabCases((prev) =>
+      prev.map((item) => (item.labCaseId === labCaseId ? { ...item, hasUnread: false } : item)),
+    );
+    setUnreadLabCases((prev) => prev.filter((item) => item.labCaseId !== labCaseId));
+  }, []);
+
+  useEffect(() => {
+    void refreshUnreadLabCases();
+  }, [refreshUnreadLabCases]);
+
+  useEffect(() => {
+    if (initialLabCasesScopeSetRef.current) return;
+    if ((tabBadgeCounts.treatment ?? 0) > 0) {
+      setLabCasesScope('updates');
+      initialLabCasesScopeSetRef.current = true;
+      return;
+    }
+    if (activePatientId) {
+      setLabCasesScope('patient');
+      initialLabCasesScopeSetRef.current = true;
+    }
+  }, [tabBadgeCounts.treatment, activePatientId]);
+
+  useEffect(() => {
+    if (unreadLabCases.length === 0 && labCasesScope === 'updates' && activePatientId) {
+      setLabCasesScope('patient');
+    }
+    if (unreadLabCases.length > 0 && !activePatientId && labCasesScope === 'patient') {
+      setLabCasesScope('updates');
+    }
+  }, [unreadLabCases.length, labCasesScope, activePatientId]);
 
   useEffect(() => {
     if (!historyPatientId) return;
@@ -604,6 +746,7 @@ export function TreatmentWorkspace({
         const response = await treatmentsApi.listPatientHistory(historyPatientId, 50);
         if (requestId !== historyRequestRef.current) return;
         setHistory(response.data);
+        void refreshPatientLabCases(historyPatientId);
       } catch (error: unknown) {
         if (requestId !== historyRequestRef.current) return;
         showError(getUserFacingError(error, tErrors, t('errorLoadHistory')));
@@ -613,7 +756,16 @@ export function TreatmentWorkspace({
         }
       }
     })();
-  }, [historyPatientId, showError, t]);
+  }, [historyPatientId, refreshPatientLabCases, showError, t, tErrors]);
+
+  useEffect(() => {
+    const onBadgesChanged = () => {
+      if (historyPatientId) void refreshPatientLabCases(historyPatientId, { silent: true });
+      void refreshUnreadLabCases({ silent: true });
+    };
+    window.addEventListener(tabBadgesChangedEventName(), onBadgesChanged);
+    return () => window.removeEventListener(tabBadgesChangedEventName(), onBadgesChanged);
+  }, [historyPatientId, refreshPatientLabCases, refreshUnreadLabCases]);
 
   useEffect(() => {
     const appointmentId = selectedAppointment?.id;
@@ -731,11 +883,12 @@ export function TreatmentWorkspace({
       const response = await treatmentsApi.listPatientHistory(patientId, 50);
       if (requestId !== historyRequestRef.current) return;
       setHistory(response.data);
+      void refreshPatientLabCases(patientId);
     } catch (error: unknown) {
       if (requestId !== historyRequestRef.current) return;
       showError(getUserFacingError(error, tErrors, t('errorLoadHistory')));
     }
-  }, [showError, t]);
+  }, [refreshPatientLabCases, showError, t, tErrors]);
 
   const runDraftSave = useCallback(async () => {
     if (!selectedAppointment || saveInFlightRef.current) {
@@ -835,6 +988,7 @@ export function TreatmentWorkspace({
         const ok = await flushDraftSave();
         if (!ok) return;
         resetToLiveContext();
+        setSearchedPatient(null);
         setSelectionLocked(true);
         setSelectedAppointmentId(id);
       })();
@@ -851,6 +1005,7 @@ export function TreatmentWorkspace({
         if (!ok) return;
         const patientIdToRefresh = historyPatientId;
         resetToLiveContext();
+        setSearchedPatient(null);
         setSelectionLocked(false);
         setSelectedDay(startOfLocalDay(day));
         if (patientIdToRefresh) {
@@ -870,7 +1025,11 @@ export function TreatmentWorkspace({
   }, []);
 
   const loadTreatmentIntoWorkspace = useCallback(
-    async (treatment: PastTreatment, focusDetailClientId?: string) => {
+    async (
+      treatment: PastTreatment,
+      focusDetailClientId?: string,
+      options?: { scrollToLabPanel?: boolean },
+    ) => {
       if (!treatment.appointmentId) {
         showError(t('errorNoAppointmentForTreatment'));
         return false;
@@ -882,7 +1041,8 @@ export function TreatmentWorkspace({
       const isHistorical = isTreatmentDayHistorical(treatment.treatmentAt, todayStart);
       setWorkspaceMode(isHistorical ? 'historical' : 'live');
       setSelectedPreviewId(null);
-      setSelectedDay(startOfLocalDay(new Date(treatment.treatmentAt)));
+      const nextDay = startOfLocalDay(new Date(treatment.treatmentAt));
+      setSelectedDay((prev) => (compareLocalDayStart(prev, nextDay) === 0 ? prev : nextDay));
       setSelectionLocked(true);
       setSelectedAppointmentId(treatment.appointmentId);
 
@@ -902,9 +1062,11 @@ export function TreatmentWorkspace({
         if (linked) {
           setActiveLabCaseId(linked.clientId);
         }
-        requestAnimationFrame(() => {
-          scrollWithinMainScrollContainer(labPanelRef.current);
-        });
+        if (options?.scrollToLabPanel !== false) {
+          requestAnimationFrame(() => {
+            scrollWithinMainScrollContainer(labPanelRef.current);
+          });
+        }
       }
 
       return true;
@@ -912,6 +1074,38 @@ export function TreatmentWorkspace({
     [flushDraftSave, hydrateFromTreatment, showError, t, todayStart],
   );
 
+  const handleSelectSearchedPatient = useCallback(
+    (patient: Patient) => {
+      void (async () => {
+        setPatientSearchBusy(true);
+        setSearchedPatient({
+          id: patient.id,
+          firstName: patient.firstName,
+          lastName: patient.lastName,
+        });
+        try {
+          const response = await treatmentsApi.listPatientHistory(patient.id, 1);
+          const latest = response.data[0];
+          if (!latest) {
+            showError(t('errorNoTreatmentForPatient'));
+            setSearchedPatient(null);
+            return;
+          }
+          const ok = await loadTreatmentIntoWorkspace(latest);
+          if (!ok) {
+            setSearchedPatient(null);
+          }
+        } catch (error: unknown) {
+          showError(getUserFacingError(error, tErrors, t('errorNoTreatmentForPatient')));
+          setSearchedPatient(null);
+        } finally {
+          setPatientSearchBusy(false);
+        }
+      })();
+    },
+    [loadTreatmentIntoWorkspace, showError, t, tErrors],
+  );
+
   const handleLoadIntoWorkspace = useCallback(() => {
     if (!previewTreatment) return;
     void loadTreatmentIntoWorkspace(previewTreatment);
@@ -943,6 +1137,97 @@ export function TreatmentWorkspace({
     [exitBrowse, history, historyPanelItems, labCaseDrafts, loadTreatmentIntoWorkspace],
   );
 
+  const activeLabCaseSummary = useMemo(() => {
+    if (activeSentLabCaseId) {
+      return patientLabCases.find((item) => item.labCaseId === activeSentLabCaseId) ?? null;
+    }
+    return patientLabCases.find((item) => item.detailClientId === activeDetailId) ?? null;
+  }, [patientLabCases, activeSentLabCaseId, activeDetailId]);
+
+  const handleLabCaseSummaryChange = useCallback((summary: PatientLabCaseSummary) => {
+    setPatientLabCases((prev) =>
+      prev.map((item) => (item.labCaseId === summary.labCaseId ? summary : item)),
+    );
+  }, []);
+
+  const handleSelectPatientLabCase = useCallback(
+    (item: PatientLabCaseSummary) => {
+      void (async () => {
+        setSelectedRailLabCaseId(item.labCaseId);
+
+        // Ensure a patient context is established before we potentially clear the last unread update,
+        // so the rail section doesn't briefly unmount/collapse.
+        if (item.patientId && item.patientId !== activePatientId) {
+          setSearchedPatient({
+            id: item.patientId,
+            firstName: item.patientFirstName,
+            lastName: item.patientLastName,
+          });
+        }
+
+        try {
+          await notificationsApi.markCaseRead(item.labCaseId);
+          notifyTabBadgesChanged();
+          handleLabCaseMarkedRead(item.labCaseId);
+        } catch {
+          // Non-blocking — workspace navigation still proceeds.
+        }
+
+        let treatment =
+          history.find((entry) => entry.id === item.treatmentId) ??
+          historyPanelItems.find((entry) => entry.id === item.treatmentId) ??
+          (selectedAppointment?.id === item.appointmentId ? currentDraftPreview : null);
+
+        if (!treatment && item.patientId) {
+          try {
+            const response = await treatmentsApi.listPatientHistory(item.patientId, 50);
+            treatment = response.data.find((entry) => entry.id === item.treatmentId) ?? null;
+          } catch (error: unknown) {
+            showError(getUserFacingError(error, tErrors, t('errorLoadHistory')));
+            return;
+          }
+        }
+
+        if (!treatment?.appointmentId) return;
+
+        if (
+          selectedAppointmentId === treatment.appointmentId &&
+          workspaceMode === 'live' &&
+          !isBrowsing
+        ) {
+          setActiveDetailId(item.detailClientId);
+          return;
+        }
+
+        await loadTreatmentIntoWorkspace(treatment, item.detailClientId, {
+          scrollToLabPanel: false,
+        });
+      })();
+    },
+    [
+      activePatientId,
+      currentDraftPreview,
+      handleLabCaseMarkedRead,
+      history,
+      historyPanelItems,
+      isBrowsing,
+      loadTreatmentIntoWorkspace,
+      selectedAppointment?.id,
+      selectedAppointmentId,
+      showError,
+      t,
+      tErrors,
+      workspaceMode,
+    ],
+  );
+
+  useEffect(() => {
+    const match = patientLabCases.find((item) => item.detailClientId === activeDetailId);
+    if (match) {
+      setSelectedRailLabCaseId(match.labCaseId);
+    }
+  }, [activeDetailId, patientLabCases]);
+
   const uploadForDetail = useCallback(
     async (detailClientId: string, files: FileList | File[]) => {
       if (!canEditTreatmentForDay || !selectedAppointment) return;
@@ -1222,6 +1507,9 @@ export function TreatmentWorkspace({
         });
         showSuccess(t('successCaseSent'));
         notifyTabBadgesChanged();
+        if (selectedAppointment.patientId) {
+          void refreshPatientLabCases(selectedAppointment.patientId);
+        }
       } catch (error: unknown) {
         showError(getUserFacingError(error, tErrors, t('errorSendCase')));
       } finally {
@@ -1233,9 +1521,11 @@ export function TreatmentWorkspace({
       selectedAppointment,
       persistDraft,
       persistLabCases,
+      refreshPatientLabCases,
       showSuccess,
       showError,
       t,
+      tErrors,
     ],
   );
 
@@ -1283,82 +1573,147 @@ export function TreatmentWorkspace({
 
       <div className="grid grid-cols-1 xl:grid-cols-[minmax(300px,380px)_minmax(0,1fr)] gap-4 items-start">
         <div className="space-y-3 min-w-0 xl:max-w-[380px]">
-          {selectedAppointment ? (
-            <div className="surface-card p-3 space-y-0.5">
-              <p className="text-[10px] uppercase tracking-wide text-text-muted">{t('selectedPatient')}</p>
-              <p className="text-base font-semibold text-text-primary">
-                {selectedAppointment.patientFirstName} {selectedAppointment.patientLastName}
-              </p>
-              <p className="text-[11px] text-text-secondary">
-                {t('purposeLabel')}{' '}
-                <span className="text-text-primary">
-                  {treatmentTypeLabelFromCatalog(selectedAppointment.purpose, treatmentCatalog)}
-                </span>
-              </p>
-            </div>
-          ) : (
-            <div className="surface-card p-3 text-sm text-text-muted">
-              {apptsLoading ? t('loadingAppointments') : t('selectDayWithAppointment')}
-            </div>
-          )}
+          <div className="surface-card p-3 space-y-3">
+            <PatientSearchCombobox
+              search={patientSearch}
+              onSearchChange={setPatientSearch}
+              patients={patientSearchResults}
+              loading={patientSearchLoading || patientSearchBusy}
+              onSelectPatient={handleSelectSearchedPatient}
+              placeholder={tPatients('searchPlaceholder')}
+              emptyResultsMessage={tPatients('noResults')}
+            />
 
-          <LabDispatchAttentionPanel
-            items={labAttentionItems}
-            treatmentCatalog={treatmentCatalog}
-            labDependentCodes={labDependentCodes}
-            orgs={orgs}
-            onGoToDispatch={handleGoToLabDispatch}
-          />
-
-          {isBrowsing && previewTreatment ? (
-            <div className="rounded-[var(--radius-md)] border border-primary/40 bg-primary/5 px-3 py-3 space-y-3">
-              <p className="text-sm text-text-primary">
-                {t('browseBanner', {
-                  date: new Date(previewTreatment.treatmentAt).toLocaleDateString(undefined, {
-                    weekday: 'short',
-                    year: 'numeric',
-                    month: 'short',
-                    day: 'numeric',
-                  }),
-                })}
-              </p>
-              <div className="flex flex-col gap-2 sm:flex-row sm:flex-wrap">
-                <Button type="button" variant="primary" onClick={handleLoadIntoWorkspace}>
-                  {t('loadIntoWorkspace')}
-                </Button>
-                <Button type="button" variant="ghost" onClick={exitBrowse}>
-                  {t('backToCurrentDraft')}
-                </Button>
+            {activePatient ? (
+              <div className="space-y-0.5 border-t border-border/60 pt-3">
+                <p className="text-[10px] uppercase tracking-wide text-text-muted">{t('selectedPatient')}</p>
+                <p className="text-base font-semibold text-text-primary">{activePatientName}</p>
+                {activePatient.purpose ? (
+                  <p className="text-[11px] text-text-secondary">
+                    {t('purposeLabel')}{' '}
+                    <span className="text-text-primary">
+                      {treatmentTypeLabelFromCatalog(activePatient.purpose, treatmentCatalog)}
+                    </span>
+                  </p>
+                ) : null}
               </div>
-            </div>
+            ) : (
+              <p className="text-sm text-text-muted border-t border-border/60 pt-3">
+                {apptsLoading ? t('loadingAppointments') : t('selectDayWithAppointment')}
+              </p>
+            )}
+          </div>
+
+          {workspaceMode === 'live' && !isBrowsing && selectedAppointment ? (
+            <TreatmentPreviewCard
+              treatment={currentDraftPreview}
+              heading={t('previewCurrentDraft')}
+              labDependentCodes={labDependentCodes}
+              treatmentCatalog={treatmentCatalog}
+              orgs={orgs}
+            />
           ) : null}
 
-          <TreatmentPreviewCard
-            treatment={previewTreatment}
-            heading={previewHeading}
-            labDependentCodes={labDependentCodes}
-            treatmentCatalog={treatmentCatalog}
-            orgs={orgs}
-          />
+          {isBrowsing && previewTreatment ? (
+            <>
+              <div className="rounded-[var(--radius-md)] border border-primary/40 bg-primary/5 px-3 py-2 space-y-2">
+                <p className="text-xs text-text-primary">
+                  {t('browseBanner', {
+                    date: new Date(previewTreatment.treatmentAt).toLocaleDateString(undefined, {
+                      weekday: 'short',
+                      year: 'numeric',
+                      month: 'short',
+                      day: 'numeric',
+                    }),
+                  })}
+                </p>
+                <div className="flex flex-wrap gap-2">
+                  <Button type="button" variant="primary" size="sm" onClick={handleLoadIntoWorkspace}>
+                    {t('loadIntoWorkspace')}
+                  </Button>
+                  <Button type="button" variant="ghost" size="sm" onClick={exitBrowse}>
+                    {t('backToCurrentDraft')}
+                  </Button>
+                </div>
+              </div>
+              <TreatmentRailSection title={t('previewBrowsingTitle')} defaultExpanded>
+                <div className="pt-2">
+                  <TreatmentPreviewCard
+                    treatment={previewTreatment}
+                    heading=""
+                    labDependentCodes={labDependentCodes}
+                    treatmentCatalog={treatmentCatalog}
+                    orgs={orgs}
+                    embedded
+                  />
+                </div>
+              </TreatmentRailSection>
+            </>
+          ) : null}
 
-          <PastTreatmentsPanel
-            items={historyPanelItems}
-            currentDraft={
-              workspaceMode === 'live' && !isBrowsing ? currentDraftPreview : null
-            }
-            patientName={
-              selectedAppointment
-                ? `${selectedAppointment.patientFirstName} ${selectedAppointment.patientLastName}`
-                : undefined
-            }
-            currentAppointmentId={selectedAppointmentId}
-            treatmentCatalog={treatmentCatalog}
-            labDependentCodes={labDependentCodes}
-            orgs={orgs}
-            loading={historyLoading}
-            selectedPreviewId={selectedPreviewId}
-            onSelectTreatment={handleSelectPreviewTreatment}
-          />
+          {labAttentionItems.length > 0 ? (
+            <TreatmentRailSection
+              title={t('labAttentionTitle')}
+              subtitle={t('labAttentionSubtitle')}
+              count={labAttentionItems.length}
+              variant="attention"
+            >
+              <LabDispatchAttentionPanel
+                items={labAttentionItems}
+                treatmentCatalog={treatmentCatalog}
+                labDependentCodes={labDependentCodes}
+                orgs={orgs}
+                onGoToDispatch={handleGoToLabDispatch}
+                compact
+              />
+            </TreatmentRailSection>
+          ) : null}
+
+          {activePatient ? (
+            <TreatmentRailSection
+              title={t('historyPatientScope', {
+                patientName: activePatientName ?? '',
+              })}
+              subtitle={t('historySubtitle')}
+              count={historyPanelItems.length}
+            >
+              <PastTreatmentsPanel
+                items={historyPanelItems}
+                currentDraft={null}
+                currentAppointmentId={selectedAppointmentId}
+                treatmentCatalog={treatmentCatalog}
+                labDependentCodes={labDependentCodes}
+                orgs={orgs}
+                loading={historyLoading}
+                selectedPreviewId={selectedPreviewId}
+                onSelectTreatment={handleSelectPreviewTreatment}
+                compact
+              />
+            </TreatmentRailSection>
+          ) : null}
+
+          {showLabShipmentsSection ? (
+            <TreatmentRailSection
+              title={t('labShipmentsTitle')}
+              subtitle={labShipmentsSubtitle}
+              count={displayedLabCases.length}
+            >
+              <TreatmentLabCasesPanel
+                scope={labCasesScope}
+                onScopeChange={setLabCasesScope}
+                items={displayedLabCases}
+                loading={labCasesListLoading}
+                locale={locale}
+                prosthesisCatalog={prosthesisCatalog}
+                unreadUpdatesCount={unreadUpdatesCount}
+                otherPatientsUnreadCount={otherPatientsUnreadCount}
+                canShowPatientScope={Boolean(activePatient)}
+                selectedLabCaseId={selectedRailLabCaseId ?? activeSentLabCaseId}
+                onSelect={handleSelectPatientLabCase}
+                compact
+              />
+            </TreatmentRailSection>
+          ) : null}
         </div>
 
         <div className="space-y-3 min-w-0 w-full">
@@ -1411,7 +1766,6 @@ export function TreatmentWorkspace({
               setActiveDetailId(next.clientId);
             }}
             onUploadFiles={(files) => void uploadForDetail(activeDetailId, files ?? [])}
-            onCommentError={showError}
           />
 
           <div ref={labPanelRef}>
@@ -1423,6 +1777,15 @@ export function TreatmentWorkspace({
             labCases={labCaseDrafts}
             labDependentCodes={labDependentCodes}
             treatmentCatalog={treatmentCatalog}
+            labCaseSummary={activeLabCaseSummary}
+            locale={locale}
+            onLabCaseSummaryChange={handleLabCaseSummaryChange}
+            onLabCaseMarkedRead={handleLabCaseMarkedRead}
+            onLabCaseActivityChange={() => {
+              if (historyPatientId) {
+                void refreshPatientLabCases(historyPatientId, { silent: true });
+              }
+            }}
             activeLabCaseId={activeLabCaseId}
             onLabCasesChange={handleLabCasesChange}
             disabled={!canEditTreatmentForDay}