@aryacode/dsh-aryacode-polish 0.14.0 → 0.16.0

package/CHANGELOG.md

@@ -1,5 +1,28 @@
 # Changelog
 
+## [0.16.0] - 2026-10-28
+
+### Added
+- **A glyph per workspace.** The workspace menu can put an emoji badge in front of a
+  workspace instead of the folder icon, and the choice is remembered with the colour.
+- **A note per workspace.** The note shows as the row tooltip and is edited from the same
+  menu; Enter saves, Escape cancels.
+
+
+## [0.15.2] - 2026-10-28
+
+### Added
+- **Density modes.** A control in the tree header switches between comfortable and
+  compact rows, and the choice is remembered (`aryacode-polish:density.v1`). Density
+  changes row height only — the text size stays readable.
+
+### Fixed
+- **Expand all now expands folders too.** The header button only flipped workspace rows, so a
+  folded folder kept its workspaces hidden while the button claimed everything was open.
+- **Archived sessions no longer sit in their workspace.** The tree now reads
+  `archivedSessionIds` (it never did) and shows those sessions in a collapsed
+  **Archived** section at the bottom, each one restorable from its own menu.
+
 ## [0.14.0] - 2026-10-28
 
 ### Added

package/client/workspace.js

@@ -202,7 +202,7 @@ const WS_ROW = {
   gap: '6px',
   boxSizing: 'border-box',
   width: '100%',
-  height: '28px',
+  height: 'var(--polish-ws-row, 28px)',
   padding: '0 6px',
   border: 'none',
   borderRadius: 'var(--dsw-radius-sm, 6px)',
@@ -385,6 +385,116 @@ export function moveBefore(list, movingId, beforeId) {
 const LOOK_KEY = 'aryacode-polish:workspace-appearance.v1'
 const ORDER_KEY = 'aryacode-polish:workspace-order.v1'
 const FOLD_KEY = 'aryacode-polish:folded.v1'
+const DENSITY_KEY = 'aryacode-polish:density.v1'
+
+export const DENSITIES = ['comfortable', 'compact']
+
+/** Row height per density: the tree fits more rows without shrinking the text. */
+export const DENSITY_METRICS = {
+  comfortable: { row: '28px' },
+  compact: { row: '22px' },
+}
+
+export function densityOf(value) {
+  return value === 'compact' ? 'compact' : 'comfortable'
+}
+
+export function readDensity(storage) {
+  try {
+    const store = storage || (typeof localStorage === 'undefined' ? undefined : localStorage)
+    if (!store) return 'comfortable'
+    return densityOf(store.getItem(DENSITY_KEY))
+  } catch {
+    return 'comfortable'
+  }
+}
+
+export function writeDensity(value, storage) {
+  try {
+    const store = storage || (typeof localStorage === 'undefined' ? undefined : localStorage)
+    if (!store) return
+    store.setItem(DENSITY_KEY, densityOf(value))
+  } catch {
+    /* remembering this is a nicety, not a requirement */
+  }
+}
+
+/**
+ * Split the flat session list into the rows a workspace shows and the ones it has
+ * archived. The shipped browser hides archived sessions; here they keep a section of
+ * their own at the bottom instead of disappearing without a trace.
+ */
+export function splitArchived(sessions, archivedIds) {
+  const archive = archivedIds instanceof Set ? archivedIds : new Set(archivedIds || [])
+  const active = []
+  const archived = []
+  for (const session of Array.isArray(sessions) ? sessions : []) {
+    if (archive.has(session.id)) archived.push(session)
+    else active.push(session)
+  }
+  return { active, archived }
+}
+
+const WS_GLYPH_GRID = {
+  display: 'grid',
+  gridTemplateColumns: 'repeat(6, 26px)',
+  gap: '2px',
+  padding: '2px',
+}
+
+const WS_GLYPH_BUTTON = {
+  width: '26px',
+  height: '26px',
+  display: 'inline-flex',
+  alignItems: 'center',
+  justifyContent: 'center',
+  padding: 0,
+  border: 'none',
+  borderRadius: 'var(--dsw-radius-sm, 6px)',
+  background: 'transparent',
+  fontSize: '15px',
+  lineHeight: 1,
+  cursor: 'pointer',
+}
+
+const WS_NOTE_INPUT = {
+  width: '220px',
+  boxSizing: 'border-box',
+  padding: '5px 8px',
+  border: '0.5px solid var(--dsw-alias-border-l2, rgba(0, 0, 0, 0.12))',
+  borderRadius: 'var(--dsw-radius-sm, 6px)',
+  background: 'transparent',
+  color: 'inherit',
+  font: 'inherit',
+  outline: 'none',
+}
+
+const WS_MENU_HINT = {
+  padding: '4px 8px 2px',
+  fontSize: 'calc(var(--dsh-content-font-size-secondary, 13px) - 2px)',
+  color: 'var(--dsw-alias-label-quaternary, #8a8a8a)',
+}
+
+const WS_GLYPH = {
+  flex: 'none',
+  width: '16px',
+  textAlign: 'center',
+  fontSize: '13px',
+  lineHeight: 1,
+}
+
+const WS_SECTION = {
+  display: 'flex',
+  alignItems: 'center',
+  gap: '5px',
+  padding: '8px 6px 2px',
+  textTransform: 'uppercase',
+  letterSpacing: '0.04em',
+  color: 'var(--dsw-alias-label-quaternary, #8a8a8a)',
+  fontSize: 'calc(' + 'var(--dsh-content-font-size-secondary, 13px)' + ' - 3px)',
+  cursor: 'pointer',
+  userSelect: 'none',
+}
 
 /** Which workspaces and folders are folded, kept so a restart looks like yesterday. */
 export function readFolded(storage) {
@@ -583,19 +693,29 @@ export const TONE_COLOR = {
   violet: '#7a5cc4',
 }
 
+/** Glyphs a workspace can wear instead of the folder icon. */
+export const GLYPHS = ['📁', '🚀', '🧪', '🐍', '⚙️', '📦', '🧭', '✨', '🧠', '🗂️']
+
 export function appearanceOf(map, workspaceId) {
   const entry = (map && map[workspaceId]) || {}
   return {
     tone: TONE_COLOR[entry.tone] ? entry.tone : undefined,
     strong: entry.strong === true,
+    glyph: typeof entry.glyph === 'string' && entry.glyph.length > 0 && entry.glyph.length <= 4 ? entry.glyph : undefined,
+    note: typeof entry.note === 'string' && entry.note.length > 0 ? entry.note : undefined,
   }
 }
 
 export function withAppearance(map, workspaceId, patch) {
   const next = Object.assign({}, map || {})
   const merged = Object.assign({}, appearanceOf(next, workspaceId), patch || {})
-  if (!merged.tone && merged.strong !== true) delete next[workspaceId]
-  else next[workspaceId] = { tone: merged.tone, strong: merged.strong === true }
+  const entry = {}
+  if (merged.tone) entry.tone = merged.tone
+  if (merged.strong === true) entry.strong = true
+  if (merged.glyph) entry.glyph = merged.glyph
+  if (merged.note) entry.note = merged.note
+  if (Object.keys(entry).length === 0) delete next[workspaceId]
+  else next[workspaceId] = entry
   return next
 }
 
@@ -712,9 +832,12 @@ export function BetterWorkspace(props) {
   const [drag, setDrag] = React.useState(null)
   const [dropping, setDropping] = React.useState(null)
   const [look, setLook] = React.useState(() => readAppearance())
+  const [noteDraft, setNoteDraft] = React.useState('')
   const folded = React.useMemo(() => readFolded(), [])
   const [folders, setFolders] = React.useState(folded.folders)
   const [switcher, setSwitcher] = React.useState(null)
+  const [density, setDensity] = React.useState(() => readDensity())
+  const [archiveOpen, setArchiveOpen] = React.useState(false)
   React.useEffect(() => { writeFolded({ workspaces: expanded, folders }) }, [expanded, folders])
   const [renaming, setRenaming] = React.useState(null)
   const commitRename = async () => {
@@ -750,7 +873,11 @@ export function BetterWorkspace(props) {
     () => new Set((workspaceState && workspaceState.pinnedSessionIds) || []),
     [workspaceState],
   )
-  const allRows = workspaceRows(workspaceList, sessionList)
+  const metrics = DENSITY_METRICS[densityOf(density)]
+  const archiveSet = new Set((workspaceState && workspaceState.archivedSessionIds) || [])
+  const split = splitArchived(sessionList, archiveSet)
+  const allRows = workspaceRows(workspaceList, split.active)
+  const archivedSessions = split.archived
   const rows = filterTree(allRows, query, pinned)
   const folderOf = (workspace) => folderKey(workspace)
   const visibleRows = rows.filter((group) => {
@@ -763,7 +890,12 @@ export function BetterWorkspace(props) {
   const entries = React.useMemo(() => rowMenuEntries(slots), [slots, workspaceList.length, sessionList.length])
   const totalCount = allRows.reduce((sum, row) => sum + row.sessions.length, 0)
   const shownCount = rows.reduce((sum, row) => sum + row.sessions.length, 0)
-  const allFolded = rows.length > 0 && rows.every(row => expanded[row.workspace.workspaceId] === false)
+  const folderNames = Array.from(new Set(rows.map(row => folderKey(row.workspace)).filter(Boolean)))
+  // One click should always do the useful thing: if anything is folded, the button
+  // expands everything (folders included); only when nothing is folded does it fold.
+  const anyFolded = rows.some(row => expanded[row.workspace.workspaceId] === false)
+    || folderNames.some(name => folders[name] === true)
+  const allFolded = rows.length > 0 && !anyFolded
 
   React.useEffect(() => {
     if (cursor >= walk.length) setCursor(walk.length - 1)
@@ -833,10 +965,17 @@ export function BetterWorkspace(props) {
     })
   }
   const foldAll = () => {
-    if (allFolded) { setExpanded({}); return }
+    if (anyFolded) {
+      setExpanded({})
+      setFolders({})
+      return
+    }
     const next = {}
     rows.forEach((row) => { next[row.workspace.workspaceId] = false })
+    const nextFolders = {}
+    folderNames.forEach((name) => { nextFolders[name] = true })
     setExpanded(next)
+    setFolders(nextFolders)
   }
 
   const reorderWorkspace = async (movingId, beforeId) => {
@@ -955,6 +1094,29 @@ export function BetterWorkspace(props) {
             }
           },
         }, 'Restore saved order'),
+      React.createElement('button', {
+        type: 'button',
+        'data-polish-glyph': 'open',
+        style: WS_MENU_ITEM,
+        onClick: () => {
+          const target = menu.workspace
+          const anchor = menu.anchor
+          closeMenu()
+          setMenu({ kind: 'glyph', workspace: target, anchor })
+        },
+      }, 'Glyph…'),
+      React.createElement('button', {
+        type: 'button',
+        'data-polish-note': 'open',
+        style: WS_MENU_ITEM,
+        onClick: () => {
+          const target = menu.workspace
+          const anchor = menu.anchor
+          closeMenu()
+          setNoteDraft(appearanceOf(look, target.workspaceId).note || '')
+          setMenu({ kind: 'note', workspace: target, anchor })
+        },
+      }, 'Note…'),
       React.createElement('button', {
         type: 'button',
         'data-polish-ws-appearance': 'open',
@@ -980,6 +1142,79 @@ export function BetterWorkspace(props) {
       }, armed && armed === menu.workspace.workspaceId ? 'Remove workspace?' : 'Remove workspace'))
     : null
 
+  const archivedMenu = menu && menu.kind === 'archived'
+    ? React.createElement(RowMenu, { anchor: menu.anchor, onClose: closeMenu },
+      React.createElement('button', {
+        type: 'button',
+        'data-polish-ws-unarchive': menu.row.id,
+        style: WS_MENU_ITEM,
+        onClick: async () => {
+          const row = menu.row
+          closeMenu()
+          try {
+            await services.unarchiveSession(row.id)
+            setNotice('Restored that session.')
+          } catch {
+            setNotice('Could not restore that session.')
+          }
+        },
+      }, 'Unarchive session'))
+    : null
+
+  const glyphMenu = menu && menu.kind === 'glyph'
+    ? React.createElement(RowMenu, { anchor: menu.anchor, onClose: closeMenu },
+      React.createElement('div', { style: WS_GLYPH_GRID },
+        GLYPHS.map((glyph) => React.createElement('button', {
+          key: 'glyph:' + glyph,
+          type: 'button',
+          'data-polish-glyph-pick': glyph,
+          title: 'Use ' + glyph,
+          style: Object.assign({}, WS_GLYPH_BUTTON, {
+            background: appearanceOf(look, menu.workspace.workspaceId).glyph === glyph
+              ? 'var(--dsw-alias-interactive-bg-hover, rgba(0, 0, 0, 0.06))'
+              : undefined,
+          }),
+          onClick: () => {
+            const target = menu.workspace
+            closeMenu()
+            paintLook(target.workspaceId, { glyph })
+          },
+        }, glyph)),
+        React.createElement('button', {
+          key: 'glyph:none',
+          type: 'button',
+          'data-polish-glyph-pick': 'none',
+          style: WS_GLYPH_BUTTON,
+          onClick: () => {
+            const target = menu.workspace
+            closeMenu()
+            paintLook(target.workspaceId, { glyph: '' })
+          },
+        }, '⌫')))
+    : null
+
+  const noteMenu = menu && menu.kind === 'note'
+    ? React.createElement(RowMenu, { anchor: menu.anchor, onClose: closeMenu },
+      React.createElement('input', {
+        'data-polish-note-input': 'true',
+        type: 'text',
+        value: noteDraft,
+        placeholder: 'A note for this workspace',
+        autoFocus: true,
+        style: WS_NOTE_INPUT,
+        onChange: (event) => setNoteDraft(event.target.value),
+        onKeyDown: (event) => {
+          if (event.key === 'Escape') { event.stopPropagation(); closeMenu(); return }
+          if (event.key !== 'Enter') return
+          const target = menu.workspace
+          const value = noteDraft.trim()
+          closeMenu()
+          paintLook(target.workspaceId, { note: value })
+        },
+      }),
+      React.createElement('div', { style: WS_MENU_HINT }, 'Enter saves, Escape cancels'))
+    : null
+
   const paintMenu = menu && menu.kind === 'paint'
     ? (() => {
       const workspace = menu.workspace
@@ -1093,6 +1328,19 @@ export function BetterWorkspace(props) {
       style: WS_ADD,
       onClick: foldAll,
     }, allFolded ? '⌄' : '⌃'),
+    React.createElement('button', {
+      key: 'density',
+      type: 'button',
+      'data-polish-ws-density': densityOf(density),
+      title: densityOf(density) === 'compact' ? 'Use comfortable rows' : 'Use compact rows',
+      'aria-label': densityOf(density) === 'compact' ? 'Use comfortable rows' : 'Use compact rows',
+      style: WS_ADD,
+      onClick: () => {
+        const next = densityOf(density) === 'compact' ? 'comfortable' : 'compact'
+        setDensity(next)
+        writeDensity(next)
+      },
+    }, densityOf(density) === 'compact' ? '≡' : '≣'),
     React.createElement('button', {
       key: 'add',
       type: 'button',
@@ -1263,6 +1511,7 @@ export function BetterWorkspace(props) {
       }),
       onClick: () => toggleWorkspace(workspace.workspaceId),
       onContextMenu: (event) => openWorkspaceMenu(event, workspace),
+      title: looks.note || undefined,
       onMouseEnter: () => setHover('workspace:' + workspace.workspaceId),
       onMouseLeave: () => setHover(null),
       onDragStart: () => setDrag({ kind: 'workspace', id: workspace.workspaceId }),
@@ -1275,7 +1524,9 @@ export function BetterWorkspace(props) {
       onDrop: (event) => { event.preventDefault(); dropOnWorkspace(workspace.workspaceId) },
     },
     React.createElement(CaretGlyph, { open }),
-    React.createElement(FolderGlyph),
+    looks.glyph
+      ? React.createElement('span', { 'data-polish-ws-glyph': looks.glyph, style: WS_GLYPH }, looks.glyph)
+      : React.createElement(FolderGlyph),
     looks.tone
       ? React.createElement('span', { style: Object.assign({}, WS_TONE, { background: TONE_COLOR[looks.tone] }) })
       : null,
@@ -1301,6 +1552,36 @@ export function BetterWorkspace(props) {
     }
   })
 
+  if (archivedSessions.length > 0) {
+    children.push(React.createElement('div', {
+      key: 'archived-head',
+      'data-polish-ws-archived': 'head',
+      style: WS_SECTION,
+      onClick: () => setArchiveOpen((open) => !open),
+    },
+    React.createElement('span', { 'aria-hidden': 'true' }, archiveOpen ? '⌄' : '›'),
+    React.createElement('span', { style: WS_TITLE }, 'Archived'),
+    React.createElement('span', { style: WS_COUNT }, String(archivedSessions.length))))
+
+    if (archiveOpen) {
+      for (const row of archivedSessions) {
+        children.push(React.createElement('div', {
+          key: 'archived:' + row.id,
+          'data-polish-ws-archived-row': row.id,
+          title: 'Archived session',
+          style: Object.assign({}, WS_ROW, { opacity: 0.7, fontStyle: 'italic' }),
+          onClick: () => services.openSession(row.id),
+          onContextMenu: (event) => {
+            event.preventDefault()
+            event.stopPropagation()
+            setMenu({ kind: 'archived', row, anchor: { top: event.clientY, left: event.clientX } })
+          },
+        },
+        React.createElement('span', { style: WS_TITLE }, row.displayTitle || row.id)))
+      }
+    }
+  }
+
   return React.createElement('div', {
     'data-polish-ws': 'tree',
     tabIndex: 0,
@@ -1317,6 +1598,7 @@ export function BetterWorkspace(props) {
       overflowX: 'hidden',
       padding: '2px 6px 12px',
       outline: 'none',
+      '--polish-ws-row': metrics.row,
     },
   },
   children,
@@ -1325,6 +1607,9 @@ export function BetterWorkspace(props) {
     : null,
   switcherCard,
   sessionMenu,
+  glyphMenu,
+  noteMenu,
+  archivedMenu,
   paintMenu,
   workspaceMenu)
 }
@@ -1451,6 +1736,7 @@ export function installWorkspaceSeat(ctx, configForms, extras = {}) {
             reorderSession: (workspaceId, movingId, beforeId) => seated.workspaces.insertSessionBefore(workspaceId, movingId, beforeId),
             removeWorkspace: (id) => seated.workspaces.delete(id),
             renameWorkspace: (id, title) => seated.workspaces.rename(id, title),
+            unarchiveSession: (id) => seated.workspaces.unarchiveSession(id),
             openFolder: async (path) => {
               const answer = await seated.remote.session.openWorkspacePath({ path })
               if (answer && answer.ok === false) throw new Error('cannot open the folder')

package/docs/better-workspace.md

@@ -152,3 +152,37 @@ panel's stacking context can clip it.
 like the way out. Verified across a real restart: folding `WORK` left
 `{"workspaces":{},"folders":{"Work":true}}` in storage and the folder still read `› WORK 2`
 with its workspace hidden.
+
+## Density
+
+The header carries a density control that flips between comfortable (28 px rows) and
+compact (22 px rows), remembered under `aryacode-polish:density.v1`. Density changes row
+height only: the text keeps its size, so a compact tree is still readable on a laptop.
+The row height travels through the CSS variable `--polish-ws-row`, which the tree element
+sets from `DENSITY_METRICS`; nothing else in the row styling depends on the mode.
+
+## Archived sessions
+
+Archiving a session removes it from its workspace — that is what the Host means by
+archived, and the shipped browser simply stops rendering it. Here those sessions keep a
+collapsed **Archived** section at the bottom of the tree instead, dimmed and italic, with
+their count on the header. Clicking one opens it; right-clicking offers **Unarchive
+session**, which goes through `workspaces.unarchiveSession`. This also fixed a real gap:
+before this, `workspaceRows` never consulted `archivedSessionIds`, so archived sessions
+were being rendered inline in their workspace as if they were live.
+
+## Folding everything
+
+The header's fold control expands when anything is folded (folders included) and folds
+only when nothing is. An earlier version only looked at workspace rows, so a folded
+folder left the button saying "Expand all" while its workspaces stayed hidden.
+
+## Glyphs and notes
+
+A workspace can wear an emoji badge instead of the folder icon (**Glyph…** in its menu, ten
+badges plus a clear button) and carry a short note (**Note…**, Enter saves, Escape cancels).
+Both live in the same appearance record as the colour — one localStorage key, one shape —
+and the note surfaces as the row's tooltip, so it costs no vertical space in the tree.
+
+Glyph validation is deliberately narrow (one to four characters): the field is a badge in a
+16 px slot, not a place to paste a sentence.

package/lib/client.js

@@ -53,7 +53,7 @@ window.__ModuleLoader__.load({
     ]
     const ROW_ID = "polish"
     const ROW_KEY = "@aryacode/dsh-aryacode-polish" + '#' + ROW_ID
-    const CLIENT_VERSION = "0.14.0"
+    const CLIENT_VERSION = "0.16.0"
 
 /* html2canvas 1.4.1 — MIT, vendored from vendor/html2canvas.min.js.
  * A UMD build, so it assigns itself to globalThis; face.js reads it lazily. */
@@ -403,7 +403,7 @@ window.__ModuleLoader__.load({
       gap: '6px',
       boxSizing: 'border-box',
       width: '100%',
-      height: '28px',
+      height: 'var(--polish-ws-row, 28px)',
       padding: '0 6px',
       border: 'none',
       borderRadius: 'var(--dsw-radius-sm, 6px)',
@@ -586,6 +586,116 @@ window.__ModuleLoader__.load({
     const LOOK_KEY = 'aryacode-polish:workspace-appearance.v1'
     const ORDER_KEY = 'aryacode-polish:workspace-order.v1'
     const FOLD_KEY = 'aryacode-polish:folded.v1'
+    const DENSITY_KEY = 'aryacode-polish:density.v1'
+
+    const DENSITIES = ['comfortable', 'compact']
+
+    /** Row height per density: the tree fits more rows without shrinking the text. */
+    const DENSITY_METRICS = {
+      comfortable: { row: '28px' },
+      compact: { row: '22px' },
+    }
+
+    function densityOf(value) {
+      return value === 'compact' ? 'compact' : 'comfortable'
+    }
+
+    function readDensity(storage) {
+      try {
+        const store = storage || (typeof localStorage === 'undefined' ? undefined : localStorage)
+        if (!store) return 'comfortable'
+        return densityOf(store.getItem(DENSITY_KEY))
+      } catch {
+        return 'comfortable'
+      }
+    }
+
+    function writeDensity(value, storage) {
+      try {
+        const store = storage || (typeof localStorage === 'undefined' ? undefined : localStorage)
+        if (!store) return
+        store.setItem(DENSITY_KEY, densityOf(value))
+      } catch {
+        /* remembering this is a nicety, not a requirement */
+      }
+    }
+
+    /**
+     * Split the flat session list into the rows a workspace shows and the ones it has
+     * archived. The shipped browser hides archived sessions; here they keep a section of
+     * their own at the bottom instead of disappearing without a trace.
+     */
+    function splitArchived(sessions, archivedIds) {
+      const archive = archivedIds instanceof Set ? archivedIds : new Set(archivedIds || [])
+      const active = []
+      const archived = []
+      for (const session of Array.isArray(sessions) ? sessions : []) {
+        if (archive.has(session.id)) archived.push(session)
+        else active.push(session)
+      }
+      return { active, archived }
+    }
+
+    const WS_GLYPH_GRID = {
+      display: 'grid',
+      gridTemplateColumns: 'repeat(6, 26px)',
+      gap: '2px',
+      padding: '2px',
+    }
+
+    const WS_GLYPH_BUTTON = {
+      width: '26px',
+      height: '26px',
+      display: 'inline-flex',
+      alignItems: 'center',
+      justifyContent: 'center',
+      padding: 0,
+      border: 'none',
+      borderRadius: 'var(--dsw-radius-sm, 6px)',
+      background: 'transparent',
+      fontSize: '15px',
+      lineHeight: 1,
+      cursor: 'pointer',
+    }
+
+    const WS_NOTE_INPUT = {
+      width: '220px',
+      boxSizing: 'border-box',
+      padding: '5px 8px',
+      border: '0.5px solid var(--dsw-alias-border-l2, rgba(0, 0, 0, 0.12))',
+      borderRadius: 'var(--dsw-radius-sm, 6px)',
+      background: 'transparent',
+      color: 'inherit',
+      font: 'inherit',
+      outline: 'none',
+    }
+
+    const WS_MENU_HINT = {
+      padding: '4px 8px 2px',
+      fontSize: 'calc(var(--dsh-content-font-size-secondary, 13px) - 2px)',
+      color: 'var(--dsw-alias-label-quaternary, #8a8a8a)',
+    }
+
+    const WS_GLYPH = {
+      flex: 'none',
+      width: '16px',
+      textAlign: 'center',
+      fontSize: '13px',
+      lineHeight: 1,
+    }
+
+    const WS_SECTION = {
+      display: 'flex',
+      alignItems: 'center',
+      gap: '5px',
+      padding: '8px 6px 2px',
+      textTransform: 'uppercase',
+      letterSpacing: '0.04em',
+      color: 'var(--dsw-alias-label-quaternary, #8a8a8a)',
+      fontSize: 'calc(' + 'var(--dsh-content-font-size-secondary, 13px)' + ' - 3px)',
+      cursor: 'pointer',
+      userSelect: 'none',
+    }
 
     /** Which workspaces and folders are folded, kept so a restart looks like yesterday. */
     function readFolded(storage) {
@@ -784,19 +894,29 @@ window.__ModuleLoader__.load({
       violet: '#7a5cc4',
     }
 
+    /** Glyphs a workspace can wear instead of the folder icon. */
+    const GLYPHS = ['📁', '🚀', '🧪', '🐍', '⚙️', '📦', '🧭', '✨', '🧠', '🗂️']
+
     function appearanceOf(map, workspaceId) {
       const entry = (map && map[workspaceId]) || {}
       return {
         tone: TONE_COLOR[entry.tone] ? entry.tone : undefined,
         strong: entry.strong === true,
+        glyph: typeof entry.glyph === 'string' && entry.glyph.length > 0 && entry.glyph.length <= 4 ? entry.glyph : undefined,
+        note: typeof entry.note === 'string' && entry.note.length > 0 ? entry.note : undefined,
       }
     }
 
     function withAppearance(map, workspaceId, patch) {
       const next = Object.assign({}, map || {})
       const merged = Object.assign({}, appearanceOf(next, workspaceId), patch || {})
-      if (!merged.tone && merged.strong !== true) delete next[workspaceId]
-      else next[workspaceId] = { tone: merged.tone, strong: merged.strong === true }
+      const entry = {}
+      if (merged.tone) entry.tone = merged.tone
+      if (merged.strong === true) entry.strong = true
+      if (merged.glyph) entry.glyph = merged.glyph
+      if (merged.note) entry.note = merged.note
+      if (Object.keys(entry).length === 0) delete next[workspaceId]
+      else next[workspaceId] = entry
       return next
     }
 
@@ -913,9 +1033,12 @@ window.__ModuleLoader__.load({
       const [drag, setDrag] = React.useState(null)
       const [dropping, setDropping] = React.useState(null)
       const [look, setLook] = React.useState(() => readAppearance())
+      const [noteDraft, setNoteDraft] = React.useState('')
       const folded = React.useMemo(() => readFolded(), [])
       const [folders, setFolders] = React.useState(folded.folders)
       const [switcher, setSwitcher] = React.useState(null)
+      const [density, setDensity] = React.useState(() => readDensity())
+      const [archiveOpen, setArchiveOpen] = React.useState(false)
       React.useEffect(() => { writeFolded({ workspaces: expanded, folders }) }, [expanded, folders])
       const [renaming, setRenaming] = React.useState(null)
       const commitRename = async () => {
@@ -951,7 +1074,11 @@ window.__ModuleLoader__.load({
         () => new Set((workspaceState && workspaceState.pinnedSessionIds) || []),
         [workspaceState],
       )
-      const allRows = workspaceRows(workspaceList, sessionList)
+      const metrics = DENSITY_METRICS[densityOf(density)]
+      const archiveSet = new Set((workspaceState && workspaceState.archivedSessionIds) || [])
+      const split = splitArchived(sessionList, archiveSet)
+      const allRows = workspaceRows(workspaceList, split.active)
+      const archivedSessions = split.archived
       const rows = filterTree(allRows, query, pinned)
       const folderOf = (workspace) => folderKey(workspace)
       const visibleRows = rows.filter((group) => {
@@ -964,7 +1091,12 @@ window.__ModuleLoader__.load({
       const entries = React.useMemo(() => rowMenuEntries(slots), [slots, workspaceList.length, sessionList.length])
       const totalCount = allRows.reduce((sum, row) => sum + row.sessions.length, 0)
       const shownCount = rows.reduce((sum, row) => sum + row.sessions.length, 0)
-      const allFolded = rows.length > 0 && rows.every(row => expanded[row.workspace.workspaceId] === false)
+      const folderNames = Array.from(new Set(rows.map(row => folderKey(row.workspace)).filter(Boolean)))
+      // One click should always do the useful thing: if anything is folded, the button
+      // expands everything (folders included); only when nothing is folded does it fold.
+      const anyFolded = rows.some(row => expanded[row.workspace.workspaceId] === false)
+        || folderNames.some(name => folders[name] === true)
+      const allFolded = rows.length > 0 && !anyFolded
 
       React.useEffect(() => {
         if (cursor >= walk.length) setCursor(walk.length - 1)
@@ -1034,10 +1166,17 @@ window.__ModuleLoader__.load({
         })
       }
       const foldAll = () => {
-        if (allFolded) { setExpanded({}); return }
+        if (anyFolded) {
+          setExpanded({})
+          setFolders({})
+          return
+        }
         const next = {}
         rows.forEach((row) => { next[row.workspace.workspaceId] = false })
+        const nextFolders = {}
+        folderNames.forEach((name) => { nextFolders[name] = true })
         setExpanded(next)
+        setFolders(nextFolders)
       }
 
       const reorderWorkspace = async (movingId, beforeId) => {
@@ -1156,6 +1295,29 @@ window.__ModuleLoader__.load({
                 }
               },
             }, 'Restore saved order'),
+          React.createElement('button', {
+            type: 'button',
+            'data-polish-glyph': 'open',
+            style: WS_MENU_ITEM,
+            onClick: () => {
+              const target = menu.workspace
+              const anchor = menu.anchor
+              closeMenu()
+              setMenu({ kind: 'glyph', workspace: target, anchor })
+            },
+          }, 'Glyph…'),
+          React.createElement('button', {
+            type: 'button',
+            'data-polish-note': 'open',
+            style: WS_MENU_ITEM,
+            onClick: () => {
+              const target = menu.workspace
+              const anchor = menu.anchor
+              closeMenu()
+              setNoteDraft(appearanceOf(look, target.workspaceId).note || '')
+              setMenu({ kind: 'note', workspace: target, anchor })
+            },
+          }, 'Note…'),
           React.createElement('button', {
             type: 'button',
             'data-polish-ws-appearance': 'open',
@@ -1181,6 +1343,79 @@ window.__ModuleLoader__.load({
           }, armed && armed === menu.workspace.workspaceId ? 'Remove workspace?' : 'Remove workspace'))
         : null
 
+      const archivedMenu = menu && menu.kind === 'archived'
+        ? React.createElement(RowMenu, { anchor: menu.anchor, onClose: closeMenu },
+          React.createElement('button', {
+            type: 'button',
+            'data-polish-ws-unarchive': menu.row.id,
+            style: WS_MENU_ITEM,
+            onClick: async () => {
+              const row = menu.row
+              closeMenu()
+              try {
+                await services.unarchiveSession(row.id)
+                setNotice('Restored that session.')
+              } catch {
+                setNotice('Could not restore that session.')
+              }
+            },
+          }, 'Unarchive session'))
+        : null
+
+      const glyphMenu = menu && menu.kind === 'glyph'
+        ? React.createElement(RowMenu, { anchor: menu.anchor, onClose: closeMenu },
+          React.createElement('div', { style: WS_GLYPH_GRID },
+            GLYPHS.map((glyph) => React.createElement('button', {
+              key: 'glyph:' + glyph,
+              type: 'button',
+              'data-polish-glyph-pick': glyph,
+              title: 'Use ' + glyph,
+              style: Object.assign({}, WS_GLYPH_BUTTON, {
+                background: appearanceOf(look, menu.workspace.workspaceId).glyph === glyph
+                  ? 'var(--dsw-alias-interactive-bg-hover, rgba(0, 0, 0, 0.06))'
+                  : undefined,
+              }),
+              onClick: () => {
+                const target = menu.workspace
+                closeMenu()
+                paintLook(target.workspaceId, { glyph })
+              },
+            }, glyph)),
+            React.createElement('button', {
+              key: 'glyph:none',
+              type: 'button',
+              'data-polish-glyph-pick': 'none',
+              style: WS_GLYPH_BUTTON,
+              onClick: () => {
+                const target = menu.workspace
+                closeMenu()
+                paintLook(target.workspaceId, { glyph: '' })
+              },
+            }, '⌫')))
+        : null
+
+      const noteMenu = menu && menu.kind === 'note'
+        ? React.createElement(RowMenu, { anchor: menu.anchor, onClose: closeMenu },
+          React.createElement('input', {
+            'data-polish-note-input': 'true',
+            type: 'text',
+            value: noteDraft,
+            placeholder: 'A note for this workspace',
+            autoFocus: true,
+            style: WS_NOTE_INPUT,
+            onChange: (event) => setNoteDraft(event.target.value),
+            onKeyDown: (event) => {
+              if (event.key === 'Escape') { event.stopPropagation(); closeMenu(); return }
+              if (event.key !== 'Enter') return
+              const target = menu.workspace
+              const value = noteDraft.trim()
+              closeMenu()
+              paintLook(target.workspaceId, { note: value })
+            },
+          }),
+          React.createElement('div', { style: WS_MENU_HINT }, 'Enter saves, Escape cancels'))
+        : null
+
       const paintMenu = menu && menu.kind === 'paint'
         ? (() => {
           const workspace = menu.workspace
@@ -1294,6 +1529,19 @@ window.__ModuleLoader__.load({
           style: WS_ADD,
           onClick: foldAll,
         }, allFolded ? '⌄' : '⌃'),
+        React.createElement('button', {
+          key: 'density',
+          type: 'button',
+          'data-polish-ws-density': densityOf(density),
+          title: densityOf(density) === 'compact' ? 'Use comfortable rows' : 'Use compact rows',
+          'aria-label': densityOf(density) === 'compact' ? 'Use comfortable rows' : 'Use compact rows',
+          style: WS_ADD,
+          onClick: () => {
+            const next = densityOf(density) === 'compact' ? 'comfortable' : 'compact'
+            setDensity(next)
+            writeDensity(next)
+          },
+        }, densityOf(density) === 'compact' ? '≡' : '≣'),
         React.createElement('button', {
           key: 'add',
           type: 'button',
@@ -1464,6 +1712,7 @@ window.__ModuleLoader__.load({
           }),
           onClick: () => toggleWorkspace(workspace.workspaceId),
           onContextMenu: (event) => openWorkspaceMenu(event, workspace),
+          title: looks.note || undefined,
           onMouseEnter: () => setHover('workspace:' + workspace.workspaceId),
           onMouseLeave: () => setHover(null),
           onDragStart: () => setDrag({ kind: 'workspace', id: workspace.workspaceId }),
@@ -1476,7 +1725,9 @@ window.__ModuleLoader__.load({
           onDrop: (event) => { event.preventDefault(); dropOnWorkspace(workspace.workspaceId) },
         },
         React.createElement(CaretGlyph, { open }),
-        React.createElement(FolderGlyph),
+        looks.glyph
+          ? React.createElement('span', { 'data-polish-ws-glyph': looks.glyph, style: WS_GLYPH }, looks.glyph)
+          : React.createElement(FolderGlyph),
         looks.tone
           ? React.createElement('span', { style: Object.assign({}, WS_TONE, { background: TONE_COLOR[looks.tone] }) })
           : null,
@@ -1502,6 +1753,36 @@ window.__ModuleLoader__.load({
         }
       })
 
+      if (archivedSessions.length > 0) {
+        children.push(React.createElement('div', {
+          key: 'archived-head',
+          'data-polish-ws-archived': 'head',
+          style: WS_SECTION,
+          onClick: () => setArchiveOpen((open) => !open),
+        },
+        React.createElement('span', { 'aria-hidden': 'true' }, archiveOpen ? '⌄' : '›'),
+        React.createElement('span', { style: WS_TITLE }, 'Archived'),
+        React.createElement('span', { style: WS_COUNT }, String(archivedSessions.length))))
+
+        if (archiveOpen) {
+          for (const row of archivedSessions) {
+            children.push(React.createElement('div', {
+              key: 'archived:' + row.id,
+              'data-polish-ws-archived-row': row.id,
+              title: 'Archived session',
+              style: Object.assign({}, WS_ROW, { opacity: 0.7, fontStyle: 'italic' }),
+              onClick: () => services.openSession(row.id),
+              onContextMenu: (event) => {
+                event.preventDefault()
+                event.stopPropagation()
+                setMenu({ kind: 'archived', row, anchor: { top: event.clientY, left: event.clientX } })
+              },
+            },
+            React.createElement('span', { style: WS_TITLE }, row.displayTitle || row.id)))
+          }
+        }
+      }
+
       return React.createElement('div', {
         'data-polish-ws': 'tree',
         tabIndex: 0,
@@ -1518,6 +1799,7 @@ window.__ModuleLoader__.load({
           overflowX: 'hidden',
           padding: '2px 6px 12px',
           outline: 'none',
+          '--polish-ws-row': metrics.row,
         },
       },
       children,
@@ -1526,6 +1808,9 @@ window.__ModuleLoader__.load({
         : null,
       switcherCard,
       sessionMenu,
+      glyphMenu,
+      noteMenu,
+      archivedMenu,
       paintMenu,
       workspaceMenu)
     }
@@ -1652,6 +1937,7 @@ window.__ModuleLoader__.load({
                 reorderSession: (workspaceId, movingId, beforeId) => seated.workspaces.insertSessionBefore(workspaceId, movingId, beforeId),
                 removeWorkspace: (id) => seated.workspaces.delete(id),
                 renameWorkspace: (id, title) => seated.workspaces.rename(id, title),
+                unarchiveSession: (id) => seated.workspaces.unarchiveSession(id),
                 openFolder: async (path) => {
                   const answer = await seated.remote.session.openWorkspacePath({ path })
                   if (answer && answer.ok === false) throw new Error('cannot open the folder')

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@aryacode/dsh-aryacode-polish",
-  "version": "0.14.0",
+  "version": "0.16.0",
   "description": "AryaCode Polish: one install for the small things that make AryaCode feel finished. One Plugins row, one switch per quality-of-life feature.",
   "keywords": [
     "dsh",