improvement: treatment preview and treatment history components overhauled. draft & completed status for treatment plan completely removed from the flow.

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

@@ -4,6 +4,11 @@ import { useRef } from 'react';
 import { useTranslations } from 'next-intl';
 import { Button } from '@/components/ui/shared/Button';
 import { Dropdown } from '@/components/ui/shared/Dropdown';
+import {
+  autosaveStatusClass,
+  labPendingBannerClass,
+  labSentBannerClass,
+} from '@/components/ui/treatment/treatmentStatusStyles';
 import type { TreatmentDetailDraft } from '@/types/treatment';
 import { TREATMENT_TYPE_COLORS, treatmentTypeLabelKey } from '@/components/ui/treatment/treatmentTypeDisplay';
 
@@ -13,12 +18,12 @@ interface TreatmentDetailsEditorProps {
   onActiveDetailChange: (id: string) => void;
   onDetailsChange: (details: TreatmentDetailDraft[]) => void;
   isDetailLocked: (detail: TreatmentDetailDraft) => boolean;
+  labDependentCodes: Set<string>;
   disabled: boolean;
   canEdit: boolean;
   saveStatus: 'idle' | 'dirty' | 'saving' | 'saved' | 'error';
   uploadBusy: boolean;
   onAddDetail: () => void;
-  onPreview: () => void;
   onUploadFiles: (files: FileList | null) => void;
 }
 
@@ -28,16 +33,15 @@ export function TreatmentDetailsEditor({
   onActiveDetailChange,
   onDetailsChange,
   isDetailLocked,
+  labDependentCodes,
   disabled,
   canEdit,
   saveStatus,
   uploadBusy,
   onAddDetail,
-  onPreview,
   onUploadFiles,
 }: TreatmentDetailsEditorProps) {
   const t = useTranslations('treatment');
-  const tCommon = useTranslations('common');
   const attachmentInputRef = useRef<HTMLInputElement>(null);
   const activeDetail = details.find((d) => d.clientId === activeDetailId) ?? details[0];
 
@@ -46,6 +50,8 @@ export function TreatmentDetailsEditor({
   const locked = isDetailLocked(activeDetail);
   const readOnly = disabled || locked;
   const treatmentTypeTextColor = TREATMENT_TYPE_COLORS[activeDetail.treatmentType];
+  const isLabDependent = labDependentCodes.has(activeDetail.treatmentType);
+  const showPendingLabHint = isLabDependent && !locked && !readOnly;
 
   return (
     <div className="surface-card p-4 space-y-4">
@@ -54,14 +60,9 @@ export function TreatmentDetailsEditor({
           <h3 className="text-sm font-semibold text-text-primary">{t('detailsTitle')}</h3>
           <p className="text-xs text-text-muted mt-0.5">{t('detailsSubtitle')}</p>
         </div>
-        <div className="flex flex-wrap items-center gap-2">
-          <Button type="button" variant="secondary" disabled={!canEdit || disabled} onClick={onPreview}>
-            {tCommon('preview')}
-          </Button>
-          <Button type="button" variant="primary" disabled={!canEdit || disabled} onClick={onAddDetail}>
-            {t('addDetail')}
-          </Button>
-        </div>
+        <Button type="button" variant="primary" disabled={!canEdit || disabled} onClick={onAddDetail}>
+          {t('addDetail')}
+        </Button>
       </div>
 
       <div className="flex flex-wrap gap-2">
@@ -88,9 +89,10 @@ export function TreatmentDetailsEditor({
 
       <div className="space-y-4 border border-border/60 rounded-[var(--radius-md)] p-4 bg-background-secondary/30">
         {locked && (
-          <p className="text-xs text-text-muted rounded-[var(--radius-sm)] border border-border/50 bg-background-secondary/50 px-2 py-1.5">
-            {t('detailLockedInShipment')}
-          </p>
+          <p className={labSentBannerClass}>{t('detailLockedInShipment')}</p>
+        )}
+        {showPendingLabHint && (
+          <p className={labPendingBannerClass}>{t('detailPendingLabSend')}</p>
         )}
 
         <label className="block text-xs font-medium text-text-secondary">
@@ -173,9 +175,7 @@ export function TreatmentDetailsEditor({
 
       {canEdit && saveStatus !== 'idle' && (
         <p
-          className={`text-xs pt-2 border-t border-border/60 ${
-            saveStatus === 'error' ? 'text-red-500' : 'text-text-muted'
-          }`}
+          className={`text-xs pt-2 border-t border-border/60 ${autosaveStatusClass(saveStatus)}`}
           role="status"
           aria-live="polite"
         >