diff --git a/apps/web/src/samples/components/Tag/BaseWorkflowTag.tsx b/apps/web/src/samples/components/Tag/BaseWorkflowTag.tsx index a4fb68c40..e6cbaa0e3 100644 --- a/apps/web/src/samples/components/Tag/BaseWorkflowTag.tsx +++ b/apps/web/src/samples/components/Tag/BaseWorkflowTag.tsx @@ -1,11 +1,11 @@ +import { cn } from "@app/utils"; import type { ComponentPropsWithoutRef, ElementType, ReactNode } from "react"; -import { cn } from "@/app/utils"; -interface BaseWorkflowTagProps { +type BaseWorkflowTagProps = { as?: T; children: ReactNode; className?: string; -} +}; /** * Base workflow tag component. @@ -24,10 +24,10 @@ export function BaseWorkflowTag({ return ( {children}; -} diff --git a/apps/web/src/samples/components/Tag/WorkflowTag.tsx b/apps/web/src/samples/components/Tag/WorkflowTag.tsx index 983c61788..182940d55 100644 --- a/apps/web/src/samples/components/Tag/WorkflowTag.tsx +++ b/apps/web/src/samples/components/Tag/WorkflowTag.tsx @@ -3,7 +3,6 @@ import Loader from "@base/Loader"; import type { WorkflowState } from "@samples/types"; import { CheckCircle } from "lucide-react"; import { BaseWorkflowTag } from "./BaseWorkflowTag"; -import { WorkflowLabelIcon } from "./WorkflowLabelIcon"; type SampleItemWorkflowTagProps = { displayName: string; @@ -23,13 +22,13 @@ export default function WorkflowTag({ }: SampleItemWorkflowTagProps) { return ( - + {workflowState === "pending" ? ( ) : ( )} - + {displayName} ); diff --git a/apps/web/src/samples/components/Tag/WorkflowTags.tsx b/apps/web/src/samples/components/Tag/WorkflowTags.tsx index 24544a5a5..a4cba822c 100644 --- a/apps/web/src/samples/components/Tag/WorkflowTags.tsx +++ b/apps/web/src/samples/components/Tag/WorkflowTags.tsx @@ -1,7 +1,6 @@ import { getWorkflowDisplayName } from "@app/utils"; import Link from "@base/Link"; import type { SampleWorkflows } from "@samples/types"; -import type { ReactElement } from "react"; import { BaseWorkflowTag } from "./BaseWorkflowTag"; import WorkflowTag from "./WorkflowTag"; @@ -21,38 +20,30 @@ type WorkflowTagsProps = { * @returns The workflow tags for a sample. */ export default function WorkflowTags({ id, workflows }: WorkflowTagsProps) { - const workflowTags = Object.entries(workflows).reduce( - (tags, [key, value]) => { - if (value === "complete" || value === "pending") { - tags.push( - , - ); - } - return tags; - }, - [], - ); + const workflowTags = Object.entries(workflows) + .filter(([, value]) => value === "complete" || value === "pending") + .map(([key, value]) => ( + + )); return ( -
-
- - View +
+ + View + + {!workflowTags.length && ( + + No Analyses - {!workflowTags.length && ( - - No Analyses - - )} - {workflowTags} -
+ )} + {workflowTags}
); }