From 3ff8a8deb564619ca63c6ad32251ab4d91463e67 Mon Sep 17 00:00:00 2001
From: zdomke <zdomke@slac.stanford.edu>
Date: Fri, 23 Jan 2026 09:56:57 -0800
Subject: [PATCH 1/4] ENH: Add secondary text to list

---
 src/pages/TagPage.tsx | 74 ++++++++++++++++++++++++-------------------
 1 file changed, 41 insertions(+), 33 deletions(-)

diff --git a/src/pages/TagPage.tsx b/src/pages/TagPage.tsx
index 7c01a14b2..2e62c053d 100644
--- a/src/pages/TagPage.tsx
+++ b/src/pages/TagPage.tsx
@@ -17,11 +17,13 @@ import {
   DialogContent,
   DialogActions,
   TextField,
+  Chip,
+  ListSubheader,
+  Divider,
   List,
   ListItem,
   ListItemText,
   ListItemSecondaryAction,
-  Chip,
 } from '@mui/material';
 import { Add, Delete, Edit, NoteOutlined } from '@mui/icons-material';
 import { TagGroup, Tag } from '../types';
@@ -328,42 +330,48 @@ export const TagPage: React.FC<TagPageProps> = ({
               multiline
               rows={2}
             />
-            <Typography variant="subtitle2" sx={{ mt: 2, mb: 1 }}>
-              Tags:
-            </Typography>
           </Box>
 
-          <Box sx={{ flex: 1, overflowY: 'auto', px: 3, py: 1 }}>
+          <Box sx={{ flex: 1, overflowY: 'auto', px: 3 }}>
             {selectedGroup && selectedGroup.tags.length > 0 ? (
-              <List dense sx={{ p: 0 }}>
+              <List sx={{ p: 0 }} subheader={<ListSubheader>Tags</ListSubheader>}>
                 {selectedGroup.tags.map((tag, idx) => (
-                  <ListItem key={idx}>
-                    <ListItemText primary={tag.name} />
-                    <ListItemSecondaryAction>
-                      {onEditTag && (
-                        <IconButton
-                          edge="end"
-                          aria-label="edit tag"
-                          size="small"
-                          onClick={() => handleOpenTagDialog(tag)}
-                          color="default"
-                        >
-                          {isAdmin ? <Edit fontSize="small" /> : <NoteOutlined fontSize="small" />}
-                        </IconButton>
-                      )}
-                      {isAdmin && onDeleteTag && (
-                        <IconButton
-                          edge="end"
-                          aria-label="delete"
-                          size="small"
-                          onClick={() => handleDeleteTag(tag)}
-                          color="error"
-                        >
-                          <Delete fontSize="small" />
-                        </IconButton>
-                      )}
-                    </ListItemSecondaryAction>
-                  </ListItem>
+                  <>
+                    <ListItem key={idx}>
+                      <ListItemText primary={tag.name} secondary={tag.description} />
+                      <ListItemSecondaryAction>
+                        {onEditTag && (
+                          <IconButton
+                            edge="end"
+                            aria-label="edit tag"
+                            size="small"
+                            onClick={() => handleOpenTagDialog(tag)}
+                            color="default"
+                          >
+                            {isAdmin ? (
+                              <Edit fontSize="small" />
+                            ) : (
+                              <NoteOutlined fontSize="small" />
+                            )}
+                          </IconButton>
+                        )}
+                        {isAdmin && onDeleteTag && (
+                          <IconButton
+                            edge="end"
+                            aria-label="delete"
+                            size="small"
+                            onClick={() => handleDeleteTag(tag)}
+                            color="error"
+                          >
+                            <Delete fontSize="small" />
+                          </IconButton>
+                        )}
+                      </ListItemSecondaryAction>
+                    </ListItem>
+                    {selectedGroup.tags.length - 1 != idx && (
+                      <Divider key={`divider-${idx}`} component="li" />
+                    )}
+                  </>
                 ))}
               </List>
             ) : (

From 92d568b0ba4dd35f61479cf951eb925410138fa8 Mon Sep 17 00:00:00 2001
From: zdomke <zdomke@slac.stanford.edu>
Date: Fri, 23 Jan 2026 15:18:22 -0800
Subject: [PATCH 2/4] ENH: Truncate description text

---
 src/pages/TagPage.tsx | 14 +++++++++++++-
 1 file changed, 13 insertions(+), 1 deletion(-)

diff --git a/src/pages/TagPage.tsx b/src/pages/TagPage.tsx
index 2e62c053d..3790d0d2a 100644
--- a/src/pages/TagPage.tsx
+++ b/src/pages/TagPage.tsx
@@ -338,7 +338,19 @@ export const TagPage: React.FC<TagPageProps> = ({
                 {selectedGroup.tags.map((tag, idx) => (
                   <>
                     <ListItem key={idx}>
-                      <ListItemText primary={tag.name} secondary={tag.description} />
+                      <ListItemText
+                        primary={tag.name}
+                        secondary={tag.description}
+                        sx={{ pr: 3, overflow: 'hidden' }}
+                        secondaryTypographyProps={{
+                          variant: 'subtitle2',
+                          style: {
+                            whiteSpace: 'nowrap',
+                            overflow: 'hidden',
+                            textOverflow: 'ellipsis',
+                          },
+                        }}
+                      />
                       <ListItemSecondaryAction>
                         {onEditTag && (
                           <IconButton

From 5ace1716858e33116b807f676406ad28cf71fd1d Mon Sep 17 00:00:00 2001
From: zdomke <zdomke@slac.stanford.edu>
Date: Tue, 27 Jan 2026 11:23:48 -0800
Subject: [PATCH 3/4] STY: Use divider property rather than component

---
 src/pages/TagPage.tsx | 7 +++----
 1 file changed, 3 insertions(+), 4 deletions(-)

diff --git a/src/pages/TagPage.tsx b/src/pages/TagPage.tsx
index 3790d0d2a..afb086b05 100644
--- a/src/pages/TagPage.tsx
+++ b/src/pages/TagPage.tsx
@@ -24,6 +24,8 @@ import {
   ListItem,
   ListItemText,
   ListItemSecondaryAction,
+  ListItemAvatar,
+  ListItemButton,
 } from '@mui/material';
 import { Add, Delete, Edit, NoteOutlined } from '@mui/icons-material';
 import { TagGroup, Tag } from '../types';
@@ -337,7 +339,7 @@ export const TagPage: React.FC<TagPageProps> = ({
               <List sx={{ p: 0 }} subheader={<ListSubheader>Tags</ListSubheader>}>
                 {selectedGroup.tags.map((tag, idx) => (
                   <>
-                    <ListItem key={idx}>
+                    <ListItem key={idx} divider={idx < selectedGroup.tags.length - 1}>
                       <ListItemText
                         primary={tag.name}
                         secondary={tag.description}
@@ -380,9 +382,6 @@ export const TagPage: React.FC<TagPageProps> = ({
                         )}
                       </ListItemSecondaryAction>
                     </ListItem>
-                    {selectedGroup.tags.length - 1 != idx && (
-                      <Divider key={`divider-${idx}`} component="li" />
-                    )}
                   </>
                 ))}
               </List>

From 48f2623baa6c493b7622d25406710073ffac6e93 Mon Sep 17 00:00:00 2001
From: zdomke <zdomke@slac.stanford.edu>
Date: Tue, 27 Jan 2026 11:49:26 -0800
Subject: [PATCH 4/4] STY: Remove unused imports

---
 src/pages/TagPage.tsx | 3 ---
 1 file changed, 3 deletions(-)

diff --git a/src/pages/TagPage.tsx b/src/pages/TagPage.tsx
index afb086b05..10c2d59f0 100644
--- a/src/pages/TagPage.tsx
+++ b/src/pages/TagPage.tsx
@@ -19,13 +19,10 @@ import {
   TextField,
   Chip,
   ListSubheader,
-  Divider,
   List,
   ListItem,
   ListItemText,
   ListItemSecondaryAction,
-  ListItemAvatar,
-  ListItemButton,
 } from '@mui/material';
 import { Add, Delete, Edit, NoteOutlined } from '@mui/icons-material';
 import { TagGroup, Tag } from '../types';