All files / src/pages/flowsheet-page/flowsheet/PropertiesSidebar/MachineLearning ProgressBar.tsx

100% Statements 3/3
66.66% Branches 4/6
100% Functions 1/1
100% Lines 3/3

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                15x 15x                     60x                                                  
import { X } from "lucide-react";
import React from "react";
import { Button } from "@/ahuora-design-system/ui/button";
import { DialogClose } from "@/ahuora-design-system/ui/dialog";
import { Separator } from "@/ahuora-design-system/ui/separator";
import { cn } from "@/lib/utils";
 
export default function ProgressBar({ progress }: { progress: number }) {
  const currentStep = progress >= 4 ? 3 : progress;
  const options = [
    "Upload csv",
    "Column mapping",
    "Train model",
    progress === 4 ? "Training failed" : "Success",
  ];
  return (
    <div className="w-full flex flex-col gap-4">
      <div className="flex justify-between items-center">
        <div className="flex w-full gap-7">
          {options.map((option, index) => (
            <h1
              key={option}
              className={cn(
                index !== currentStep && "text-faint",
                "cursor-not-allowed",
              )}
            >
              {index + 1}. {option}
            </h1>
          ))}
        </div>
        <DialogClose asChild>
          <Button
            variant="ghost"
            className="h-max p-0"
            aria-label="close-ml-viewer"
          >
            <X className="icon-medium" />
          </Button>
        </DialogClose>
      </div>
      <Separator />
    </div>
  );
}