From 6198a59c0fbe3014594c3f2af0d6c9a72af5e919 Mon Sep 17 00:00:00 2001 From: Victor Date: Thu, 16 Nov 2023 21:10:08 -0800 Subject: [PATCH] added jobs list component working with new inference jobs polling --- .../InferenceJobsList/InferenceJobsList.tsx | 35 ++++++++++++++++--- .../fakeyou.com/src/v2/view/PageContainer.tsx | 2 +- .../lipsync/LipsyncEditor/LipsyncEditor.tsx | 3 +- .../voice_designer/VoiceDesignerFormPage.tsx | 4 +-- .../voice_designer/VoiceDesignerMainPage.tsx | 4 +-- .../VoiceDesignerVoiceEditPage.tsx | 3 +- 6 files changed, 38 insertions(+), 13 deletions(-) diff --git a/packages/fakeyou.com/src/components/layout/InferenceJobsList/InferenceJobsList.tsx b/packages/fakeyou.com/src/components/layout/InferenceJobsList/InferenceJobsList.tsx index a85c49747d..3f123bd575 100644 --- a/packages/fakeyou.com/src/components/layout/InferenceJobsList/InferenceJobsList.tsx +++ b/packages/fakeyou.com/src/components/layout/InferenceJobsList/InferenceJobsList.tsx @@ -5,8 +5,12 @@ import { GetPendingTtsJobCountIsOk, GetPendingTtsJobCountSuccessResponse, } from "@storyteller/components/src/api/tts/GetPendingTtsJobCount"; + +import { JobState } from "@storyteller/components/src/jobs/JobStates"; + +import { InferenceJob } from "@storyteller/components/src/jobs/InferenceJob"; // import { springs } from "resources"; -import { useInferenceJobs } from "hooks"; +// import { useInferenceJobs } from "hooks"; import { Button } from 'components/common'; import { Analytics } from "common/Analytics"; import { FontAwesomeIcon } from "@fortawesome/react-fontawesome"; @@ -14,8 +18,10 @@ import { faChevronRight, faHourglass1, faRemove, faTrophy, faWarning } from "@fo const DEFAULT_QUEUE_REFRESH_INTERVAL_MILLIS = 15000; -export default function InferenceJobsList({ t }: { t: any }) { - const { inferenceJobs = [] } = useInferenceJobs({ type: 0 }); +export default function InferenceJobsList({ t, inferenceJobs }: { t: any, inferenceJobs?: any }) { + // const { inferenceJobs = [] } = useInferenceJobs({ type: 0 }); + // const oldJobs = thejobs || inferenceJobs; + // console.log("😎",inferenceJobs); const [pending, pendingSet] = useState({ success: true, pending_job_count: 0, @@ -32,6 +38,24 @@ export default function InferenceJobsList({ t }: { t: any }) { } }; + const processStatus = (job: InferenceJob) => { + switch (job.jobState) { + case JobState.PENDING: + case JobState.UNKNOWN: return 0; + case JobState.STARTED: return 1 + case JobState.ATTEMPT_FAILED: return 2; + case JobState.COMPLETE_FAILURE: + case JobState.DEAD: return 3; + case JobState.COMPLETE_SUCCESS: return 4; + default: return -1; + } + }; + + const jobs = inferenceJobs.map((job: InferenceJob, i: number) => ({ + ...job!, + statusIndex: processStatus(job!) + })); + // const transitions = useTransition(inferenceJobs, { // not today // ...springs.soft, // from: { opacity: 0, position: "absolute" }, @@ -61,9 +85,10 @@ export default function InferenceJobsList({ t }: { t: any }) { return () => clearInterval(interval); }, [pending]); - return inferenceJobs.length ?
+ return jobs.length ?
{ t("headings.yourJobs") }
- { inferenceJobs.map((job, key) => { + { jobs.map((job: any, key: number) => { + console.log("🌸",job); return
diff --git a/packages/fakeyou.com/src/v2/view/PageContainer.tsx b/packages/fakeyou.com/src/v2/view/PageContainer.tsx index d2710a70d6..85efca84fd 100644 --- a/packages/fakeyou.com/src/v2/view/PageContainer.tsx +++ b/packages/fakeyou.com/src/v2/view/PageContainer.tsx @@ -677,7 +677,7 @@ class PageContainer extends React.Component< - + diff --git a/packages/fakeyou.com/src/v2/view/pages/lipsync/LipsyncEditor/LipsyncEditor.tsx b/packages/fakeyou.com/src/v2/view/pages/lipsync/LipsyncEditor/LipsyncEditor.tsx index 30a8875a95..c840e931d2 100644 --- a/packages/fakeyou.com/src/v2/view/pages/lipsync/LipsyncEditor/LipsyncEditor.tsx +++ b/packages/fakeyou.com/src/v2/view/pages/lipsync/LipsyncEditor/LipsyncEditor.tsx @@ -32,6 +32,7 @@ import { usePrefixedDocumentTitle } from "common/UsePrefixedDocumentTitle"; export default function LipsyncEditor({ enqueueInferenceJob, sessionSubscriptionsWrapper, + inferenceJobs, inferenceJobsByCategory, ...rest }: FaceAnimatorCore) { @@ -182,7 +183,7 @@ export default function LipsyncEditor({ ); })}
- +
diff --git a/packages/fakeyou.com/src/v2/view/pages/voice_designer/VoiceDesignerFormPage.tsx b/packages/fakeyou.com/src/v2/view/pages/voice_designer/VoiceDesignerFormPage.tsx index 5df88eb907..c350f63341 100644 --- a/packages/fakeyou.com/src/v2/view/pages/voice_designer/VoiceDesignerFormPage.tsx +++ b/packages/fakeyou.com/src/v2/view/pages/voice_designer/VoiceDesignerFormPage.tsx @@ -30,7 +30,7 @@ function VoiceDesignerFormPage() { const history = useHistory(); const { datasets, inputCtrl, languages, visibilityOptions, voices } = useVoiceRequests({}); const [language, languageSet] = useState("en"); - const [visibility, visibilitySet] = useState(""); + const [visibility, visibilitySet] = useState("hidden"); const [title, titleSet] = useState(""); const [fetched,fetchedSet] = useState(false); @@ -108,8 +108,6 @@ function VoiceDesignerFormPage() { creator_set_visibility: visibility, idempotency_token: uuidv4(), }).then((res: any) => { - - console.log("😎",res); if (res && res.success && res.token) { history.push(`/voice-designer/dataset/${ res.token }/upload`); } diff --git a/packages/fakeyou.com/src/v2/view/pages/voice_designer/VoiceDesignerMainPage.tsx b/packages/fakeyou.com/src/v2/view/pages/voice_designer/VoiceDesignerMainPage.tsx index 8ff4e01003..68f195da50 100644 --- a/packages/fakeyou.com/src/v2/view/pages/voice_designer/VoiceDesignerMainPage.tsx +++ b/packages/fakeyou.com/src/v2/view/pages/voice_designer/VoiceDesignerMainPage.tsx @@ -12,7 +12,7 @@ import ListItems from "./components/NewList"; import Modal from "components/common/Modal"; import useVoiceRequests from "./useVoiceRequests"; -function VoiceDesignerMainPage() { +function VoiceDesignerMainPage({ inferenceJobs }: { inferenceJobs: any }) { const { pathname } = useLocation(); const { t } = useLocalize("FaceAnimator"); const { datasets, voices } = useVoiceRequests({ requestDatasets: true, requestVoices: true }); @@ -131,7 +131,7 @@ function VoiceDesignerMainPage() { panel={false} imageUrl="/images/header/voice-designer.png" /> - +
+ aaaaa