From a9093447bc71b0c8116fb6248dc0aacb75e25a1d Mon Sep 17 00:00:00 2001
From: Tom Kane <thomas.kane@diamond.ac.uk>
Date: Fri, 9 Oct 2026 17:20:55 +0000
Subject: [PATCH 1/7] rearrange and standardise form layouts between
 experiments, delete visit input, add step/fly to spectroscopy

---
 .../spectroscopy/SpectroscopyForm.tsx         | 130 +++++++++++-------
 .../spectroscopy/SpectroscopyView.tsx         |   2 +-
 .../components/tomography/TomographyForm.tsx  |  92 +++++++------
 3 files changed, 131 insertions(+), 93 deletions(-)

diff --git a/apps/visr/src/components/spectroscopy/SpectroscopyForm.tsx b/apps/visr/src/components/spectroscopy/SpectroscopyForm.tsx
index 3c52a0a8..b248ed16 100644
--- a/apps/visr/src/components/spectroscopy/SpectroscopyForm.tsx
+++ b/apps/visr/src/components/spectroscopy/SpectroscopyForm.tsx
@@ -4,8 +4,6 @@ import AbortButton from "../AbortButton";
 import { useState } from "react";
 import { NumberInput } from "@diamondlightsource/sci-react-ui";
 import { Box } from "@mui/material";
-import { visitToText, VisitInput } from "@diamondlightsource/sci-react-ui";
-import { visitTextToVisit } from "../../utils/common";
 
 export type SpectroscopyFormData = {
   total_number_of_scan_points: number;
@@ -16,7 +14,7 @@ export type SpectroscopyFormData = {
 };
 
 export function SpectroscopyForm() {
-  const { instrumentSession, setInstrumentSession } = useInstrumentSession();
+  const { instrumentSession } = useInstrumentSession();
   const [formData, setFormData] = useState<SpectroscopyFormData>({
     total_number_of_scan_points: 25,
     grid_size: 5.0,
@@ -28,88 +26,114 @@ export function SpectroscopyForm() {
   const maxValue = 14.5;
 
   return (
-    <Box>
+    <Box sx={{ display: "flex", flexDirection: "column", gap: 3, p: 3 }}>
+      
       <Box
         sx={{
           display: "grid",
-          gridTemplateColumns: {
-            xs: "1fr",
-            sm: "1fr 1fr",
-            md: "1fr 1fr 1fr",
-          },
+          gridTemplateColumns: { xs: "1fr", sm: "1fr 1fr" },
           gap: 3,
-          flexGrow: 1,
+          alignItems: "start",
         }}
       >
-        <NumberInput
-          label="Grid Origin x"
-          numberMode="scientific"
-          defaultValue={formData["grid_origin_x"]}
-          onCommit={parsedValue => {
-            setFormData({ ...formData, ["grid_origin_x"]: parsedValue });
-          }}
-          minValue={minValue}
-          maxValue={maxValue}
-        />
-        <NumberInput
-          label="Grid Origin y"
-          numberMode="scientific"
-          defaultValue={formData["grid_origin_y"]}
-          onCommit={parsedValue => {
-            setFormData({ ...formData, ["grid_origin_y"]: parsedValue });
+        {/* Line one */}
+        <Box
+          sx={{
+            display: "grid",
+            gridTemplateColumns: "1fr 1fr",
+            gap: 2,
+            alignItems: "start",
           }}
-          minValue={minValue}
-          maxValue={maxValue}
-        />
+        >
+          <NumberInput
+            label="Grid Origin x"
+            numberMode="scientific"
+            defaultValue={formData["grid_origin_x"]}
+            onCommit={parsedValue =>
+              setFormData(prev => ({ ...prev, grid_origin_x: parsedValue }))
+            }
+            minValue={minValue}
+            maxValue={maxValue}
+          />
+          <NumberInput
+            label="Grid Origin y"
+            numberMode="scientific"
+            defaultValue={formData["grid_origin_y"]}
+            onCommit={parsedValue =>
+              setFormData(prev => ({ ...prev, grid_origin_y: parsedValue }))
+            }
+            minValue={minValue}
+            maxValue={maxValue}
+          />
+        </Box>
+
         <NumberInput
           label="Grid Size"
           numberMode="scientific"
           defaultValue={formData["grid_size"]}
-          onCommit={parsedValue => {
-            setFormData({ ...formData, ["grid_size"]: parsedValue });
-          }}
+          onCommit={parsedValue =>
+            setFormData(prev => ({ ...prev, grid_size: parsedValue }))
+          }
           minValue={0.1}
           maxValue={15}
         />
+
+        {/* Line two */}
         <NumberInput
           label="Number of Points"
           numberMode="natural"
           defaultValue={formData["total_number_of_scan_points"]}
-          onCommit={parsedValue => {
-            setFormData({
-              ...formData,
-              ["total_number_of_scan_points"]: parsedValue,
-            });
-          }}
+          onCommit={parsedValue =>
+            setFormData(prev => ({
+              ...prev,
+              total_number_of_scan_points: parsedValue,
+            }))
+          }
           minValue={1}
         />
         <NumberInput
           label="Exposure Time"
           numberMode="scientific"
           defaultValue={formData["exposure_time"]}
-          onCommit={parsedValue => {
-            setFormData({ ...formData, ["exposure_time"]: parsedValue });
-          }}
-          minValue={0.1}
-        />
-        <VisitInput
-          visit={
-            visitTextToVisit(instrumentSession) ??
-            visitTextToVisit("cm12345-1") ??
-            undefined
+          onCommit={parsedValue =>
+            setFormData(prev => ({ ...prev, exposure_time: parsedValue }))
           }
-          onSubmit={visit => setInstrumentSession(visitToText(visit))}
-          submitButton={false}
+          minValue={0.1}
         />
       </Box>
-      <Box sx={{ mt: 4 }} display={"flex"} justifyContent={"center"}>
+
+      {/* Line three */}
+      <Box
+        sx={{
+          display: "grid",
+          gridTemplateColumns: { xs: "1fr", sm: "1fr 1fr" },
+          gap: 2,
+          pt: 3,
+          borderTop: 1,
+          borderColor: "divider",
+          "& .MuiButton-root": {
+            width: "100%",
+            height: 40,
+            whiteSpace: "nowrap",
+          },
+        }}
+      >
         <RunPlanButton
           name="demo_spectroscopy"
-          params={formData}
+          params={{ ...formData, fly: false }}
           instrumentSession={instrumentSession}
+          buttonText="Step Scan"
+        />
+        <RunPlanButton
+          name="demo_spectroscopy"
+          params={{ ...formData, fly: true }}
+          instrumentSession={instrumentSession}
+          buttonText="Fly Scan"
         />
       </Box>
-      <Box sx={{ mt: 4 }} display={"flex"} justifyContent={"center"}>
+
+      {/* Line four */}
+      <Box sx={{ "& .MuiButton-root": { width: "100%", height: 40 } }}>
         <AbortButton />
       </Box>
     </Box>
diff --git a/apps/visr/src/components/spectroscopy/SpectroscopyView.tsx b/apps/visr/src/components/spectroscopy/SpectroscopyView.tsx
index 137f41fa..58c3590a 100644
--- a/apps/visr/src/components/spectroscopy/SpectroscopyView.tsx
+++ b/apps/visr/src/components/spectroscopy/SpectroscopyView.tsx
@@ -73,7 +73,7 @@ function SpectroscopyView() {
         open={drawerOpen}
         collapsedHeight={DRAWER_COLLAPSED_HEIGHT}
         onToggle={() => setDrawerOpen(prev => !prev)}
-        controls={<SpectroscopyForm />}
+        controls={[<SpectroscopyForm />, <SpectroscopyForm />]}
       />
     </Box>
   );
diff --git a/apps/visr/src/components/tomography/TomographyForm.tsx b/apps/visr/src/components/tomography/TomographyForm.tsx
index 0d83ca91..405edcef 100644
--- a/apps/visr/src/components/tomography/TomographyForm.tsx
+++ b/apps/visr/src/components/tomography/TomographyForm.tsx
@@ -10,8 +10,6 @@ import {
   ToggleButton,
   ToggleButtonGroup,
 } from "@mui/material";
-import { visitToText, VisitInput } from "@diamondlightsource/sci-react-ui";
-import { visitTextToVisit } from "../../utils/common";
 
 enum LightSource {
   LED = "led",
@@ -22,66 +20,79 @@ enum LightSource {
 export type TomographyFormData = {
   number_of_projections: number;
   light_source: LightSource;
+  exposure_time: number;
 };
 
 export function TomographyForm() {
-  const { instrumentSession, setInstrumentSession } = useInstrumentSession();
+  const { instrumentSession } = useInstrumentSession();
   const [formData, setFormData] = useState<TomographyFormData>({
     number_of_projections: 360,
     light_source: LightSource.LED,
+    exposure_time: 0.1,
   });
   const minProjections = 30;
   const maxProjections = 1440;
 
   return (
-    <Box
-      sx={{
-        display: "flex",
-        flexDirection: "column",
-        gap: 3,
-        p: 3,
-      }}
-    >
+    <Box sx={{ display: "flex", flexDirection: "column", gap: 3, p: 3 }}>
+      {/* Line one */}
       <Box
         sx={{
-          display: "flex",
-          flexDirection: "column",
-          gap: 2,
+          display: "grid",
+          gridTemplateColumns: {
+            xs: "1fr",
+            sm: "1fr 1fr",
+            md: "1fr 1fr 1fr",
+          },
+          columnGap: 3,
+          rowGap: 4,
+          alignItems: "start",
+          pt: 2,
         }}
       >
         <NumberInput
           label="Number of Projections"
           defaultValue={formData["number_of_projections"]}
           numberMode="natural"
-          onCommit={parsedValue => {
-            setFormData({
-              ...formData,
-              ["number_of_projections"]: parsedValue,
-            });
-          }}
+          onCommit={parsedValue =>
+            setFormData(prev => ({
+              ...prev,
+              number_of_projections: parsedValue,
+            }))
+          }
           minValue={minProjections}
           maxValue={maxProjections}
         />
-        <VisitInput
-          visit={
-            visitTextToVisit(instrumentSession) ??
-            visitTextToVisit("cm12345-1") ??
-            undefined
+        <NumberInput
+          label="Exposure Time"
+          numberMode="scientific"
+          defaultValue={formData["exposure_time"]}
+          onCommit={parsedValue =>
+            setFormData(prev => ({ ...prev, exposure_time: parsedValue }))
           }
-          onSubmit={visit => setInstrumentSession(visitToText(visit))}
-          submitButton={false}
+          minValue={0.1}
         />
-        <FormControl>
-          <FormLabel id="light-source-label" sx={{ mb: 1 }}>
+        <FormControl fullWidth sx={{ position: "relative" }}>
+          <FormLabel
+            id="light-source-label"
+            sx={{
+              position: "absolute",
+              top: -24,
+              left: 0,
+              fontSize: "0.875rem",
+            }}
+          >
             Light Source
           </FormLabel>
           <ToggleButtonGroup
             exclusive
+            fullWidth
             aria-labelledby="light-source-label"
             value={formData.light_source}
             onChange={(_, value: LightSource | null) =>
-              value && setFormData({ ...formData, light_source: value })
+              value && setFormData(prev => ({ ...prev, light_source: value }))
             }
+            sx={{ height: 56 }}
           >
             <ToggleButton value={LightSource.LED}>LED</ToggleButton>
             <ToggleButton value={LightSource.SR}>Synchrotron</ToggleButton>
@@ -89,14 +100,21 @@ export function TomographyForm() {
           </ToggleButtonGroup>
         </FormControl>
       </Box>
+
+      {/* Line two */}
       <Box
         sx={{
-          display: "flex",
-          flexWrap: "wrap",
+          display: "grid",
+          gridTemplateColumns: { xs: "1fr", sm: "repeat(3, 1fr)" },
           gap: 2,
-          pt: 1,
+          pt: 3,
           borderTop: 1,
           borderColor: "divider",
+          "& .MuiButton-root": {
+            width: "100%",
+            height: 40,
+            whiteSpace: "nowrap",
+          },
         }}
       >
         <RunPlanButton
@@ -113,7 +131,6 @@ export function TomographyForm() {
         />
         <Box
           sx={{
-            ml: "auto",
             "& .MuiButton-root": {
               backgroundColor: "secondary.main",
               "&:hover": { backgroundColor: "secondary.dark" },
@@ -129,11 +146,8 @@ export function TomographyForm() {
         </Box>
       </Box>
 
-      <Box
-        sx={{
-          display: "flex",
-        }}
-      >
+      {/* Line three */}
+      <Box sx={{ "& .MuiButton-root": { width: "100%", height: 40 } }}>
         <AbortButton />
       </Box>
     </Box>

From c076255f2278169a590a302859b0c3c0ee1935e8 Mon Sep 17 00:00:00 2001
From: Tom Kane <thomas.kane@diamond.ac.uk>
Date: Fri, 9 Oct 2026 17:38:14 +0000
Subject: [PATCH 2/7] remove second form used for visualisation

---
 apps/visr/src/components/spectroscopy/SpectroscopyView.tsx | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/apps/visr/src/components/spectroscopy/SpectroscopyView.tsx b/apps/visr/src/components/spectroscopy/SpectroscopyView.tsx
index 58c3590a..137f41fa 100644
--- a/apps/visr/src/components/spectroscopy/SpectroscopyView.tsx
+++ b/apps/visr/src/components/spectroscopy/SpectroscopyView.tsx
@@ -73,7 +73,7 @@ function SpectroscopyView() {
         open={drawerOpen}
         collapsedHeight={DRAWER_COLLAPSED_HEIGHT}
         onToggle={() => setDrawerOpen(prev => !prev)}
-        controls={[<SpectroscopyForm />, <SpectroscopyForm />]}
+        controls={<SpectroscopyForm />}
       />
     </Box>
   );

From 5e938d4e840eeaa7422837c069ab115191949e6e Mon Sep 17 00:00:00 2001
From: Tom Kane <thomas.kane@diamond.ac.uk>
Date: Mon, 12 Oct 2026 15:41:26 +0000
Subject: [PATCH 3/7] make step/fly a toggle with run button, change order and
 refcator

---
 apps/visr/src/components/scanType.ts          |   4 +
 .../spectroscopy/SpectroscopyForm.tsx         | 113 ++++++++----------
 .../components/tomography/TomographyForm.tsx  | 113 ++++++++++--------
 3 files changed, 118 insertions(+), 112 deletions(-)
 create mode 100644 apps/visr/src/components/scanType.ts

diff --git a/apps/visr/src/components/scanType.ts b/apps/visr/src/components/scanType.ts
new file mode 100644
index 00000000..e805bfd7
--- /dev/null
+++ b/apps/visr/src/components/scanType.ts
@@ -0,0 +1,4 @@
+export enum ScanType {
+  STEP = "step",
+  FLY = "fly",
+}
diff --git a/apps/visr/src/components/spectroscopy/SpectroscopyForm.tsx b/apps/visr/src/components/spectroscopy/SpectroscopyForm.tsx
index b248ed16..6c8a117a 100644
--- a/apps/visr/src/components/spectroscopy/SpectroscopyForm.tsx
+++ b/apps/visr/src/components/spectroscopy/SpectroscopyForm.tsx
@@ -1,11 +1,13 @@
 import { useInstrumentSession } from "../../context/instrumentSession/useInstrumentSession";
 import { RunPlanButton } from "@atlas/blueapi-ui";
 import AbortButton from "../AbortButton";
+import { ScanType } from "../scanType";
 import { useState } from "react";
 import { NumberInput } from "@diamondlightsource/sci-react-ui";
-import { Box } from "@mui/material";
+import { Box, ToggleButton, ToggleButtonGroup } from "@mui/material";
 
 export type SpectroscopyFormData = {
+  scan_type: ScanType;
   total_number_of_scan_points: number;
   grid_size: number;
   grid_origin_x: number;
@@ -16,6 +18,7 @@ export type SpectroscopyFormData = {
 export function SpectroscopyForm() {
   const { instrumentSession } = useInstrumentSession();
   const [formData, setFormData] = useState<SpectroscopyFormData>({
+    scan_type: ScanType.STEP,
     total_number_of_scan_points: 25,
     grid_size: 5.0,
     grid_origin_x: 0.0,
@@ -25,9 +28,29 @@ export function SpectroscopyForm() {
   const minValue = -14.5;
   const maxValue = 14.5;
 
+  const setField = <K extends keyof typeof formData>(
+    key: K,
+    value: (typeof formData)[K],
+  ) => setFormData(prev => ({ ...prev, [key]: value }));
+
+  const sectionSx = { pt: 3, borderTop: 1, borderColor: "divider" };
+
   return (
-    <Box sx={{ display: "flex", flexDirection: "column", gap: 3, p: 3 }}>
-      
+    <Box
+      sx={{
+        display: "flex",
+        flexDirection: "column",
+        gap: 3,
+        p: 3,
+        "& .MuiButton-root": {
+          width: "100%",
+          height: 56,
+          whiteSpace: "nowrap",
+        },
+        "& .MuiToggleButtonGroup-root": { height: 56 },
+      }}
+    >
+      {/* Parameters */}
       <Box
         sx={{
           display: "grid",
@@ -36,104 +59,74 @@ export function SpectroscopyForm() {
           alignItems: "start",
         }}
       >
-        {/* Line one */}
-        <Box
-          sx={{
-            display: "grid",
-            gridTemplateColumns: "1fr 1fr",
-            gap: 2,
-            alignItems: "start",
-          }}
-        >
+        {/* x and y share one cell */}
+        <Box sx={{ display: "grid", gridTemplateColumns: "1fr 1fr", gap: 2 }}>
           <NumberInput
             label="Grid Origin x"
             numberMode="scientific"
-            defaultValue={formData["grid_origin_x"]}
-            onCommit={parsedValue =>
-              setFormData(prev => ({ ...prev, grid_origin_x: parsedValue }))
-            }
+            defaultValue={formData.grid_origin_x}
+            onCommit={v => setField("grid_origin_x", v)}
             minValue={minValue}
             maxValue={maxValue}
           />
           <NumberInput
             label="Grid Origin y"
             numberMode="scientific"
-            defaultValue={formData["grid_origin_y"]}
-            onCommit={parsedValue =>
-              setFormData(prev => ({ ...prev, grid_origin_y: parsedValue }))
-            }
+            defaultValue={formData.grid_origin_y}
+            onCommit={v => setField("grid_origin_y", v)}
             minValue={minValue}
             maxValue={maxValue}
           />
         </Box>
-
         <NumberInput
           label="Grid Size"
           numberMode="scientific"
-          defaultValue={formData["grid_size"]}
-          onCommit={parsedValue =>
-            setFormData(prev => ({ ...prev, grid_size: parsedValue }))
-          }
+          defaultValue={formData.grid_size}
+          onCommit={v => setField("grid_size", v)}
           minValue={0.1}
           maxValue={15}
         />
-
-        {/* Line two */}
         <NumberInput
           label="Number of Points"
           numberMode="natural"
-          defaultValue={formData["total_number_of_scan_points"]}
-          onCommit={parsedValue =>
-            setFormData(prev => ({
-              ...prev,
-              total_number_of_scan_points: parsedValue,
-            }))
-          }
+          defaultValue={formData.total_number_of_scan_points}
+          onCommit={v => setField("total_number_of_scan_points", v)}
           minValue={1}
         />
         <NumberInput
           label="Exposure Time"
           numberMode="scientific"
-          defaultValue={formData["exposure_time"]}
-          onCommit={parsedValue =>
-            setFormData(prev => ({ ...prev, exposure_time: parsedValue }))
-          }
+          defaultValue={formData.exposure_time}
+          onCommit={v => setField("exposure_time", v)}
           minValue={0.1}
         />
       </Box>
 
-      {/* Line three */}
+      {/* Scan controls */}
       <Box
         sx={{
+          ...sectionSx,
           display: "grid",
-          gridTemplateColumns: { xs: "1fr", sm: "1fr 1fr" },
+          gridTemplateColumns: { xs: "1fr", sm: "repeat(3, 1fr)" },
           gap: 2,
-          pt: 3,
-          borderTop: 1,
-          borderColor: "divider",
-          "& .MuiButton-root": {
-            width: "100%",
-            height: 40,
-            whiteSpace: "nowrap",
-          },
         }}
       >
+        <ToggleButtonGroup
+          exclusive
+          fullWidth
+          aria-label="Scan type"
+          value={formData.scan_type}
+          onChange={(_, v) => v && setField("scan_type", v)}
+        >
+          <ToggleButton value={ScanType.STEP}>Step</ToggleButton>
+          <ToggleButton value={ScanType.FLY}>Fly</ToggleButton>
+        </ToggleButtonGroup>
         <RunPlanButton
           name="demo_spectroscopy"
-          params={{ ...formData, fly: false }}
-          instrumentSession={instrumentSession}
-          buttonText="Step Scan"
-        />
-        <RunPlanButton
-          name="demo_spectroscopy"
-          params={{ ...formData, fly: true }}
+          params={formData}
           instrumentSession={instrumentSession}
-          buttonText="Fly Scan"
+          buttonText="Run"
         />
-      </Box>
-
-      {/* Line four */}
-      <Box sx={{ "& .MuiButton-root": { width: "100%", height: 40 } }}>
         <AbortButton />
       </Box>
     </Box>
diff --git a/apps/visr/src/components/tomography/TomographyForm.tsx b/apps/visr/src/components/tomography/TomographyForm.tsx
index 405edcef..9e798232 100644
--- a/apps/visr/src/components/tomography/TomographyForm.tsx
+++ b/apps/visr/src/components/tomography/TomographyForm.tsx
@@ -1,6 +1,7 @@
 import { useInstrumentSession } from "../../context/instrumentSession/useInstrumentSession";
 import { RunPlanButton } from "@atlas/blueapi-ui";
 import AbortButton from "../AbortButton";
+import { ScanType } from "../scanType";
 import { useState } from "react";
 import { NumberInput } from "@diamondlightsource/sci-react-ui";
 import {
@@ -18,6 +19,7 @@ enum LightSource {
 }
 
 export type TomographyFormData = {
+  scan_type: ScanType;
   number_of_projections: number;
   light_source: LightSource;
   exposure_time: number;
@@ -26,6 +28,7 @@ export type TomographyFormData = {
 export function TomographyForm() {
   const { instrumentSession } = useInstrumentSession();
   const [formData, setFormData] = useState<TomographyFormData>({
+    scan_type: ScanType.STEP,
     number_of_projections: 360,
     light_source: LightSource.LED,
     exposure_time: 0.1,
@@ -33,16 +36,36 @@ export function TomographyForm() {
   const minProjections = 30;
   const maxProjections = 1440;
 
+  const setField = <K extends keyof typeof formData>(
+    key: K,
+    value: (typeof formData)[K],
+  ) => setFormData(prev => ({ ...prev, [key]: value }));
+
+  const sectionSx = { pt: 3, borderTop: 1, borderColor: "divider" };
+
   return (
-    <Box sx={{ display: "flex", flexDirection: "column", gap: 3, p: 3 }}>
-      {/* Line one */}
+    <Box
+      sx={{
+        display: "flex",
+        flexDirection: "column",
+        gap: 3,
+        p: 3,
+        "& .MuiButton-root": {
+          width: "100%",
+          height: 56,
+          whiteSpace: "nowrap",
+        },
+        "& .MuiToggleButtonGroup-root": { height: 56 },
+      }}
+    >
+      {/* Parameters */}
       <Box
         sx={{
           display: "grid",
           gridTemplateColumns: {
             xs: "1fr",
             sm: "1fr 1fr",
-            md: "1fr 1fr 1fr",
+            md: "repeat(3, 1fr)",
           },
           columnGap: 3,
           rowGap: 4,
@@ -52,24 +75,17 @@ export function TomographyForm() {
       >
         <NumberInput
           label="Number of Projections"
-          defaultValue={formData["number_of_projections"]}
           numberMode="natural"
-          onCommit={parsedValue =>
-            setFormData(prev => ({
-              ...prev,
-              number_of_projections: parsedValue,
-            }))
-          }
+          defaultValue={formData.number_of_projections}
+          onCommit={v => setField("number_of_projections", v)}
           minValue={minProjections}
           maxValue={maxProjections}
         />
         <NumberInput
           label="Exposure Time"
           numberMode="scientific"
-          defaultValue={formData["exposure_time"]}
-          onCommit={parsedValue =>
-            setFormData(prev => ({ ...prev, exposure_time: parsedValue }))
-          }
+          defaultValue={formData.exposure_time}
+          onCommit={v => setField("exposure_time", v)}
           minValue={0.1}
         />
         <FormControl fullWidth sx={{ position: "relative" }}>
@@ -89,10 +105,7 @@ export function TomographyForm() {
             fullWidth
             aria-labelledby="light-source-label"
             value={formData.light_source}
-            onChange={(_, value: LightSource | null) =>
-              value && setFormData(prev => ({ ...prev, light_source: value }))
-            }
-            sx={{ height: 56 }}
+            onChange={(_, v) => v && setField("light_source", v)}
           >
             <ToggleButton value={LightSource.LED}>LED</ToggleButton>
             <ToggleButton value={LightSource.SR}>Synchrotron</ToggleButton>
@@ -101,54 +114,50 @@ export function TomographyForm() {
         </FormControl>
       </Box>
 
-      {/* Line two */}
+      {/* Scan controls */}
       <Box
         sx={{
+          ...sectionSx,
           display: "grid",
           gridTemplateColumns: { xs: "1fr", sm: "repeat(3, 1fr)" },
           gap: 2,
-          pt: 3,
-          borderTop: 1,
-          borderColor: "divider",
-          "& .MuiButton-root": {
-            width: "100%",
-            height: 40,
-            whiteSpace: "nowrap",
-          },
         }}
       >
+        <ToggleButtonGroup
+          exclusive
+          fullWidth
+          aria-label="Scan type"
+          value={formData.scan_type}
+          onChange={(_, v) => v && setField("scan_type", v)}
+        >
+          <ToggleButton value={ScanType.STEP}>Step</ToggleButton>
+          <ToggleButton value={ScanType.FLY}>Fly</ToggleButton>
+        </ToggleButtonGroup>
         <RunPlanButton
           name="tomography"
-          params={{ ...formData, fly: false }}
+          params={formData}
           instrumentSession={instrumentSession}
-          buttonText="Step Scan"
+          buttonText="Run"
         />
+        <AbortButton />
+      </Box>
+
+      {/* Darks/flats */}
+      <Box
+        sx={{
+          ...sectionSx,
+          "& .MuiButton-root": {
+            bgcolor: "secondary.main",
+            "&:hover": { bgcolor: "secondary.dark" },
+          },
+        }}
+      >
         <RunPlanButton
-          name="tomography"
-          params={{ ...formData, fly: true }}
+          name="darks_flats"
+          params={{ light_source: formData.light_source }}
           instrumentSession={instrumentSession}
-          buttonText="Fly Scan"
+          buttonText="Acquire Darks/Flats"
         />
-        <Box
-          sx={{
-            "& .MuiButton-root": {
-              backgroundColor: "secondary.main",
-              "&:hover": { backgroundColor: "secondary.dark" },
-            },
-          }}
-        >
-          <RunPlanButton
-            name="darks_flats"
-            params={{ light_source: formData.light_source }}
-            instrumentSession={instrumentSession}
-            buttonText="Acquire Darks/Flats"
-          />
-        </Box>
-      </Box>
-
-      {/* Line three */}
-      <Box sx={{ "& .MuiButton-root": { width: "100%", height: 40 } }}>
-        <AbortButton />
       </Box>
     </Box>
   );

From bb81d1e5336c30470ac3cbb37a139a55b65dd6f7 Mon Sep 17 00:00:00 2001
From: Tom Kane <thomas.kane@diamond.ac.uk>
Date: Mon, 12 Oct 2026 16:38:57 +0000
Subject: [PATCH 4/7] add exposure time to darks/flats

---
 apps/visr/src/components/tomography/TomographyForm.tsx | 5 ++++-
 1 file changed, 4 insertions(+), 1 deletion(-)

diff --git a/apps/visr/src/components/tomography/TomographyForm.tsx b/apps/visr/src/components/tomography/TomographyForm.tsx
index 9e798232..72a2c726 100644
--- a/apps/visr/src/components/tomography/TomographyForm.tsx
+++ b/apps/visr/src/components/tomography/TomographyForm.tsx
@@ -154,7 +154,10 @@ export function TomographyForm() {
       >
         <RunPlanButton
           name="darks_flats"
-          params={{ light_source: formData.light_source }}
+          params={{
+            light_source: formData.light_source,
+            exposure_time: formData.exposure_time,
+          }}
           instrumentSession={instrumentSession}
           buttonText="Acquire Darks/Flats"
         />

From 5c80c6f595c926e341dddb04cea7ab60ae14bae3 Mon Sep 17 00:00:00 2001
From: Tom Kane <thomas.kane@diamond.ac.uk>
Date: Tue, 13 Oct 2026 14:25:53 +0000
Subject: [PATCH 5/7] remove customisation on darks flats button

---
 apps/visr/src/components/tomography/TomographyForm.tsx | 4 ----
 1 file changed, 4 deletions(-)

diff --git a/apps/visr/src/components/tomography/TomographyForm.tsx b/apps/visr/src/components/tomography/TomographyForm.tsx
index 72a2c726..c4086a35 100644
--- a/apps/visr/src/components/tomography/TomographyForm.tsx
+++ b/apps/visr/src/components/tomography/TomographyForm.tsx
@@ -146,10 +146,6 @@ export function TomographyForm() {
       <Box
         sx={{
           ...sectionSx,
-          "& .MuiButton-root": {
-            bgcolor: "secondary.main",
-            "&:hover": { bgcolor: "secondary.dark" },
-          },
         }}
       >
         <RunPlanButton

From 394eb38de0eecf7db784106bf706811c754bc9ca Mon Sep 17 00:00:00 2001
From: Tom Kane <thomas.kane@diamond.ac.uk>
Date: Fri, 16 Oct 2026 11:29:43 +0000
Subject: [PATCH 6/7] update name of plan in buttomn to plain spectroscopy

---
 apps/visr/src/components/spectroscopy/SpectroscopyForm.tsx | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/apps/visr/src/components/spectroscopy/SpectroscopyForm.tsx b/apps/visr/src/components/spectroscopy/SpectroscopyForm.tsx
index 04d6b7ee..fbb7ce17 100644
--- a/apps/visr/src/components/spectroscopy/SpectroscopyForm.tsx
+++ b/apps/visr/src/components/spectroscopy/SpectroscopyForm.tsx
@@ -122,7 +122,7 @@ export function SpectroscopyForm() {
           <ToggleButton value={ScanType.FLY}>Fly</ToggleButton>
         </ToggleButtonGroup>
         <RunPlanButton
-          name="demo_spectroscopy"
+          name="spectroscopy"
           params={formData}
           instrumentSession={instrumentSession}
           buttonText="Run"

From e507c603106b7ddd2ffe77a1547175170ff7f3c6 Mon Sep 17 00:00:00 2001
From: Tom Kane <thomas.kane@diamond.ac.uk>
Date: Mon, 19 Oct 2026 09:57:41 +0000
Subject: [PATCH 7/7] change plan names back to demo_

---
 apps/visr/src/components/spectroscopy/SpectroscopyForm.tsx | 2 +-
 apps/visr/src/components/tomography/TomographyForm.tsx     | 2 +-
 2 files changed, 2 insertions(+), 2 deletions(-)

diff --git a/apps/visr/src/components/spectroscopy/SpectroscopyForm.tsx b/apps/visr/src/components/spectroscopy/SpectroscopyForm.tsx
index fbb7ce17..04d6b7ee 100644
--- a/apps/visr/src/components/spectroscopy/SpectroscopyForm.tsx
+++ b/apps/visr/src/components/spectroscopy/SpectroscopyForm.tsx
@@ -122,7 +122,7 @@ export function SpectroscopyForm() {
           <ToggleButton value={ScanType.FLY}>Fly</ToggleButton>
         </ToggleButtonGroup>
         <RunPlanButton
-          name="spectroscopy"
+          name="demo_spectroscopy"
           params={formData}
           instrumentSession={instrumentSession}
           buttonText="Run"
diff --git a/apps/visr/src/components/tomography/TomographyForm.tsx b/apps/visr/src/components/tomography/TomographyForm.tsx
index 675f7829..47f5e882 100644
--- a/apps/visr/src/components/tomography/TomographyForm.tsx
+++ b/apps/visr/src/components/tomography/TomographyForm.tsx
@@ -134,7 +134,7 @@ export function TomographyForm() {
           <ToggleButton value={ScanType.FLY}>Fly</ToggleButton>
         </ToggleButtonGroup>
         <RunPlanButton
-          name="tomography"
+          name="demo_tomography"
           params={formData}
           instrumentSession={instrumentSession}
           buttonText="Run"