From 78ec06f0a6357dda1bdc5cf12aa43d93963c9f68 Mon Sep 17 00:00:00 2001
From: Dave Falke <dfalke@uga.edu>
Date: Tue, 24 Sep 2024 10:10:05 -0400
Subject: [PATCH] Add diamond support to multi-blast, and enable on ortho-site
 (#1197)

* Attempt to get local dev working for multi-blast

* Upgrade recoil to work with React 18 types

* Wire multi-blast in ortho-site

* Make blastOntologyDatabase optional, and add magic string to indicate
all algorithm options are available.

* Update search name

* Handle optional blastOntologyDatabase property

* Add options for custom workspace header, and remove hardcoded path.

* Add new route for map-proteins

* add multi-blast vars to sample file

* Handle empty advanced params, allow file-only sequence param, and use file-based request if a file is provided.

* Add diamond config types and mappings with wdk search parameter values

* eValue should be a number for diamond

* Only assign parameter values when the config value is defined

* Update link in header

* Update workspace heading

* Make link relative

* Add generic method to fetch a specific report file

* Add support for customizing verbiage

* Reduce margin

* Add method to get download url for a file

* Relativize links

target can be null

* target can be null

* Add result view for diamond jobs

* go to new form for map-proteins

* fix issues with multi-blast local dev site

* Make help tab configurable

* Request headers and use for preview and download

* Make paths relative to workspace root

* Update comment

* Map stitle to new columns

* Add support for AbortSignal to usePromise

* Handle AbortSignal
---
 packages/libs/multi-blast/config-overrides.js |  41 +++-
 packages/libs/multi-blast/package.json        |   7 +-
 packages/libs/multi-blast/src/index.tsx       |  27 ++-
 .../src/lib/components/BlastForm.scss         |   6 +-
 .../src/lib/components/BlastForm.tsx          | 129 +++++++----
 .../src/lib/components/BlastWorkspace.tsx     |  26 ++-
 .../src/lib/components/BlastWorkspaceHelp.tsx |  20 +-
 .../lib/components/BlastWorkspaceResult.scss  |   9 +
 .../lib/components/BlastWorkspaceResult.tsx   | 143 +++++++-----
 .../lib/components/DiamondResultContainer.tsx | 214 ++++++++++++++++++
 .../lib/controllers/BlastWorkspaceRouter.tsx  |  19 +-
 .../multi-blast/src/lib/hooks/allJobs.tsx     |   6 +-
 .../src/lib/hooks/blastAlgorithms.tsx         | 147 ++++++------
 .../src/lib/hooks/combinedResults.tsx         |   6 +-
 .../src/lib/hooks/individualResult.tsx        |   6 +-
 .../libs/multi-blast/src/lib/hooks/params.ts  |  18 +-
 .../multi-blast/src/lib/utils/ServiceTypes.ts |  61 ++++-
 .../libs/multi-blast/src/lib/utils/api.ts     |  27 ++-
 .../libs/multi-blast/src/lib/utils/params.ts  |  71 +++++-
 .../multi-blast/src/lib/utils/targetTypes.ts  |  12 +-
 .../libs/preferred-organisms/package.json     |   2 +-
 .../src/lib/utils/preferredOrganisms.ts       |   2 +-
 .../libs/wdk-client/src/Hooks/PromiseHook.ts  |  12 +-
 packages/sites/genomics-site/.env.sample      |   3 +
 packages/sites/genomics-site/package.json     |   2 +-
 .../js/client/blastRoutes.tsx                 |   3 +-
 packages/sites/ortho-site/.env.sample         |   3 +
 packages/sites/ortho-site/package.json        |   1 +
 .../js/client/blastRoutes.tsx                 |  47 ++++
 .../client/components/layout/OrthoMCLPage.tsx |   4 +-
 .../controllers/BlastWorkspaceResult.tsx      |   2 +
 .../controllers/BlastWorkspaceRouter.tsx      |   2 +
 .../js/client/pluginConfig.tsx                |  25 ++
 .../js/client/plugins/BlastForm.tsx           |   2 +
 .../plugins/BlastQuestionController.tsx       |   2 +
 .../js/client/proteinMappingRoutes.tsx        |  34 +++
 .../wdkCustomization/js/client/routes.tsx     |   5 +
 .../wdkCustomization/js/client/services.tsx   |   4 +-
 .../sites/ortho-site/webpack.config.local.mjs |   1 +
 yarn.lock                                     |  17 +-
 40 files changed, 911 insertions(+), 257 deletions(-)
 create mode 100644 packages/libs/multi-blast/src/lib/components/DiamondResultContainer.tsx
 create mode 100644 packages/sites/ortho-site/webapp/wdkCustomization/js/client/blastRoutes.tsx
 create mode 100644 packages/sites/ortho-site/webapp/wdkCustomization/js/client/controllers/BlastWorkspaceResult.tsx
 create mode 100644 packages/sites/ortho-site/webapp/wdkCustomization/js/client/controllers/BlastWorkspaceRouter.tsx
 create mode 100644 packages/sites/ortho-site/webapp/wdkCustomization/js/client/plugins/BlastForm.tsx
 create mode 100644 packages/sites/ortho-site/webapp/wdkCustomization/js/client/plugins/BlastQuestionController.tsx
 create mode 100644 packages/sites/ortho-site/webapp/wdkCustomization/js/client/proteinMappingRoutes.tsx

diff --git a/packages/libs/multi-blast/config-overrides.js b/packages/libs/multi-blast/config-overrides.js
index 501f171fce..c061efdf7e 100644
--- a/packages/libs/multi-blast/config-overrides.js
+++ b/packages/libs/multi-blast/config-overrides.js
@@ -1,4 +1,4 @@
-const path = require('path');
+const webpack = require('webpack');
 
 /*
  * The following gives preference to the project's root node_modules directory when loading modules and loaders.
@@ -10,18 +10,37 @@ module.exports = function override(config, env) {
     ...config,
     resolve: {
       ...config.resolve,
-      modules: [
-        path.join(__dirname, 'node_modules'),
-        ...(config.resolve.modules || ['node_modules']),
-      ],
+      fallback: {
+        path: 'path-browserify',
+        stream: 'stream-browserify',
+        querystring: 'querystring-es3',
+        assert: 'assert',
+        buffer: 'buffer',
+        fs: false,
+      },
     },
-    resolveLoader: {
-      ...config.resolveLoader,
-      modules: [
-        path.join(__dirname, 'node_modules'),
-        ...(config.resolveLoader.modules || ['node_modules']),
+    plugins: [
+      ...config.plugins,
+      new webpack.ProvidePlugin({
+        // This is needed by shape2geohash, used by MapVEuMap
+        process: 'process/browser',
+      }),
+    ],
+    externals: [{ jquery: 'jQuery' }],
+    module: {
+      ...config.module,
+      rules: [
+        ...config.module.rules,
+        {
+          test: /\.(js|jsx|ts|tsx)$/,
+          exclude: /node_modules\/(?!(@veupathdb))/,
+          enforce: 'pre',
+          use: 'source-map-loader',
+        },
       ],
     },
-    externals: [{ jquery: 'jQuery' }],
+    snapshot: {
+      managedPaths: [],
+    },
   };
 };
diff --git a/packages/libs/multi-blast/package.json b/packages/libs/multi-blast/package.json
index e105dc2848..93a00cf200 100644
--- a/packages/libs/multi-blast/package.json
+++ b/packages/libs/multi-blast/package.json
@@ -12,7 +12,8 @@
     "src/lib"
   ],
   "sideEffects": [
-    "*.scss"
+    "*.scss",
+    "src/globals.js"
   ],
   "dependencies": {
     "@veupathdb/coreui": "workspace:^",
@@ -99,9 +100,9 @@
     "react-redux": "^7.2.6",
     "react-router": "^5.2.0",
     "react-router-dom": "^5.2.0",
-    "react-scripts": "4.0.1",
+    "react-scripts": "5.0.1",
     "read": "^1.0.7",
-    "recoil": "^0.2.0",
+    "recoil": "^0.7.7",
     "redux": "^4.0.0",
     "sass": "^1.56.2",
     "script-loader": "^0.7.2",
diff --git a/packages/libs/multi-blast/src/index.tsx b/packages/libs/multi-blast/src/index.tsx
index a11052b4a0..a783f493bb 100644
--- a/packages/libs/multi-blast/src/index.tsx
+++ b/packages/libs/multi-blast/src/index.tsx
@@ -1,15 +1,22 @@
 import './globals';
+
+// eslint-disable-next-line import/no-webpack-loader-syntax
+import '!!script-loader!@veupathdb/wdk-client/vendored/jquery';
+// eslint-disable-next-line import/no-webpack-loader-syntax
+import '!!script-loader!@veupathdb/wdk-client/vendored/jquery-migrate-1.2.1';
+// eslint-disable-next-line import/no-webpack-loader-syntax
+import '!!script-loader!@veupathdb/wdk-client/vendored/jquery-ui';
+// eslint-disable-next-line import/no-webpack-loader-syntax
+import '!!script-loader!@veupathdb/wdk-client/vendored/jquery.qtip.min';
+
 import React, { Suspense } from 'react';
 import { Redirect, RouteComponentProps } from 'react-router';
 import { RecoilRoot } from 'recoil';
-import { initialize } from '@veupathdb/web-common/lib/bootstrap';
-import {
-  BlastSummaryViewPlugin,
-  GenomeSummaryViewPlugin,
-  ResultTableSummaryViewPlugin,
-} from '@veupathdb/wdk-client/lib/Plugins';
+import { initialize } from '@veupathdb/wdk-client';
+import { ResultTableSummaryViewPlugin } from '@veupathdb/wdk-client/lib/Plugins';
 import { RouteEntry } from '@veupathdb/wdk-client/lib/Core/RouteEntry';
 import { ClientPluginRegistryEntry } from '@veupathdb/wdk-client/lib/Utils/ClientPlugin';
+import BlastSummaryViewPlugin from '@veupathdb/blast-summary-view/lib/Controllers/BlastSummaryViewController';
 
 import {
   OrganismParam,
@@ -28,9 +35,6 @@ import { BlastWorkspaceRouter } from './lib/controllers/BlastWorkspaceRouter';
 import { isMultiBlastQuestion } from './lib/utils/pluginConfig';
 import { wrapWdkService } from './lib/utils/wdkServiceIntegration';
 
-import '@veupathdb/wdk-client/lib/Core/Style/index.scss';
-import '@veupathdb/web-common/lib/styles/client.scss';
-
 import './index.css';
 
 initialize({
@@ -93,11 +97,6 @@ initialize({
       name: '_default',
       component: ResultTableSummaryViewPlugin,
     },
-    {
-      type: 'summaryView',
-      name: 'genomic-view',
-      component: GenomeSummaryViewPlugin,
-    },
     {
       type: 'summaryView',
       name: 'blast-view',
diff --git a/packages/libs/multi-blast/src/lib/components/BlastForm.scss b/packages/libs/multi-blast/src/lib/components/BlastForm.scss
index 46dbcad544..2e2417ea27 100644
--- a/packages/libs/multi-blast/src/lib/components/BlastForm.scss
+++ b/packages/libs/multi-blast/src/lib/components/BlastForm.scss
@@ -1,12 +1,16 @@
 .wdk-QuestionForm {
   &MultiBlast {
+    > * + * {
+      margin-block-start: 1em;
+    }
+
     .SequenceParam {
       display: inline-flex;
       flex-direction: column;
       gap: 1em;
 
       &Instructions {
-        font-size: 1.2em;
+        font-size: 1.1em;
       }
 
       textarea {
diff --git a/packages/libs/multi-blast/src/lib/components/BlastForm.tsx b/packages/libs/multi-blast/src/lib/components/BlastForm.tsx
index 2536fa2a31..1f772281fc 100644
--- a/packages/libs/multi-blast/src/lib/components/BlastForm.tsx
+++ b/packages/libs/multi-blast/src/lib/components/BlastForm.tsx
@@ -1,5 +1,4 @@
 import {
-  ChangeEvent,
   FormEvent,
   useCallback,
   useContext,
@@ -23,11 +22,15 @@ import {
   TextArea,
 } from '@veupathdb/wdk-client/lib/Components';
 import { WdkDependenciesContext } from '@veupathdb/wdk-client/lib/Hooks/WdkDependenciesEffect';
-import { makeClassNameHelper } from '@veupathdb/wdk-client/lib/Utils/ComponentUtils';
+import {
+  makeClassNameHelper,
+  safeHtml,
+} from '@veupathdb/wdk-client/lib/Utils/ComponentUtils';
 import { scrollIntoView } from '@veupathdb/wdk-client/lib/Utils/DomUtils';
 import {
   Parameter,
   ParameterGroup,
+  SelectEnumParam,
 } from '@veupathdb/wdk-client/lib/Utils/WdkModel';
 import DefaultQuestionForm, {
   ParameterList,
@@ -38,7 +41,6 @@ import DefaultQuestionForm, {
 import { Plugin } from '@veupathdb/wdk-client/lib/Utils/ClientPlugin';
 import {
   makeParamDependenciesUpdating,
-  useChangeParamValue,
   useDependentParamsAreUpdating,
 } from '@veupathdb/wdk-client/lib/Views/Question/Params/Utils';
 
@@ -74,6 +76,7 @@ import { AdvancedParamGroup } from './AdvancedParamGroup';
 import { BlastFormValidationInfo } from './BlastFormValidationInfo';
 
 import './BlastForm.scss';
+import Banner from '@veupathdb/coreui/lib/components/banners/Banner';
 
 export const blastFormCx = makeClassNameHelper('wdk-QuestionForm');
 
@@ -86,6 +89,10 @@ export interface Props extends DefaultQuestionFormProps {
   isMultiBlast?: boolean;
 }
 
+interface TransformedProps extends Props {
+  originalQuestion: Props['state']['question'];
+}
+
 export function BlastForm(props: Props) {
   const targetType = props.state.paramValues[BLAST_DATABASE_TYPE_PARAM_NAME];
   const targetMetadataByDataType = useContext(TargetMetadataByDataType);
@@ -101,54 +108,47 @@ export function BlastForm(props: Props) {
   );
 }
 
-function BlastFormWithTransformedQuestion(props: Props) {
+function BlastFormWithTransformedQuestion(props: TransformedProps) {
   const canChangeRecordType = props.canChangeRecordType ?? false;
 
   const targetType = props.state.paramValues[BLAST_DATABASE_TYPE_PARAM_NAME];
 
+  const blastAlgorithmParameter = props.state.question.parametersByName[
+    BLAST_ALGORITHM_PARAM_NAME
+  ] as SelectEnumParam;
+
   const selectedBlastAlgorithm =
     props.state.paramValues[BLAST_ALGORITHM_PARAM_NAME];
 
+  const selectedBlastAlgorithmDisplay =
+    blastAlgorithmParameter.vocabulary.find(
+      ([term]) => term === selectedBlastAlgorithm
+    )?.[1] ?? selectedBlastAlgorithm;
+
   const restrictedAdvancedParamGroup = useMemo(() => {
     const fullAdvancedParamGroup =
       props.state.question.groupsByName[ADVANCED_PARAMS_GROUP_NAME];
 
+    if (fullAdvancedParamGroup == null) {
+      return undefined;
+    }
+
     return {
       ...fullAdvancedParamGroup,
-      displayName: `Advanced ${selectedBlastAlgorithm.toUpperCase()} Parameters`,
+      displayName: `Advanced ${selectedBlastAlgorithmDisplay.toUpperCase()} Parameters`,
       parameters: fullAdvancedParamGroup.parameters.filter(
         (paramName) =>
           !isOmittedParam(props.state.question.parametersByName[paramName])
       ),
     };
   }, [
-    selectedBlastAlgorithm,
+    selectedBlastAlgorithmDisplay,
     props.state.question.groupsByName,
     props.state.question.parametersByName,
   ]);
 
   const enabledAlgorithms = useEnabledAlgorithms(targetType);
 
-  const updateQueryParam = useChangeParamValue(
-    props.state.question.parametersByName[BLAST_QUERY_SEQUENCE_PARAM_NAME],
-    props.state,
-    props.eventHandlers.updateParamValue
-  );
-
-  const onQueryFileInputChanged = useCallback(
-    (event: ChangeEvent<HTMLInputElement>) => {
-      const file =
-        event.target.files == null || event.target.files.length === 0
-          ? null
-          : event.target.files[0];
-
-      if (file != null) {
-        file.text().then(updateQueryParam);
-      }
-    },
-    [updateQueryParam]
-  );
-
   const defaultAdvancedParamsMetadata = useDefaultAdvancedParams(
     props.state.question
   );
@@ -208,6 +208,11 @@ function BlastFormWithTransformedQuestion(props: Props) {
     props.eventHandlers.updateParamValue
   );
 
+  const enableSequenceTextArea =
+    !props.state.question.parametersByName[
+      BLAST_QUERY_SEQUENCE_PARAM_NAME
+    ]?.properties?.['multiBlastOptions']?.includes('fileOnly');
+
   const targetParamElement = (
     <RadioList
       {...targetParamProps}
@@ -223,25 +228,33 @@ function BlastFormWithTransformedQuestion(props: Props) {
   const sequenceParamElement = (
     <div className="SequenceParam">
       <div className="SequenceParamInstructions">
-        {props.isMultiBlast
-          ? 'Paste one or several sequences, or upload a FASTA file.'
-          : 'Paste one sequence, or upload a one-sequence FASTA file.'}
+        {props.originalQuestion.parametersByName[
+          BLAST_QUERY_SEQUENCE_PARAM_NAME
+        ]?.visibleHelp ??
+          (enableSequenceTextArea
+            ? props.isMultiBlast
+              ? 'Paste one or several sequences, or upload a FASTA file. If both are provided, the file will be used.'
+              : 'Paste one sequence, or upload a one-sequence FASTA file. If both are provided, the file will be used.'
+            : props.isMultiBlast
+            ? 'Upload a FASTA file.'
+            : 'Upload a one-sequence FASTA file.')}
       </div>
-      <TextArea
-        {...sequenceParamProps}
-        name={`${props.state.question.urlSegment}/${BLAST_QUERY_SEQUENCE_PARAM_NAME}`}
-      />
+      {enableSequenceTextArea && (
+        <TextArea
+          {...sequenceParamProps}
+          name={`${props.state.question.urlSegment}/${BLAST_QUERY_SEQUENCE_PARAM_NAME}`}
+        />
+      )}
       <input
         type="file"
         accept="text/*"
         name={`${props.state.question.urlSegment}/${BLAST_QUERY_SEQUENCE_PARAM_NAME}__file`}
-        onChange={onQueryFileInputChanged}
       />
     </div>
   );
   const dynamicOrganismParam =
     props.state.question.parametersByName[BLAST_DATABASE_ORGANISM_PARAM_NAME];
-  const organismParamElement = (
+  const organismParamElement = dynamicOrganismParam && (
     <Plugin
       context={{
         type: 'questionFormParameter',
@@ -284,9 +297,7 @@ function BlastFormWithTransformedQuestion(props: Props) {
   const renderBlastParamGroup = useCallback(
     (group: ParameterGroup, formProps: Props) => (
       <div key={group.name} className={blastFormCx('Group', group.name)}>
-        {group.name !== ADVANCED_PARAMS_GROUP_NAME ? (
-          renderDefaultParamGroup(group, formProps)
-        ) : (
+        {group.name === restrictedAdvancedParamGroup?.name ? (
           <AdvancedParamGroup
             key={group.name}
             searchName={formProps.state.question.urlSegment}
@@ -314,6 +325,8 @@ function BlastFormWithTransformedQuestion(props: Props) {
               />
             </>
           </AdvancedParamGroup>
+        ) : (
+          renderDefaultParamGroup(group, formProps)
         )}
       </div>
     ),
@@ -404,7 +417,7 @@ function NewJobForm(props: NewJobFormProps) {
   const history = useHistory();
 
   const onSubmit = useCallback(
-    async (event: FormEvent) => {
+    async (event: FormEvent<HTMLFormElement>) => {
       if (api == null) {
         throw new Error('To use this form, the BLAST api must be configured.');
       }
@@ -455,7 +468,21 @@ function NewJobForm(props: NewJobFormProps) {
         target: `${organism}${dbTargetName}`,
       }));
 
-      const query = props.state.paramValues[BLAST_QUERY_SEQUENCE_PARAM_NAME];
+      // React's typescript definitions do not make it easy to access the form element this event was attached to.
+      // event.target has a generic Event type; event.currentTarget has a FormEvent type, but this is not accurate, since it is `null`
+      const queryFileInput = (
+        event.target as HTMLFormElement
+      ).elements.namedItem(
+        `${props.state.question.urlSegment}/${BLAST_QUERY_SEQUENCE_PARAM_NAME}__file`
+      );
+      const queryFile =
+        queryFileInput instanceof HTMLInputElement &&
+        queryFileInput.type === 'file'
+          ? queryFileInput.files?.[0]
+          : undefined;
+
+      const query =
+        queryFile ?? props.state.paramValues[BLAST_QUERY_SEQUENCE_PARAM_NAME];
 
       const config = paramValuesToBlastConfig(props.state.paramValues);
 
@@ -476,7 +503,7 @@ function NewJobForm(props: NewJobFormProps) {
 
         setSubmitting(false);
 
-        history.push(`/workspace/blast/result/${jobId}`);
+        history.push(`result/${jobId}`);
       } else if (createJobResult.details.status === 'invalid-input') {
         setInputErrors(createJobResult.details.errors);
 
@@ -491,16 +518,26 @@ function NewJobForm(props: NewJobFormProps) {
     },
     [
       api,
-      history,
-      targetMetadataByDataType,
       wdkDependencies,
-      props.state.paramValues,
       submissionDisabled,
+      props.state.paramValues,
+      props.state.question.urlSegment,
+      targetMetadataByDataType,
+      history,
     ]
   );
 
   return api == null ? null : (
     <div className={props.containerClassName} ref={containerRef}>
+      {props.state.question.description && (
+        <Banner
+          banner={{
+            type: 'info',
+            hideIcon: true,
+            message: safeHtml(props.state.question.description, null, 'div'),
+          }}
+        />
+      )}
       {inputErrors != null && <BlastFormValidationInfo errors={inputErrors} />}
       <form onSubmit={onSubmit}>
         {props.state.question.groups
@@ -523,7 +560,7 @@ function transformFormQuestion(
   formProps: Props,
   isMultiBlast: boolean = false,
   targetRecordType: string
-): Props {
+): Props & { originalQuestion: Props['state']['question'] } {
   const transformedParameters = formProps.state.question.parameters.reduce(
     (memo, parameter) => {
       if (parameter.name === JOB_DESCRIPTION_PARAM_NAME && !isMultiBlast) {
@@ -545,6 +582,7 @@ function transformFormQuestion(
                 Learn more about BLAST query inputs here.
               </a>
             `,
+          visibleHelp: undefined,
         });
 
         return memo;
@@ -596,5 +634,6 @@ function transformFormQuestion(
         groupsByName: transformedGroupsByName,
       },
     },
+    originalQuestion: formProps.state.question,
   };
 }
diff --git a/packages/libs/multi-blast/src/lib/components/BlastWorkspace.tsx b/packages/libs/multi-blast/src/lib/components/BlastWorkspace.tsx
index 10ef081d42..3450c531d0 100644
--- a/packages/libs/multi-blast/src/lib/components/BlastWorkspace.tsx
+++ b/packages/libs/multi-blast/src/lib/components/BlastWorkspace.tsx
@@ -12,17 +12,25 @@ import { BlastWorkspaceHelp } from './BlastWorkspaceHelp';
 import { BlastWorkspaceNew } from './BlastWorkspaceNew';
 
 import './BlastWorkspace.scss';
+import { ReactNode } from 'react';
 
 export const blastWorkspaceCx = makeClassNameHelper('BlastWorkspace');
 
-export function BlastWorkspace() {
+interface Props {
+  helpPageUrl: string;
+  workspaceUrl: string;
+  workspaceHeading?: ReactNode;
+}
+
+export function BlastWorkspace(props: Props) {
   useSetDocumentTitle('BLAST Workspace');
+  const { helpPageUrl, workspaceUrl, workspaceHeading = 'BLAST' } = props;
 
   return (
     <div className={blastWorkspaceCx()}>
       <WorkspaceNavigation
-        heading="BLAST"
-        routeBase="/workspace/blast"
+        heading={workspaceHeading}
+        routeBase={workspaceUrl}
         items={[
           {
             display: 'New job',
@@ -40,21 +48,23 @@ export function BlastWorkspace() {
       />
       <Switch>
         <WdkRoute
-          path="/workspace/blast/new"
+          path={workspaceUrl + '/new'}
           requiresLogin={false}
           component={BlastWorkspaceNew}
         />
         <WdkRoute
-          path="/workspace/blast/all"
+          path={workspaceUrl + '/all'}
           requiresLogin={false}
           component={BlastWorkspaceAll}
         />
         <WdkRoute
-          path="/workspace/blast/help"
+          path={workspaceUrl + '/help'}
           requiresLogin={false}
-          component={BlastWorkspaceHelp}
+          component={() => {
+            return <BlastWorkspaceHelp helpPageUrl={helpPageUrl} />;
+          }}
         />
-        <Redirect to="/workspace/blast/all" />
+        <Redirect to={workspaceUrl + '/all'} />
       </Switch>
     </div>
   );
diff --git a/packages/libs/multi-blast/src/lib/components/BlastWorkspaceHelp.tsx b/packages/libs/multi-blast/src/lib/components/BlastWorkspaceHelp.tsx
index 80bf3a2015..9820d7a359 100644
--- a/packages/libs/multi-blast/src/lib/components/BlastWorkspaceHelp.tsx
+++ b/packages/libs/multi-blast/src/lib/components/BlastWorkspaceHelp.tsx
@@ -1,17 +1,11 @@
-import { useLocation } from 'react-router';
-
 import ExternalContentController from '@veupathdb/web-common/lib/controllers/ExternalContentController';
-import { useCommunitySiteRootUrl } from '@veupathdb/web-common/lib/hooks/staticData';
 
-export function BlastWorkspaceHelp() {
-  const communitySiteUrl = useCommunitySiteRootUrl();
-  const location = useLocation();
+interface Props {
+  helpPageUrl: string;
+}
+
+export function BlastWorkspaceHelp(props: Props) {
+  const { helpPageUrl } = props;
 
-  return communitySiteUrl == null ? null : (
-    <ExternalContentController
-      url={
-        communitySiteUrl + 'multiblast.html' + location.search + location.hash
-      }
-    />
-  );
+  return <ExternalContentController url={helpPageUrl} />;
 }
diff --git a/packages/libs/multi-blast/src/lib/components/BlastWorkspaceResult.scss b/packages/libs/multi-blast/src/lib/components/BlastWorkspaceResult.scss
index 811a70898e..747dfebe25 100644
--- a/packages/libs/multi-blast/src/lib/components/BlastWorkspaceResult.scss
+++ b/packages/libs/multi-blast/src/lib/components/BlastWorkspaceResult.scss
@@ -19,6 +19,15 @@
       margin-top: 1em;
     }
 
+    .ResultContainer > * + * {
+      margin-top: 0.5em;
+    }
+
+    h2 {
+      font-weight: 400;
+      padding: 0;
+    }
+
     a.BackToAllJobs {
       font-size: 1.2em;
     }
diff --git a/packages/libs/multi-blast/src/lib/components/BlastWorkspaceResult.tsx b/packages/libs/multi-blast/src/lib/components/BlastWorkspaceResult.tsx
index 51ff0903de..d1f17708b3 100644
--- a/packages/libs/multi-blast/src/lib/components/BlastWorkspaceResult.tsx
+++ b/packages/libs/multi-blast/src/lib/components/BlastWorkspaceResult.tsx
@@ -1,10 +1,10 @@
+import path from 'path';
 import { Fragment, useContext, useEffect, useMemo, useState } from 'react';
-import { useHistory } from 'react-router';
+import { useHistory, Link } from 'react-router-dom';
 
 import {
   CollapsibleSection,
   Error as ErrorPage,
-  Link,
   Loading,
 } from '@veupathdb/wdk-client/lib/Components';
 import WorkspaceNavigation from '@veupathdb/wdk-client/lib/Components/Workspace/WorkspaceNavigation';
@@ -40,6 +40,7 @@ import { BlastRequestError } from './BlastRequestError';
 import { ResultContainer } from './ResultContainer';
 
 import './BlastWorkspaceResult.scss';
+import { DiamondResultContainer } from './DiamondResultContainer';
 
 interface Props {
   jobId: string;
@@ -60,16 +61,51 @@ export function BlastWorkspaceResult(props: Props) {
   );
 
   const jobResult = usePromise(
-    () => makeJobPollingPromise(blastApi, props.jobId),
+    ({ signal }) => makeJobPollingPromise(blastApi, props.jobId, signal),
     [blastApi, props.jobId]
   );
 
+  if (jobResult.value == null || queryResult.value == null) {
+    return <LoadingBlastResult {...props} />;
+  }
+
+  return jobResult.value != null &&
+    jobResult.value.status === 'request-error' ? (
+    <BlastRequestError errorDetails={jobResult.value.details} />
+  ) : jobResult.value != null && jobResult.value.status === 'error' ? (
+    <BlastRerunError {...props} />
+  ) : jobResult.value != null && jobResult.value.status === 'queueing-error' ? (
+    <ErrorPage message="We were unable to queue your job." />
+  ) : queryResult.value != null && queryResult.value.status === 'error' ? (
+    <BlastRequestError errorDetails={queryResult.value.details} />
+  ) : jobResult.value.job.config.tool.startsWith('diamond-') ? (
+    <DiamondResultContainer
+      {...props}
+      job={jobResult.value.job}
+      query={queryResult.value.value}
+    />
+  ) : (
+    <StandardBlastResult
+      {...props}
+      job={jobResult.value.job}
+      query={queryResult.value.value}
+    />
+  );
+}
+
+function StandardBlastResult(
+  props: Props & {
+    job: LongJobResponse;
+    query: string;
+  }
+) {
+  const { job, query } = props;
+  const blastApi = useBlastApi();
+  // TODO Add numRows, or whatever, for diamond results
   const reportResult = usePromise(
     async () =>
-      jobResult.value?.status !== 'job-completed'
-        ? undefined
-        : makeReportPollingPromise(blastApi, props.jobId, 'single-file-json'),
-    [blastApi, jobResult.value?.status]
+      makeReportPollingPromise(blastApi, props.jobId, 'single-file-json'),
+    [blastApi]
   );
 
   const multiQueryReportResult = usePromise(
@@ -83,16 +119,10 @@ export function BlastWorkspaceResult(props: Props) {
   );
 
   const individualQueriesResult = usePromise(async () => {
-    if (jobResult.value?.status !== 'job-completed') {
-      return undefined;
-    }
-
-    const childJobIds = jobResult.value.job?.childJobs?.map(({ id }) => id);
+    const childJobIds = job.childJobs?.map(({ id }) => id);
 
     const subJobIds =
-      childJobIds == null || childJobIds.length === 0
-        ? [jobResult.value.job.id]
-        : childJobIds;
+      childJobIds == null || childJobIds.length === 0 ? [job.id] : childJobIds;
 
     const queryResults = await Promise.all(
       subJobIds.map((id) =>
@@ -125,18 +155,9 @@ export function BlastWorkspaceResult(props: Props) {
             }[]
           ).map((queryResult) => queryResult.value),
         } as ApiResultSuccess<IndividualQuery[]>);
-  }, [jobResult.value]);
+  }, [job]);
 
-  return jobResult.value != null &&
-    jobResult.value.status === 'request-error' ? (
-    <BlastRequestError errorDetails={jobResult.value.details} />
-  ) : jobResult.value != null && jobResult.value.status === 'error' ? (
-    <BlastRerunError {...props} />
-  ) : jobResult.value != null && jobResult.value.status === 'queueing-error' ? (
-    <ErrorPage message="We were unable to queue your job." />
-  ) : queryResult.value != null && queryResult.value.status === 'error' ? (
-    <BlastRequestError errorDetails={queryResult.value.details} />
-  ) : reportResult.value != null &&
+  return reportResult.value != null &&
     reportResult.value.status === 'request-error' ? (
     <BlastRequestError errorDetails={reportResult.value.details} />
   ) : reportResult.value != null &&
@@ -145,17 +166,14 @@ export function BlastWorkspaceResult(props: Props) {
   ) : individualQueriesResult.value != null &&
     individualQueriesResult.value.status === 'error' ? (
     <BlastRequestError errorDetails={individualQueriesResult.value.details} />
-  ) : queryResult.value == null ||
-    jobResult.value == null ||
-    reportResult.value == null ||
-    individualQueriesResult.value == null ? (
+  ) : reportResult.value == null || individualQueriesResult.value == null ? (
     <LoadingBlastResult {...props} />
   ) : (
     <CompleteBlastResult
       {...props}
       individualQueries={individualQueriesResult.value.value}
-      jobDetails={jobResult.value.job}
-      query={queryResult.value.value}
+      jobDetails={job}
+      query={query}
       multiQueryReportResult={multiQueryReportResult}
     />
   );
@@ -175,10 +193,9 @@ function LoadingBlastResult(props: Props) {
           </p>
           <p className="Instructions">
             This job could take some time to run. You may leave this page and
-            access the result from your{' '}
-            <Link to="/workspace/blast/all">jobs list</Link> later, or{' '}
-            <Link to="/workspace/blast/new">submit another BLAST job</Link>{' '}
-            while you wait.
+            access the result from your <Link to="../all">jobs list</Link>{' '}
+            later, or <Link to="../new">submit another BLAST job</Link> while
+            you wait.
           </p>
         </div>
       </Loading>
@@ -230,8 +247,9 @@ function CompleteBlastResult(props: CompleteBlastResultProps) {
 
   const targets = props.jobDetails.targets;
 
-  const { targetTypeTerm, wdkRecordType } =
-    useTargetTypeTermAndWdkRecordType(targets);
+  const { targetTypeTerm, wdkRecordType } = useTargetTypeTermAndWdkRecordType(
+    targets ?? []
+  );
 
   const organismToFilenameMapsResult = useBlastCompatibleWdkService(
     async (wdkService) =>
@@ -266,7 +284,7 @@ function CompleteBlastResult(props: CompleteBlastResultProps) {
     <BlastSummary
       filesToOrganisms={organismToFilenameMapsResult.filesToOrganisms}
       jobDetails={props.jobDetails}
-      targets={targets}
+      targets={targets ?? []}
       multiQueryReportResult={props.multiQueryReportResult}
       query={props.query}
       individualQueries={props.individualQueries}
@@ -277,6 +295,7 @@ function CompleteBlastResult(props: CompleteBlastResultProps) {
   );
 }
 
+// TODO Move this to an external file to remove circular dependency
 interface BlastSummaryProps {
   filesToOrganisms: Record<string, string>;
   jobDetails: LongJobResponse;
@@ -337,10 +356,15 @@ function BlastSummary({
 
   const [showMore, setShowMore] = useState<boolean>(false);
 
+  // The different types of searchResult have different
+  // nesting levels relative to the workspace root.
+  const relativeUrlPrefix =
+    selectedResult.type === 'combined' ? '../../' : '../../../';
+
   return (
     <div className={blastWorkspaceCx('Result', 'Complete')}>
       <h1>BLAST Job - result</h1>
-      <Link className="BackToAllJobs" to="/workspace/blast/all">
+      <Link className="BackToAllJobs" to={relativeUrlPrefix + 'all'}>
         &lt;&lt; All my BLAST Jobs
       </Link>
       <div className="ConfigDetailsContainer">
@@ -351,12 +375,22 @@ function BlastSummary({
             {multiQueryParamValues && (
               <Link
                 className="EditJob"
-                to={{
-                  pathname: '/workspace/blast/new',
+                to={(location) => ({
+                  // When providing a location object, relative
+                  // paths are relative to the application root
+                  // and not the current location. So, we need
+                  // to get a handle on the current location to
+                  // create a path relative to it. Furthermore,
+                  // we need to use path.join to normalize the
+                  // path (remove the .. parts) so that
+                  // react-router recognizes it.
+                  pathname: path.join(
+                    location.pathname + './../' + relativeUrlPrefix + 'new'
+                  ),
                   state: {
                     parameterValues: multiQueryParamValues,
                   },
-                }}
+                })}
               >
                 Revise and rerun
               </Link>
@@ -371,6 +405,8 @@ function BlastSummary({
           <span className="InlineHeader">Program:</span>
           <span>
             {jobDetails.config.tool === 'tblastx' ||
+            jobDetails.config.tool === 'diamond-blastp' ||
+            jobDetails.config.tool === 'diamond-blastx' ||
             jobDetails.config.task == null
               ? jobDetails.config.tool
               : jobDetails.config.task}
@@ -462,7 +498,8 @@ interface JobPollingError {
 
 async function makeJobPollingPromise(
   blastApi: BlastApi,
-  jobId: string
+  jobId: string,
+  signal: AbortSignal
 ): Promise<JobPollingResult | ApiResultError<ErrorDetails>> {
   const jobRequest = await blastApi.fetchJob(jobId);
 
@@ -485,7 +522,14 @@ async function makeJobPollingPromise(
 
     await waitForNextPoll();
 
-    return makeJobPollingPromise(blastApi, jobId);
+    if (signal.aborted) {
+      return {
+        status: 'error',
+        details: signal.reason,
+      };
+    }
+
+    return makeJobPollingPromise(blastApi, jobId, signal);
   } else {
     return {
       ...jobRequest,
@@ -521,7 +565,7 @@ export async function makeReportPollingPromise(
       return makeReportPollingPromise(
         blastApi,
         jobId,
-        'single-file-json',
+        format,
         reportRequest.value.reportID
       );
     } else {
@@ -551,12 +595,7 @@ export async function makeReportPollingPromise(
 
     await waitForNextPoll();
 
-    return makeReportPollingPromise(
-      blastApi,
-      jobId,
-      'single-file-json',
-      report.reportID
-    );
+    return makeReportPollingPromise(blastApi, jobId, format, report.reportID);
   } else {
     return {
       ...reportRequest,
diff --git a/packages/libs/multi-blast/src/lib/components/DiamondResultContainer.tsx b/packages/libs/multi-blast/src/lib/components/DiamondResultContainer.tsx
new file mode 100644
index 0000000000..910ea2e924
--- /dev/null
+++ b/packages/libs/multi-blast/src/lib/components/DiamondResultContainer.tsx
@@ -0,0 +1,214 @@
+import path from 'path';
+import { LongJobResponse } from '../utils/ServiceTypes';
+import { useBlastApi } from '../hooks/api';
+import { usePromise } from '@veupathdb/wdk-client/lib/Hooks/PromiseHook';
+import { blastWorkspaceCx } from './BlastWorkspace';
+import { Link } from 'react-router-dom';
+import { blastConfigToParamValues } from '../utils/params';
+import { useMemo } from 'react';
+import { Loading } from '@veupathdb/wdk-client/lib/Components';
+import { upperFirst, zip } from 'lodash';
+import Mesa from '@veupathdb/coreui/lib/components/Mesa/Ui/Mesa';
+import { create as createMesaState } from '@veupathdb/coreui/lib/components/Mesa/Utils/MesaState';
+import { FilledButton } from '@veupathdb/coreui';
+
+interface Props {
+  job: LongJobResponse;
+  query: string;
+}
+
+export function DiamondResultContainer(props: Props) {
+  const { job, query } = props;
+
+  const blastApi = useBlastApi();
+
+  const headerRow = job.config.outFormat?.fields?.flatMap((field) =>
+    field === 'subject-title' || field === 'stitle'
+      ? ['Subject sequence id', 'OrthoMCL group id', 'Description']
+      : [upperFirst(field.replaceAll('-', ' '))]
+  );
+
+  const reportMetadataResult = usePromise(
+    () => blastApi.fetchReport(job.id),
+    [blastApi, job.id]
+  );
+
+  const reportResult = usePromise(
+    async () =>
+      reportMetadataResult.value?.status !== 'ok'
+        ? undefined
+        : blastApi.fetchSingleFileReport(
+            reportMetadataResult.value.value.reportID,
+            reportMetadataResult.value.value.files?.[0]!,
+            headerRow,
+            '1-100'
+          ),
+    [blastApi, reportMetadataResult.value]
+  );
+
+  const parameterValues = useMemo(() => {
+    return blastConfigToParamValues(job.config);
+  }, [job]);
+
+  return (
+    <div className={blastWorkspaceCx('Result', 'Complete')}>
+      <h1>Diamond Job - result</h1>
+      <Link className="BackToAllJobs" to="../all">
+        &lt;&lt; All my Diamond Jobs
+      </Link>
+      <div className="ConfigDetailsContainer">
+        <div className="ConfigDetails">
+          <span className="InlineHeader">Job Id:</span>
+          <span className="JobId">
+            {job.id}
+            {parameterValues && (
+              <Link
+                className="EditJob"
+                to={(location) => ({
+                  // When providing a location object, relative
+                  // paths are relative to the application root
+                  // and not the current location. So, we need
+                  // to get a handle on the current location to
+                  // create a path relative to it. Furthermore,
+                  // we need to use path.join to normalize the
+                  // path (remove the .. parts) so that
+                  // react-router recognizes it.
+                  pathname: path.join(location.pathname, './../../new'),
+                  state: {
+                    parameterValues,
+                  },
+                })}
+              >
+                Revise and rerun
+              </Link>
+            )}
+          </span>
+          {job.description != null && (
+            <>
+              <span className="InlineHeader">Description:</span>
+              <span>{job.description}</span>
+            </>
+          )}
+          <span className="InlineHeader">Program:</span>
+          <span>{job.config.tool}</span>
+          {/* <span className="InlineHeader">Target Type:</span>
+          <span>{hitTypeDisplayName}</span> */}
+          {/* <span className="InlineHeader">
+            {databases.length > 1 ? 'Databases' : 'Database'}:
+          </span>
+          <span>
+            {databasesStr.length > MAX_DATABASE_STRING_LENGTH ? (
+              <CollapsibleSection
+                isCollapsed={!showMore}
+                onCollapsedChange={() => setShowMore(!showMore)}
+                headerContent={
+                  <>
+                    {!showMore ? (
+                      <span>
+                        {databasesStr.slice(0, MAX_DATABASE_STRING_LENGTH)}...{' '}
+                        <span className="link">Show more</span>
+                      </span>
+                    ) : (
+                      <div
+                        style={{
+                          height: '2em',
+                        }}
+                      >
+                        <span className="link">Show less</span>
+                      </div>
+                    )}
+                  </>
+                }
+                children={databasesStr}
+              />
+            ) : (
+              databasesStr
+            )}
+          </span> */}
+        </div>
+      </div>
+      <div className="ResultContainer">
+        {reportMetadataResult.value == null ? (
+          <Loading>
+            <div className="wdk-LoadingData">Loading data...</div>
+          </Loading>
+        ) : reportMetadataResult.value.status === 'error' ? (
+          <div>
+            Unable to load results:{' '}
+            {JSON.stringify(reportMetadataResult.value.details)}
+          </div>
+        ) : reportResult.value == null ? (
+          <Loading>
+            <div className="wdk-LoadingData">Loading data...</div>
+          </Loading>
+        ) : reportResult.value.status === 'error' ? (
+          <div>Unable to load results: {reportResult.value.details.status}</div>
+        ) : (
+          <>
+            <div
+              style={{
+                display: 'flex',
+                justifyContent: 'space-between',
+                alignItems: 'end',
+              }}
+            >
+              <h2>Mapped proteins</h2>
+              <form
+                method="get"
+                action={blastApi.getSingleFileReportUrl(
+                  reportMetadataResult.value.value.reportID,
+                  reportMetadataResult.value.value.files?.[0]!
+                )}
+              >
+                <input
+                  type="hidden"
+                  name="headers"
+                  value={headerRow?.join(',')}
+                />
+                <FilledButton
+                  onPress={() => {
+                    /* This prop is required, but is not needed when submitting a form */
+                  }}
+                  additionalAriaProperties={{
+                    type: 'submit',
+                  }}
+                  text="Download as a tsv file"
+                  themeRole="primary"
+                />
+              </form>
+            </div>
+            <DiamondResultTable
+              rawResult={reportResult.value.value as string}
+              fields={job.config.outFormat?.fields!}
+            ></DiamondResultTable>
+          </>
+        )}
+      </div>
+    </div>
+  );
+}
+
+interface DiamondResultTableProps {
+  rawResult: string;
+  fields: string[];
+}
+function DiamondResultTable(props: DiamondResultTableProps) {
+  const { rawResult } = props;
+  const tableState = useMemo(() => {
+    const [fields, ...rawRows] = rawResult
+      .trim()
+      .split(/\n/g)
+      .map((row) => row.split(/\t/g));
+    const columns = fields.map((field) => ({
+      key: field,
+      name: upperFirst(field.replaceAll('-', ' ')),
+    }));
+    const rows = rawRows.map((row) => Object.fromEntries(zip(fields, row)));
+    return createMesaState({
+      columns,
+      rows,
+    });
+  }, [rawResult]);
+
+  return <Mesa state={tableState} />;
+}
diff --git a/packages/libs/multi-blast/src/lib/controllers/BlastWorkspaceRouter.tsx b/packages/libs/multi-blast/src/lib/controllers/BlastWorkspaceRouter.tsx
index 59127ea429..2ec8bc0a77 100644
--- a/packages/libs/multi-blast/src/lib/controllers/BlastWorkspaceRouter.tsx
+++ b/packages/libs/multi-blast/src/lib/controllers/BlastWorkspaceRouter.tsx
@@ -4,16 +4,29 @@ import { NotFoundController } from '@veupathdb/wdk-client/lib/Controllers';
 
 import { BlastWorkspace } from '../components/BlastWorkspace';
 import { BlastWorkspaceResult } from '../components/BlastWorkspaceResult';
+import { ReactNode } from 'react';
 
-export function BlastWorkspaceRouter() {
-  const { path } = useRouteMatch();
+interface Props {
+  workspaceHeading?: ReactNode;
+  helpPageUrl: string;
+}
+
+export function BlastWorkspaceRouter(props: Props) {
+  const { path, url } = useRouteMatch();
+  const { workspaceHeading, helpPageUrl } = props;
 
   return (
     <Switch>
       <Route
         path={`${path}/:tab(new|all|help)?`}
         exact
-        component={BlastWorkspace}
+        render={() => (
+          <BlastWorkspace
+            helpPageUrl={helpPageUrl}
+            workspaceUrl={url}
+            workspaceHeading={workspaceHeading}
+          />
+        )}
       />
       <Route
         path={`${path}/result/:jobId/combined`}
diff --git a/packages/libs/multi-blast/src/lib/hooks/allJobs.tsx b/packages/libs/multi-blast/src/lib/hooks/allJobs.tsx
index 7881a2be5b..60ac85f688 100644
--- a/packages/libs/multi-blast/src/lib/hooks/allJobs.tsx
+++ b/packages/libs/multi-blast/src/lib/hooks/allJobs.tsx
@@ -24,7 +24,7 @@ export function useAllJobsColumns(): MesaColumn<JobRow>[] {
         key: 'jobId',
         name: 'Job Id',
         renderCell: ({ row }: { row: JobRow }) => (
-          <Link to={`/workspace/blast/result/${row.jobId}`}>{row.jobId}</Link>
+          <Link to={`./result/${row.jobId}`}>{row.jobId}</Link>
         ),
         sortable: true,
       },
@@ -51,7 +51,7 @@ export function useAllJobsColumns(): MesaColumn<JobRow>[] {
             {row.status === 'expired' && (
               <>
                 {' '}
-                (<Link to={`/workspace/blast/result/${row.jobId}`}>rerun</Link>)
+                (<Link to={`./result/${row.jobId}`}>rerun</Link>)
               </>
             )}
           </div>
@@ -126,7 +126,7 @@ export function useMesaOptions() {
           <div className="EmptyState-BodyWrapper">
             <p>You do not have any BLAST jobs</p>
             <p>
-              Please run a <Link to="/workspace/blast/new">new job</Link>{' '}
+              Please run a <Link to="./new">new job</Link>{' '}
             </p>
           </div>
         </div>
diff --git a/packages/libs/multi-blast/src/lib/hooks/blastAlgorithms.tsx b/packages/libs/multi-blast/src/lib/hooks/blastAlgorithms.tsx
index d74e69b473..1e2d85e53f 100644
--- a/packages/libs/multi-blast/src/lib/hooks/blastAlgorithms.tsx
+++ b/packages/libs/multi-blast/src/lib/hooks/blastAlgorithms.tsx
@@ -1,4 +1,4 @@
-import { useContext, useMemo } from 'react';
+import { useContext } from 'react';
 
 import { keyBy, zip } from 'lodash';
 
@@ -10,6 +10,7 @@ import {
   EnabledAlgorithms,
   TargetMetadataByDataType,
 } from '../utils/targetTypes';
+import WdkService from '@veupathdb/wdk-client/lib/Service/WdkService';
 
 const blastOntologyDatabases: BlastOntologyDatabase[] = [
   'blast-est-ontology',
@@ -24,82 +25,96 @@ const algorithmTermTables: Record<BlastOntologyDatabase, string> = {
 export function useEnabledAlgorithms(
   targetDataType: string
 ): EnabledAlgorithms | undefined {
-  const algorithmTermsByDatabase = useAlgorithmTermsByDatabase();
   const targetMetadataByDataType = useContext(TargetMetadataByDataType);
 
-  const enabledAlgorithms = useMemo(() => {
-    if (algorithmTermsByDatabase == null) {
-      return undefined;
-    }
-
-    const targetMetadata = targetMetadataByDataType[targetDataType];
-    const targetOntologyDatabaseName = targetMetadata.blastOntologyDatabase;
-    const targetwdkRecordType = targetMetadata.recordClassUrlSegment;
-
-    const enabledAlgorithmsForTargetType =
-      algorithmTermsByDatabase[targetOntologyDatabaseName];
-
-    const enabledAlgorithmsForWdkRecordType = Object.values(
-      targetMetadataByDataType
-    ).reduce((memo, { blastOntologyDatabase, recordClassUrlSegment }) => {
-      if (recordClassUrlSegment === targetwdkRecordType) {
-        memo.push(...algorithmTermsByDatabase[blastOntologyDatabase]);
-      }
-
-      return memo;
-    }, [] as string[]);
-
-    return {
-      enabledAlgorithmsForTargetType,
-      enabledAlgorithmsForWdkRecordType,
-    };
-  }, [algorithmTermsByDatabase, targetDataType, targetMetadataByDataType]);
+  const enabledAlgorithms = useWdkService(
+    async (wdkService): Promise<EnabledAlgorithms> => {
+      const targetMetadata = targetMetadataByDataType[targetDataType];
+      const targetOntologyDatabaseName = targetMetadata.blastOntologyDatabase;
+      const targetwdkRecordType = targetMetadata.recordClassUrlSegment;
+
+      // If the target datatype does not specify a blastOntologyDatabase,
+      // the allow all provided algorithms.
+      if (targetOntologyDatabaseName == null)
+        return {
+          enabledAlgorithmsForTargetType: '_ALL_',
+          enabledAlgorithmsForWdkRecordType: '_ALL_',
+        };
+
+      const algorithmTermsByDatabase = await getAlgorithmTermsByDatabase(
+        wdkService
+      );
+
+      const enabledAlgorithmsForTargetType =
+        algorithmTermsByDatabase[targetOntologyDatabaseName];
+
+      const enabledAlgorithmsForWdkRecordType = Object.values(
+        targetMetadataByDataType
+      ).reduce((memo, { blastOntologyDatabase, recordClassUrlSegment }) => {
+        if (
+          blastOntologyDatabase != null &&
+          recordClassUrlSegment === targetwdkRecordType
+        ) {
+          memo.push(...(algorithmTermsByDatabase[blastOntologyDatabase] ?? []));
+        }
+
+        return memo;
+      }, [] as string[]);
+
+      return {
+        enabledAlgorithmsForTargetType,
+        enabledAlgorithmsForWdkRecordType,
+      };
+    },
+    [targetDataType, targetMetadataByDataType]
+  );
 
   return enabledAlgorithms;
 }
 
-function useAlgorithmTermsByDatabase() {
-  const algorithmTermsByDatabase = useWdkService(async (wdkService) => {
-    const [projectId, recordClasses] = await Promise.all([
-      wdkService.getConfig().then(({ projectId }) => projectId),
-      wdkService.getRecordClasses(),
-    ]);
+async function getAlgorithmTermsByDatabase(wdkService: WdkService) {
+  const [projectId, recordClasses] = await Promise.all([
+    wdkService.getConfig().then(({ projectId }) => projectId),
+    wdkService.getRecordClasses(),
+  ]);
 
-    const recordClassesByUrlSegment = keyBy(
-      recordClasses,
-      (recordClass) => recordClass.urlSegment
-    );
+  const recordClassesByUrlSegment = keyBy(
+    recordClasses,
+    (recordClass) => recordClass.urlSegment
+  );
 
-    const recordPromises = blastOntologyDatabases.map((databaseName) => {
-      const recordClass = recordClassesByUrlSegment[databaseName];
+  const recordPromises = blastOntologyDatabases.map((databaseName) => {
+    const recordClass = recordClassesByUrlSegment[databaseName];
 
-      const primaryKey = recordClass.primaryKeyColumnRefs.map((columnName) => ({
-        name: columnName,
-        value: columnName === 'project_id' ? projectId : 'fill',
-      }));
+    if (recordClass == null) return undefined;
 
-      return wdkService.getRecord(recordClass.urlSegment, primaryKey, {
-        tables: [algorithmTermTables[databaseName]],
-      });
-    });
-
-    const databaseRecords = await Promise.all(recordPromises);
-
-    const result = zip(blastOntologyDatabases, databaseRecords).reduce(
-      (memo, [databaseName, record]) => ({
-        ...memo,
-        [databaseName as BlastOntologyDatabase]: recordToTerms(
-          databaseName as BlastOntologyDatabase,
-          record as RecordInstance
-        ).map(({ term }) => term),
-      }),
-      {} as Record<BlastOntologyDatabase, string[]>
-    );
+    const primaryKey = recordClass.primaryKeyColumnRefs.map((columnName) => ({
+      name: columnName,
+      value: columnName === 'project_id' ? projectId : 'fill',
+    }));
 
-    return result;
-  }, []);
-
-  return algorithmTermsByDatabase;
+    return wdkService.getRecord(recordClass.urlSegment, primaryKey, {
+      tables: [algorithmTermTables[databaseName]],
+    });
+  });
+
+  const databaseRecords = await Promise.all(recordPromises);
+
+  const result = zip(blastOntologyDatabases, databaseRecords).reduce(
+    (memo, [databaseName, record]) =>
+      record == null
+        ? memo
+        : {
+            ...memo,
+            [databaseName as BlastOntologyDatabase]: recordToTerms(
+              databaseName as BlastOntologyDatabase,
+              record as RecordInstance
+            ).map(({ term }) => term),
+          },
+    {} as Record<BlastOntologyDatabase, string[]>
+  );
+
+  return result;
 }
 
 function recordToTerms(
diff --git a/packages/libs/multi-blast/src/lib/hooks/combinedResults.tsx b/packages/libs/multi-blast/src/lib/hooks/combinedResults.tsx
index f54ecf4a1d..5d01c431ed 100644
--- a/packages/libs/multi-blast/src/lib/hooks/combinedResults.tsx
+++ b/packages/libs/multi-blast/src/lib/hooks/combinedResults.tsx
@@ -289,11 +289,7 @@ function useCombinedResultColumns(
         key: 'queryIndex',
         name: 'Individual Result',
         renderCell: ({ row }: { row: CombinedResultRow }) => (
-          <Link
-            to={`/workspace/blast/result/${jobId}/individual/${row.queryIndex}`}
-          >
-            See Result
-          </Link>
+          <Link to={`individual/${row.queryIndex}`}>See Result</Link>
         ),
         helpText: INDIVIDUAL_RESULT_HELP_TEXT,
       },
diff --git a/packages/libs/multi-blast/src/lib/hooks/individualResult.tsx b/packages/libs/multi-blast/src/lib/hooks/individualResult.tsx
index 1d2a1350d6..81a3193022 100644
--- a/packages/libs/multi-blast/src/lib/hooks/individualResult.tsx
+++ b/packages/libs/multi-blast/src/lib/hooks/individualResult.tsx
@@ -83,12 +83,10 @@ export function useIndividualResultProps({
       actionMeta: ActionMeta<IndividualQueryOption>
     ) => {
       if (actionMeta.action === 'select-option' && selection != null) {
-        history.push(
-          `/workspace/blast/result/${jobId}/individual/${selection.value}`
-        );
+        history.push(selection.value.toString());
       }
     },
-    [history, jobId]
+    [history]
   );
 
   const answerResultConfig = useMemo(
diff --git a/packages/libs/multi-blast/src/lib/hooks/params.ts b/packages/libs/multi-blast/src/lib/hooks/params.ts
index 2801a7a93c..292f7f610e 100644
--- a/packages/libs/multi-blast/src/lib/hooks/params.ts
+++ b/packages/libs/multi-blast/src/lib/hooks/params.ts
@@ -92,12 +92,16 @@ export function useAlgorithmParamProps(
         .filter(
           ([value]) =>
             canChangeWdkRecordType ||
-            enabledAlgorithmsForWdkRecordType?.includes(value)
+            enabledAlgorithmsForWdkRecordType?.includes(value) ||
+            enabledAlgorithmsForWdkRecordType === '_ALL_'
         )
         .map(([value, display]) => ({
           value,
           display: safeHtml(display),
-          disabled: !enabledAlgorithmsForTargetType?.includes(value),
+          disabled:
+            enabledAlgorithmsForTargetType != null &&
+            enabledAlgorithmsForTargetType !== '_ALL_' &&
+            !enabledAlgorithmsForTargetType.includes(value),
         })),
     [
       parameter,
@@ -114,14 +118,20 @@ export function useAlgorithmParamProps(
     state.question.urlSegment
   );
 
+  // If the selected algorithm is not enabled for the selected
+  // record type, then default to the first available algorithm
+  // that is enabled for the selected record type.
+  // This can happen if the user selects a new record type
+  // that does not include the previously selected algorithm.
   useEffect(() => {
     if (
       enabledAlgorithmsForTargetType != null &&
+      enabledAlgorithmsForTargetType !== '_ALL_' &&
       !enabledAlgorithmsForTargetType.includes(algorithm)
     ) {
       onChange(enabledAlgorithmsForTargetType[0]);
     }
-  }, [algorithm, enabledAlgorithmsForTargetType, onChange]);
+  }, [algorithm, enabledAlgorithmsForTargetType, onChange, parameter]);
 
   return {
     items,
@@ -186,7 +196,7 @@ async function fetchDefaultAlgorithmAdvancedParams(
   const searchName = question.urlSegment;
 
   const advancedParamNames =
-    question.groupsByName[ADVANCED_PARAMS_GROUP_NAME].parameters;
+    question.groupsByName[ADVANCED_PARAMS_GROUP_NAME]?.parameters ?? [];
   const defaultAdvancedParams = advancedParamNames.map(
     (advancedParamName) => question.parametersByName[advancedParamName]
   );
diff --git a/packages/libs/multi-blast/src/lib/utils/ServiceTypes.ts b/packages/libs/multi-blast/src/lib/utils/ServiceTypes.ts
index 07c5a1000d..7989fd920e 100644
--- a/packages/libs/multi-blast/src/lib/utils/ServiceTypes.ts
+++ b/packages/libs/multi-blast/src/lib/utils/ServiceTypes.ts
@@ -4,6 +4,7 @@ import {
   boolean,
   intersection,
   literal,
+  nullType,
   number,
   partial,
   record,
@@ -526,14 +527,70 @@ export const ioTBlastXConfig = intersection([
   }),
 ]);
 
+export const ioDiamondBlastOutputFormat = type({
+  format: literal('blast-tab'),
+  fields: array(string),
+});
+
 export type IoTBlastXConfig = TypeOf<typeof ioTBlastXConfig>;
 
+const ioSensitivity = union([
+  literal('faster'),
+  literal('fast'),
+  literal('mid-sensitive'),
+  literal('shapes-30x10'),
+  literal('sensitive'),
+  literal('more-sensitive'),
+  literal('very-sensitive'),
+  literal('ultra-sensitive'),
+]);
+
+export type IoSensitivity = TypeOf<typeof ioSensitivity>;
+
+const ioDiamondConfigShared = partial({
+  query: string,
+  eValue: number,
+  maxTargetSeqs: number,
+  // TODO This can be a union of string literal
+  sensitivity: ioSensitivity,
+  masking: union([literal('none'), literal('tantan'), literal('seq')]),
+  compBasedStats: union([
+    literal('disabled'),
+    literal('hauser'),
+    literal('hauser-and-matrix-adjust'),
+    literal('matrix-adjust'),
+  ]),
+  iterate: array(ioSensitivity),
+  reportUnaligned: boolean,
+  outFormat: ioDiamondBlastOutputFormat,
+});
+
+export const ioDiamondBlastPConfig = intersection([
+  type({
+    tool: literal('diamond-blastp'),
+  }),
+  ioDiamondConfigShared,
+]);
+
+export type IoDiamondBlastPConfig = TypeOf<typeof ioDiamondBlastPConfig>;
+
+export const ioDiamondBlastXConfig = intersection([
+  type({
+    tool: literal('diamond-blastx'),
+  }),
+  ioDiamondConfigShared,
+]);
+
+export type IoDiamondBlastXConfig = TypeOf<typeof ioDiamondBlastXConfig>;
+
 export const ioBlastConfig = union([
   ioBlastNConfig,
   ioBlastPConfig,
   ioBlastXConfig,
   ioTBlastNConfig,
   ioTBlastXConfig,
+  ioDiamondBlastPConfig,
+  ioDiamondBlastXConfig,
 ]);
 
 export type IoBlastConfig = TypeOf<typeof ioBlastConfig>;
@@ -551,11 +608,11 @@ export const shortJobResponse = intersection([
     status: ioJobStatus,
     created: string,
     site: string,
-    targets: array(target),
     // FIXME: This field no longer appears in the response. Service bug?
     // expires: string,
   }),
   partial({
+    targets: array(target),
     description: string,
     // FIXME: This field is missing from "secondary" jobs. Service bug?
     isPrimary: boolean,
@@ -610,7 +667,7 @@ export const shortReportResponse = intersection([
   type({
     jobID: string,
     reportID: string,
-    config: reportConfig,
+    config: union([reportConfig, nullType]),
     status: ioJobStatus,
   }),
   partial({
diff --git a/packages/libs/multi-blast/src/lib/utils/api.ts b/packages/libs/multi-blast/src/lib/utils/api.ts
index 74f91c9f5f..6ef4b10362 100644
--- a/packages/libs/multi-blast/src/lib/utils/api.ts
+++ b/packages/libs/multi-blast/src/lib/utils/api.ts
@@ -1,5 +1,5 @@
 import { isLeft, map } from 'fp-ts/Either';
-import { array, string } from 'io-ts';
+import { array, string, unknown } from 'io-ts';
 import { identity, memoize, omit } from 'lodash';
 
 import {
@@ -221,6 +221,31 @@ export class BlastApi extends FetchClientWithCredentials {
     });
   }
 
+  /** Request a preview of the file */
+  fetchSingleFileReport(
+    reportId: string,
+    fileName: string,
+    headerRow?: string[],
+    lines?: string,
+    maxSize: number = 10 * 10 ** 6 // 10 MB
+  ) {
+    let query = '?download=false';
+    if (headerRow) query += `&headers=${headerRow}`;
+    if (lines) query += `&lines=${lines}`;
+    return this.taggedFetch({
+      path: `${REPORTS_PATH}/${reportId}/files/${fileName}${query}`,
+      headers: {
+        'Content-Max-Length': `${maxSize}`,
+      },
+      method: 'GET',
+      transformResponse: ioTransformer(unknown),
+    });
+  }
+
+  getSingleFileReportUrl(reportId: string, fileName: string): string {
+    return `${this.baseUrl}${REPORTS_PATH}/${reportId}/files/${fileName}`;
+  }
+
   fetchSingleFileJsonReport(
     reportId: string,
     maxSize: number = 10 * 10 ** 6 // 10 MB
diff --git a/packages/libs/multi-blast/src/lib/utils/params.ts b/packages/libs/multi-blast/src/lib/utils/params.ts
index c53db2ec44..cafe64430a 100644
--- a/packages/libs/multi-blast/src/lib/utils/params.ts
+++ b/packages/libs/multi-blast/src/lib/utils/params.ts
@@ -21,6 +21,8 @@ import {
   IOBlastPScoringMatrix,
   IoBlastSegMask,
   IOBlastXScoringMatrix,
+  IoDiamondBlastPConfig,
+  IoSensitivity,
   IOTBlastNScoringMatrix,
   IOTBlastXScoringMatrix,
   LongJobResponse,
@@ -52,6 +54,15 @@ export const LOWER_CASE_MASK_PARAM_NAME = 'LowerCaseMask';
 export const GAP_COSTS_PARAM_NAME = 'GapCosts';
 export const MATCH_MISMATCH_SCORE = 'MatchMismatchScore';
 
+// Diamond
+export const SENSITIVITY_PARAM_NAME = 'Sensitivity';
+export const MAX_TARGET_SEQS_PARAM_NAME = 'MaxTargetSeqs';
+export const REPORT_UNALIGNED_PARAM_NAME = 'ReportUnaligned';
+export const MASKING_PARAM_NAME = 'Masking';
+export const COMP_BASED_STATS_PARAM_NAME = 'CompBasedStats';
+export const ITERATE_PARAM_NAME = 'Iterate';
+export const DIAMOND_OUTPUT_FIELDS_PARAM_NAME = 'DiamondOutputFields';
+
 export const ADVANCED_PARAMS_GROUP_NAME = 'advancedParams';
 
 export const OMIT_PARAM_TERM = 'none';
@@ -80,7 +91,6 @@ export function paramValuesToBlastConfig(
   paramValues: ParameterValues
 ): IoBlastConfig {
   const {
-    [BLAST_QUERY_SEQUENCE_PARAM_NAME]: query,
     [BLAST_ALGORITHM_PARAM_NAME]: selectedTool,
     [EXPECTATION_VALUE_PARAM_NAME]: eValue,
     [NUM_QUERY_RESULTS_PARAM_NAME]: numQueryResultsStr,
@@ -93,13 +103,19 @@ export function paramValuesToBlastConfig(
     [LOWER_CASE_MASK_PARAM_NAME]: lowerCaseMaskStr,
     [GAP_COSTS_PARAM_NAME]: gapCostsStr,
     [MATCH_MISMATCH_SCORE]: matchMismatchStr,
+    [SENSITIVITY_PARAM_NAME]: sensitivity,
+    [MAX_TARGET_SEQS_PARAM_NAME]: maxTargetSeqs,
+    [REPORT_UNALIGNED_PARAM_NAME]: reportUnaligned,
+    [MASKING_PARAM_NAME]: masking,
+    [COMP_BASED_STATS_PARAM_NAME]: compBasedStatsDiamond,
+    [ITERATE_PARAM_NAME]: iterate,
+    [DIAMOND_OUTPUT_FIELDS_PARAM_NAME]: diamondOutputFields,
   } = paramValues;
 
   const maxHSPsConfig =
     Number(maxMatchesStr) >= 1 ? { maxHSPs: Number(maxMatchesStr) } : {};
 
   const baseConfig = {
-    query,
     eValue,
     maxTargetSeqs: Number(numQueryResultsStr),
     wordSize: Number(wordSizeStr),
@@ -188,6 +204,24 @@ export function paramValuesToBlastConfig(
     };
   }
 
+  if (selectedTool === 'diamond-blastp') {
+    return {
+      tool: selectedTool,
+      eValue: eValue ? Number(eValue) : undefined,
+      sensitivity: sensitivity as IoSensitivity,
+      maxTargetSeqs: maxTargetSeqs ? Number(maxTargetSeqs) : undefined,
+      reportUnaligned: reportUnaligned === '1',
+      compBasedStats:
+        compBasedStatsDiamond as IoDiamondBlastPConfig['compBasedStats'],
+      masking: masking as IoDiamondBlastPConfig['masking'],
+      iterate: iterate === 'yes' ? [] : undefined,
+      outFormat: {
+        format: 'blast-tab',
+        fields: diamondOutputFields?.split(/\s+/g) ?? [],
+      },
+    };
+  }
+
   throw new Error(`The BLAST tool '${selectedTool}' is not supported.`);
 }
 
@@ -198,6 +232,39 @@ export function blastConfigToParamValues(
     [BLAST_ALGORITHM_PARAM_NAME]: blastConfig.tool,
   };
 
+  // Handle Diamond blast configurations
+  if (
+    blastConfig.tool === 'diamond-blastp' ||
+    blastConfig.tool === 'diamond-blastx'
+  ) {
+    if (blastConfig.eValue != null) {
+      parameterValues[EXPECTATION_VALUE_PARAM_NAME] =
+        blastConfig.eValue.toString();
+    }
+    if (blastConfig.sensitivity != null) {
+      parameterValues[SENSITIVITY_PARAM_NAME] = blastConfig.sensitivity;
+    }
+    if (blastConfig.maxTargetSeqs != null) {
+      parameterValues[MAX_TARGET_SEQS_PARAM_NAME] =
+        blastConfig.maxTargetSeqs.toString();
+    }
+    if (blastConfig.compBasedStats != null) {
+      parameterValues[COMP_BASED_STATS_PARAM_NAME] = blastConfig.compBasedStats;
+    }
+    if (blastConfig.masking) {
+      parameterValues[MASKING_PARAM_NAME] = blastConfig.masking;
+    }
+    if (blastConfig.outFormat != null) {
+      parameterValues[DIAMOND_OUTPUT_FIELDS_PARAM_NAME] =
+        blastConfig.outFormat.fields.join(' ');
+    }
+    parameterValues[REPORT_UNALIGNED_PARAM_NAME] = blastConfig.reportUnaligned
+      ? '1'
+      : '0';
+    parameterValues[ITERATE_PARAM_NAME] = blastConfig.iterate ? 'yes' : 'no';
+    return parameterValues;
+  }
+
   if (blastConfig.eValue != null) {
     parameterValues[EXPECTATION_VALUE_PARAM_NAME] = blastConfig.eValue;
   }
diff --git a/packages/libs/multi-blast/src/lib/utils/targetTypes.ts b/packages/libs/multi-blast/src/lib/utils/targetTypes.ts
index 40bbb99ed7..fbdf2e61ba 100644
--- a/packages/libs/multi-blast/src/lib/utils/targetTypes.ts
+++ b/packages/libs/multi-blast/src/lib/utils/targetTypes.ts
@@ -1,7 +1,7 @@
 import { createContext } from 'react';
 
 export interface TargetMetadata {
-  blastOntologyDatabase: BlastOntologyDatabase;
+  blastOntologyDatabase?: BlastOntologyDatabase;
   recordClassUrlSegment: string;
   recordLinkUrlSegment?: string;
   searchUrlSegment: string;
@@ -11,6 +11,7 @@ export interface TargetMetadata {
 
 export type BlastOntologyDatabase = 'blast-est-ontology' | 'blast-orf-ontology';
 
+// Keys are blast database type defined in model
 const targetMetadataByDataType: Record<string, TargetMetadata> = {
   AnnotatedTranscripts: {
     blastOntologyDatabase: 'blast-est-ontology',
@@ -55,7 +56,12 @@ export function dbNameToTargetTypeTerm(dbName: string) {
   return dbName === 'Isolates' ? 'PopSet' : dbName;
 }
 
+/**
+ * List of enabled algorithms based on the database ontology record classes.
+ * The magic string "_ALL_" means that all algorithms provided by the WDK
+ * question should be enabled.
+ */
 export interface EnabledAlgorithms {
-  enabledAlgorithmsForTargetType: string[];
-  enabledAlgorithmsForWdkRecordType: string[];
+  enabledAlgorithmsForTargetType: string[] | '_ALL_';
+  enabledAlgorithmsForWdkRecordType: string[] | '_ALL_';
 }
diff --git a/packages/libs/preferred-organisms/package.json b/packages/libs/preferred-organisms/package.json
index d547d6809d..bbb4e6c5e2 100644
--- a/packages/libs/preferred-organisms/package.json
+++ b/packages/libs/preferred-organisms/package.json
@@ -19,7 +19,7 @@
     "@veupathdb/wdk-client": "workspace:^",
     "@veupathdb/web-common": "workspace:^",
     "lodash": "^4.17.21",
-    "recoil": "^0.2.0"
+    "recoil": "^0.7.7"
   },
   "peerDependencies": {
     "react": ">=16.14.0",
diff --git a/packages/libs/preferred-organisms/src/lib/utils/preferredOrganisms.ts b/packages/libs/preferred-organisms/src/lib/utils/preferredOrganisms.ts
index 690d9744f7..3224fae9f2 100644
--- a/packages/libs/preferred-organisms/src/lib/utils/preferredOrganisms.ts
+++ b/packages/libs/preferred-organisms/src/lib/utils/preferredOrganisms.ts
@@ -167,7 +167,7 @@ export const makePreferredOrganismsRecoilState = memoize(
             );
           }
 
-          onSet((newValue) => {
+          onSet((newValue: boolean | DefaultValue) => {
             const newValueBoolean =
               newValue instanceof DefaultValue ? true : newValue;
 
diff --git a/packages/libs/wdk-client/src/Hooks/PromiseHook.ts b/packages/libs/wdk-client/src/Hooks/PromiseHook.ts
index d45b4daf5e..6e4c1414c3 100644
--- a/packages/libs/wdk-client/src/Hooks/PromiseHook.ts
+++ b/packages/libs/wdk-client/src/Hooks/PromiseHook.ts
@@ -1,7 +1,10 @@
 import { useEffect, useState } from 'react';
 
+interface PromiseFactoryProps {
+  signal: AbortSignal;
+}
 interface PromiseFactory<T> {
-  (): Promise<T>;
+  (props: PromiseFactoryProps): Promise<T>;
 }
 
 /**
@@ -14,8 +17,12 @@ export function usePromise<T>(factory: PromiseFactory<T>, deps?: any[]) {
   const [loading, setLoading] = useState(false);
   useEffect(() => {
     let doSetValue = true;
+    const controller = new AbortController();
+    const props = { signal: controller.signal };
     setLoading(true);
-    factory().then((value) => {
+    // Pass AbortSignal to factory function so it can handle
+    // abort, if it so chooses.
+    factory(props).then((value) => {
       if (doSetValue) {
         setValue(value);
         setLoading(false);
@@ -23,6 +30,7 @@ export function usePromise<T>(factory: PromiseFactory<T>, deps?: any[]) {
     });
     return () => {
       doSetValue = false;
+      controller.abort();
     };
   }, deps);
   return { value, loading };
diff --git a/packages/sites/genomics-site/.env.sample b/packages/sites/genomics-site/.env.sample
index 2bf44e9c75..d919993ff4 100644
--- a/packages/sites/genomics-site/.env.sample
+++ b/packages/sites/genomics-site/.env.sample
@@ -27,6 +27,9 @@ EDA_SINGLE_APP_MODE=pass
 SITE_SEARCH_SERVICE_ENDPOINT=/site-search
 SITE_SEARCH_SERVICE_URL=${BASE_PROXY_URL}/site-search
 
+MULTI_BLAST_ENDPOINT=/multi-blast
+MULTI_BLAST_URL=${BASE_PROXY_URL}/multi-blast
+
 USER_DATASETS_WORKSPACE_ENABLED=true
 USER_DATASETS_WORKSPACE_IMPORT_SERVICE_ENDPOINT=/dataset-import
 USER_DATASETS_WORKSPACE_IMPORT_SERVICE_URL=${BASE_PROXY_URL}/dataset-import
diff --git a/packages/sites/genomics-site/package.json b/packages/sites/genomics-site/package.json
index feb219124e..8f1a4417fe 100644
--- a/packages/sites/genomics-site/package.json
+++ b/packages/sites/genomics-site/package.json
@@ -74,7 +74,7 @@
     "react-redux": "^7.1.3",
     "react-router-dom": "^5.3.0",
     "react-spring": "^8.0.27",
-    "recoil": "^0.2.0",
+    "recoil": "^0.7.7",
     "redux": "^4.0.0",
     "redux-observable": "^1.2.0",
     "relative-deps": "^1.0.7",
diff --git a/packages/sites/genomics-site/webapp/wdkCustomization/js/client/blastRoutes.tsx b/packages/sites/genomics-site/webapp/wdkCustomization/js/client/blastRoutes.tsx
index 52ee8e556f..ef8edb5554 100644
--- a/packages/sites/genomics-site/webapp/wdkCustomization/js/client/blastRoutes.tsx
+++ b/packages/sites/genomics-site/webapp/wdkCustomization/js/client/blastRoutes.tsx
@@ -3,6 +3,7 @@ import { Redirect, RouteComponentProps } from 'react-router';
 
 import { Loading } from '@veupathdb/wdk-client/lib/Components';
 import { RouteEntry } from '@veupathdb/wdk-client/lib/Core/RouteEntry';
+import { communitySite } from '@veupathdb/web-common/lib/config';
 
 const BlastWorkspaceRouter = React.lazy(
   () => import('./controllers/BlastWorkspaceRouter')
@@ -14,7 +15,7 @@ export const blastRoutes: RouteEntry[] = [
     exact: false,
     component: () => (
       <Suspense fallback={<Loading />}>
-        <BlastWorkspaceRouter />
+        <BlastWorkspaceRouter helpPageUrl={communitySite + 'multiblast.html'} />
       </Suspense>
     ),
   },
diff --git a/packages/sites/ortho-site/.env.sample b/packages/sites/ortho-site/.env.sample
index 6305f232fe..9a21063072 100644
--- a/packages/sites/ortho-site/.env.sample
+++ b/packages/sites/ortho-site/.env.sample
@@ -12,6 +12,9 @@ WDK_SERVICE_URL=${LEGACY_WEB_APP_URL}/service
 SITE_SEARCH_SERVICE_ENDPOINT=/site-search
 SITE_SEARCH_SERVICE_URL=${BASE_PROXY_URL}/site-search
 
+MULTI_BLAST_ENDPOINT=/multi-blast
+MULTI_BLAST_URL=${BASE_PROXY_URL}/multi-blast
+
 DOCUMENTS_ENDPOINT=/documents
 DOCUMENTS_URL=${BASE_PROXY_URL}/documents
 
diff --git a/packages/sites/ortho-site/package.json b/packages/sites/ortho-site/package.json
index 1e1f137512..e3ee06fec2 100644
--- a/packages/sites/ortho-site/package.json
+++ b/packages/sites/ortho-site/package.json
@@ -43,6 +43,7 @@
     "@veupathdb/coreui": "workspace:^",
     "@veupathdb/eda": "workspace:^",
     "@veupathdb/http-utils": "workspace:^",
+    "@veupathdb/multi-blast": "workspace:^",
     "@veupathdb/react-scripts": "workspace:^",
     "@veupathdb/site-babel-config": "workspace:^",
     "@veupathdb/site-tsconfig": "workspace:^",
diff --git a/packages/sites/ortho-site/webapp/wdkCustomization/js/client/blastRoutes.tsx b/packages/sites/ortho-site/webapp/wdkCustomization/js/client/blastRoutes.tsx
new file mode 100644
index 0000000000..fc720c7624
--- /dev/null
+++ b/packages/sites/ortho-site/webapp/wdkCustomization/js/client/blastRoutes.tsx
@@ -0,0 +1,47 @@
+import React, { ContextType, Suspense } from 'react';
+import { Redirect, RouteComponentProps } from 'react-router';
+
+import { Loading } from '@veupathdb/wdk-client/lib/Components';
+import { RouteEntry } from '@veupathdb/wdk-client/lib/Core/RouteEntry';
+
+const BlastWorkspaceRouter = React.lazy(
+  () => import('./controllers/BlastWorkspaceRouter')
+);
+
+import { TargetMetadataByDataType } from '@veupathdb/multi-blast/lib/utils/targetTypes';
+import { communitySite } from '@veupathdb/web-common/lib/config';
+
+const targetMetadataByDataType: ContextType<typeof TargetMetadataByDataType> = {
+  AnnotatedProteins: {
+    recordClassUrlSegment: 'sequence',
+    searchUrlSegment: 'ByMultiBlast',
+  },
+};
+
+export const blastRoutes: RouteEntry[] = [
+  {
+    path: '/workspace/blast',
+    exact: false,
+    component: () => (
+      <Suspense fallback={<Loading />}>
+        <TargetMetadataByDataType.Provider value={targetMetadataByDataType}>
+          <BlastWorkspaceRouter
+            helpPageUrl={communitySite + 'multiblast.html'}
+          />
+        </TargetMetadataByDataType.Provider>
+      </Suspense>
+    ),
+  },
+  {
+    path: '/search/:recordClass/:searchName(.*MultiBlast)',
+    component: (
+      props: RouteComponentProps<{
+        recordClass: string;
+      }>
+    ) => (
+      <Redirect
+        to={`/workspace/blast/new?recordType=${props.match.params.recordClass}`}
+      />
+    ),
+  },
+];
diff --git a/packages/sites/ortho-site/webapp/wdkCustomization/js/client/components/layout/OrthoMCLPage.tsx b/packages/sites/ortho-site/webapp/wdkCustomization/js/client/components/layout/OrthoMCLPage.tsx
index 4cb9c1cf06..88d76903ef 100644
--- a/packages/sites/ortho-site/webapp/wdkCustomization/js/client/components/layout/OrthoMCLPage.tsx
+++ b/packages/sites/ortho-site/webapp/wdkCustomization/js/client/components/layout/OrthoMCLPage.tsx
@@ -239,9 +239,9 @@ function useHeaderMenuItems() {
         items: [
           {
             key: 'proteome-upload',
-            display: 'Assign proteins to groups in Galaxy',
+            display: 'Map proteins to OrthoMCL with Diamond blastp',
             type: 'reactRoute',
-            url: makeStaticPageRoute(`/prot-mapping-warn.html`),
+            url: '/workspace/map-proteins/new',
           },
           {
             key: 'blast',
diff --git a/packages/sites/ortho-site/webapp/wdkCustomization/js/client/controllers/BlastWorkspaceResult.tsx b/packages/sites/ortho-site/webapp/wdkCustomization/js/client/controllers/BlastWorkspaceResult.tsx
new file mode 100644
index 0000000000..8e2fb3546f
--- /dev/null
+++ b/packages/sites/ortho-site/webapp/wdkCustomization/js/client/controllers/BlastWorkspaceResult.tsx
@@ -0,0 +1,2 @@
+import { BlastWorkspaceResult } from '@veupathdb/multi-blast/lib/components/BlastWorkspaceResult';
+export { BlastWorkspaceResult as default };
diff --git a/packages/sites/ortho-site/webapp/wdkCustomization/js/client/controllers/BlastWorkspaceRouter.tsx b/packages/sites/ortho-site/webapp/wdkCustomization/js/client/controllers/BlastWorkspaceRouter.tsx
new file mode 100644
index 0000000000..1abb9e3503
--- /dev/null
+++ b/packages/sites/ortho-site/webapp/wdkCustomization/js/client/controllers/BlastWorkspaceRouter.tsx
@@ -0,0 +1,2 @@
+import { BlastWorkspaceRouter } from '@veupathdb/multi-blast/lib/controllers/BlastWorkspaceRouter';
+export { BlastWorkspaceRouter as default };
diff --git a/packages/sites/ortho-site/webapp/wdkCustomization/js/client/pluginConfig.tsx b/packages/sites/ortho-site/webapp/wdkCustomization/js/client/pluginConfig.tsx
index fc7d9585d7..64c8762f83 100644
--- a/packages/sites/ortho-site/webapp/wdkCustomization/js/client/pluginConfig.tsx
+++ b/packages/sites/ortho-site/webapp/wdkCustomization/js/client/pluginConfig.tsx
@@ -5,6 +5,12 @@ import { ClientPluginRegistryEntry } from '@veupathdb/wdk-client/lib/Utils/Clien
 
 import { Form as GroupsByPhyleticPatternForm } from '../questions/GroupsByPhyleticPattern/Form';
 
+import { isMultiBlastQuestion } from '@veupathdb/multi-blast/lib/utils/pluginConfig';
+
+const BlastForm = React.lazy(() => import('./plugins/BlastForm'));
+const BlastQuestionController = React.lazy(
+  () => import('./plugins/BlastQuestionController')
+);
 const BlastSummaryViewPlugin = React.lazy(
   () =>
     import(
@@ -27,6 +33,25 @@ const orthoPluginConfig: ClientPluginRegistryEntry<any>[] = [
       </Suspense>
     ),
   },
+  {
+    type: 'questionController',
+    test: isMultiBlastQuestion,
+    component: (props) => (
+      <Suspense fallback={<Loading />}>
+        <BlastQuestionController {...props} />
+      </Suspense>
+    ),
+  },
+  {
+    type: 'questionForm',
+    test: ({ question }) =>
+      question != null && question.urlSegment.endsWith('MultiBlast'),
+    component: (props) => (
+      <Suspense fallback={<Loading />}>
+        <BlastForm {...props} />
+      </Suspense>
+    ),
+  },
 ];
 
 export default orthoPluginConfig;
diff --git a/packages/sites/ortho-site/webapp/wdkCustomization/js/client/plugins/BlastForm.tsx b/packages/sites/ortho-site/webapp/wdkCustomization/js/client/plugins/BlastForm.tsx
new file mode 100644
index 0000000000..a341c8232d
--- /dev/null
+++ b/packages/sites/ortho-site/webapp/wdkCustomization/js/client/plugins/BlastForm.tsx
@@ -0,0 +1,2 @@
+import { BlastForm } from '@veupathdb/multi-blast/lib/components/BlastForm';
+export { BlastForm as default };
diff --git a/packages/sites/ortho-site/webapp/wdkCustomization/js/client/plugins/BlastQuestionController.tsx b/packages/sites/ortho-site/webapp/wdkCustomization/js/client/plugins/BlastQuestionController.tsx
new file mode 100644
index 0000000000..203cedd466
--- /dev/null
+++ b/packages/sites/ortho-site/webapp/wdkCustomization/js/client/plugins/BlastQuestionController.tsx
@@ -0,0 +1,2 @@
+import { BlastQuestionController } from '@veupathdb/multi-blast/lib/controllers/BlastQuestionController';
+export { BlastQuestionController as default };
diff --git a/packages/sites/ortho-site/webapp/wdkCustomization/js/client/proteinMappingRoutes.tsx b/packages/sites/ortho-site/webapp/wdkCustomization/js/client/proteinMappingRoutes.tsx
new file mode 100644
index 0000000000..3c85b46606
--- /dev/null
+++ b/packages/sites/ortho-site/webapp/wdkCustomization/js/client/proteinMappingRoutes.tsx
@@ -0,0 +1,34 @@
+import React, { ContextType, Suspense } from 'react';
+import { TargetMetadataByDataType } from '@veupathdb/multi-blast/lib/utils/targetTypes';
+import { RouteEntry } from '@veupathdb/wdk-client/lib/Core/RouteEntry';
+import { Loading } from '@veupathdb/wdk-client/lib/Components';
+
+import { communitySite } from '@veupathdb/web-common/lib/config';
+
+const BlastWorkspaceRouter = React.lazy(
+  () => import('./controllers/BlastWorkspaceRouter')
+);
+
+const targetMetadataByDataType: ContextType<typeof TargetMetadataByDataType> = {
+  AnnotatedProteins: {
+    recordClassUrlSegment: 'sequence',
+    searchUrlSegment: 'MapProteinsByDiamond',
+  },
+};
+
+export const proteinMappingRoutes: RouteEntry[] = [
+  {
+    path: '/workspace/map-proteins',
+    exact: false,
+    component: () => (
+      <Suspense fallback={<Loading />}>
+        <TargetMetadataByDataType.Provider value={targetMetadataByDataType}>
+          <BlastWorkspaceRouter
+            helpPageUrl={communitySite + 'protein-mapping.html'}
+            workspaceHeading="Map proteins to OrthoMCL with Diamond blastp"
+          />
+        </TargetMetadataByDataType.Provider>
+      </Suspense>
+    ),
+  },
+];
diff --git a/packages/sites/ortho-site/webapp/wdkCustomization/js/client/routes.tsx b/packages/sites/ortho-site/webapp/wdkCustomization/js/client/routes.tsx
index 7dda45bce1..9d856e8aa0 100644
--- a/packages/sites/ortho-site/webapp/wdkCustomization/js/client/routes.tsx
+++ b/packages/sites/ortho-site/webapp/wdkCustomization/js/client/routes.tsx
@@ -10,6 +10,9 @@ import { OrthoMCLHomePageController } from 'ortho-client/controllers/OrthoMCLHom
 import { ProteomeSummaryController } from 'ortho-client/controllers/ProteomeSummaryController';
 import { GroupClusterGraphController } from 'ortho-client/controllers/GroupClusterGraphController';
 
+import { blastRoutes } from './blastRoutes';
+import { proteinMappingRoutes } from './proteinMappingRoutes';
+
 export function wrapRoutes(ebrcRoutes: RouteEntry[]): RouteEntry[] {
   return [
     {
@@ -33,6 +36,8 @@ export function wrapRoutes(ebrcRoutes: RouteEntry[]): RouteEntry[] {
       path: '/search',
       component: () => <SiteSearchController offerOrganismFilter={false} />,
     },
+    ...blastRoutes,
+    ...proteinMappingRoutes,
     ...ebrcRoutes,
   ];
 }
diff --git a/packages/sites/ortho-site/webapp/wdkCustomization/js/client/services.tsx b/packages/sites/ortho-site/webapp/wdkCustomization/js/client/services.tsx
index 8f04799f42..6b7219830f 100644
--- a/packages/sites/ortho-site/webapp/wdkCustomization/js/client/services.tsx
+++ b/packages/sites/ortho-site/webapp/wdkCustomization/js/client/services.tsx
@@ -1,5 +1,7 @@
 import { WdkService } from '@veupathdb/wdk-client/lib/Core';
 
+import { wrapWdkService as addMultiBlastService } from '@veupathdb/multi-blast/lib/utils/wdkServiceIntegration';
+
 import {
   ProteomeSummaryRows,
   proteomeSummaryRowsDecoder,
@@ -12,7 +14,7 @@ import { TaxonEntries, taxonEntriesDecoder } from 'ortho-client/utils/taxons';
 
 export function wrapWdkService(wdkService: WdkService): OrthoService {
   return {
-    ...wdkService,
+    ...addMultiBlastService(wdkService),
     getGroupLayout: orthoServiceWrappers.getGroupLayout(wdkService),
     getProteomeSummary: orthoServiceWrappers.getProteomeSummary(wdkService),
     getTaxons: orthoServiceWrappers.getTaxons(wdkService),
diff --git a/packages/sites/ortho-site/webpack.config.local.mjs b/packages/sites/ortho-site/webpack.config.local.mjs
index c3c27144ac..75a1cc73c4 100644
--- a/packages/sites/ortho-site/webpack.config.local.mjs
+++ b/packages/sites/ortho-site/webpack.config.local.mjs
@@ -19,6 +19,7 @@ export default configure({
     proxies: {
       [process.env.WDK_SERVICE_ENDPOINT]: process.env.WDK_SERVICE_URL,
       [process.env.SITE_SEARCH_SERVICE_ENDPOINT]: process.env.SITE_SEARCH_SERVICE_URL,
+      [process.env.MULTI_BLAST_ENDPOINT]: process.env.MULTI_BLAST_URL,
       [process.env.DOCUMENTS_ENDPOINT]: process.env.DOCUMENTS_URL,
       [process.env.ASSETS_ENDPOINT]: process.env.ASSETS_URL,
     },
diff --git a/yarn.lock b/yarn.lock
index e2697d475d..f11d63216a 100644
--- a/yarn.lock
+++ b/yarn.lock
@@ -8556,7 +8556,7 @@ __metadata:
     react-redux: ^7.1.3
     react-router-dom: ^5.3.0
     react-spring: ^8.0.27
-    recoil: ^0.2.0
+    recoil: ^0.7.7
     redux: ^4.0.0
     redux-observable: ^1.2.0
     relative-deps: ^1.0.7
@@ -8720,10 +8720,10 @@ __metadata:
     react-redux: ^7.2.6
     react-router: ^5.2.0
     react-router-dom: ^5.2.0
-    react-scripts: 4.0.1
+    react-scripts: 5.0.1
     react-select: ^3.0.4
     read: ^1.0.7
-    recoil: ^0.2.0
+    recoil: ^0.7.7
     redux: ^4.0.0
     sass: ^1.56.2
     script-loader: ^0.7.2
@@ -8766,6 +8766,7 @@ __metadata:
     "@veupathdb/coreui": "workspace:^"
     "@veupathdb/eda": "workspace:^"
     "@veupathdb/http-utils": "workspace:^"
+    "@veupathdb/multi-blast": "workspace:^"
     "@veupathdb/react-scripts": "workspace:^"
     "@veupathdb/site-babel-config": "workspace:^"
     "@veupathdb/site-tsconfig": "workspace:^"
@@ -8868,7 +8869,7 @@ __metadata:
     react-scripts: 4.0.3
     react-select: ^3.0.4
     read: ^1.0.7
-    recoil: ^0.2.0
+    recoil: ^0.7.7
     sass: ^1.56.2
     script-loader: ^0.7.2
     set-cookie-parser: ^2.4.6
@@ -32520,9 +32521,9 @@ __metadata:
   languageName: node
   linkType: hard
 
-"recoil@npm:^0.2.0":
-  version: 0.2.0
-  resolution: "recoil@npm:0.2.0"
+"recoil@npm:^0.7.7":
+  version: 0.7.7
+  resolution: "recoil@npm:0.7.7"
   dependencies:
     hamt_plus: 1.0.2
   peerDependencies:
@@ -32532,7 +32533,7 @@ __metadata:
       optional: true
     react-native:
       optional: true
-  checksum: f3a4ec26c167d12919b3d37b95f3c1a99642e69841a02f683daaab235d3716c10f41e9c61afa5859f2ae14c105cd3f5bd487df5fa9b07b312b6a6573bd078bde
+  checksum: 65edecbcb8d2cde89bfd61ec679c200483472a6cd343c33e4e9142b6ce524fb17d1fecc2bfd8c392926aaa8178c81457f165b32abce2a9662f51f98822c0a9cc
   languageName: node
   linkType: hard