diff --git a/frontend/unified/src/App.tsx b/frontend/unified/src/App.tsx
index 507843a2..1650a7d7 100644
--- a/frontend/unified/src/App.tsx
+++ b/frontend/unified/src/App.tsx
@@ -1,4 +1,4 @@
-import { useState } from "react";
+import { Suspense, useState } from "react";
 import { ApolloProvider, useQuery } from "@apollo/client/react";
 
 import { Box, Chip, Drawer, Grid, Stack, Typography } from "@mui/material";
@@ -189,13 +189,15 @@ export const App: React.FC = () => {
         <ApolloProvider client={apolloClientWorkflows}>
           <Grid container spacing={HORIZONTAL_SPACING} columns={2}>
             <Stack spacing={VERTICAL_SPACING} width="500px">
-              <ProcessingView
-                key={`process-${sessionName}`}
-                visit={selectedVisit}
-                beamline={beamline}
-                startTime={session.startTime}
-                scanIds={selectedScanIds}
-              />
+              <Suspense>
+                <ProcessingView
+                  key={`process-${sessionName}`}
+                  visit={selectedVisit}
+                  beamline={beamline}
+                  startTime={session.startTime}
+                  scanIds={selectedScanIds}
+                />
+              </Suspense>
             </Stack>
             <WorkflowsDataFetcher visit={selectedVisit} />
           </Grid>
diff --git a/frontend/unified/src/components/ParameterConfiguration/ParameterConfiguration.tsx b/frontend/unified/src/components/ParameterConfiguration/ParameterConfiguration.tsx
index 68ed5e15..90a1a224 100644
--- a/frontend/unified/src/components/ParameterConfiguration/ParameterConfiguration.tsx
+++ b/frontend/unified/src/components/ParameterConfiguration/ParameterConfiguration.tsx
@@ -1,17 +1,17 @@
 import { Alert, Button, Snackbar, Typography } from "@mui/material";
 import { Beamline, Technique } from "../../types";
 import { SUBMIT_WORKFLOW_TEMPLATE } from "../../../../tomography/src/components/workflows/Submission";
-import { useMutation } from "@apollo/client/react";
+import { useMutation, useSuspenseQuery } from "@apollo/client/react";
 import { Visit } from "@diamondlightsource/sci-react-ui";
 import { InstrumentSession } from "../SessionSelector";
 import TemplateSelector from "../ProcessingView/TemplateSelector";
-import { templateOptions } from "../../data/templates";
 import { getParamConfigComponent } from "./utils/getParamConfigComponent";
 import { useState } from "react";
 import {
   determineBeamlineRawDataFilepath,
   determineBeamlineVisitDirpath,
 } from "./utils/utils";
+import { PARAMETERCONFIGURATION_QUERY } from "../../graphql/ParameterConfigurationQuery";
 
 type ParameterConfigurationProps = {
   technique: Technique;
@@ -28,11 +28,12 @@ export const ParameterConfiguration: React.FC<ParameterConfigurationProps> = ({
   startTime,
   scanIds,
 }: ParameterConfigurationProps) => {
-  const templateList = templateOptions.filter((option) =>
-    option.value.includes(technique.toLowerCase())
+  const { data, error } = useSuspenseQuery(PARAMETERCONFIGURATION_QUERY);
+  const templateList = data.workflowTemplates.nodes.filter((t) =>
+    t.name.startsWith(technique.toLowerCase())
   );
   const [template, setTemplate] = useState<string | null>(
-    templateList[0]?.value ?? null
+    templateList.length > 0 ? templateList[0].name : null
   );
   const [templateParameters, setTemplateParameters] = useState<object>({});
   const [resourceParameters, setResourceParameters] = useState({
@@ -45,6 +46,8 @@ export const ParameterConfiguration: React.FC<ParameterConfigurationProps> = ({
 
   const [mutation] = useMutation(SUBMIT_WORKFLOW_TEMPLATE);
 
+  if (error) console.error(`Error: ${error.message}`);
+
   const sessionYear = new Date(startTime).getFullYear();
   const visitDirpath = determineBeamlineVisitDirpath(
     beamline,
@@ -96,10 +99,6 @@ export const ParameterConfiguration: React.FC<ParameterConfigurationProps> = ({
     );
   };
 
-  const PlaceholderComponent = (
-    <p>No available component for {template} template</p>
-  );
-
   const parameterConfigurationComponent = template
     ? getParamConfigComponent(
         technique,
@@ -121,7 +120,9 @@ export const ParameterConfiguration: React.FC<ParameterConfigurationProps> = ({
             setTemplate={setTemplate}
           />
           <Typography variant="h6">Options</Typography>
-          {parameterConfigurationComponent ?? PlaceholderComponent}
+          {parameterConfigurationComponent ?? (
+            <p>No available component for {template} template</p>
+          )}
           <Button
             disabled={!parameterConfigurationComponent}
             variant="contained"
@@ -132,7 +133,7 @@ export const ParameterConfiguration: React.FC<ParameterConfigurationProps> = ({
           </Button>
         </>
       ) : (
-        <p>No templates found</p>
+        <Typography>No templates available</Typography>
       )}
 
       <Snackbar
diff --git a/frontend/unified/src/components/ProcessingView/TemplateSelector.tsx b/frontend/unified/src/components/ProcessingView/TemplateSelector.tsx
index ce014f9a..df425770 100644
--- a/frontend/unified/src/components/ProcessingView/TemplateSelector.tsx
+++ b/frontend/unified/src/components/ProcessingView/TemplateSelector.tsx
@@ -9,14 +9,14 @@ import {
   Stack,
 } from "@mui/material";
 import InfoIcon from "@mui/icons-material/Info";
-import { Option } from "../../types";
+import { Templates } from "../../types";
 
 const TemplateSelector = ({
   templateList,
   template,
   setTemplate,
 }: {
-  templateList: Option[];
+  templateList: Templates;
   template: string;
   setTemplate: (_: string) => void;
 }) => {
@@ -26,11 +26,11 @@ const TemplateSelector = ({
 
   const desc = (function () {
     for (const option of templateList) {
-      if (option.value === template) {
-        return option.desc;
+      if (option.name === template) {
+        return option.description;
       }
     }
-    return "";
+    return "No description available";
   })();
 
   return (
@@ -45,13 +45,13 @@ const TemplateSelector = ({
           onChange={handleSelect}
         >
           {templateList.map((opt) => (
-            <MenuItem key={opt.value} value={opt.value}>
-              {opt.label}
+            <MenuItem key={opt.name} value={opt.name}>
+              {opt.name}
             </MenuItem>
           ))}
         </Select>
         {template && (
-          <Tooltip title={desc}>
+          <Tooltip title={desc ?? "No description available"}>
             <IconButton>
               <InfoIcon />
             </IconButton>
diff --git a/frontend/unified/src/data/templates.ts b/frontend/unified/src/data/templates.ts
deleted file mode 100644
index 5913d00c..00000000
--- a/frontend/unified/src/data/templates.ts
+++ /dev/null
@@ -1,79 +0,0 @@
-import type { Option } from "../types/workflowFields";
-
-export const templateOptions: Option[] = [
-  {
-    label: "DPC",
-    value: "dpc-batch",
-    desc: "DPC imaging produces an image of the phase shifts to the X-ray beam as a result of interaction with the sample by measuring the gradient of the phase and retrieving the phase shifts by a straightforward integration step.",
-  },
-  {
-    label: "XANES Auto-processing",
-    value: "xanes",
-    desc: "XANES is a utility which attempts to stack a sequence of datasets acquired at different energy for a particular line group and perform alignment based on a line group.",
-  },
-  {
-    label: "XANES Point",
-    value: "xanes-point",
-    desc: "XANES-point is a utility which takes in a scan file (inpath) and a line group (edge_element), performs windowing of this line group, and saves a two-column text file (outpath): the first column is the energy in keV, and the second column is the summed windowed MCA intensity across the 4 channels.",
-  },
-  {
-    label: "XANES Sparse",
-    value: "xanes-sparse",
-    desc: "XANES-sparse is a utility which takes the last scan file of a sparse XANES scan (inpath), defines the 2D full grid, inserts the data in the correct rows, stack the images, and completes the missing data by using looped alternating steepest descent (ASD).",
-  },
-  {
-    label: "XRD 1D",
-    value: "xrd1d-batch",
-    desc: "XRD can be used to spatially map changes in crystallographic direction, d-spacing or strain across a sample.",
-  },
-  {
-    label: "XRD 2D",
-    value: "xrd2d-batch",
-    desc: "XRD 2D is a utility which performs Azimuthal integration (ExcaliburXRDIntegration) and saves result to a nxs file",
-  },
-  {
-    label: "Ptypy Reconstruction for I08-1",
-    value: "ptypy-i08-1-from-config",
-    desc: "Runs a PtyPy reconstruction job inside a container based on data collected at I08-1.",
-  },
-  {
-    label: "Ptypy Reconstruction for P99",
-    value: "ptypy-p99-from-config",
-    desc: "Runs a PtyPy reconstruction job inside a container based on data collected at P99.",
-  },
-  {
-    label: "ptycho",
-    value: "ptycho-recon",
-    desc: "simple ptyrex reconstruction",
-  },
-  {
-    label: "ptyrex",
-    value: "ptyrex-submission",
-    desc: "simple ptyrex reconstruction",
-  },
-  {
-    label: "ptycho tomography",
-    value: "ptycho-tomography",
-    desc: "process multiple ptychography data sets in order to cover a range tomographic angles",
-  },
-  {
-    label: "NBED Mapping",
-    value: "nbed-orientation-mapping",
-    desc: "nbed orientation mapping",
-  },
-  {
-    label: "Mib Batch",
-    value: "e02mib2x-auto",
-    desc: "Batch conversion of mib files",
-  },
-  {
-    label: "CoR Sweep",
-    value: "httomo-cor-sweep",
-    desc: "optimise the centre of rotation",
-  },
-  {
-    label: "FBP 180",
-    value: "httomo-fbp-180",
-    desc: "Reconstruct 180 degree scan with FBP3d_tomobar method",
-  },
-];
diff --git a/frontend/unified/src/graphql/ParameterConfigurationQuery.ts b/frontend/unified/src/graphql/ParameterConfigurationQuery.ts
new file mode 100644
index 00000000..4ed3ee7e
--- /dev/null
+++ b/frontend/unified/src/graphql/ParameterConfigurationQuery.ts
@@ -0,0 +1,20 @@
+import { gql, TypedDocumentNode } from "@apollo/client";
+import {
+  ParameterConfigurationQuery,
+  ParameterConfigurationQueryVariables,
+} from "./__generated__/ParameterConfigurationQuery.generated";
+
+export const PARAMETERCONFIGURATION_QUERY: TypedDocumentNode<
+  ParameterConfigurationQuery,
+  ParameterConfigurationQueryVariables
+> = gql`
+  query ParameterConfigurationQuery {
+    workflowTemplates(filter: { scienceGroup: IMAGING }) {
+      __typename
+      nodes {
+        name
+        description
+      }
+    }
+  }
+`;
diff --git a/frontend/unified/src/types.ts b/frontend/unified/src/types.ts
index 9b4b5e98..b9dd01da 100644
--- a/frontend/unified/src/types.ts
+++ b/frontend/unified/src/types.ts
@@ -1,3 +1,5 @@
+import { ProcessingViewQuery } from "./graphql/__generated__/ProcessingViewQuery.generated";
+
 const Technique = {
   Dpc: "Dpc",
   Nbed: "Nbed",
@@ -65,8 +67,6 @@ export const BEAMLINES_DEFAULT_TECHNIQUE = {
   [Beamline.P99]: Technique.Ptypy,
 };
 
-export type Option = { label: string; value: string; desc?: string };
-
 export type TemplateComponentProps = {
   setParameters: (_: object) => void;
   setResourceParameters: (_: object) => void;
@@ -87,3 +87,5 @@ export type Task = {
   name: string;
   status: TaskStatus;
 };
+
+export type Templates = ProcessingViewQuery["workflowTemplates"]["nodes"];