Do not reload the page when changing job state

cvat-core/src/session-implementation.ts

@@ -70,9 +70,21 @@ export function implementJob(Job) {
                 jobData.assignee = jobData.assignee.id;
             }
 
-            const data = await serverProxy.jobs.save(this.id, jobData);
-            this._updateTrigger.reset();
-            return new Job(data);
+            let updatedJob = null;
+            try {
+                const data = await serverProxy.jobs.save(this.id, jobData);
+                updatedJob = new Job(data);
+                this._updateTrigger.reset();
+            } catch (error) {
+                updatedJob = new Job(this._initialData);
+                throw error;
+            } finally {
+                this.stage = updatedJob.stage;
+                this.state = updatedJob.state;
+                this.assignee = updatedJob.assignee;
+            }
+
+            return this;
         }
 
         const jobSpec = {

cvat-core/src/session.ts

@@ -381,7 +381,7 @@ export class Job extends Session {
         log: CallableFunction;
     };
 
-    constructor(initialData: SerializedJob) {
+    constructor(initialData: Readonly<SerializedJob>) {
         super();
         const data = {
             id: undefined,
@@ -536,6 +536,9 @@ export class Job extends Session {
                 _updateTrigger: {
                     get: () => updateTrigger,
                 },
+                _initialData: {
+                    get: () => initialData,
+                },
             }),
         );
 

cvat-ui/src/actions/annotation-actions.ts

@@ -29,7 +29,7 @@ import {
     ShapeType,
     Workspace,
 } from 'reducers';
-import { updateJobAsync } from './tasks-actions';
+import { updateJobAsync } from './jobs-actions';
 import { switchToolsBlockerState } from './settings-actions';
 
 interface AnnotationsParameters {

cvat-ui/src/actions/jobs-actions.ts

@@ -19,6 +19,8 @@ export enum JobsActionTypes {
     GET_JOB_PREVIEW_SUCCESS = 'GET_JOB_PREVIEW_SUCCESS',
     GET_JOB_PREVIEW_FAILED = 'GET_JOB_PREVIEW_FAILED',
     CREATE_JOB_FAILED = 'CREATE_JOB_FAILED',
+    UPDATE_JOB_SUCCESS = 'UPDATE_JOB_SUCCESS',
+    UPDATE_JOB_FAILED = 'UPDATE_JOB_FAILED',
     DELETE_JOB = 'DELETE_JOB',
     DELETE_JOB_SUCCESS = 'DELETE_JOB_SUCCESS',
     DELETE_JOB_FAILED = 'DELETE_JOB_FAILED',
@@ -46,6 +48,12 @@ const jobsActions = {
     createJobFailed: (error: any) => (
         createAction(JobsActionTypes.CREATE_JOB_FAILED, { error })
     ),
+    updateJobSuccess: (job: Job) => (
+        createAction(JobsActionTypes.UPDATE_JOB_SUCCESS, { job })
+    ),
+    updateJobFailed: (jobID: number, error: any) => (
+        createAction(JobsActionTypes.UPDATE_JOB_FAILED, { jobID, error })
+    ),
     deleteJob: (jobID: number) => (
         createAction(JobsActionTypes.DELETE_JOB, { jobID })
     ),
@@ -93,6 +101,20 @@ export const createJobAsync = (data: JobData): ThunkAction => async (dispatch) =
     }
 };
 
+export function updateJobAsync(jobInstance: Job): ThunkAction<Promise<boolean>> {
+    return async (dispatch): Promise<boolean> => {
+        try {
+            const updated = await jobInstance.save();
+            dispatch(jobsActions.updateJobSuccess(updated));
+        } catch (error) {
+            dispatch(jobsActions.updateJobFailed(jobInstance.id, error));
+            return false;
+        }
+
+        return true;
+    };
+}
+
 export const deleteJobAsync = (job: Job): ThunkAction => async (dispatch) => {
     dispatch(jobsActions.deleteJob(job.id));
     try {

cvat-ui/src/actions/tasks-actions.ts

@@ -22,7 +22,6 @@ export enum TasksActionTypes {
     DELETE_TASK_SUCCESS = 'DELETE_TASK_SUCCESS',
     DELETE_TASK_FAILED = 'DELETE_TASK_FAILED',
     CREATE_TASK_FAILED = 'CREATE_TASK_FAILED',
-    UPDATE_JOB_FAILED = 'UPDATE_JOB_FAILED',
     SWITCH_MOVE_TASK_MODAL_VISIBLE = 'SWITCH_MOVE_TASK_MODAL_VISIBLE',
     GET_TASK_PREVIEW = 'GET_TASK_PREVIEW',
     GET_TASK_PREVIEW_SUCCESS = 'GET_TASK_PREVIEW_SUCCESS',
@@ -294,25 +293,6 @@ ThunkAction<Promise<void>, {}, {}, AnyAction> {
     };
 }
 
-function updateJobFailed(jobID: number, error: any): AnyAction {
-    const action = {
-        type: TasksActionTypes.UPDATE_JOB_FAILED,
-        payload: { jobID, error },
-    };
-
-    return action;
-}
-
-export function updateJobAsync(jobInstance: any): ThunkAction<Promise<void>, {}, {}, AnyAction> {
-    return async (dispatch: ActionCreator<Dispatch>): Promise<void> => {
-        try {
-            await jobInstance.save();
-        } catch (error) {
-            dispatch(updateJobFailed(jobInstance.id, error));
-        }
-    };
-}
-
 export function switchMoveTaskModalVisible(visible: boolean, taskId: number | null = null): AnyAction {
     const action = {
         type: TasksActionTypes.SWITCH_MOVE_TASK_MODAL_VISIBLE,

cvat-ui/src/components/annotation-page/top-bar/annotation-menu.tsx

@@ -16,8 +16,7 @@ import Collapse from 'antd/lib/collapse';
 // eslint-disable-next-line import/no-extraneous-dependencies
 import { MenuInfo } from 'rc-menu/lib/interface';
 import CVATTooltip from 'components/common/cvat-tooltip';
-import { getCore } from 'cvat-core-wrapper';
-import { JobStage } from 'reducers';
+import { getCore, JobStage } from 'cvat-core-wrapper';
 
 const core = getCore();
 
@@ -213,7 +212,7 @@ function AnnotationMenuComponent(props: Props & RouteComponentProps): JSX.Elemen
                     <Text className={computeClassName(JobState.COMPLETED)}>{JobState.COMPLETED}</Text>
                 </Menu.Item>
             </Menu.SubMenu>
-            {[JobStage.ANNOTATION, JobStage.REVIEW].includes(jobStage) ?
+            {[JobStage.ANNOTATION, JobStage.VALIDATION].includes(jobStage) ?
                 <Menu.Item key={Actions.FINISH_JOB}>Finish the job</Menu.Item> : null}
             {jobStage === JobStage.ACCEPTANCE ?
                 <Menu.Item key={Actions.RENEW_JOB}>Renew the job</Menu.Item> : null}

cvat-ui/src/components/job-item/job-actions-menu.tsx

@@ -13,9 +13,8 @@ import { exportActions } from 'actions/export-actions';
 import {
     Job, JobStage, JobType, getCore,
 } from 'cvat-core-wrapper';
-import { deleteJobAsync } from 'actions/jobs-actions';
+import { deleteJobAsync, updateJobAsync } from 'actions/jobs-actions';
 import { importActions } from 'actions/import-actions';
-import { updateJobAsync } from 'actions/tasks-actions';
 
 const core = getCore();
 

cvat-ui/src/containers/annotation-page/top-bar/annotation-menu.tsx

@@ -1,5 +1,5 @@
 // Copyright (C) 2020-2022 Intel Corporation
-// Copyright (C) 2022 CVAT.ai Corporation
+// Copyright (C) 2022-2023 CVAT.ai Corporation
 //
 // SPDX-License-Identifier: MIT
 
@@ -9,32 +9,35 @@ import { connect } from 'react-redux';
 // eslint-disable-next-line import/no-extraneous-dependencies
 import { MenuInfo } from 'rc-menu/lib/interface';
 
-import { CombinedState, JobStage } from 'reducers';
+import { CombinedState } from 'reducers';
 import AnnotationMenuComponent, { Actions } from 'components/annotation-page/top-bar/annotation-menu';
-import { updateJobAsync } from 'actions/tasks-actions';
+import { updateJobAsync } from 'actions/jobs-actions';
 import {
     saveAnnotationsAsync,
     setForceExitAnnotationFlag as setForceExitAnnotationFlagAction,
     removeAnnotationsAsync as removeAnnotationsAsyncAction,
 } from 'actions/annotation-actions';
 import { exportActions } from 'actions/export-actions';
 import { importActions } from 'actions/import-actions';
-import { getCore } from 'cvat-core-wrapper';
+import {
+    getCore, Job, JobStage, JobState,
+} from 'cvat-core-wrapper';
+import { message } from 'antd';
 
 const core = getCore();
 
 interface StateToProps {
-    jobInstance: any;
+    jobInstance: Job;
     stopFrame: number;
 }
 
 interface DispatchToProps {
-    showExportModal: (jobInstance: any) => void;
-    showImportModal: (jobInstance: any) => void;
+    showExportModal: (jobInstance: Job) => void;
+    showImportModal: (jobInstance: Job) => void;
     removeAnnotations(startnumber: number, endnumber: number, delTrackKeyframesOnly: boolean): void;
     setForceExitAnnotationFlag(forceExit: boolean): void;
-    saveAnnotations(jobInstance: any, afterSave?: () => void): void;
-    updateJob(jobInstance: any): void;
+    saveAnnotations(jobInstance: Job, afterSave?: () => void): void;
+    updateJob(jobInstance: Job): Promise<boolean>;
 }
 
 function mapStateToProps(state: CombinedState): StateToProps {
@@ -55,10 +58,10 @@ function mapStateToProps(state: CombinedState): StateToProps {
 
 function mapDispatchToProps(dispatch: any): DispatchToProps {
     return {
-        showExportModal(jobInstance: any): void {
+        showExportModal(jobInstance: Job): void {
             dispatch(exportActions.openExportDatasetModal(jobInstance));
         },
-        showImportModal(jobInstance: any): void {
+        showImportModal(jobInstance: Job): void {
             dispatch(importActions.openImportDatasetModal(jobInstance));
         },
         removeAnnotations(startnumber: number, endnumber: number, delTrackKeyframesOnly:boolean) {
@@ -67,11 +70,11 @@ function mapDispatchToProps(dispatch: any): DispatchToProps {
         setForceExitAnnotationFlag(forceExit: boolean): void {
             dispatch(setForceExitAnnotationFlagAction(forceExit));
         },
-        saveAnnotations(jobInstance: any, afterSave?: () => void): void {
+        saveAnnotations(jobInstance: Job, afterSave?: () => void): void {
             dispatch(saveAnnotationsAsync(jobInstance, afterSave));
         },
-        updateJob(jobInstance: any): void {
-            dispatch(updateJobAsync(jobInstance));
+        updateJob(jobInstance: Job): Promise<boolean> {
+            return dispatch(updateJobAsync(jobInstance));
         },
     };
 }
@@ -98,19 +101,28 @@ function AnnotationMenuContainer(props: Props): JSX.Element {
         } else if (action === Actions.RENEW_JOB) {
             jobInstance.state = core.enums.JobState.NEW;
             jobInstance.stage = JobStage.ANNOTATION;
-            updateJob(jobInstance);
-            window.location.reload();
+            updateJob(jobInstance).then((success) => {
+                if (success) {
+                    message.info('Job renewed', 2);
+                }
+            });
         } else if (action === Actions.FINISH_JOB) {
             jobInstance.stage = JobStage.ACCEPTANCE;
             jobInstance.state = core.enums.JobState.COMPLETED;
-            updateJob(jobInstance);
-            history.push(`/tasks/${jobInstance.taskId}`);
+            updateJob(jobInstance).then((success) => {
+                if (success) {
+                    history.push(`/tasks/${jobInstance.taskId}`);
+                }
+            });
         } else if (action === Actions.OPEN_TASK) {
             history.push(`/tasks/${jobInstance.taskId}`);
         } else if (action.startsWith('state:')) {
-            [, jobInstance.state] = action.split(':');
-            updateJob(jobInstance);
-            window.location.reload();
+            [, jobInstance.state] = action.split(':') as [string, JobState];
+            updateJob(jobInstance).then((success) => {
+                if (success) {
+                    message.info('Job state updated', 2);
+                }
+            });
         } else if (action === Actions.LOAD_JOB_ANNO) {
             showImportModal(jobInstance);
         }

cvat-ui/src/reducers/annotation-reducer.ts

@@ -5,19 +5,19 @@
 
 import { AnyAction } from 'redux';
 import { AnnotationActionTypes } from 'actions/annotation-actions';
+import { JobsActionTypes } from 'actions/jobs-actions';
 import { AuthActionTypes } from 'actions/auth-actions';
 import { BoundariesActionTypes } from 'actions/boundaries-actions';
 import { Canvas, CanvasMode } from 'cvat-canvas-wrapper';
 import { Canvas3d } from 'cvat-canvas3d-wrapper';
-import { DimensionType } from 'cvat-core-wrapper';
+import { DimensionType, JobStage } from 'cvat-core-wrapper';
 import { clamp } from 'utils/math';
 
 import { SettingsActionTypes } from 'actions/settings-actions';
 import {
     ActiveControl,
     AnnotationState,
     ContextMenuType,
-    JobStage,
     ObjectType,
     ShapeType,
     Workspace,
@@ -158,7 +158,7 @@ export default (state = defaultState, action: AnyAction): AnnotationState => {
                 groundTruthJobFramesMeta,
             } = action.payload;
 
-            const isReview = job.stage === JobStage.REVIEW;
+            const isReview = job.stage === JobStage.VALIDATION;
             let workspaceSelected = Workspace.STANDARD;
 
             const defaultLabel = job.labels.length ? job.labels[0] : null;
@@ -237,6 +237,15 @@ export default (state = defaultState, action: AnyAction): AnnotationState => {
                 },
             };
         }
+        case JobsActionTypes.UPDATE_JOB_SUCCESS: {
+            return {
+                ...state,
+                job: {
+                    ...state.job,
+                    instance: action.payload.job,
+                },
+            };
+        }
         case AnnotationActionTypes.GET_DATA_FAILED: {
             return {
                 ...state,

cvat-ui/src/reducers/index.ts

@@ -375,12 +375,6 @@ export enum TaskStatus {
     COMPLETED = 'completed',
 }
 
-export enum JobStage {
-    ANNOTATION = 'annotation',
-    REVIEW = 'validation',
-    ACCEPTANCE = 'acceptance',
-}
-
 export interface ActiveInference {
     status: RQStatus;
     progress: number;

cvat-ui/src/reducers/notifications-reducer.ts

@@ -1563,6 +1563,22 @@ export default function (state = defaultState, action: AnyAction): Notifications
                 },
             };
         }
+        case JobsActionTypes.UPDATE_JOB_FAILED: {
+            return {
+                ...state,
+                errors: {
+                    ...state.errors,
+                    jobs: {
+                        ...state.errors.jobs,
+                        updating: {
+                            message: 'Could not update job',
+                            reason: action.payload.error.toString(),
+                            className: 'cvat-notification-notice-update-job-failed',
+                        },
+                    },
+                },
+            };
+        }
         case JobsActionTypes.DELETE_JOB_FAILED: {
             const { jobID } = action.payload;
             return {