From 0db3463b8ea62e0b2e2a67e6277ae3c52349a939 Mon Sep 17 00:00:00 2001
From: Dan Hatton <daniel.hatton@diamond.ac.uk>
Date: Mon, 26 Jan 2026 11:44:52 +0000
Subject: [PATCH] add more detail to services box in dashboard

---
 .../components/pages/dashboard/Dashboard.tsx  | 61 ++++++++++++++++---
 1 file changed, 52 insertions(+), 9 deletions(-)

diff --git a/webui/src/components/pages/dashboard/Dashboard.tsx b/webui/src/components/pages/dashboard/Dashboard.tsx
index 5f20e47..b97ba9d 100644
--- a/webui/src/components/pages/dashboard/Dashboard.tsx
+++ b/webui/src/components/pages/dashboard/Dashboard.tsx
@@ -173,20 +173,63 @@ export function Dashboard() {
                 <Box sx={{ flex: 1, display: 'flex', flexDirection: 'column' }}>
                   <SystemComponentContainer heading="SmartEM Services" flex={1}>
                     <Box sx={{ display: 'flex', flexDirection: 'column', flex: 1, gap: 0.5 }}>
-                      <Box sx={{ ...itemBoxSx, flex: 1, display: 'flex', alignItems: 'center' }}>
-                        <Typography variant="caption" sx={{ color: '#333' }}>
-                          CTF and Motion Correction
-                        </Typography>
-                      </Box>
-                      <Box sx={{ ...itemBoxSx, flex: 1, display: 'flex', alignItems: 'center' }}>
-                        <Typography variant="caption" sx={{ color: '#333' }}>
+                      <Box
+                        sx={{
+                          ...itemBoxSx,
+                          flex: 1,
+                          display: 'flex',
+                          alignItems: 'center',
+                          flexDirection: 'column',
+                        }}
+                      >
+                        <Typography
+                          variant="caption"
+                          sx={{ color: '#333', fontWeight: 500, mt: 1 }}
+                        >
                           Data Processing
                         </Typography>
+                        <Typography
+                          variant="caption"
+                          component="div"
+                          sx={{ color: '#555', fontSize: '0.65rem', fontFamily: 'monospace' }}
+                        >
+                          Calculate quality metrics which are fed to SmartEM for prediction updates
+                          (includes motion correction, CTF estimation, particle picking, particle
+                          selection)
+                          <br />
+                          <Link href="https://github.com/DiamondLightSource/cryoem-services">
+                            https://github.com/DiamondLightSource/cryoem-services
+                          </Link>
+                        </Typography>
                       </Box>
-                      <Box sx={{ ...itemBoxSx, flex: 1, display: 'flex', alignItems: 'center' }}>
-                        <Typography variant="caption" sx={{ color: '#333' }}>
+                      <Box
+                        sx={{
+                          ...itemBoxSx,
+                          flex: 1,
+                          display: 'flex',
+                          alignItems: 'center',
+                          flexDirection: 'column',
+                        }}
+                      >
+                        <Typography
+                          variant="caption"
+                          sx={{ color: '#333', fontWeight: 500, mt: 1 }}
+                        >
                           ML Recommendations
                         </Typography>
+                        <Typography
+                          variant="caption"
+                          component="div"
+                          sx={{ color: '#555', fontSize: '0.65rem', fontFamily: 'monospace' }}
+                        >
+                          Quality predictions from a range of models as well as model weight and
+                          parameter updates. Updates are informed by quality metrics produced by
+                          data processing services
+                          <br />
+                          <Link href="https://github.com/DiamondLightSource/smartem-models">
+                            https://github.com/DiamondLightSource/smartem-models
+                          </Link>
+                        </Typography>
                       </Box>
                     </Box>
                   </SystemComponentContainer>