Az/import export tasks

cvat-core/package.json

@@ -1,6 +1,6 @@
 {
   "name": "cvat-core",
-  "version": "3.12.0",
+  "version": "3.13.0",
   "description": "Part of Computer Vision Tool which presents an interface for client-side integration",
   "main": "babel.config.js",
   "scripts": {

cvat-core/src/server-proxy.js

@@ -490,6 +490,59 @@
                 });
             }
 
+            async function exportTask(id) {
+                const { backendAPI } = config;
+                const url = `${backendAPI}/tasks/${id}`;
+
+                return new Promise((resolve, reject) => {
+                    async function request() {
+                        try {
+                            const response = await Axios.get(`${url}?action=export`, {
+                                proxy: config.proxy,
+                            });
+                            if (response.status === 202) {
+                                setTimeout(request, 3000);
+                            } else {
+                                resolve(`${url}?action=download`);
+                            }
+                        } catch (errorData) {
+                            reject(generateError(errorData));
+                        }
+                    }
+
+                    setTimeout(request);
+                });
+            }
+
+            async function importTask(file) {
+                const { backendAPI } = config;
+
+                let annotationData = new FormData();
+                annotationData.append('task_file', file);
+
+                return new Promise((resolve, reject) => {
+                    async function request() {
+                        try {
+                            const response = await Axios.post(`${backendAPI}/tasks?action=import`, annotationData, {
+                                proxy: config.proxy,
+                            });
+                            if (response.status === 202) {
+                                annotationData = new FormData();
+                                annotationData.append('rq_id', response.data.rq_id);
+                                setTimeout(request, 3000);
+                            } else {
+                                const importedTask = await getTasks(`?id=${response.data.id}`);
+                                resolve(importedTask[0]);
+                            }
+                        } catch (errorData) {
+                            reject(generateError(errorData));
+                        }
+                    }
+
+                    setTimeout(request);
+                });
+            }
+
             async function createTask(taskSpec, taskDataSpec, onUpdate) {
                 const { backendAPI } = config;
 
@@ -1161,6 +1214,8 @@
                             createTask,
                             deleteTask,
                             exportDataset,
+                            exportTask,
+                            importTask,
                         }),
                         writable: false,
                     },

cvat-core/src/session.js

@@ -1661,6 +1661,36 @@
             const result = await PluginRegistry.apiWrapper.call(this, Task.prototype.delete);
             return result;
         }
+
+        /**
+         * Method makes a backup of a task
+         * @method export
+         * @memberof module:API.cvat.classes.Task
+         * @readonly
+         * @instance
+         * @async
+         * @throws {module:API.cvat.exceptions.ServerError}
+         * @throws {module:API.cvat.exceptions.PluginError}
+         */
+        async export() {
+            const result = await PluginRegistry.apiWrapper.call(this, Task.prototype.export);
+            return result;
+        }
+
+        /**
+         * Method imports a task from a backup
+         * @method import
+         * @memberof module:API.cvat.classes.Task
+         * @readonly
+         * @instance
+         * @async
+         * @throws {module:API.cvat.exceptions.ServerError}
+         * @throws {module:API.cvat.exceptions.PluginError}
+         */
+        static async import(file) {
+            const result = await PluginRegistry.apiWrapper.call(this, Task.import, file);
+            return result;
+        }
     }
 
     module.exports = {
@@ -2077,6 +2107,16 @@
         return result;
     };
 
+    Task.prototype.export.implementation = async function () {
+        const result = await serverProxy.tasks.exportTask(this.id);
+        return result;
+    };
+
+    Task.import.implementation = async function (file) {
+        const result = await serverProxy.tasks.importTask(file);
+        return result;
+    };
+
     Task.prototype.frames.get.implementation = async function (frame, isPlaying, step) {
         if (!Number.isInteger(frame) || frame < 0) {
             throw new ArgumentError(`Frame must be a positive integer. Got: "${frame}"`);

cvat-ui/package.json

@@ -55,6 +55,7 @@
     "@types/react-color": "^3.0.4",
     "@types/react-dom": "^16.9.11",
     "@types/react-redux": "^7.1.16",
+    "@types/react-resizable": "^1.7.2",
     "@types/react-router": "^5.1.12",
     "@types/react-router-dom": "^5.1.7",
     "@types/react-share": "^3.0.3",
@@ -72,6 +73,7 @@
     "mousetrap": "^1.6.5",
     "platform": "^1.3.6",
     "prop-types": "^15.7.2",
+    "rc-menu": "^8.10.7",
     "react": "^16.14.0",
     "react-awesome-query-builder": "^3.0.0",
     "react-color": "^2.19.3",
@@ -80,7 +82,6 @@
     "react-moment": "^1.1.1",
     "react-redux": "^7.2.2",
     "react-resizable": "^1.11.1",
-    "@types/react-resizable": "^1.7.2",
     "react-router": "^5.1.0",
     "react-router-dom": "^5.1.0",
     "react-share": "^3.0.1",

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

@@ -35,6 +35,12 @@ export enum TasksActionTypes {
     UPDATE_TASK_SUCCESS = 'UPDATE_TASK_SUCCESS',
     UPDATE_TASK_FAILED = 'UPDATE_TASK_FAILED',
     HIDE_EMPTY_TASKS = 'HIDE_EMPTY_TASKS',
+    EXPORT_TASK = 'EXPORT_TASK',
+    EXPORT_TASK_SUCCESS = 'EXPORT_TASK_SUCCESS',
+    EXPORT_TASK_FAILED = 'EXPORT_TASK_FAILED',
+    IMPORT_TASK = 'IMPORT_TASK',
+    IMPORT_TASK_SUCCESS = 'IMPORT_TASK_SUCCESS',
+    IMPORT_TASK_FAILED = 'IMPORT_TASK_FAILED',
 }
 
 function getTasks(): AnyAction {
@@ -213,6 +219,49 @@ export function loadAnnotationsAsync(
     };
 }
 
+function importTask(): AnyAction {
+    const action = {
+        type: TasksActionTypes.IMPORT_TASK,
+        payload: {},
+    };
+
+    return action;
+}
+
+function importTaskSuccess(task: any): AnyAction {
+    const action = {
+        type: TasksActionTypes.IMPORT_TASK_SUCCESS,
+        payload: {
+            task,
+        },
+    };
+
+    return action;
+}
+
+function importTaskFailed(error: any): AnyAction {
+    const action = {
+        type: TasksActionTypes.IMPORT_TASK_FAILED,
+        payload: {
+            error,
+        },
+    };
+
+    return action;
+}
+
+export function importTaskAsync(file: File): ThunkAction<Promise<void>, {}, {}, AnyAction> {
+    return async (dispatch: ActionCreator<Dispatch>): Promise<void> => {
+        try {
+            dispatch(importTask());
+            const taskInstance = await cvat.classes.Task.import(file);
+            dispatch(importTaskSuccess(taskInstance));
+        } catch (error) {
+            dispatch(importTaskFailed(error));
+        }
+    };
+}
+
 function exportDataset(task: any, exporter: any): AnyAction {
     const action = {
         type: TasksActionTypes.EXPORT_DATASET,
@@ -267,6 +316,57 @@ export function exportDatasetAsync(task: any, exporter: any): ThunkAction<Promis
     };
 }
 
+function exportTask(taskID: number): AnyAction {
+    const action = {
+        type: TasksActionTypes.EXPORT_TASK,
+        payload: {
+            taskID,
+        },
+    };
+
+    return action;
+}
+
+function exportTaskSuccess(taskID: number): AnyAction {
+    const action = {
+        type: TasksActionTypes.EXPORT_TASK_SUCCESS,
+        payload: {
+            taskID,
+        },
+    };
+
+    return action;
+}
+
+function exportTaskFailed(taskID: number, error: Error): AnyAction {
+    const action = {
+        type: TasksActionTypes.EXPORT_TASK_FAILED,
+        payload: {
+            taskID,
+            error,
+        },
+    };
+
+    return action;
+}
+
+export function exportTaskAsync(taskInstance: any): ThunkAction<Promise<void>, {}, {}, AnyAction> {
+    return async (dispatch: ActionCreator<Dispatch>): Promise<void> => {
+        dispatch(exportTask(taskInstance.id));
+
+        try {
+            const url = await taskInstance.export();
+            const downloadAnchor = window.document.getElementById('downloadAnchor') as HTMLAnchorElement;
+            downloadAnchor.href = url;
+            downloadAnchor.click();
+        } catch (error) {
+            dispatch(exportTaskFailed(taskInstance.id, error));
+        }
+
+        dispatch(exportTaskSuccess(taskInstance.id));
+    };
+}
+
 function deleteTask(taskID: number): AnyAction {
     const action = {
         type: TasksActionTypes.DELETE_TASK,

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

@@ -6,6 +6,7 @@ import './styles.scss';
 import React from 'react';
 import Menu from 'antd/lib/menu';
 import Modal from 'antd/lib/modal';
+import { LoadingOutlined } from '@ant-design/icons';
 // eslint-disable-next-line import/no-extraneous-dependencies
 import { MenuInfo } from 'rc-menu/lib/interface';
 import DumpSubmenu from './dump-submenu';
@@ -25,6 +26,7 @@ interface Props {
     inferenceIsActive: boolean;
     taskDimension: DimensionType;
     onClickMenu: (params: MenuInfo, file?: File) => void;
+    exportIsActive: boolean;
 }
 
 export enum Actions {
@@ -34,6 +36,7 @@ export enum Actions {
     DELETE_TASK = 'delete_task',
     RUN_AUTO_ANNOTATION = 'run_auto_annotation',
     OPEN_BUG_TRACKER = 'open_bug_tracker',
+    EXPORT_TASK = 'export_task',
 }
 
 export default function ActionsMenuComponent(props: Props): JSX.Element {
@@ -49,6 +52,7 @@ export default function ActionsMenuComponent(props: Props): JSX.Element {
         exportActivities,
         loadActivity,
         taskDimension,
+        exportIsActive,
     } = props;
 
     let latestParams: MenuInfo | null = null;
@@ -127,6 +131,10 @@ export default function ActionsMenuComponent(props: Props): JSX.Element {
             <Menu.Item disabled={inferenceIsActive} key={Actions.RUN_AUTO_ANNOTATION}>
                 Automatic annotation
             </Menu.Item>
+            <Menu.Item key={Actions.EXPORT_TASK}>
+                {exportIsActive && <LoadingOutlined id='cvat-export-task-loading' />}
+                Export Task
+            </Menu.Item>
             <hr />
             <Menu.Item key={Actions.DELETE_TASK}>Delete</Menu.Item>
         </Menu>