Allow to login into UI with token from api/v1/auth/login

CHANGELOG.md

@@ -6,6 +6,7 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0
 
 ## [1.2.0] - Unreleased
 ### Added
+- Ability to login into CVAT-UI with token from api/v1/auth/login (<https://github.com/openvinotoolkit/cvat/pull/2234>)
 - Added password reset functionality (<https://github.com/opencv/cvat/pull/2058>)
 - Ability to work with data on the fly (https://github.com/opencv/cvat/pull/2007)
 - Annotation in process outline color wheel (<https://github.com/opencv/cvat/pull/2084>)

cvat-ui/package.json

@@ -67,6 +67,7 @@
     "prop-types": "^15.7.2",
     "react": "^16.9.0",
     "react-color": "^2.18.1",
+    "react-cookie": "^4.0.3",
     "react-dom": "^16.9.0",
     "react-hotkeys": "^2.0.0",
     "react-redux": "^7.1.1",

cvat-ui/src/components/cvat-app.tsx

@@ -15,6 +15,7 @@ import Text from 'antd/lib/typography/Text';
 import notification from 'antd/lib/notification';
 
 import GlobalErrorBoundary from 'components/global-error-boundary/global-error-boundary';
+import LoginWithTokenComponent from './login-with-token/login-with-token';
 import ShorcutsDialog from 'components/shortcuts-dialog/shortcuts-dialog';
 import TasksPageContainer from 'containers/tasks-page/tasks-page';
 import CreateTaskPageContainer from 'containers/create-task-page/create-task-page';
@@ -337,6 +338,7 @@ class CVATApplication extends React.PureComponent<CVATAppProps & RouteComponentP
                     <Switch>
                         <Route exact path='/auth/register' component={RegisterPageContainer} />
                         <Route exact path='/auth/login' component={LoginPageContainer} />
+                        <Route exact path='/auth/login-with-token/:sessionId/:token' component={LoginWithTokenComponent} />
                         <Route exact path='/auth/password/reset' component={ResetPasswordPageComponent} />
                         <Route exact path='/auth/password/reset/confirm' component={ResetPasswordPageConfirmComponent} />
                         <Redirect to='/auth/login' />

cvat-ui/src/components/login-with-token/login-with-token.tsx

@@ -0,0 +1,21 @@
+// Copyright (C) 2020 Intel Corporation
+//
+// SPDX-License-Identifier: MIT
+
+import React from 'react';
+import {Redirect, useParams} from "react-router";
+import {useCookies } from "react-cookie";
+
+export default function LoginWithTokenComponent(){
+    const { sessionId, token } = useParams()
+    const [cookies, setCookie] = useCookies(['sessionid', 'csrftoken'])
+    const expires = new Date(new Date().setFullYear(new Date().getFullYear() + 1))
+    setCookie('sessionid', sessionId, {path: '/', expires })
+    setCookie('csrftoken', token, {path: '/', expires})
+
+    if ( cookies['sessionid'] && cookies['csrftoken']) {
+        window.location.reload();
+        <Redirect to="/tasks" />
+    }
+    return(<></>);
+};