improvement/ux-overhaul up #61

Merged
rameen merged 24 commits from improvement/ux-overhaul into master 2026-07-14 22:46:19 +03:30
4 changed files with 38 additions and 37 deletions
Showing only changes of commit b7682a2d1c - Show all commits

View File

@@ -70,7 +70,8 @@ Thin route: `app/[locale]/(dashboard)/treatment/page.tsx` (supports `?appointmen
- **Not shipped to lab** — show treatments that have at least one lab-dependent detail (prosthesis via `labDependentCodes`) with `!sentAt`. - **Not shipped to lab** — show treatments that have at least one lab-dependent detail (prosthesis via `labDependentCodes`) with `!sentAt`.
- **Date** — filter on `treatmentAt` matching that local calendar day. - **Date** — filter on `treatmentAt` matching that local calendar day.
- When **not shipped** is on and workspace is live (not browsing), prepend a synthetic **current draft** row (`id: 'current-draft'`) if it has pending lab-dependent details. - When **not shipped** is on, filters **already-fetched** history only (excludes the active appointment row).
- **Previous treatments rail** excludes the active appointment; live draft stays in **Current draft** preview only. Refresh history after lab send.
Helpers: `frontend/src/components/treatment/treatmentHistoryFilters.ts`. Helpers: `frontend/src/components/treatment/treatmentHistoryFilters.ts`.

View File

@@ -25,17 +25,13 @@ export function treatmentMatchesHistoryDate(treatmentAt: string, date: string):
export function filterTreatmentHistoryItems( export function filterTreatmentHistoryItems(
history: PastTreatment[], history: PastTreatment[],
currentDraft: PastTreatment | null,
labDependentCodes: Set<string>, labDependentCodes: Set<string>,
filters: TreatmentHistoryFilters, filters: TreatmentHistoryFilters,
excludeAppointmentId?: string | null,
): PastTreatment[] { ): PastTreatment[] {
const source = (() => { const source = excludeAppointmentId
if (!currentDraft) return history; ? history.filter((item) => item.appointmentId !== excludeAppointmentId)
const withoutCurrentAppointment = currentDraft.appointmentId
? history.filter((item) => item.appointmentId !== currentDraft.appointmentId)
: history; : history;
return [currentDraft, ...withoutCurrentAppointment];
})();
return source.filter((treatment) => { return source.filter((treatment) => {
if (!treatmentMatchesHistoryDate(treatment.treatmentAt, filters.date)) { if (!treatmentMatchesHistoryDate(treatment.treatmentAt, filters.date)) {

View File

@@ -15,7 +15,6 @@ import type { TreatmentCatalogEntry } from '@/types/treatment-catalog';
interface PastTreatmentsPanelProps { interface PastTreatmentsPanelProps {
items: PastTreatment[]; items: PastTreatment[];
currentDraft?: PastTreatment | null;
patientName?: string; patientName?: string;
currentAppointmentId?: string | null; currentAppointmentId?: string | null;
treatmentCatalog: TreatmentCatalogEntry[]; treatmentCatalog: TreatmentCatalogEntry[];
@@ -33,7 +32,6 @@ function formatHistoryTimestamp(iso: string, locale: string): string {
export function PastTreatmentsPanel({ export function PastTreatmentsPanel({
items, items,
currentDraft = null,
patientName, patientName,
currentAppointmentId, currentAppointmentId,
treatmentCatalog, treatmentCatalog,
@@ -54,11 +52,11 @@ export function PastTreatmentsPanel({
const displayedItems = useMemo( const displayedItems = useMemo(
() => () =>
filterTreatmentHistoryItems(items, currentDraft, labDependentCodes, { filterTreatmentHistoryItems(items, labDependentCodes, {
notShippedOnly, notShippedOnly,
date: filterDate, date: filterDate,
}), }, currentAppointmentId),
[items, currentDraft, labDependentCodes, notShippedOnly, filterDate], [items, currentAppointmentId, labDependentCodes, notShippedOnly, filterDate],
); );
function clearFilters() { function clearFilters() {
@@ -119,9 +117,6 @@ export function PastTreatmentsPanel({
> >
{displayedItems.map((treatment) => { {displayedItems.map((treatment) => {
const isSelected = selectedPreviewId === treatment.id; const isSelected = selectedPreviewId === treatment.id;
const isCurrentAppointment =
Boolean(currentAppointmentId) && treatment.appointmentId === currentAppointmentId;
const isLiveDraft = treatment.id === 'current-draft';
return ( return (
<article <article
@@ -152,15 +147,6 @@ export function PastTreatmentsPanel({
> >
{formatHistoryTimestamp(treatment.treatmentAt, locale)} {formatHistoryTimestamp(treatment.treatmentAt, locale)}
</time> </time>
{isLiveDraft ? (
<span className="text-[10px] font-medium uppercase tracking-wide text-primary">
{t('labAttentionCurrentDraft')}
</span>
) : isCurrentAppointment ? (
<span className="text-[10px] font-medium uppercase tracking-wide text-primary">
{t('historyCurrentAppointment')}
</span>
) : null}
</div> </div>
{treatment.details.length === 0 ? ( {treatment.details.length === 0 ? (

View File

@@ -501,12 +501,19 @@ export function TreatmentWorkspace({
const previewTreatment = useMemo(() => { const previewTreatment = useMemo(() => {
if (!selectedPreviewId) return currentDraftPreview; if (!selectedPreviewId) return currentDraftPreview;
return ( const fromHistory =
history.find((item) => item.id === selectedPreviewId) ?? history.find((item) => item.id === selectedPreviewId) ??
historyPanelItems.find((item) => item.id === selectedPreviewId) ?? historyPanelItems.find((item) => item.id === selectedPreviewId);
currentDraftPreview if (
); workspaceMode === 'live' &&
}, [selectedPreviewId, history, historyPanelItems, currentDraftPreview]); currentDraftPreview?.appointmentId &&
(selectedPreviewId === currentDraftPreview.id ||
fromHistory?.appointmentId === currentDraftPreview.appointmentId)
) {
return currentDraftPreview;
}
return fromHistory ?? currentDraftPreview;
}, [selectedPreviewId, history, historyPanelItems, currentDraftPreview, workspaceMode]);
const isBrowsing = selectedPreviewId !== null; const isBrowsing = selectedPreviewId !== null;
@@ -1039,23 +1046,33 @@ export function TreatmentWorkspace({
const ok = workspaceModeRef.current === 'live' ? await flushDraftSave() : true; const ok = workspaceModeRef.current === 'live' ? await flushDraftSave() : true;
if (!ok) return false; if (!ok) return false;
const isHistorical = isTreatmentDayHistorical(treatment.treatmentAt, todayStart); let treatmentToLoad = treatment;
try {
const draftResponse = await treatmentsApi.getDraft(treatment.appointmentId);
if (draftResponse.data) {
treatmentToLoad = draftResponse.data;
}
} catch {
// Fall back to the history snapshot when draft cannot be loaded.
}
const isHistorical = isTreatmentDayHistorical(treatmentToLoad.treatmentAt, todayStart);
setWorkspaceMode(isHistorical ? 'historical' : 'live'); setWorkspaceMode(isHistorical ? 'historical' : 'live');
setSelectedPreviewId(null); setSelectedPreviewId(null);
const nextDay = startOfLocalDay(new Date(treatment.treatmentAt)); const nextDay = startOfLocalDay(new Date(treatmentToLoad.treatmentAt));
setSelectedDay((prev) => (compareLocalDayStart(prev, nextDay) === 0 ? prev : nextDay)); setSelectedDay((prev) => (compareLocalDayStart(prev, nextDay) === 0 ? prev : nextDay));
setSelectionLocked(true); setSelectionLocked(true);
setSelectedAppointmentId(treatment.appointmentId); setSelectedAppointmentId(treatmentToLoad.appointmentId ?? treatment.appointmentId);
skipNextGetDraftRef.current = true; skipNextGetDraftRef.current = true;
draftHydratingRef.current = true; draftHydratingRef.current = true;
hydrateFromTreatment(treatment); hydrateFromTreatment(treatmentToLoad);
draftHydratingRef.current = false; draftHydratingRef.current = false;
if (focusDetailClientId) { if (focusDetailClientId) {
setActiveDetailId(focusDetailClientId); setActiveDetailId(focusDetailClientId);
const mappedLabCases = withoutEmptyLabCaseDrafts( const mappedLabCases = withoutEmptyLabCaseDrafts(
(treatment.labCases ?? []).map(mapLabCaseDraftFromApi), (treatmentToLoad.labCases ?? []).map(mapLabCaseDraftFromApi),
); );
const linked = mappedLabCases.find( const linked = mappedLabCases.find(
(lc) => !lc.sentAt && lc.detailClientId === focusDetailClientId, (lc) => !lc.sentAt && lc.detailClientId === focusDetailClientId,
@@ -1510,6 +1527,7 @@ export function TreatmentWorkspace({
notifyTabBadgesChanged(); notifyTabBadgesChanged();
if (selectedAppointment.patientId) { if (selectedAppointment.patientId) {
void refreshPatientLabCases(selectedAppointment.patientId); void refreshPatientLabCases(selectedAppointment.patientId);
void refreshHistory(selectedAppointment.patientId);
} }
} catch (error: unknown) { } catch (error: unknown) {
showError(getUserFacingError(error, tErrors, t('errorSendCase'))); showError(getUserFacingError(error, tErrors, t('errorSendCase')));
@@ -1523,6 +1541,7 @@ export function TreatmentWorkspace({
persistDraft, persistDraft,
persistLabCases, persistLabCases,
refreshPatientLabCases, refreshPatientLabCases,
refreshHistory,
showSuccess, showSuccess,
showError, showError,
t, t,
@@ -1675,7 +1694,6 @@ export function TreatmentWorkspace({
> >
<PastTreatmentsPanel <PastTreatmentsPanel
items={historyPanelItems} items={historyPanelItems}
currentDraft={null}
currentAppointmentId={selectedAppointmentId} currentAppointmentId={selectedAppointmentId}
treatmentCatalog={treatmentCatalog} treatmentCatalog={treatmentCatalog}
labDependentCodes={labDependentCodes} labDependentCodes={labDependentCodes}