All files / src/pages/flowsheet-page/flowsheet/revisions FlowsheetRevisionPreviewBanner.tsx

84.61% Statements 33/39
53.33% Branches 16/30
42.85% Functions 3/7
100% Lines 23/23

Press n or j to go to the next uncovered block, b, p or k for the previous block.

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64                        1274x 1274x 1274x   1274x 1499x 1274x 1274x   3480x 1243x   38x           31x 38x             1x         36x 31x 23x               54x 31x 31x   31x 93x 124x 155x      
import { History, RotateCcw } from "lucide-react";
import { useState } from "react";
import { Button } from "@/ahuora-design-system/ui/button";
import { useFlowsheetRevisionPreview } from "@/hooks/flowsheetRevisionPreview";
import { useFlowsheet } from "@/hooks/project";
import { getFlowsheetAccess } from "@/lib/flowsheetAccess";
import { FlowsheetRevisionRestoreDialog } from "./FlowsheetRevisionDialogs";
import { FlowsheetRevisionPreviewSwitcher } from "./FlowsheetRevisionPreviewSwitcher";
import { useRestoreFlowsheetRevision } from "./useRestoreFlowsheetRevision";
import { getFlowsheetVersionLabel } from "./versionLabels";
 
/** Persistent product-language status and escape hatch for historical reads. */
export function FlowsheetRevisionPreviewBanner() {
  const [restoreOpen, setRestoreOpen] = useState(false);
  const flowsheet = useFlowsheet();
  const { isPreview, revision, returnToCurrent } =
    useFlowsheetRevisionPreview();
  const canRestore = getFlowsheetAccess(flowsheet)?.can_edit ?? false;
  const { restoreRevision, isRestoring } = useRestoreFlowsheetRevision({
    flowsheetId: flowsheet?.id ?? 0,
    onRestored: returnToCurrent,
  });
  Iif (!isPreview || !revision) return null;
 
  const label = getFlowsheetVersionLabel(revision);
  return (
    <section
      aria-label="Version preview"
      className="flex min-h-10 items-center justify-center gap-3 border-b bg-secondary/30 px-4 py-1.5 text-sm"
    >
      <History className="h-4 w-4 shrink-0" aria-hidden="true" />
      <span className="font-medium">Viewing {label}</span>
      {canRestore && (
        <Button
          type="button"
          variant="default"
          size="sm"
          className="h-7"
          onClick={() => setRestoreOpen(true)}
        >
          <RotateCcw className="h-3.5 w-3.5" aria-hidden="true" />
          Restore
        </Button>
      )}
      <FlowsheetRevisionPreviewSwitcher />
      <Button
        type="button"
        variant="outline"
        size="sm"
        className="h-7 bg-background"
        onClick={returnToCurrent}
      >
        Return to current
      </Button>
      <FlowsheetRevisionRestoreDialog
        restoreTarget={restoreOpen ? revision : null}
        restorePending={isRestoring}
        onDismissRestore={() => setRestoreOpen(false)}
        onConfirmRestore={() => void restoreRevision(revision)}
      />
    </section>
  );
}