-
+ const render = () => {
+ if (pageNumber === 0) {
+ return (
-
-
-
-
-
-
-
+ );
+ } else if (pageNumber === 1) {
+ if (finishState === "Save changes") {
+ return (
+
+ );
+ } else if (finishState === "Start processing") {
+ return (
+
+ );
+ } else if (finishState === "Discard changes") {
+ return (
+
+ );
+ }
+ } else if (pageNumber === 2) {
+ return (
-
-
{t("various.error-text")}
@@ -73,90 +60,4 @@ const WorkflowConfiguration: React.FC = () => {
);
};
-/**
- * Button that sends a post request to save current changes
- * and starts the selected workflow
- */
-export const SaveAndProcessButton: React.FC<{ text: string; }> = ({ text }) => {
-
- // Initialize redux variables
- const dispatch = useAppDispatch();
-
- const selectedWorkflowId = useAppSelector(selectSelectedWorkflowId);
- const segments = useAppSelector(selectSegments);
- const tracks = useAppSelector(selectTracks);
- const subtitles = useAppSelector(selectSubtitles);
- const metadata = useAppSelector(selectCatalogs);
- const workflowStatus = useAppSelector(selectStatus);
- const theme = useTheme();
-
- // Let users leave the page without warning after a successful save
- useEffect(() => {
- if (workflowStatus === "success") {
- dispatch(setEnd({ hasEnded: true, value: "success" }));
- dispatch(videoSetHasChanges(false));
- dispatch(metadataSetHasChanges(false));
- dispatch(subtitleSetHasChanges(false));
- }
- }, [dispatch, workflowStatus]);
-
- const prepareSubtitles = () => {
- const subtitlesForPosting = [];
-
- for (const identifier in subtitles) {
- subtitlesForPosting.push({
- id: identifier,
- subtitle: serializeSubtitle(subtitles[identifier].cues),
- tags: subtitles[identifier].tags,
- });
- }
- return subtitlesForPosting;
- };
-
- const saveAndProcess = () => {
- dispatch(postVideoInformationWithWorkflow({
- segments: segments,
- tracks: tracks,
- workflow: [{ id: selectedWorkflowId }],
- subtitles: prepareSubtitles(),
- metadata: metadata,
- }));
- };
-
- // Update based on current fetching status
- let Icon = LuDatabase;
- let spin = false;
- if (workflowStatus === "failed") {
- Icon = LuAlertCircle;
- spin = false;
- } else if (workflowStatus === "success") {
- Icon = LuCheck;
- spin = false;
- } else if (workflowStatus === "loading") {
- Icon = LuLoader;
- spin = true;
-
- }
-
- const saveButtonStyle = css({
- padding: "16px",
- boxShadow: `${theme.boxShadow}`,
- background: `${theme.element_bg}`,
- });
-
- return (
-
) => {
- if (event.key === " " || event.key === "Enter") {
- saveAndProcess();
- }
- }}>
-
- {text}
-
- );
-};
-
export default WorkflowConfiguration;
diff --git a/src/main/WorkflowSelection.tsx b/src/main/WorkflowSelection.tsx
index 19b773358..48fb01a92 100644
--- a/src/main/WorkflowSelection.tsx
+++ b/src/main/WorkflowSelection.tsx
@@ -5,12 +5,9 @@ import { backOrContinueStyle, errorBoxStyle } from "../cssStyles";
import { useAppDispatch, useAppSelector } from "../redux/store";
import { selectWorkflows, setSelectedWorkflowIndex } from "../redux/videoSlice";
-import { selectFinishState, selectPageNumber } from "../redux/finishSlice";
import { PageButton } from "./Finish";
-import { LuChevronLeft } from "react-icons/lu";
-import { SaveAndProcessButton } from "./WorkflowConfiguration";
-import { selectStatus, selectError } from "../redux/workflowPostAndProcessSlice";
+import { LuChevronLeft, LuDatabase } from "react-icons/lu";
import { selectStatus as saveSelectStatus, selectError as saveSelectError } from "../redux/workflowPostSlice";
import { httpRequestState, Workflow } from "../types";
import { SaveButton } from "./Save";
@@ -37,18 +34,14 @@ const WorkflowSelection: React.FC = () => {
return (b.displayOrder - a.displayOrder);
});
- const finishState = useAppSelector(selectFinishState);
- const pageNumber = useAppSelector(selectPageNumber);
const theme = useTheme();
- const postAndProcessWorkflowStatus = useAppSelector(selectStatus);
- const postAndProcessError = useAppSelector(selectError);
const saveStatus = useAppSelector(saveSelectStatus);
const saveError = useAppSelector(saveSelectError);
const workflowSelectionStyle = css({
padding: "20px",
- display: (finishState === "Start processing" && pageNumber === 1) ? "flex" : "none",
+ display: "flex",
flexDirection: "column",
justifyContent: "center",
alignItems: "center",
@@ -107,7 +100,7 @@ const WorkflowSelection: React.FC = () => {
{t("various.error-text")}
{errorMessage ?
- t("various.error-details-text", { errorMessage: postAndProcessError }) :
+ t("various.error-details-text", { errorMessage: saveError }) :
t("various.error-text")}
@@ -140,9 +133,13 @@ const WorkflowSelection: React.FC = () => {
This will take some time.
,
false,
-