subscribe on history updates in the root component

cvat-ui/src/components/annotation-page/annotation-page.tsx

@@ -4,13 +4,11 @@
 
 import './styles.scss';
 import React, { useEffect } from 'react';
-import { useLocation } from 'react-router-dom';
 import Layout from 'antd/lib/layout';
 import Spin from 'antd/lib/spin';
 import Result from 'antd/lib/result';
 
 import { Workspace } from 'reducers/interfaces';
-import { customWaViewHit } from 'utils/enviroment';
 import AnnotationTopBarContainer from 'containers/annotation-page/top-bar/top-bar';
 import StatisticsModalContainer from 'containers/annotation-page/top-bar/statistics-modal';
 import StandardWorkspaceComponent from './standard-workspace/standard-workspace';
@@ -33,12 +31,9 @@ export default function AnnotationPageComponent(props: Props): JSX.Element {
         workspace,
     } = props;
 
-    const location = useLocation();
-
     useEffect(() => {
         saveLogs();
         const root = window.document.getElementById('root');
-        customWaViewHit(location.pathname);
         if (root) {
             root.style.minHeight = '768px';
         }

cvat-ui/src/components/create-model-page/create-model-page.tsx

@@ -3,13 +3,11 @@
 // SPDX-License-Identifier: MIT
 
 import './styles.scss';
-import React, { useEffect } from 'react';
-import { useLocation } from 'react-router-dom';
+import React from 'react';
 import { Row, Col } from 'antd/lib/grid';
 import Text from 'antd/lib/typography/Text';
 
 import { ModelFiles } from 'reducers/interfaces';
-import { customWaViewHit } from 'utils/enviroment';
 import CreateModelContent from './create-model-content';
 
 interface Props {
@@ -25,12 +23,6 @@ export default function CreateModelPageComponent(props: Props): JSX.Element {
         createModel,
     } = props;
 
-    const location = useLocation();
-
-    useEffect(() => {
-        customWaViewHit(location.pathname);
-    });
-
     return (
         <Row type='flex' justify='center' align='top' className='cvat-create-model-form-wrapper'>
             <Col md={20} lg={16} xl={14} xxl={9}>

cvat-ui/src/components/create-task-page/create-task-page.tsx

@@ -4,14 +4,12 @@
 
 import './styles.scss';
 import React, { useEffect } from 'react';
-import { useLocation } from 'react-router-dom';
 import { Row, Col } from 'antd/lib/grid';
 import Modal from 'antd/lib/modal';
 import Text from 'antd/lib/typography/Text';
 import Paragraph from 'antd/lib/typography/Paragraph';
 import TextArea from 'antd/lib/input/TextArea';
 
-import { customWaViewHit } from 'utils/enviroment';
 import CreateTaskContent, { CreateTaskData } from './create-task-content';
 
 interface Props {
@@ -28,11 +26,8 @@ export default function CreateTaskPage(props: Props): JSX.Element {
         onCreate,
         installedGit,
     } = props;
-    const location = useLocation();
 
     useEffect(() => {
-        customWaViewHit(location.pathname);
-
         if (error) {
             let errorCopy = error;
             const sshKeys: string[] = [];

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

@@ -24,6 +24,7 @@ import AnnotationPageContainer from 'containers/annotation-page/annotation-page'
 import LoginPageContainer from 'containers/login-page/login-page';
 import RegisterPageContainer from 'containers/register-page/register-page';
 import HeaderContainer from 'containers/header/header';
+import { customWaViewHit } from 'utils/enviroment';
 
 import getCore from 'cvat-core-wrapper';
 import { NotificationsState } from 'reducers/interfaces';
@@ -61,7 +62,7 @@ interface CVATAppProps {
 class CVATApplication extends React.PureComponent<CVATAppProps & RouteComponentProps> {
     public componentDidMount(): void {
         const core = getCore();
-        const { verifyAuthorized, loadUserAgreements } = this.props;
+        const { verifyAuthorized, history } = this.props;
         configure({ ignoreRepeatedEventsWhenKeyHeldDown: false });
 
         // Logger configuration
@@ -71,6 +72,11 @@ class CVATApplication extends React.PureComponent<CVATAppProps & RouteComponentP
         });
         core.logger.configure(() => window.document.hasFocus, userActivityCallback);
 
+        customWaViewHit(location.pathname, location.search, location.hash);
+        history.listen((location) => {
+            customWaViewHit(location.pathname, location.search, location.hash);
+        });
+
         verifyAuthorized();
     }
 

cvat-ui/src/components/login-page/login-page.tsx

@@ -2,14 +2,13 @@
 //
 // SPDX-License-Identifier: MIT
 
-import React, { useEffect } from 'react';
+import React from 'react';
 import { RouteComponentProps } from 'react-router';
 import { Link, withRouter } from 'react-router-dom';
 import Title from 'antd/lib/typography/Title';
 import Text from 'antd/lib/typography/Text';
 import { Row, Col } from 'antd/lib/grid';
 
-import { customWaViewHit } from 'utils/enviroment';
 import LoginForm, { LoginData } from './login-form';
 import CookieDrawer from './cookie-policy-drawer';
 
@@ -30,13 +29,8 @@ function LoginPageComponent(props: LoginPageComponentProps & RouteComponentProps
     const {
         fetching,
         onLogin,
-        location,
     } = props;
 
-    useEffect(() => {
-        customWaViewHit(location.pathname);
-    });
-
     return (
         <>
             <Row type='flex' justify='center' align='middle'>

cvat-ui/src/components/models-page/models-page.tsx

@@ -3,11 +3,9 @@
 // SPDX-License-Identifier: MIT
 
 import './styles.scss';
-import React, { useEffect } from 'react';
-import { useLocation } from 'react-router-dom';
+import React from 'react';
 import Spin from 'antd/lib/spin';
 
-import { customWaViewHit } from 'utils/enviroment';
 import TopBarComponent from './top-bar';
 import UploadedModelsList from './uploaded-models-list';
 import BuiltModelsList from './built-models-list';
@@ -40,12 +38,6 @@ export default function ModelsPageComponent(props: Props): JSX.Element {
         deleteModel,
     } = props;
 
-    const location = useLocation();
-
-    useEffect(() => {
-        customWaViewHit(location.pathname);
-    });
-
     if (!modelsInitialized) {
         if (!modelsFetching) {
             props.getModels();

cvat-ui/src/components/register-page/register-page.tsx

@@ -3,15 +3,14 @@
 // SPDX-License-Identifier: MIT
 
 import './styles.scss';
-import React, { useEffect } from 'react';
+import React from 'react';
 import { RouteComponentProps } from 'react-router';
 import { Link, withRouter } from 'react-router-dom';
 import Title from 'antd/lib/typography/Title';
 import Text from 'antd/lib/typography/Text';
 import { Row, Col } from 'antd/lib/grid';
 
 import { UserAgreement } from 'reducers/interfaces'
-import { customWaViewHit } from 'utils/enviroment';
 import CookieDrawer from 'components/login-page/cookie-policy-drawer';
 import RegisterForm, { RegisterData, UserConfirmation } from './register-form';
 
@@ -39,13 +38,8 @@ function RegisterPageComponent(
         fetching,
         userAgreements,
         onRegister,
-        location,
     } = props;
 
-    useEffect(() => {
-        customWaViewHit(location.pathname);
-    });
-
     return (
         <>
             <Row type='flex' justify='center' align='middle'>

cvat-ui/src/components/settings-page/settings-page.tsx

@@ -3,7 +3,7 @@
 // SPDX-License-Identifier: MIT
 
 import './styles.scss';
-import React, { useEffect } from 'react';
+import React from 'react';
 import { Row, Col } from 'antd/lib/grid';
 import Tabs from 'antd/lib/tabs';
 import Icon from 'antd/lib/icon';
@@ -14,15 +14,8 @@ import { RouteComponentProps } from 'react-router';
 
 import WorkspaceSettingsContainer from 'containers/settings-page/workspace-settings';
 import PlayerSettingsContainer from 'containers/settings-page/player-settings';
-import { customWaViewHit } from 'utils/enviroment';
 
 function SettingsPage(props: RouteComponentProps): JSX.Element {
-    const { location } = props;
-
-    useEffect(() => {
-        customWaViewHit(location.pathname);
-    });
-
     return (
         <div className='cvat-settings-page'>
             <Row type='flex' justify='center'>

cvat-ui/src/components/task-page/task-page.tsx

@@ -14,7 +14,6 @@ import DetailsContainer from 'containers/task-page/details';
 import JobListContainer from 'containers/task-page/job-list';
 import ModelRunnerModalContainer from 'containers/model-runner-dialog/model-runner-dialog';
 import { Task } from 'reducers/interfaces';
-import { customWaViewHit } from 'utils/enviroment';
 import TopBarComponent from './top-bar';
 
 interface TaskPageComponentProps {
@@ -28,11 +27,6 @@ interface TaskPageComponentProps {
 type Props = TaskPageComponentProps & RouteComponentProps<{id: string}>;
 
 class TaskPageComponent extends React.PureComponent<Props> {
-    public componentDidMount(): void {
-        const { location } = this.props;
-
-        customWaViewHit(location.pathname);
-    }
     public componentDidUpdate(): void {
         const {
             deleteActivity,

cvat-ui/src/components/tasks-page/tasks-page.tsx

@@ -12,12 +12,12 @@ import message from 'antd/lib/message';
 import Text from 'antd/lib/typography/Text';
 
 import { TasksQuery } from 'reducers/interfaces';
-import { customWaViewHit } from 'utils/enviroment';
 import FeedbackComponent from 'components/feedback/feedback';
 import TaskListContainer from 'containers/tasks-page/tasks-list';
 import TopBar from './top-bar';
 import EmptyListComponent from './empty-list';
 
+
 interface TasksPageProps {
     tasksFetching: boolean;
     gettingQuery: TasksQuery;
@@ -84,7 +84,6 @@ class TasksPageComponent extends React.PureComponent<TasksPageProps & RouteCompo
 
         const query = updateQuery(gettingQuery, location.search);
         onGetTasks(query);
-        customWaViewHit(location.pathname, location.search);
     }
 
     public componentDidUpdate(prevProps: TasksPageProps & RouteComponentProps): void {
@@ -101,7 +100,6 @@ class TasksPageComponent extends React.PureComponent<TasksPageProps & RouteCompo
             const query = updateQuery(gettingQuery, location.search);
             message.destroy();
             onGetTasks(query);
-            customWaViewHit(location.pathname, location.search);
             return;
         }