From 7e7e5c15bf8730bc12639879402796bc66a049ee Mon Sep 17 00:00:00 2001 From: Chetan-Gudagamanal Date: Mon, 20 Nov 2023 12:42:11 +0530 Subject: [PATCH 1/3] added modal for task reopen if voiceover dependency present --- src/common/TaskReopenDialog.jsx | 129 ++++++++++++++++++ src/common/index.js | 2 + .../Organization/Project/TaskList.jsx | 82 +++++------ 3 files changed, 164 insertions(+), 49 deletions(-) create mode 100644 src/common/TaskReopenDialog.jsx diff --git a/src/common/TaskReopenDialog.jsx b/src/common/TaskReopenDialog.jsx new file mode 100644 index 00000000..4bfbb15d --- /dev/null +++ b/src/common/TaskReopenDialog.jsx @@ -0,0 +1,129 @@ +import React from "react"; + +//Components +import { + Box, + Button, + Dialog, + DialogActions, + DialogContent, + DialogContentText, + Table, + TableBody, + TableCell, + TableHead, + TableRow, + Tooltip, +} from "@mui/material"; +import Loader from "./Spinner"; + +const headers = ["Video Id", "Task Type", "Target Language", "Video Name"]; + +const TaskReopenDialog = ({ + openDialog, + handleClose, + submit, + message, + loading, + taskReopenResponse, +}) => { + return ( + + + + {message} + + {taskReopenResponse && ( + + + + + + + {headers.map((item, index) => { + return ( + + {item} + + ); + })} + + + + {taskReopenResponse.map((item, index) => { + return ( + + {item.video_id} + {item.task_type} + + {item.target_language} + + {item.video_name} + + ); + })} + +
+ + + + )} + + + + + + + + + + ); +}; + +export default TaskReopenDialog; diff --git a/src/common/index.js b/src/common/index.js index af83e45c..d5f60ac6 100644 --- a/src/common/index.js +++ b/src/common/index.js @@ -11,6 +11,7 @@ import CreateVideoDialog from "./CreateVideoDialog"; import CustomMenuComponent from "./CustomMenuComponent"; import CustomSwitchDarkBackground from "./CustomSwitchDarkBackground"; import DeleteDialog from "./DeleteDialog"; +import TaskReopenDialog from "./TaskReopenDialog"; import DeleteMemberErrorDialog from "./DeleteMemberErrorDialog"; import ExportAllDialog from "./ExportAllDialog"; import ExportDialog from "./ExportDialog"; @@ -58,6 +59,7 @@ export { CustomMenuComponent, CustomSwitchDarkBackground, DeleteDialog, + TaskReopenDialog, DeleteMemberErrorDialog, ExportAllDialog, ExportDialog, diff --git a/src/containers/Organization/Project/TaskList.jsx b/src/containers/Organization/Project/TaskList.jsx index a2afadd5..d6deebe9 100644 --- a/src/containers/Organization/Project/TaskList.jsx +++ b/src/containers/Organization/Project/TaskList.jsx @@ -46,6 +46,7 @@ import { UpdateBulkTaskDialog, UploadFormatDialog, ViewTaskDialog, + TaskReopenDialog, } from "common"; //Icons @@ -117,6 +118,10 @@ const TaskList = () => { const [uploadLoading, setUploadLoading] = useState([]); const [deleteMsg, setDeleteMsg] = useState(""); const [deleteResponse, setDeleteResponse] = useState([]); + + const [taskReopenMsg, setTaskReopenMsg] = useState(""); + const [taskReopenResponse, setTaskReopenResponse] = useState([]); + const [isSubmit, setIsSubmit] = useState(false); const [currentTaskDetails, setCurrentTaskDetails] = useState(); @@ -133,6 +138,7 @@ const TaskList = () => { uploadDialog: false, speakerInfoDialog: false, tableDialog: false, + TaskReopenDialog: false, }); const [tableDialogMessage, setTableDialogMessage] = useState(""); const [tableDialogResponse, setTableDialogResponse] = useState([]); @@ -177,51 +183,6 @@ const TaskList = () => { (state) => state.getPreviewData?.data ); - const reopenActionColumn = { - name: "Action", - label: "Actions", - options: { - filter: false, - sort: false, - align: "center", - setCellHeaderProps: () => ({ - className: tableClasses.cellHeaderProps, - }), - customBodyRender: (_value, tableMeta) => { - const { tableData: data, rowIndex } = tableMeta; - const selectedTask = data[rowIndex]; - - return ( - - - - ); - }, - }, - }; - useEffect(() => { const { progress, success, apiType, data } = apiStatus; if (!progress) { @@ -237,6 +198,11 @@ const TaskList = () => { fetchTaskList(); break; + case "REOPEN_TASK": + handleDialogClose("TaskReopenDialog"); + fetchTaskList(); + break; + case "GENERATE_TRANSLATION_OUTPUT": navigate(`/task/${currentTaskDetails?.id}/translate`); break; @@ -295,10 +261,9 @@ const TaskList = () => { if (apiType === "REOPEN_TASK" && data.response) { dispatch(setSnackBar({ open: false })); - handleDialogOpen("tableDialog"); - setTableDialogColumn([...reopenTableColumns,reopenActionColumn]); - setTableDialogMessage(data.message); - setTableDialogResponse(data.response); + handleDialogOpen("TaskReopenDialog"); + setTaskReopenMsg(data.message); + setTaskReopenResponse(data.response); } } } @@ -592,6 +557,14 @@ const TaskList = () => { handleDialogClose("deleteDialog"); }; + const handleTaskReopen = async () => { + setLoading(true); + + const reopenObj = new ReopenTaskAPI(reOpenTaskId,true); + dispatch(APITransport(reopenObj)); + handleDialogClose("TaskReopenDialog"); + }; + const handlePreviewTask = async (videoId, taskType, targetlanguage) => { handleDialogOpen("previewDialog"); @@ -1105,6 +1078,17 @@ const TaskList = () => { /> )} + {openDialogs.TaskReopenDialog && ( + handleDialogClose("TaskReopenDialog")} + submit={() => handleTaskReopen()} + loading={apiStatus.loading} + message={taskReopenMsg} + taskReopenResponse={taskReopenResponse} + /> + )} + {openDialogs.editTaskDialog && ( Date: Tue, 21 Nov 2023 13:15:46 +0530 Subject: [PATCH 2/3] rearranged failInfoOnSave cols and updated reopen dialog message --- src/common/DeleteDialog.jsx | 1 + src/common/TaskReopenDialog.jsx | 15 +++------------ src/config/tableColumns.js | 24 ++++++++++++------------ 3 files changed, 16 insertions(+), 24 deletions(-) diff --git a/src/common/DeleteDialog.jsx b/src/common/DeleteDialog.jsx index 5e5cd812..76d004bf 100644 --- a/src/common/DeleteDialog.jsx +++ b/src/common/DeleteDialog.jsx @@ -101,6 +101,7 @@ const DeleteDialog = ({ Cancel - - ); diff --git a/src/config/tableColumns.js b/src/config/tableColumns.js index 8fe867cd..b5baf9c2 100644 --- a/src/config/tableColumns.js +++ b/src/config/tableColumns.js @@ -500,14 +500,14 @@ export const taskQueueStatusColumns = [ ]; export const failInfoColumns = [ - { - name: "index", - label: "Id", - }, { name: "page_number", label: "Page Number", }, + { + name: "index", + label: "Id", + }, { name: "start_time", label: "Start Time", @@ -527,14 +527,14 @@ export const failInfoColumns = [ ]; export const failTranscriptionInfoColumns = [ - { - name: "index", - label: "Id", - }, { name: "page_number", label: "Page Number", }, + { + name: "index", + label: "Id", + }, { name: "start_time", label: "Start Time", @@ -550,14 +550,14 @@ export const failTranscriptionInfoColumns = [ ]; export const voiceoverFailInfoColumns = [ - { - name: "index", - label: "Id", - }, { name: "page_number", label: "Page Number", }, + { + name: "index", + label: "Id", + }, { name: "reason", label: "Reason", From 92a81480572fcd4069a14598bda096d07d17e754 Mon Sep 17 00:00:00 2001 From: Chetan-Gudagamanal Date: Wed, 29 Nov 2023 11:06:48 +0530 Subject: [PATCH 3/3] display bad sentances on transcription complete --- src/config/tableColumns.js | 4 + .../Organization/Video/RightPanel.jsx | 84 +++++++++++++++---- 2 files changed, 74 insertions(+), 14 deletions(-) diff --git a/src/config/tableColumns.js b/src/config/tableColumns.js index b5baf9c2..2b763130 100644 --- a/src/config/tableColumns.js +++ b/src/config/tableColumns.js @@ -524,6 +524,10 @@ export const failInfoColumns = [ name: "target_text", label: "Target Text", }, + { + name: "issue_type", + label: "Issue Type", + }, ]; export const failTranscriptionInfoColumns = [ diff --git a/src/containers/Organization/Video/RightPanel.jsx b/src/containers/Organization/Video/RightPanel.jsx index 1267bca4..abd27a6c 100644 --- a/src/containers/Organization/Video/RightPanel.jsx +++ b/src/containers/Organization/Video/RightPanel.jsx @@ -40,6 +40,7 @@ import { import { ConfirmDialog, ShortcutKeys, + TableDialog, TagsSuggestionList, TimeBoxes, } from "common"; @@ -52,11 +53,14 @@ import C from "redux/constants"; import { APITransport, FetchTranscriptPayloadAPI, + FetchTaskFailInfoAPI, SaveTranscriptAPI, setSnackBar, setSubtitles, } from "redux/actions"; +import { failInfoColumns } from "config"; + const RightPanel = ({ currentIndex, setCurrentIndex }) => { const { taskId } = useParams(); const classes = VideoLandingStyle(); @@ -110,23 +114,59 @@ const RightPanel = ({ currentIndex, setCurrentIndex }) => { const [complete, setComplete] = useState(false); const [autoSave, setAutoSave] = useState(false); + const [openInfoDialog, setOpenInfoDialog] = useState(false); + const [tableDialogMessage, setTableDialogMessage] = useState(""); + const [tableDialogResponse, setTableDialogResponse] = useState([]); + const [tableDialogColumn, setTableDialogColumn] = useState([]); + useEffect(() => { - const { progress, success, apiType } = apiStatus; + const { progress, success, apiType, data } = apiStatus; + + if (!progress) { + if (success) { + switch (apiType) { + case "SAVE_TRANSCRIPT": + if (!autoSave) { + setTimeout(() => { + dispatch(setSnackBar({ open: false })); + }, 1000); + } + if (complete) { + setTimeout(() => { + navigate( + `/my-organization/${assignedOrgId}/project/${taskData?.project}` + ); + setComplete(false); + }, 2000); + } + break; - if (!progress && success && apiType === "SAVE_TRANSCRIPT") { - if (!autoSave) { - setTimeout(() => { - dispatch(setSnackBar({ open: false })); - }, 1000); - } + case "GET_TASK_FAIL_INFO": + setOpenInfoDialog(true); + setTableDialogColumn(failInfoColumns.filter((col)=>col.name!='target_text')); + setTableDialogMessage(data.message); + setTableDialogResponse(data.data); + break; - if (complete) { - setTimeout(() => { - navigate( - `/my-organization/${assignedOrgId}/project/${taskData?.project}` - ); - setComplete(false); - }, 2000); + default: + break; + } + } else { + switch (apiType) { + case "SAVE_TRANSCRIPT": + setOpenConfirmDialog(false); + + if (complete) { + setOpenInfoDialog(true); + setTableDialogColumn(failInfoColumns.filter((col)=>col.name!='target_text')); + setTableDialogMessage(data.message); + setTableDialogResponse(data.data); + } + break; + + default: + break; + } } } @@ -278,6 +318,11 @@ const RightPanel = ({ currentIndex, setCurrentIndex }) => { } }; + const handleInfoButtonClick = async () => { + const apiObj = new FetchTaskFailInfoAPI(taskId); + dispatch(APITransport(apiObj)); + }; + const onMergeClick = useCallback( (index) => { const selectionStart = getSelectionStart(index); @@ -571,6 +616,7 @@ const RightPanel = ({ currentIndex, setCurrentIndex }) => { handleSuperscript={handleSuperscript} showPopOver={showPopOver} showSplit={true} + handleInfoButtonClick={handleInfoButtonClick} /> @@ -765,6 +811,16 @@ const RightPanel = ({ currentIndex, setCurrentIndex }) => { /> )} + {openInfoDialog && ( + setOpenInfoDialog(false)} + message={tableDialogMessage} + response={tableDialogResponse} + columns={tableDialogColumn} + /> + )} + {Boolean(tagSuggestionsAnchorEl) && (