Merge pull request #851 from ebi-uniprot/job-state

Jobs SharedWorker

Author: dlrice

__mocks__/idb.js

@@ -1,6 +1,6 @@
-/* eslint-disable import/no-import-module-exports, import/no-extraneous-dependencies */
 // structuredClone not in JSDom (as of Aug 2024)
 import 'core-js/stable/structured-clone';
+// eslint-disable-next-line import/no-extraneous-dependencies
 import 'fake-indexeddb/auto';
 
-export { openDB, IDBPDatabase } from 'idb';
+export { IDBPDatabase, openDB } from 'idb';

jest.setup.ts

@@ -1,6 +1,7 @@
 import '@testing-library/jest-dom';
 import 'interaction-viewer';
 import 'swagger-ui-react';
+
 import { resetUuidV1 } from './__mocks__/uuid';
 
 global.gtag = () => {
@@ -22,6 +23,12 @@ jest.mock('interaction-viewer', () => null);
 
 jest.mock('/shared/custom-elements/NightingaleMSA', () => jest.fn());
 
+jest.mock('/shared/workers/jobs/getJobSharedWorker', () => ({
+  __esModule: true,
+  default: jest.fn(),
+  dispatchJobs: jest.fn(),
+}));
+
 jest.mock('@nightingale-elements/nightingale-navigation', () => jest.fn());
 
 jest.mock('swagger-ui-react', () => null);

src/app/components/App.tsx

@@ -25,6 +25,7 @@ import BaseLayout from '../../shared/components/layouts/BaseLayout';
 import { SingleColumnLayout } from '../../shared/components/layouts/SingleColumnLayout';
 import useReloadApp from '../../shared/hooks/useReloadApp';
 import useScrollToTop from '../../shared/hooks/useScrollToTop';
+import useSupportsJobs from '../../shared/hooks/useSupportsJobs';
 import { Namespace, SearchableNamespace } from '../../shared/types/namespaces';
 import history from '../../shared/utils/browserHistory';
 import { stringifyQuery, stringifyUrl } from '../../shared/utils/url';
@@ -211,56 +212,56 @@ const ARBAEntryPage = lazy(
 const BlastResult = lazy(
   () =>
     import(
-      /* webpackChunkName: "blast-result" */ '../../tools/blast/components/results/BlastResult'
+      /* webpackChunkName: "blast-result" */ '../../jobs/blast/components/results/BlastResult'
     )
 );
 const BlastForm = lazy(
   () =>
     import(
-      /* webpackChunkName: "blast-form" */ '../../tools/blast/components/BlastForm'
+      /* webpackChunkName: "blast-form" */ '../../jobs/blast/components/BlastForm'
     )
 );
 const AlignResult = lazy(
   () =>
     import(
-      /* webpackChunkName: "align-result" */ '../../tools/align/components/results/AlignResult'
+      /* webpackChunkName: "align-result" */ '../../jobs/align/components/results/AlignResult'
     )
 );
 const AlignForm = lazy(
   () =>
     import(
-      /* webpackChunkName: "align-form" */ '../../tools/align/components/AlignForm'
+      /* webpackChunkName: "align-form" */ '../../jobs/align/components/AlignForm'
     )
 );
 const IDMappingResult = lazy(
   () =>
     import(
-      /* webpackChunkName: "id-mapping-result" */ '../../tools/id-mapping/components/results/IDMappingResult'
+      /* webpackChunkName: "id-mapping-result" */ '../../jobs/id-mapping/components/results/IDMappingResult'
     )
 );
 const IDMappingForm = lazy(
   () =>
     import(
-      /* webpackChunkName: "id-mapping-form" */ '../../tools/id-mapping/components/IDMappingForm'
+      /* webpackChunkName: "id-mapping-form" */ '../../jobs/id-mapping/components/IDMappingForm'
     )
 );
 const PeptideSearchResult = lazy(
   () =>
     import(
-      /* webpackChunkName: "peptide-search-result" */ '../../tools/peptide-search/components/results/PeptideSearchResult'
+      /* webpackChunkName: "peptide-search-result" */ '../../jobs/peptide-search/components/results/PeptideSearchResult'
     )
 );
 const PeptideSearchForm = lazy(
   () =>
     import(
-      /* webpackChunkName: "peptide-search-form" */ '../../tools/peptide-search/components/PeptideSearchForm'
+      /* webpackChunkName: "peptide-search-form" */ '../../jobs/peptide-search/components/PeptideSearchForm'
     )
 );
 
 const Dashboard = lazy(
   () =>
     import(
-      /* webpackChunkName: "dashboard" */ '../../tools/dashboard/components/Dashboard'
+      /* webpackChunkName: "dashboard" */ '../../jobs/dashboard/components/Dashboard'
     )
 );
 
@@ -318,6 +319,13 @@ const ResourceNotFoundPage = lazy(
     )
 );
 
+const JobsNotSupportedPage = lazy(
+  () =>
+    import(
+      /* webpackChunkName: "jobs-not-supported" */ '../../shared/components/error-pages/JobsNotSupported'
+    )
+);
+
 const ContextualHelp = lazy(() =>
   sleep(1000).then(
     () =>
@@ -404,6 +412,11 @@ const RedirectToStarSearch = (
   );
 };
 
+const IfSupportsJobs = ({ children }: React.PropsWithChildren) => {
+  const supportsJobs = useSupportsJobs();
+  return <>{supportsJobs ? children : <JobsNotSupportedPage />}</>;
+};
+
 const App = () => {
   useScrollToTop(history);
   useReloadApp(history);
@@ -500,58 +513,84 @@ const App = () => {
             {/* Tools */}
             <Route
               path={LocationToPath[Location.BlastResult]}
-              component={BlastResult}
+              render={() => (
+                <IfSupportsJobs>
+                  <BlastResult />
+                </IfSupportsJobs>
+              )}
             />
             <Route
               path={LocationToPath[Location.Blast]}
               render={() => (
-                <SingleColumnLayout>
-                  <BlastForm />
-                </SingleColumnLayout>
+                <IfSupportsJobs>
+                  <SingleColumnLayout>
+                    <BlastForm />
+                  </SingleColumnLayout>
+                </IfSupportsJobs>
               )}
             />
             <Route
               path={LocationToPath[Location.AlignResult]}
-              component={AlignResult}
+              render={() => (
+                <IfSupportsJobs>
+                  <AlignResult />
+                </IfSupportsJobs>
+              )}
             />
             <Route
               path={LocationToPath[Location.Align]}
               render={() => (
-                <SingleColumnLayout>
-                  <AlignForm />
-                </SingleColumnLayout>
+                <IfSupportsJobs>
+                  <SingleColumnLayout>
+                    <AlignForm />
+                  </SingleColumnLayout>
+                </IfSupportsJobs>
               )}
             />
             <Route
               path={LocationToPath[Location.PeptideSearchResult]}
-              component={PeptideSearchResult}
+              render={() => (
+                <IfSupportsJobs>
+                  <PeptideSearchResult />
+                </IfSupportsJobs>
+              )}
             />
             <Route
               path={LocationToPath[Location.PeptideSearch]}
               render={() => (
-                <SingleColumnLayout>
-                  <PeptideSearchForm />
-                </SingleColumnLayout>
+                <IfSupportsJobs>
+                  <SingleColumnLayout>
+                    <PeptideSearchForm />
+                  </SingleColumnLayout>
+                </IfSupportsJobs>
               )}
             />
             <Route
               path={LocationToPath[Location.IDMappingResult]}
-              component={IDMappingResult}
+              render={() => (
+                <IfSupportsJobs>
+                  <IDMappingResult />
+                </IfSupportsJobs>
+              )}
             />
             <Route
               path={LocationToPath[Location.IDMapping]}
               render={() => (
-                <SingleColumnLayout>
-                  <IDMappingForm />
-                </SingleColumnLayout>
+                <IfSupportsJobs>
+                  <SingleColumnLayout>
+                    <IDMappingForm />
+                  </SingleColumnLayout>
+                </IfSupportsJobs>
               )}
             />
             <Route
               path={LocationToPath[Location.Dashboard]}
               render={() => (
-                <SingleColumnLayout>
-                  <Dashboard />
-                </SingleColumnLayout>
+                <IfSupportsJobs>
+                  <SingleColumnLayout>
+                    <Dashboard />
+                  </SingleColumnLayout>
+                </IfSupportsJobs>
               )}
             />
             {/* Basket */}

src/app/components/home-page/AnalysisTools.tsx

@@ -6,7 +6,7 @@ import AlignIllustration from '../../../images/align_illustration.img.svg';
 import BlastIllustration from '../../../images/blast_illustration.img.svg';
 import IDMappingIllustration from '../../../images/id-mapping_illustration.img.svg';
 import PeptideSearchIllustration from '../../../images/peptide_search_illustration.img.svg';
-import { JobTypes } from '../../../tools/types/toolsJobTypes';
+import { JobTypes } from '../../../jobs/types/jobTypes';
 import { jobTypeToPath, Location, LocationToPath } from '../../config/urls';
 import styles from './styles/non-critical.module.scss';
 

src/app/config/urls.ts

@@ -2,19 +2,19 @@ import { LocationDescriptorObject } from 'history';
 import { partial } from 'lodash-es';
 import { generatePath, matchPath } from 'react-router-dom';
 
+import { databaseToNamespace } from '../../jobs/blast/config/BlastFormData';
+import { FormParameters as BLASTFormParameters } from '../../jobs/blast/types/blastFormParameters';
+import { Database } from '../../jobs/blast/types/blastServerParameters';
+import { FormParameters as IdMappingFormParameters } from '../../jobs/id-mapping/types/idMappingFormParameters';
+import { JobTypes } from '../../jobs/types/jobTypes';
 import {
   Namespace,
   namespaceAndToolsLabels,
   SearchableNamespace,
   searchableNamespaceLabels,
   supportingDataAndAANamespaces,
 } from '../../shared/types/namespaces';
-import { databaseToNamespace } from '../../tools/blast/config/BlastFormData';
-import { FormParameters as BLASTFormParameters } from '../../tools/blast/types/blastFormParameters';
-import { Database } from '../../tools/blast/types/blastServerParameters';
-import { FormParameters as IdMappingFormParameters } from '../../tools/id-mapping/types/idMappingFormParameters';
-import { FinishedJob, Job } from '../../tools/types/toolsJob';
-import { JobTypes } from '../../tools/types/toolsJobTypes';
+import { FinishedJob, Job } from '../../shared/workers/jobs/types/job';
 
 export const IDMappingNamespaces = [
   Namespace.uniprotkb,

src/app/contexts/Global.tsx

@@ -5,7 +5,6 @@ import { Router } from 'react-router-dom';
 import ErrorBoundary from '../../shared/components/error-component/ErrorBoundary';
 import { IDMappingDetailsProvider } from '../../shared/contexts/IDMappingDetails';
 import { MessagesProvider } from '../../shared/contexts/Messages';
-import { ToolsProvider } from '../../shared/contexts/Tools';
 import { UniProtDataProvider } from '../../shared/contexts/UniProtData';
 import history from '../../shared/utils/browserHistory';
 
@@ -16,11 +15,9 @@ const GlobalContext: FC<React.PropsWithChildren<unknown>> = ({ children }) => (
       <HelmetProvider>
         <MessagesProvider>
           {/* Order is important, tools needs to be within messages */}
-          <ToolsProvider>
-            <UniProtDataProvider>
-              <IDMappingDetailsProvider>{children}</IDMappingDetailsProvider>
-            </UniProtDataProvider>
-          </ToolsProvider>
+          <UniProtDataProvider>
+            <IDMappingDetailsProvider>{children}</IDMappingDetailsProvider>
+          </UniProtDataProvider>
         </MessagesProvider>
       </HelmetProvider>
     </ErrorBoundary>

src/automatic-annotations/arba/config/__tests__/ARBAColumnConfiguration.spec.tsx

@@ -8,7 +8,7 @@ import ARBAColumnConfiguration, {
   ARBAColumn,
 } from '../ARBAColumnConfiguration';
 
-jest.mock('../../../../tools/utils/storage');
+jest.mock('../../../../shared/workers/jobs/utils/storage');
 
 const transformedData: ARBAUIModel = databaseConverter(data[0]);
 

src/automatic-annotations/unirule/config/__tests__/UniRuleColumnConfiguration.spec.tsx

@@ -8,7 +8,7 @@ import UniRuleColumnConfiguration, {
   UniRuleColumn,
 } from '../UniRuleColumnConfiguration';
 
-jest.mock('../../../../tools/utils/storage');
+jest.mock('../../../../shared/workers/jobs/utils/storage');
 
 const transformedData: UniRuleUIModel = databaseConverter(data[1]);
 

src/basket/BasketFullView.tsx

@@ -2,6 +2,7 @@ import { Loader, PageIntro } from 'franklin-sites';
 import { useRouteMatch } from 'react-router-dom';
 
 import { basketNamespaces, Location, LocationToPath } from '../app/config/urls';
+import { reIds } from '../jobs/utils/urls';
 import HTMLHead from '../shared/components/HTMLHead';
 import { SidebarLayout } from '../shared/components/layouts/SideBarLayout';
 import ResultsButtons from '../shared/components/results/ResultsButtons';
@@ -19,7 +20,6 @@ import {
   searchableNamespaceLabels,
 } from '../shared/types/namespaces';
 import { SearchResults } from '../shared/types/results';
-import { reIds } from '../tools/utils/urls';
 import { updateResultsWithAccessionSubsets } from './BasketMiniView';
 import EmptyBasket from './EmptyBasket';
 

src/basket/BasketMiniView.tsx

@@ -3,6 +3,7 @@ import { Dispatch, SetStateAction, useEffect, useMemo } from 'react';
 import { generatePath, Link } from 'react-router-dom';
 
 import { Location, LocationToPath } from '../app/config/urls';
+import { reIds } from '../jobs/utils/urls';
 import ResultsButtons from '../shared/components/results/ResultsButtons';
 import ResultsData from '../shared/components/results/ResultsData';
 import useBasket, { Basket } from '../shared/hooks/useBasket';
@@ -17,7 +18,6 @@ import usePagination from '../shared/hooks/usePagination';
 import { APIModel } from '../shared/types/apiModel';
 import { Namespace } from '../shared/types/namespaces';
 import { getIdKeyForData } from '../shared/utils/getIdKey';
-import { reIds } from '../tools/utils/urls';
 import { UniParcColumn } from '../uniparc/config/UniParcColumnConfiguration';
 import { UniProtkbAPIModel } from '../uniprotkb/adapters/uniProtkbConverter';
 import { UniProtKBColumn } from '../uniprotkb/types/columnTypes';