All files / src/pages/flowsheet-page/flowsheet/LeftSideBar/Revisions FlowsheetRevisionControls.tsx

95.65% Statements 22/23
50% Branches 16/32
33.33% Functions 1/3
100% Lines 19/19

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 65 66 67 68 69 70 71 72 73 74 75 76 77                                  21x         21x                         21x     2x       23x 21x 105x   21x 21x   21x   42x 105x 2x 21x       23x 2x                       21x 63x 63x      
import { CircleHelp, Loader2, Save } from "lucide-react";
import { Button } from "@/ahuora-design-system/ui/button";
import { Checkbox } from "@/ahuora-design-system/ui/checkbox";
import { Label } from "@/ahuora-design-system/ui/label";
import { ToolTipCover } from "@/ahuora-design-system/ui/tooltip";
 
type FlowsheetRevisionControlsProps = {
  flowsheetId: number;
  autoSaveEnabled: boolean;
  autoSavePending: boolean;
  savePending: boolean;
  disabled?: boolean;
  onSave: () => void;
  onAutoSaveChange: (enabled: boolean) => void;
};
 
/** Actions that affect the current flowsheet rather than one saved revision. */
export function FlowsheetRevisionControls({
  flowsheetId,
  autoSaveEnabled,
  autoSavePending,
  savePending,
  disabled = false,
  onSave,
  onAutoSaveChange,
}: FlowsheetRevisionControlsProps) {
  return (
    <section
      aria-label="Version saving controls"
      className="space-y-0.5 rounded-md bg-secondary/30 p-1.5"
    >
      <Button
        variant="ghost"
        size="sm"
        className="h-8 w-full justify-start gap-2 px-2"
        disabled={disabled || savePending}
        onClick={onSave}
      >
        {savePending ? (
          <Loader2 className="h-4 w-4 animate-spin" />
        ) : (
          <Save className="h-4 w-4" />
        )}
        {savePending ? "Saving version..." : "Save version"}
      </Button>
      <div className="flex items-center gap-2 rounded-md px-2 py-1.5 hover:bg-secondary/20">
        <Checkbox
          id={`auto-save-revision-${flowsheetId}`}
          checked={autoSaveEnabled}
          disabled={disabled || autoSavePending}
          aria-description="Not used for MSS or dynamic runs."
          onCheckedChange={(checked) => onAutoSaveChange(checked === true)}
        />
        <Label
          htmlFor={`auto-save-revision-${flowsheetId}`}
          className="min-w-0 cursor-pointer text-xs font-normal leading-tight peer-disabled:cursor-not-allowed peer-disabled:opacity-70"
        >
          Save after each successful solve
        </Label>
        <ToolTipCover
          asChild
          delay={0}
          content="Not used for MSS or dynamic runs."
        >
          <button
            type="button"
            aria-label="About automatic versions"
            className="ml-auto shrink-0 rounded-sm text-muted-foreground outline-none hover:text-foreground focus-visible:ring-2 focus-visible:ring-ring"
          >
            <CircleHelp className="h-4 w-4" />
          </button>
        </ToolTipCover>
      </div>
    </section>
  );
}