From 75bf0e3bd27165a75f07cec0ffa034f55ef7cd52 Mon Sep 17 00:00:00 2001 From: Paul Abumov Date: Mon, 25 Sep 2023 20:12:36 -0400 Subject: [PATCH] Task review app - linted code with Prettier --- .../mnist_for_review/webapp/src/app.jsx | 16 +- .../webapp/src/components/core_components.jsx | 21 +- .../abstractions/databases/local_database.py | 4 +- .../review_app/client/package-lock.json | 20 + .../client/review_app/client/package.json | 4 +- .../review_app/client/public/index.html | 8 +- .../client/review_app/client/src/App/App.css | 1 - .../client/review_app/client/src/App/App.tsx | 37 +- .../ClosableErrorAlert/ClosableErrorAlert.css | 2 +- .../ClosableErrorAlert/ClosableErrorAlert.tsx | 11 +- .../client/src/components/Errors/Errors.tsx | 25 +- .../review_app/client/src/consts/http.ts | 3 +- .../review_app/client/src/consts/review.ts | 1 - .../client/review_app/client/src/default.css | 8 +- .../client/review_app/client/src/index.tsx | 15 +- .../client/src/pages/HomePage/HomePage.css | 2 - .../client/src/pages/HomePage/HomePage.tsx | 14 +- .../pages/TaskPage/ModalForm/ModalForm.css | 6 +- .../pages/TaskPage/ModalForm/ModalForm.tsx | 294 ++++++----- .../TaskPage/ReviewModal/ReviewModal.css | 21 +- .../TaskPage/ReviewModal/ReviewModal.tsx | 104 ++-- .../pages/TaskPage/TaskHeader/TaskHeader.css | 3 +- .../pages/TaskPage/TaskHeader/TaskHeader.tsx | 261 +++++---- .../client/src/pages/TaskPage/TaskPage.tsx | 494 ++++++++++-------- .../client/src/pages/TaskPage/helpers.ts | 8 +- .../client/src/pages/TaskPage/modalData.tsx | 14 +- .../TasksPage/TasksHeader/TasksHeader.tsx | 37 +- .../client/src/pages/TasksPage/TasksPage.tsx | 134 ++--- .../client/src/requests/generateURL.tsx | 12 +- .../client/src/requests/makeRequest.ts | 27 +- .../client/src/requests/mockResponses.ts | 363 ++++++------- .../client/src/requests/qualifications.ts | 70 +-- .../review_app/client/src/requests/stats.ts | 16 +- .../review_app/client/src/requests/tasks.ts | 34 +- .../review_app/client/src/requests/units.ts | 53 +- .../review_app/client/src/requests/workers.ts | 16 +- .../client/src/types/qualifications.d.ts | 1 - .../review_app/client/src/types/requests.d.ts | 3 - .../client/src/types/reviewModal.d.ts | 2 - .../review_app/client/src/types/static.d.ts | 21 +- .../review_app/client/src/types/tasks.d.ts | 2 - .../review_app/client/src/types/units.d.ts | 3 - .../review_app/client/src/types/workers.d.ts | 1 - mephisto/client/review_app/client/src/urls.ts | 35 +- mephisto/client/review_app/server/__init__.py | 28 +- .../api/views/qualification_workers_view.py | 4 +- .../server/api/views/qualifications_view.py | 40 +- .../server/api/views/qualify_worker_view.py | 35 +- .../review_app/server/api/views/stats_view.py | 36 +- .../review_app/server/api/views/task_view.py | 2 +- .../review_app/server/api/views/tasks_view.py | 7 +- .../api/views/tasks_worker_units_view.py | 5 +- .../server/api/views/units_approve_view.py | 6 +- .../server/api/views/units_details_view.py | 2 +- .../server/api/views/units_reject_view.py | 6 +- .../api/views/units_soft_reject_view.py | 6 +- .../review_app/server/api/views/units_view.py | 2 +- .../server/api/views/worker_block_view.py | 6 +- .../client/review_app/server/db_queries.py | 9 +- 59 files changed, 1321 insertions(+), 1100 deletions(-) diff --git a/examples/remote_procedure/mnist_for_review/webapp/src/app.jsx b/examples/remote_procedure/mnist_for_review/webapp/src/app.jsx index 321134418..beb04a7eb 100644 --- a/examples/remote_procedure/mnist_for_review/webapp/src/app.jsx +++ b/examples/remote_procedure/mnist_for_review/webapp/src/app.jsx @@ -34,15 +34,15 @@ function uuidv4() { function RemoteProcedureApp() { const searchParams = new URLSearchParams(window.location.search); - const reviewMode = searchParams.get('review_mode'); + const reviewMode = searchParams.get("review_mode"); const [reviewData, setReviewData] = React.useState(null); // [RECEIVING WIDGET DATA] // --- - window.onmessage = function(e) { + window.onmessage = function (e) { const data = JSON.parse(e.data); - setReviewData(data['REVIEW_DATA']); + setReviewData(data["REVIEW_DATA"]); }; // --- @@ -52,13 +52,9 @@ function RemoteProcedureApp() { // --- // Return review before other code that contains any request to server if (reviewMode) { - return
- {reviewData && ( - - )} -
; + return ( +
{reviewData && }
+ ); } // --- diff --git a/examples/remote_procedure/mnist_for_review/webapp/src/components/core_components.jsx b/examples/remote_procedure/mnist_for_review/webapp/src/components/core_components.jsx index 8fadd4557..764b2733c 100644 --- a/examples/remote_procedure/mnist_for_review/webapp/src/components/core_components.jsx +++ b/examples/remote_procedure/mnist_for_review/webapp/src/components/core_components.jsx @@ -210,7 +210,7 @@ function ReviewAnnotationCanvas({ index, value }) { style={{ float: "left", padding: "3px", borderStyle: "solid" }} >
- {'img' + {"img"
- - -
- {props.data.applyToNextUnitsCount > 1 && ( - onChangeApplyToNext(!props.data.applyToNext)} + + - )} - - - ; -} + + +
+ + +
+
+ {props.data.applyToNextUnitsCount > 1 && ( + onChangeApplyToNext(!props.data.applyToNext)} + /> + )} + +
+ + ) + ); +} export default ReviewModal; diff --git a/mephisto/client/review_app/client/src/pages/TaskPage/TaskHeader/TaskHeader.css b/mephisto/client/review_app/client/src/pages/TaskPage/TaskHeader/TaskHeader.css index e5d071802..7c1f6d391 100644 --- a/mephisto/client/review_app/client/src/pages/TaskPage/TaskHeader/TaskHeader.css +++ b/mephisto/client/review_app/client/src/pages/TaskPage/TaskHeader/TaskHeader.css @@ -40,7 +40,8 @@ text-align: center; } -.task-header .table th, .task-header .table td { +.task-header .table th, +.task-header .table td { background: transparent; line-height: 0.8; } diff --git a/mephisto/client/review_app/client/src/pages/TaskPage/TaskHeader/TaskHeader.tsx b/mephisto/client/review_app/client/src/pages/TaskPage/TaskHeader/TaskHeader.tsx index c2592dee6..1afe5353a 100644 --- a/mephisto/client/review_app/client/src/pages/TaskPage/TaskHeader/TaskHeader.tsx +++ b/mephisto/client/review_app/client/src/pages/TaskPage/TaskHeader/TaskHeader.tsx @@ -4,13 +4,12 @@ * LICENSE file in the root directory of this source tree. */ -import * as React from 'react'; -import { Col, Container, Row, Table } from 'react-bootstrap'; -import { Link } from 'react-router-dom'; -import logo from 'static/images/logo.svg'; -import urls from 'urls'; -import './TaskHeader.css'; - +import * as React from "react"; +import { Col, Container, Row, Table } from "react-bootstrap"; +import { Link } from "react-router-dom"; +import logo from "static/images/logo.svg"; +import urls from "urls"; +import "./TaskHeader.css"; interface PropsType { taskStats?: TaskStatsType; @@ -18,114 +17,162 @@ interface PropsType { workerStats?: WorkerStatsType; } - function TaskHeader(props: PropsType) { const wStats = props.workerStats; const tStats = props.taskStats; const toPercent = (total: number, value: number): number => { - return total !== 0 ? Math.round(value * 100 / total) : 0; + return total !== 0 ? Math.round((value * 100) / total) : 0; }; - return - - - - logo - - - - {wStats && tStats && ( - - - - - - - - - - - - - {/* Worker line */} - - - - - - - - - {/* Total line */} - - - - - - - - -
ReviewedApprovedSoft‑RejectedRejected
Worker {props.workerId} - {wStats.total_count !== null ? (<> - {wStats.reviewed_count}/{wStats.total_count} - ) : (<> - --/-- - )} - - {wStats.total_count !== null ? (<> - {wStats.approved_count}{' '} - ({toPercent(wStats.total_count, wStats.approved_count)}%) - ) : (<> - -- - )} - - {wStats.total_count !== null ? (<> - {wStats.soft_rejected_count}{' '} - ({toPercent(wStats.total_count, wStats.soft_rejected_count)}%) - ) : (<> - -- - )} - - {wStats.total_count !== null ? (<> - {wStats.rejected_count}{' '} - ({toPercent(wStats.total_count, wStats.rejected_count)}%) - ) : (<> - -- - )} -
Total - {tStats.total_count !== null ? (<> - {tStats.reviewed_count}/{tStats.total_count} - ) : (<> - --/-- - )} - - {tStats.total_count !== null ? (<> - {tStats.approved_count}{' '} - ({toPercent(tStats.total_count, tStats.approved_count)}%) - ) : (<> - -- - )} - - {tStats.total_count !== null ? (<> - {tStats.soft_rejected_count}{' '} - ({toPercent(tStats.total_count, tStats.soft_rejected_count)}%) - ) : (<> - -- - )} - - {tStats.total_count !== null ? (<> - {tStats.rejected_count}{' '} - ({toPercent(tStats.total_count, tStats.rejected_count)}%) - ) : (<> - -- - )} -
+ return ( + + + + + logo + - )} - - ; -} + + {wStats && tStats && ( + + + + + + + + + + + + + {/* Worker line */} + + + + + + + + {/* Total line */} + + + + + + + + +
+ Reviewed + + Approved + + Soft‑Rejected + + Rejected +
Worker {props.workerId} + {wStats.total_count !== null ? ( + <> + {wStats.reviewed_count}/{wStats.total_count} + + ) : ( + <> + --/-- + + )} + + {wStats.total_count !== null ? ( + <> + {wStats.approved_count} ( + {toPercent(wStats.total_count, wStats.approved_count)}%) + + ) : ( + <> + -- + + )} + + {wStats.total_count !== null ? ( + <> + {wStats.soft_rejected_count} ( + {toPercent( + wStats.total_count, + wStats.soft_rejected_count + )} + %) + + ) : ( + <> + -- + + )} + + {wStats.total_count !== null ? ( + <> + {wStats.rejected_count} ( + {toPercent(wStats.total_count, wStats.rejected_count)}%) + + ) : ( + <> + -- + + )} +
Total + {tStats.total_count !== null ? ( + <> + {tStats.reviewed_count}/{tStats.total_count} + + ) : ( + <> + --/-- + + )} + + {tStats.total_count !== null ? ( + <> + {tStats.approved_count} ( + {toPercent(tStats.total_count, tStats.approved_count)}%) + + ) : ( + <> + -- + + )} + + {tStats.total_count !== null ? ( + <> + {tStats.soft_rejected_count} ( + {toPercent( + tStats.total_count, + tStats.soft_rejected_count + )} + %) + + ) : ( + <> + -- + + )} + + {tStats.total_count !== null ? ( + <> + {tStats.rejected_count} ( + {toPercent(tStats.total_count, tStats.rejected_count)}%) + + ) : ( + <> + -- + + )} +
+ + )} + + + ); +} export default TaskHeader; diff --git a/mephisto/client/review_app/client/src/pages/TaskPage/TaskPage.tsx b/mephisto/client/review_app/client/src/pages/TaskPage/TaskPage.tsx index 296e6772e..97397a8fc 100644 --- a/mephisto/client/review_app/client/src/pages/TaskPage/TaskPage.tsx +++ b/mephisto/client/review_app/client/src/pages/TaskPage/TaskPage.tsx @@ -6,42 +6,40 @@ // TODO: Find the way to import it dynamically // import { TaskFrontend } from 'components/mnist_core_components_copied'; -import { ReviewType } from 'consts/review'; -import cloneDeep from 'lodash/cloneDeep'; -import * as React from 'react'; -import { useEffect } from 'react'; -import { Button, Spinner, Table } from 'react-bootstrap'; -import JSONPretty from 'react-json-pretty'; -import { useNavigate, useParams } from 'react-router-dom'; +import { ReviewType } from "consts/review"; +import cloneDeep from "lodash/cloneDeep"; +import * as React from "react"; +import { useEffect } from "react"; +import { Button, Spinner, Table } from "react-bootstrap"; +import JSONPretty from "react-json-pretty"; +import { useNavigate, useParams } from "react-router-dom"; import { postQualificationGrantWorker, postQualificationRevokeWorker, -} from 'requests/qualifications'; -import { getStats } from 'requests/stats'; -import { getTask, getTaskWorkerUnitsIds } from 'requests/tasks'; +} from "requests/qualifications"; +import { getStats } from "requests/stats"; +import { getTask, getTaskWorkerUnitsIds } from "requests/tasks"; import { getUnits, getUnitsDetails, postUnitsApprove, postUnitsReject, postUnitsSoftReject, -} from 'requests/units'; -import { postWorkerBlock } from 'requests/workers'; -import urls from 'urls'; -import { setPageTitle, updateModalState } from './helpers'; +} from "requests/units"; +import { postWorkerBlock } from "requests/workers"; +import urls from "urls"; +import { setPageTitle, updateModalState } from "./helpers"; import { APPROVE_MODAL_DATA_STATE, DEFAULT_MODAL_STATE_VALUE, REJECT_MODAL_DATA_STATE, SOFT_REJECT_MODAL_DATA_STATE, -} from './modalData'; -import ReviewModal from './ReviewModal/ReviewModal'; -import TaskHeader from './TaskHeader/TaskHeader'; -import './TaskPage.css'; - - -const MNIST_URL = process.env.REACT_APP__MNIST_URL || 'http://localhost:3000'; +} from "./modalData"; +import ReviewModal from "./ReviewModal/ReviewModal"; +import TaskHeader from "./TaskHeader/TaskHeader"; +import "./TaskPage.css"; +const MNIST_URL = process.env.REACT_APP__MNIST_URL || "http://localhost:3000"; const defaultStats = { total_count: null, @@ -49,22 +47,18 @@ const defaultStats = { approved_count: 0, rejected_count: 0, soft_rejected_count: 0, -} - - -type UnitDetailsMapType = {[key: string]: UnitType & UnitDetailsType}; +}; +type UnitDetailsMapType = { [key: string]: UnitType & UnitDetailsType }; type ParamsType = { id: string; }; - interface PropsType { setErrors: Function; } - function TaskPage(props: PropsType) { const params = useParams(); const navigate = useNavigate(); @@ -86,17 +80,31 @@ function TaskPage(props: PropsType) { ); const [taskStats, setTaskStats] = React.useState(defaultStats); - const [workerStats, setWorkerStats] = React.useState(defaultStats); - const [workerUnits, setWorkerUnits] = React.useState>(null); - const [unitsOnReview, setUnitsOnReview] = React.useState<[number, number[]]>(null); - const [currentWorkerOnReview, setCurrentWorkerOnReview] = React.useState(null); - const [currentUnitOnReview, setCurrentUnitOnReview] = React.useState(null); + const [workerStats, setWorkerStats] = React.useState( + defaultStats + ); + const [workerUnits, setWorkerUnits] = React.useState< + Array<[number, number[]]> + >(null); + const [unitsOnReview, setUnitsOnReview] = React.useState<[number, number[]]>( + null + ); + const [currentWorkerOnReview, setCurrentWorkerOnReview] = React.useState< + number + >(null); + const [currentUnitOnReview, setCurrentUnitOnReview] = React.useState( + null + ); const [unitDetails, setUnitDetails] = React.useState(null); - const [unitDetailsMap, setUnitDetailsMap] = React.useState({}); + const [unitDetailsMap, setUnitDetailsMap] = React.useState< + UnitDetailsMapType + >({}); const [finishedTask, setFinishedTask] = React.useState(false); - const onGetTaskWorkerUnitsIdsSuccess = (workerUnitsIds: WorkerUnitIdType[]) => { + const onGetTaskWorkerUnitsIdsSuccess = ( + workerUnitsIds: WorkerUnitIdType[] + ) => { setWorkerUnits(() => { const workerUnitsMap = {}; @@ -108,7 +116,7 @@ function TaskPage(props: PropsType) { let sortedValue = []; for (let i in workerUnitsMap) { - sortedValue.push([Number(i), workerUnitsMap[i]]); + sortedValue.push([Number(i), workerUnitsMap[i]]); } // Sort workers by number of their units @@ -175,7 +183,10 @@ function TaskPage(props: PropsType) { setUnitsOnReview([firstWrokerUnits[0], [...firstWrokerUnits[1]]]); setCurrentWorkerOnReview(firstWrokerUnits[0]); - setModalData({...modalData, applyToNextUnitsCount: [...firstWrokerUnits[1]].length}); + setModalData({ + ...modalData, + applyToNextUnitsCount: [...firstWrokerUnits[1]].length, + }); const firstUnit = firstWrokerUnits[1].shift(); setCurrentUnitOnReview(firstUnit); @@ -184,7 +195,10 @@ function TaskPage(props: PropsType) { const onReviewSuccess = (_modalData: ModalDataType, unitIds: number[]) => { if (_modalData.type === ReviewType.APPROVE) { // Grant Qualification - if (_modalData.form.checkboxAssignQualification && _modalData.form.qualification) { + if ( + _modalData.form.checkboxAssignQualification && + _modalData.form.qualification + ) { postQualificationGrantWorker( _modalData.form.qualification, currentWorkerOnReview, @@ -192,17 +206,23 @@ function TaskPage(props: PropsType) { setLoading, onError, { - feedback: _modalData.form.checkboxComment ? _modalData.form.comment : null, - tips: _modalData.form.checkboxGiveTips ? _modalData.form.tips : null, + feedback: _modalData.form.checkboxComment + ? _modalData.form.comment + : null, + tips: _modalData.form.checkboxGiveTips + ? _modalData.form.tips + : null, unit_ids: unitIds, value: _modalData.form.qualificationValue, - }, - ) + } + ); } - } - else if (_modalData.type === ReviewType.SOFT_REJECT) { + } else if (_modalData.type === ReviewType.SOFT_REJECT) { // Revoke Qualification - if (_modalData.form.checkboxAssignQualification && _modalData.form.qualification) { + if ( + _modalData.form.checkboxAssignQualification && + _modalData.form.qualification + ) { postQualificationRevokeWorker( _modalData.form.qualification, currentWorkerOnReview, @@ -210,16 +230,20 @@ function TaskPage(props: PropsType) { setLoading, onError, { - feedback: _modalData.form.checkboxComment ? _modalData.form.comment : null, + feedback: _modalData.form.checkboxComment + ? _modalData.form.comment + : null, unit_ids: unitIds, value: _modalData.form.qualificationValue, - }, - ) + } + ); } - } - else if (_modalData.type === ReviewType.REJECT) { + } else if (_modalData.type === ReviewType.REJECT) { // Revoke Qualification - if (_modalData.form.checkboxUnassignQualification && _modalData.form.qualification) { + if ( + _modalData.form.checkboxUnassignQualification && + _modalData.form.qualification + ) { postQualificationRevokeWorker( _modalData.form.qualification, currentWorkerOnReview, @@ -227,10 +251,12 @@ function TaskPage(props: PropsType) { setLoading, onError, { - feedback: _modalData.form.checkboxComment ? _modalData.form.comment : null, + feedback: _modalData.form.checkboxComment + ? _modalData.form.comment + : null, unit_ids: unitIds, - }, - ) + } + ); } // Block Worker if (_modalData.form.checkboxBanWorker) { @@ -240,10 +266,12 @@ function TaskPage(props: PropsType) { setLoading, onError, { - feedback: _modalData.form.checkboxComment ? _modalData.form.comment : null, + feedback: _modalData.form.checkboxComment + ? _modalData.form.comment + : null, unit_ids: unitIds, - }, - ) + } + ); } } @@ -268,17 +296,24 @@ function TaskPage(props: PropsType) { if (modalData.type === ReviewType.APPROVE) { postUnitsApprove( - () => onReviewSuccess(modalData, unitIds), setLoading, onError, {unit_ids: unitIds}, + () => onReviewSuccess(modalData, unitIds), + setLoading, + onError, + { unit_ids: unitIds } ); - } - else if (modalData.type === ReviewType.SOFT_REJECT) { + } else if (modalData.type === ReviewType.SOFT_REJECT) { postUnitsSoftReject( - () => onReviewSuccess(modalData, unitIds), setLoading, onError, {unit_ids: unitIds}, + () => onReviewSuccess(modalData, unitIds), + setLoading, + onError, + { unit_ids: unitIds } ); - } - else if (modalData.type === ReviewType.REJECT) { + } else if (modalData.type === ReviewType.REJECT) { postUnitsReject( - () => onReviewSuccess(modalData, unitIds), setLoading, onError, {unit_ids: unitIds}, + () => onReviewSuccess(modalData, unitIds), + setLoading, + onError, + { unit_ids: unitIds } ); } @@ -297,9 +332,9 @@ function TaskPage(props: PropsType) { const sendDataToTaskIframe = (data: object) => { const reviewData = { REVIEW_DATA: data, - } - const taskIframe = iframeRef.current; - taskIframe.contentWindow.postMessage(JSON.stringify(reviewData), '*'); + }; + const taskIframe = iframeRef.current; + taskIframe.contentWindow.postMessage(JSON.stringify(reviewData), "*"); }; // --- @@ -317,7 +352,10 @@ function TaskPage(props: PropsType) { if (units === null) { getTaskWorkerUnitsIds( - Number(params.id), onGetTaskWorkerUnitsIdsSuccess, setLoading, onError, + Number(params.id), + onGetTaskWorkerUnitsIdsSuccess, + setLoading, + onError ); } }, []); @@ -342,9 +380,10 @@ function TaskPage(props: PropsType) { useEffect(() => { if (unitsOnReview && unitsOnReview[1].length) { - getUnits( - setUnits, setLoading, onError, {task_id: params.id, unit_ids: unitsOnReview[1].join(',')}, - ); + getUnits(setUnits, setLoading, onError, { + task_id: params.id, + unit_ids: unitsOnReview[1].join(","), + }); } }, [unitsOnReview]); @@ -358,26 +397,24 @@ function TaskPage(props: PropsType) { return map; }); - getStats(setTaskStats, setLoading, onError, {task_id: params.id}); - getStats( - setWorkerStats, - setLoading, - onError, - {task_id: params.id, worker_id: currentWorkerOnReview}, - ); - getUnitsDetails(setUnitDetails, setLoading, onError, {unit_ids: currentUnitOnReview}); + getStats(setTaskStats, setLoading, onError, { task_id: params.id }); + getStats(setWorkerStats, setLoading, onError, { + task_id: params.id, + worker_id: currentWorkerOnReview, + }); + getUnitsDetails(setUnitDetails, setLoading, onError, { + unit_ids: currentUnitOnReview, + }); } }, [units, currentUnitOnReview]); useEffect(() => { if (finishedTask === true) { - getStats(setTaskStats, setLoading, onError, {task_id: params.id}); - getStats( - setWorkerStats, - setLoading, - onError, - {task_id: params.id, worker_id: currentWorkerOnReview}, - ); + getStats(setTaskStats, setLoading, onError, { task_id: params.id }); + getStats(setWorkerStats, setLoading, onError, { + task_id: params.id, + worker_id: currentWorkerOnReview, + }); setTimeout(() => { navigate(urls.client.tasks); @@ -391,7 +428,7 @@ function TaskPage(props: PropsType) { const map = cloneDeep(oldValue); unitDetails.forEach((item: UnitDetailsType) => { const prev = map[item.id]; - map[item.id] = {...prev, ...item}; + map[item.id] = { ...prev, ...item }; }); return map; }); @@ -404,7 +441,7 @@ function TaskPage(props: PropsType) { if ( iframeLoaded && currentUnitDetails?.outputs && - 'final_submission' in currentUnitDetails.outputs + "final_submission" in currentUnitDetails.outputs ) { sendDataToTaskIframe(currentUnitDetails.outputs); } @@ -415,131 +452,172 @@ function TaskPage(props: PropsType) { return null; } - return
- - -
- {!finishedTask ? (<> - - - - ) : ( -
No units left for this task. Redirecting to the list of tasks.
- )} -
- -
- {/* Preloader when we request tasks */} - {loading && ( -
- - Loading... - -
- )} - - {/* Unit info */} - {unitDetails && currentUnitOnReview && ( -
- {currentUnitDetails && (<> -
Unit ID: {currentUnitDetails.id}
-
Task ID: {currentUnitDetails.task_id}
-
Worker ID: {currentUnitDetails.worker_id}
- )} -
- )} - - {currentUnitDetails?.outputs && (<> - {/* Task info */} -
e.preventDefault()}> - {'final_submission' in currentUnitDetails.outputs ? (<> - {/* TODO [RECEIVING WIDGET DATA]: Remove this later if `iframe` is OK */} - {/*
*/} - {/* {(currentUnitDetails.outputs['final_submission']['annotations'] || []).map(*/} - {/* (item: {[key: string]: any}, i: number) => {*/} - {/* return {'img';*/} - {/* }*/} - {/* )}*/} - {/*
*/} - {/* null}*/} - {/* handleSubmit={(e) => console.log('handleSubmit', e)}*/} - {/* taskData={currentUnitDetails.outputs['init_data'] || {isScreeningUnit: false}}*/} - {/*/>*/} - - {/* [RECEIVING WIDGET DATA] */} - {/* --- */} - {/* + return ( +
+ + +
+ {!finishedTask ? ( + <> + + + + + ) : ( +
+ No units left for this task. Redirecting to the list of tasks. +
+ )} +
+ +
+ {/* Preloader when we request tasks */} + {loading && ( +
+ + Loading... + +
+ )} + + {/* Unit info */} + {unitDetails && currentUnitOnReview && ( +
+ {currentUnitDetails && ( + <> +
Unit ID: {currentUnitDetails.id}
+
Task ID: {currentUnitDetails.task_id}
+
Worker ID: {currentUnitDetails.worker_id}
+ + )} +
+ )} + + {currentUnitDetails?.outputs && ( + <> + {/* Task info */} +
e.preventDefault()}> + {"final_submission" in currentUnitDetails.outputs ? ( + <> + {/* TODO [RECEIVING WIDGET DATA]: Remove this later if `iframe` is OK */} + {/*
*/} + {/* {(currentUnitDetails.outputs['final_submission']['annotations'] || []).map(*/} + {/* (item: {[key: string]: any}, i: number) => {*/} + {/* return {'img';*/} + {/* }*/} + {/* )}*/} + {/*
*/} + {/* null}*/} + {/* handleSubmit={(e) => console.log('handleSubmit', e)}*/} + {/* taskData={currentUnitDetails.outputs['init_data'] || {isScreeningUnit: false}}*/} + {/*/>*/} + + {/* [RECEIVING WIDGET DATA] */} + {/* --- */} + {/* NOTE: We need to pass `review_mode=true` to tell MNIST app not to show default view and make any requests to server */} -