diff --git a/packages/fakeyou.com/src/components/layout/InferenceJobsList/InferenceJobsList.tsx b/packages/fakeyou.com/src/components/layout/InferenceJobsList/InferenceJobsList.tsx index 3f06c52c05..5aeea05075 100644 --- a/packages/fakeyou.com/src/components/layout/InferenceJobsList/InferenceJobsList.tsx +++ b/packages/fakeyou.com/src/components/layout/InferenceJobsList/InferenceJobsList.tsx @@ -15,7 +15,9 @@ interface JobsListProps { jobType?: FrontendInferenceJobType; value?: JobListTypes; onSelect?: (e: any) => any; + panel?: boolean; showNoJobs?: boolean; + showHeader?: boolean; } const resultPaths = { @@ -32,7 +34,9 @@ export default function InferenceJobsList({ jobType, value, onSelect, + panel = true, showNoJobs = false, + showHeader = true, }: JobsListProps) { // undefined specified here to allow 0. // jobType + 1 because the difference between FrontendInferenceJobType and JobListTypes is an "all" option @@ -48,31 +52,43 @@ export default function InferenceJobsList({ useInferenceJobs(jobValue); const { t } = useLocalize("InferenceJobs"); + const jobContent = ( + <> + {showHeader &&

{t("core.heading")}

} + {inferenceJobs + .map((job: InferenceJob, key: number) => ( + + )) + .reverse()} + {!inferenceJobs.length && showNoJobs && ( +

Currently, there are current no jobs pending.

+ )} + + ); + if (inferenceJobs.length || showNoJobs) { return ( - -
{t("core.heading")}
- {inferenceJobs - .map((job: InferenceJob, key: number) => ( - - )) - .reverse()} - {!inferenceJobs.length && showNoJobs && ( -

Currently, there are current no jobs pending.

+ <> + {panel ? ( + + {jobContent} + + ) : ( + jobContent )} -
+ ); } else { return null; diff --git a/packages/fakeyou.com/src/components/modals/InferenceJobsModal/InferenceJobsModal.tsx b/packages/fakeyou.com/src/components/modals/InferenceJobsModal/InferenceJobsModal.tsx index b1d77529b4..82f2dcf5c3 100644 --- a/packages/fakeyou.com/src/components/modals/InferenceJobsModal/InferenceJobsModal.tsx +++ b/packages/fakeyou.com/src/components/modals/InferenceJobsModal/InferenceJobsModal.tsx @@ -1,6 +1,4 @@ -import React, { - // useState -} from "react"; +import React from "react"; // useState import InferenceJobsList from "components/layout/InferenceJobsList"; import { FrontendInferenceJobType } from "@storyteller/components/src/jobs/InferenceJob"; // import { TempSelect } from "components/common"; @@ -8,11 +6,14 @@ import { FrontendInferenceJobType } from "@storyteller/components/src/jobs/Infer import ModalHeader from "../ModalHeader"; interface Props { - handleClose?: any, - jobType?: FrontendInferenceJobType + handleClose?: any; + jobType?: FrontendInferenceJobType; } -export default function InferenceJobsModal({ handleClose, jobType: inJobType = -1 }: Props) { +export default function InferenceJobsModal({ + handleClose, + jobType: inJobType = -1, +}: Props) { // const presetFilter = enumToKeyArr(FrontendInferenceJobType)[inJobType]; // const [jobType,jobTypeSet] = useState(inJobType > -1 ? presetFilter : "All"); // const typeObj = ["All", ...Object.values(FrontendInferenceJobType)]; @@ -30,18 +31,24 @@ export default function InferenceJobsModal({ handleClose, jobType: inJobType = - } }; - return <> - - { - // jobTypeSet(target.value), options, value: jobType }} /> - } - { - if (handleClose) handleClose(); - }, - value: 0 // fixed for now - // value: typeObj.indexOf(jobType), - }} /> - ; -}; \ No newline at end of file + return ( + <> + + { + // jobTypeSet(target.value), options, value: jobType }} /> + } + { + if (handleClose) handleClose(); + }, + value: 0, // fixed for now + // value: typeObj.indexOf(jobType), + showHeader: false, + panel: false, + }} + /> + + ); +}