dsh-sidebar-suite 0.2.7 → 0.2.9

package/lib/client.js

@@ -179,6 +179,25 @@ window.__ModuleLoader__.load({
       'settings.support': '喜欢这个插件？请作者喝杯咖啡 · Enjoy it? Buy me a coffee',
       'settings.supportHint': '完全自愿，无任何回报承诺。用微信扫一扫即可；「设置 → 支持贡献者」里也登记了同一个码。 / Purely voluntary, no rewards promised. Scan with WeChat Pay; the same QR is registered under Settings → Support contributors.',
       'settings.qrAlt': '微信支付收款码 / WeChat Pay QR',
+      // 0.2.8 — every remaining config key becomes a switch on this page.
+      'options.title': '侧栏与临时会话 · Sidebar & temp session options',
+      'options.help': '每一项都会写入 temp-session-config.txt。也可以直接用记事本改那个文件，保存后约 3 秒自动生效，不用重启 DSH；两边是同一个文件，不会打架。 / Every switch writes temp-session-config.txt. You can also edit that file in Notepad — saves apply in about 3 seconds, no restart. Both paths share one file so they never disagree.',
+      'options.showButton': '显示「临时」按钮 / Show the Temp button',
+      'options.inChatMode': 'CHAT 官网模式 / In CHAT mode',
+      'options.chatHide': '隐藏按钮 / Hide',
+      'options.chatShow': '照常显示 / Show',
+      'options.buttonStyle': '按钮摆法 / Button layout',
+      'options.stylePair': '并排 / Pair',
+      'options.styleOwn': '独占一行 / Own row',
+      'options.expandAll': '会话默认全展开 / Always expand sessions',
+      'options.expandHint': '关掉后恢复 DSH 原来的折叠行为；已经展开的列表要切换一次工作区才会收回去。 / Turning it off restores host folding; already-expanded groups collapse after you switch workspaces once.',
+      'options.maxKept': '最多保留 / Keep at most',
+      'options.maxKeptHint': '个临时会话（1–200） / temp sessions (1–200)',
+      'options.purge': '立即清理临时会话 / Clean up now',
+      'options.purging': '清理中… / Cleaning…',
+      'options.purged': '已清理 / Removed ',
+      'options.purgeFailed': '清理失败 / Cleanup failed: ',
+      'options.rev': '设置版本 / Settings rev',
       'feedback.title': '反馈 · Feedback',
       'feedback.help': '遇到问题，或者想要某个功能？写在下面，然后选一个入口。 / Hit a bug or want a feature? Write it below, then pick a channel.',
       'feedback.placeholder': '例如：点了「临时」之后，侧栏没有出现新会话…… / e.g. clicking Temp adds no session to the sidebar…',
@@ -288,6 +307,55 @@ window.__ModuleLoader__.load({
       'html[data-dsbs-rail="true"] [data-dsbs-temp-row]::after{display:none}',
       '[data-dsbs-temp-toast]{position:fixed;left:50%;bottom:28px;transform:translateX(-50%);z-index:9500;max-width:min(560px,calc(100vw - 40px));box-sizing:border-box;padding:9px 14px;border-radius:10px;background:var(--dsw-alias-bg-overlay,var(--dsw-alias-bg-base,#1f1f1f));color:var(--dsw-alias-label-primary,inherit);border:1px solid var(--dsw-alias-border-l2,rgba(127,127,127,.3));box-shadow:0 12px 34px rgba(0,0,0,.34);font:inherit;font-size:12px;line-height:1.6;word-break:break-word}',
       '[data-dsbs-temp-toast][data-dsbs-temp-toast-error="true"]{color:var(--dsw-alias-state-business-danger,#d9534f);border-color:rgba(217,83,79,.45)}',
+      // ---- sidebar polish (0.2.9) --------------------------------------
+      // The three layout modes are mutually exclusive, so they share one
+      // segmented pill; the buttons that belong to the chosen layout sit on
+      // the far side of a divider, which keeps "pick a layout" and "act on
+      // it" visually distinct in a 280px column.
+      //
+      // Glyphs are CSS masks, not <svg> children: makeButton() owns a plain
+      // text node that relabel() rewrites (an inline <svg> would be wiped),
+      // and the test stubs have no createElementNS. A mask also paints in
+      // currentColor, so the icons follow the host theme on their own.
+      '[data-dsbs-bar]{display:flex;align-items:center;gap:6px;min-height:30px;flex-wrap:nowrap}',
+      '[data-dsbs-seg]{display:inline-flex;align-items:center;gap:2px;padding:2px;border-radius:9px;flex:none;background:color-mix(in srgb,currentColor 11%,transparent)}',
+      '[data-dsbs-bar] button[data-dsbs-glyph]{position:relative;display:flex;align-items:center;justify-content:center;width:28px;height:26px;min-width:0;padding:0!important;border:0;border-radius:7px;font-size:0!important;line-height:0!important;background:transparent;color:inherit;cursor:pointer;transition:background-color .14s ease,opacity .14s ease}',
+      '[data-dsbs-bar] button[data-dsbs-glyph]:not([aria-pressed="true"]):hover{background:color-mix(in srgb,currentColor 12%,transparent)}',
+      '[data-dsbs-seg] button[aria-pressed="true"]{background:color-mix(in srgb,currentColor 20%,transparent);box-shadow:0 1px 2px rgba(0,0,0,.22)}',
+      '[data-dsbs-seg] button[aria-pressed="false"]{opacity:.70}',
+      '[data-dsbs-seg] button[aria-pressed="false"]:hover{opacity:.9;background:color-mix(in srgb,currentColor 9%,transparent)}',
+      '[data-dsbs-bar] button[data-dsbs-glyph]::before{content:"";position:absolute;inset:0;margin:auto;width:16px;height:16px;background:currentColor;opacity:.88;-webkit-mask-image:var(--dsbs-icon);-webkit-mask-size:16px 16px;-webkit-mask-position:center;-webkit-mask-repeat:no-repeat;mask-image:var(--dsbs-icon);mask-size:16px 16px;mask-position:center;mask-repeat:no-repeat}',
+      // a — one column of stacked rows
+      '[data-dsbs-bar] [data-dsbs-glyph="a"]{--dsbs-icon:url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 16 16%22 fill=%22none%22 stroke=%22%23000%22 stroke-width=%221.5%22 stroke-linecap=%22round%22 stroke-linejoin=%22round%22%3E%3Crect x=%222.5%22 y=%222.5%22 width=%2211%22 height=%2211%22 rx=%222.5%22/%3E%3Cpath d=%22M5.5 6.5h5M5.5 9.5h3%22/%3E%3C/svg%3E")}',
+      // b — one column split down the middle
+      '[data-dsbs-bar] [data-dsbs-glyph="b"]{--dsbs-icon:url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 16 16%22 fill=%22none%22 stroke=%22%23000%22 stroke-width=%221.5%22 stroke-linecap=%22round%22 stroke-linejoin=%22round%22%3E%3Crect x=%222.5%22 y=%222.5%22 width=%2211%22 height=%2211%22 rx=%222.5%22/%3E%3Cpath d=%22M8 3v10%22/%3E%3C/svg%3E")}',
+      // c — a panel floating above the column
+      '[data-dsbs-bar] [data-dsbs-glyph="c"]{--dsbs-icon:url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 16 16%22 fill=%22none%22 stroke=%22%23000%22 stroke-width=%221.5%22 stroke-linecap=%22round%22 stroke-linejoin=%22round%22%3E%3Crect x=%222.5%22 y=%226.5%22 width=%229%22 height=%227%22 rx=%221.8%22/%3E%3Cpath d=%22M7.2 6.5V4.4a1.6 1.6 0 011.6-1.6h3.1a1.6 1.6 0 011.6 1.6v3.9%22/%3E%3C/svg%3E")}',
+      // fold — collapse one list (single chevron)
+      '[data-dsbs-bar] [data-dsbs-glyph="fold"]{--dsbs-icon:url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 16 16%22 fill=%22none%22 stroke=%22%23000%22 stroke-width=%221.5%22 stroke-linecap=%22round%22 stroke-linejoin=%22round%22%3E%3Cpath d=%22M3 3.5h10M8 6v6M5.6 9.6L8 12l2.4-2.4%22/%3E%3C/svg%3E")}',
+      // fold all — two chevrons, so the two fold buttons never look alike
+      '[data-dsbs-bar] [data-dsbs-glyph="fold2"]{--dsbs-icon:url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 16 16%22 fill=%22none%22 stroke=%22%23000%22 stroke-width=%221.5%22 stroke-linecap=%22round%22 stroke-linejoin=%22round%22%3E%3Cpath d=%22M3 3h10M5.6 6.4L8 8.8l2.4-2.4M5.6 10.2L8 12.6l2.4-2.4%22/%3E%3C/svg%3E")}',
+      // swap — trade the two tabs
+      '[data-dsbs-bar] [data-dsbs-glyph="swap"]{--dsbs-icon:url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 16 16%22 fill=%22none%22 stroke=%22%23000%22 stroke-width=%221.5%22 stroke-linecap=%22round%22 stroke-linejoin=%22round%22%3E%3Cpath d=%22M2.5 5.5h9.5M9.5 3.2l2.5 2.3-2.5 2.3%22/%3E%3Cpath d=%22M13.5 10.5H4M6.5 8.2l-2.5 2.3 2.5 2.3%22/%3E%3C/svg%3E")}',
+      // pop — detach the panel
+      '[data-dsbs-bar] [data-dsbs-glyph="pop"]{--dsbs-icon:url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 16 16%22 fill=%22none%22 stroke=%22%23000%22 stroke-width=%221.5%22 stroke-linecap=%22round%22 stroke-linejoin=%22round%22%3E%3Crect x=%222.5%22 y=%222.5%22 width=%228%22 height=%228%22 rx=%221.8%22/%3E%3Cpath d=%22M9.5 13.5h3.5v-3.5M13 13l-4-4%22/%3E%3C/svg%3E")}',
+      // cycle — walk the three layouts in order
+      '[data-dsbs-bar] [data-dsbs-glyph="quick"]{--dsbs-icon:url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 16 16%22 fill=%22none%22 stroke=%22%23000%22 stroke-width=%221.5%22 stroke-linecap=%22round%22 stroke-linejoin=%22round%22%3E%3Cpath d=%22M13.4 7A5.5 5.5 0 004 4.2M2.6 9A5.5 5.5 0 0012 11.8%22/%3E%3Cpath d=%22M12.6 1.8v3h-3M3.4 14.2v-3h3%22/%3E%3C/svg%3E")}',
+      // The divider keeps the action buttons apart from the mode pill; it
+      // rides along to the right edge so the row never looks lopsided.
+      '[data-dsbs-bar]>span{margin-left:auto;margin-right:4px;height:16px;width:1px;opacity:.26;background:currentColor;flex:none}',
+      '[data-dsbs-bar]>span[hidden]{display:none!important}',
+      // Wide column: the action buttons win their words back (the mode pill
+      // stays iconic — its three options are read as one control). Only the
+      // direct children grow, so the pill is untouched.
+      'html:not([data-dsbs-narrow="true"]) [data-dsbs-bar]>button[data-dsbs-glyph]{width:auto!important;min-width:max-content!important;max-width:none!important;box-sizing:border-box;white-space:nowrap;padding:0 11px 0 31px!important;font-size:12px!important;line-height:1!important;justify-content:flex-start}',
+      'html:not([data-dsbs-narrow="true"]) [data-dsbs-bar]>button[data-dsbs-glyph]::before{inset:auto;left:9px;top:50%;margin:0;transform:translateY(-50%)}',
+      // Host session rows: a 2px accent rail on the active row, drawn with an
+      // inset shadow so no box changes size, plus a soft transition. Both are
+      // read-only decoration on the host's own markup.
+      '[data-row-key^="session:"]{transition:background-color .13s ease,box-shadow .13s ease,color .13s ease;font-variant-numeric:tabular-nums}',
+      '[data-row-key^="session:"][aria-selected="true"]{box-shadow:inset 2px 0 0 var(--dsw-alias-state-business-primary,var(--dsw-alias-label-primary,#4d6bfe))!important}',
+      'html[data-dsbs-rail="true"] [data-row-key^="session:"][aria-selected="true"]{box-shadow:none!important}',
     ].join('\n')
 
     function assign(target) {
@@ -498,6 +566,10 @@ window.__ModuleLoader__.load({
       var tempSlot = null // wrapper that keeps the root's top-level <button> count at one
       var tempNewChatHost = null
       var tempChatPolicy = 'hide' // TEMP_IN_CHAT_MODE in temp-session-config.txt
+      // 0.2.8 hot reload: these are re-applied whenever the config file changes.
+      var tempShowButton = true
+      var tempConfigRevision = null
+      var configPollPending = false
       var tempChatGuard = null
       var tempIds = [] // session ids the Host half will delete on quit
       var tempBusy = false
@@ -802,9 +874,23 @@ window.__ModuleLoader__.load({
         return slot
       }
 
+      // 0.2.8: the config can change while DSH is running, so visibility is
+      // re-applied on every paint instead of being a one-way boot-time hide.
+      function applyTempButtonVisibility() {
+        var hidden = !tempShowButton
+        if (tempButton) {
+          if (hidden) tempButton.setAttribute('hidden', '')
+          else tempButton.removeAttribute('hidden')
+        }
+        if (tempSlot) {
+          if (hidden) tempSlot.setAttribute('hidden', '')
+          else tempSlot.removeAttribute('hidden')
+        }
+      }
+
       function hideTempButton() {
-        if (tempButton) tempButton.setAttribute('hidden', '')
-        if (tempSlot) tempSlot.setAttribute('hidden', '')
+        tempShowButton = false
+        applyTempButtonVisibility()
       }
 
       function placeTempButton() {
@@ -837,6 +923,7 @@ window.__ModuleLoader__.load({
         if (tempButton.textContent !== label) tempButton.textContent = label
         var hint = t('temp.hint')
         if (tempButton.title !== hint) tempButton.title = hint
+        applyTempButtonVisibility()
         return true
       }
 
@@ -849,6 +936,26 @@ window.__ModuleLoader__.load({
         setFlag(html, 'data-dsbs-expand-all', expandAllKnown && expandAll)
       }
 
+      /** Apply a Host status payload to the running sidebar. No restart. */
+      function applyTempSettings(data) {
+        if (runtime.disposed) return
+        tempShowButton = !data || data.showButton !== false
+        applyTempButtonVisibility()
+        if (data && data.chatModePolicy) tempChatPolicy = String(data.chatModePolicy)
+        if (data && data.buttonStyle) setFlag(html, 'data-dsbs-temp-style', String(data.buttonStyle) === 'own')
+        // Older Host halves (<= 0.2.3) do not send this key; default to on.
+        expandAll = !data || data.expandAllSessions !== false
+        expandAllKnown = true
+        applyExpandFlag()
+        syncChatMode()
+        expandAllSessions()
+        scheduleSync()
+      }
+
+      function rememberConfigRevision(data) {
+        if (data && typeof data.configRevision === 'number') tempConfigRevision = data.configRevision
+      }
+
       /**
        * The host keeps five session rows per workspace and renders one overflow
        * button for the rest: <button data-row-key="overflow:<group>">.
@@ -930,16 +1037,9 @@ window.__ModuleLoader__.load({
           tempStatusPending = false
           tempStatusLoaded = true
           if (expandGateTimer) { clearTimeout(expandGateTimer); expandGateTimer = 0 }
-          if (data && data.showButton === false) hideTempButton()
-          if (data && data.chatModePolicy) tempChatPolicy = String(data.chatModePolicy)
-          if (data && data.buttonStyle) setFlag(html, 'data-dsbs-temp-style', String(data.buttonStyle) === 'own')
-          // Older Host halves (<= 0.2.3) do not send this key; default to on.
-          expandAll = !data || data.expandAllSessions !== false
-          expandAllKnown = true
-          applyExpandFlag()
-          syncChatMode()
+          rememberConfigRevision(data)
+          applyTempSettings(data)
           refreshTempIds()
-          scheduleSync()
         }).catch(function (error) {
           void error
           tempStatusPending = false
@@ -980,21 +1080,30 @@ window.__ModuleLoader__.load({
         tempChatGuard = setInterval(syncChatMode, 1500)
       }
 
-      // One row of plain text buttons, the shape the bar had in its first
-      // version: the filled button is the chosen layout, and everything after
-      // the divider names the action its click performs in that layout.
+      // 0.2.9: the three layouts are one segmented pill (they are mutually
+      // exclusive), and the actions that belong to the chosen layout sit after
+      // a divider. Glyphs are CSS pseudo elements, so makeButton() keeps owning
+      // the plain text node that relabel() rewrites.
       function buildBar() {
         var bar = document.createElement('div')
         bar.setAttribute('data-dsbs-bar', '')
         bar.setAttribute('role', 'toolbar')
 
+        var seg = document.createElement('div')
+        seg.setAttribute('data-dsbs-seg', '')
+        seg.setAttribute('role', 'group')
+        seg.setAttribute('aria-label', t('bar.label'))
+
         var i
         for (i = 0; i < MODES.length; i++) {
           var mode = MODES[i]
-          bar.appendChild(makeButton('mode-' + mode, 'mode.' + mode, 'mode.' + mode + '.hint', (function (value) {
+          var modeButton = makeButton('mode-' + mode, 'mode.' + mode, 'mode.' + mode + '.hint', (function (value) {
             return function () { setMode(value) }
-          })(mode)))
+          })(mode))
+          modeButton.setAttribute('data-dsbs-glyph', mode === 'a' ? 'a' : mode === 'b' ? 'b' : 'c')
+          seg.appendChild(modeButton)
         }
+        bar.appendChild(seg)
 
         var separator = makeSeparator()
         bar.appendChild(separator)
@@ -1013,6 +1122,14 @@ window.__ModuleLoader__.load({
           var index = MODES.indexOf(config.values.mode)
           setMode(MODES[(index + 1) % MODES.length])
         })
+        foldExt.setAttribute('data-dsbs-glyph', 'fold')
+        // Two fold buttons sit side by side in layout a, so they must not
+        // share a glyph — a single chevron vs. a double one is the only cue
+        // available once the labels collapse to icons.
+        foldWs.setAttribute('data-dsbs-glyph', 'fold2')
+        tabSwap.setAttribute('data-dsbs-glyph', 'swap')
+        pop.setAttribute('data-dsbs-glyph', 'pop')
+        quick.setAttribute('data-dsbs-glyph', 'quick')
         bar.appendChild(foldExt)
         bar.appendChild(foldWs)
         bar.appendChild(tabSwap)
@@ -1155,6 +1272,7 @@ window.__ModuleLoader__.load({
         if (fx.nav && !fx.nav.hasAttribute('data-dsbs-ext')) fx.nav.setAttribute('data-dsbs-ext', '')
         ensureBar(fx)
         placeTempButton()
+        applyTempButtonVisibility()
         loadTempStatus()
         // Bars left behind by an earlier client generation are dead weight and
         // read as a duplicated control; keep exactly one.
@@ -1584,6 +1702,10 @@ window.__ModuleLoader__.load({
           var saveState = ReactLib.useState('')
           var saveStatus = saveState[0]
           var setSaveStatus = saveState[1]
+          // '' | 'busy' | a result line for the manual cleanup button.
+          var purgeState = ReactLib.useState('')
+          var purgeStatus = purgeState[0]
+          var setPurgeStatus = purgeState[1]
 
           // ---- feedback -------------------------------------------------
           // A plugin bundle has no server to post to, and no mail client it can
@@ -1758,27 +1880,63 @@ window.__ModuleLoader__.load({
           }
 
           function adoptPolicy(data, fallbackTime) {
+            var kept = Number(data && data.maxKept)
             setPolicy({
               deleteOnExit: data.deleteOnExit !== false,
               scheduleDelete: data.scheduleDelete === true,
               scheduleTime: typeof data.scheduleTime === 'string' && data.scheduleTime
                 ? data.scheduleTime
                 : (fallbackTime || '03:00'),
+              // 0.2.8 — the remaining config keys, all editable on this page.
+              showButton: data.showButton !== false,
+              inChatMode: data.inChatMode === 'show' ? 'show' : 'hide',
+              buttonStyle: data.buttonStyle === 'own' ? 'own' : 'pair',
+              expandAllSessions: data.expandAllSessions !== false,
+              maxKept: kept > 0 ? Math.min(Math.round(kept), 200) : 20,
+              configRevision: typeof data.configRevision === 'number' ? data.configRevision : null,
+              configFile: typeof data.configFile === 'string' ? data.configFile : '',
             })
           }
 
           ReactLib.useEffect(function () {
             var stopped = false
-            tempCall('api/dsh-temp-session.config')
-              .then(function (data) {
-                if (stopped) return
-                if (!data || data.ok !== true) { setPolicy(false); return }
-                adoptPolicy(data)
-              })
-              .catch(function () {
-                if (!stopped) setPolicy(false)
-              })
-            return function () { stopped = true }
+            var loaded = false
+            var revision = null
+            function read(first) {
+              tempCall('api/dsh-temp-session.config')
+                .then(function (data) {
+                  if (stopped) return
+                  if (!data || data.ok !== true) {
+                    if (first) setPolicy(false)
+                    return
+                  }
+                  loaded = true
+                  var rev = typeof data.configRevision === 'number' ? data.configRevision : null
+                  // Only re-render on a real change. Re-rendering on every tick
+                  // would fight a user who is halfway through typing a time.
+                  if (first || rev === null || rev !== revision) {
+                    revision = rev
+                    adoptPolicy(data)
+                  }
+                })
+                .catch(function () {
+                  if (!stopped && first) setPolicy(false)
+                })
+            }
+            read(true)
+            // 0.2.8: a save in Notepad is picked up here within ~2.5 seconds.
+            var timer = null
+            if (typeof window.setInterval === 'function') {
+              timer = window.setInterval(function () {
+                if (stopped || !loaded) return
+                if (typeof document.hidden === 'boolean' && document.hidden) return
+                read(false)
+              }, 2500)
+            }
+            return function () {
+              stopped = true
+              if (timer !== null && typeof window.clearInterval === 'function') window.clearInterval(timer)
+            }
           }, [])
 
           function persist(patch) {
@@ -1804,6 +1962,20 @@ window.__ModuleLoader__.load({
               })
           }
 
+          function purgeNow() {
+            if (purgeStatus === 'busy') return
+            setPurgeStatus('busy')
+            tempCall('api/dsh-temp-session.purge', { method: 'POST' })
+              .then(function (data) {
+                if (!data || data.ok !== true) throw new Error((data && data.error) || 'purge failed')
+                var n = typeof data.removed === 'number' ? data.removed : 0
+                setPurgeStatus(t('options.purged') + n)
+              })
+              .catch(function (error) {
+                setPurgeStatus(t('options.purgeFailed') + String((error && error.message) || error))
+              })
+          }
+
           var available = !!configController()
           var policyReady = !!(policy && policy !== false)
           var dim = { fontSize: '11px', lineHeight: '16px', color: 'var(--dsw-alias-label-secondary,inherit)' }
@@ -1835,6 +2007,26 @@ window.__ModuleLoader__.load({
               extra || null
             )
           }
+          function optionRow(label, value, choices, onPick) {
+            return h('div', {
+              key: label,
+              style: { display: 'flex', alignItems: 'center', gap: '8px', flexWrap: 'wrap' }
+            },
+              h('span', { style: { fontSize: '12px', color: 'var(--dsw-alias-label-primary,inherit)' } }, label),
+              h('div', { style: { display: 'flex', gap: '4px' } },
+                choices.map(function (choice) {
+                  var active = value === choice.value
+                  return h('button', {
+                    key: choice.value, type: 'button',
+                    'aria-pressed': active ? 'true' : 'false',
+                    disabled: !policyReady,
+                    onClick: function () { onPick(choice.value) },
+                    style: assign({}, pillBase, { minWidth: '0' }, active ? pillOn : {})
+                  }, choice.label)
+                })
+              )
+            )
+          }
           var cardBase = {
             display: 'flex', flexDirection: 'column', alignItems: 'flex-start', gap: '5px',
             flex: '1 1 140px', minWidth: '140px', maxWidth: '230px', padding: '10px',
@@ -1875,6 +2067,60 @@ window.__ModuleLoader__.load({
               })
             ),
             available ? null : h('div', { style: { fontSize: '11px', color: 'var(--dsw-alias-label-secondary,inherit)' } }, t('settings.unavailable')),
+            h('div', { 'data-dsbs-options': ENTRY, style: {
+              display: 'flex', flexDirection: 'column', gap: '8px',
+              paddingTop: '12px', marginTop: '2px',
+              borderTop: '1px solid var(--dsw-alias-border-l1,rgba(127,127,127,.2))'
+            } },
+              h('div', { style: { fontSize: '13px', fontWeight: '600', color: 'var(--dsw-alias-label-primary,inherit)' } }, t('options.title')),
+              h('div', { style: dim }, t('options.help')),
+              policy === null
+                ? h('div', { style: dim }, t('policy.loading'))
+                : policy === false
+                  ? h('div', { style: dim }, t('policy.unavailable'))
+                  : h('div', { style: { display: 'flex', flexDirection: 'column', gap: '8px' } },
+                    policyRow(t('options.showButton'), policy.showButton === true, function (next) {
+                      persist({ showButton: next })
+                    }),
+                    optionRow(t('options.inChatMode'), policy.inChatMode, [
+                      { value: 'hide', label: t('options.chatHide') },
+                      { value: 'show', label: t('options.chatShow') },
+                    ], function (next) { persist({ inChatMode: next }) }),
+                    optionRow(t('options.buttonStyle'), policy.buttonStyle, [
+                      { value: 'pair', label: t('options.stylePair') },
+                      { value: 'own', label: t('options.styleOwn') },
+                    ], function (next) { persist({ buttonStyle: next }) }),
+                    policyRow(t('options.expandAll'), policy.expandAllSessions === true, function (next) {
+                      persist({ expandAllSessions: next })
+                    }),
+                    h('div', { style: dim }, t('options.expandHint')),
+                    h('div', { style: { display: 'flex', alignItems: 'center', gap: '8px', flexWrap: 'wrap' } },
+                      h('span', { style: { fontSize: '12px', color: 'var(--dsw-alias-label-primary,inherit)' } }, t('options.maxKept')),
+                      h('input', {
+                        type: 'number', min: 1, max: 200, step: 1,
+                        value: String(policy.maxKept),
+                        disabled: !policyReady,
+                        'aria-label': t('options.maxKept'),
+                        onChange: function (event) {
+                          var raw = event && event.target ? event.target.value : ''
+                          var n = Number(raw)
+                          if (!(n > 0)) return
+                          persist({ maxKept: Math.min(Math.round(n), 200) })
+                        },
+                        style: {
+                          font: 'inherit', fontSize: '12px', padding: '1px 6px', width: '64px',
+                          borderRadius: '6px', color: 'var(--dsw-alias-label-primary,inherit)',
+                          background: 'transparent',
+                          border: '1px solid var(--dsw-alias-border-l1,rgba(127,127,127,.3))'
+                        }
+                      }),
+                      h('span', { style: dim }, t('options.maxKeptHint'))
+                    ),
+                    h('div', { style: dim },
+                      t('options.rev') + ' ' + (policy.configRevision === null ? '-' : policy.configRevision) +
+                      (policy.configFile ? ' · ' + policy.configFile : ''))
+                  )
+            ),
             h('div', { 'data-dsbs-temp-policy': ENTRY, style: {
               display: 'flex', flexDirection: 'column', gap: '8px',
               paddingTop: '12px', marginTop: '2px',
@@ -1922,7 +2168,20 @@ window.__ModuleLoader__.load({
                               : 'var(--dsw-alias-text-error,#e5484d)'
                         }
                       }, saveStatus === 'saving' ? t('policy.saving') : saveStatus === 'saved' ? t('policy.saved') : saveStatus)
-                      : null
+                      : null,
+                    h('div', {
+                      style: { display: 'flex', alignItems: 'center', gap: '8px', flexWrap: 'wrap', paddingTop: '2px' }
+                    },
+                      h('button', {
+                        type: 'button',
+                        disabled: !policyReady || purgeStatus === 'busy',
+                        onClick: purgeNow,
+                        style: assign({}, pillBase, { minWidth: '0' })
+                      }, purgeStatus === 'busy' ? t('options.purging') : t('options.purge')),
+                      purgeStatus && purgeStatus !== 'busy'
+                        ? h('span', { style: dim }, purgeStatus)
+                        : null
+                    )
                   )
             ),
             h('div', { 'data-dsbs-feedback': ENTRY, style: {
@@ -2154,6 +2413,30 @@ window.__ModuleLoader__.load({
         }
       }, 'sidebar-suite: sync')
 
+      effect(function () {
+        // 0.2.8 hot reload. The Host stamps the config file and bumps a
+        // monotone revision; one cheap status poll is enough to notice a save
+        // in Notepad and re-apply every sidebar setting in place. Old Host
+        // halves have no revision field — those are simply left on boot values.
+        var timer = setInterval(function () {
+          if (runtime.disposed || configPollPending) return
+          if (typeof document.hidden === 'boolean' && document.hidden) return
+          configPollPending = true
+          tempCall('api/dsh-temp-session.status')
+            .then(function (data) {
+              configPollPending = false
+              if (runtime.disposed || !data || data.ok !== true) return
+              if (typeof data.configRevision !== 'number') return
+              if (data.configRevision === tempConfigRevision) return
+              rememberConfigRevision(data)
+              applyTempSettings(data)
+            })
+            .catch(function () { configPollPending = false })
+        }, 3000)
+        if (timer && typeof timer.unref === 'function') timer.unref()
+        return function () { clearInterval(timer) }
+      }, 'sidebar-suite: config hot reload')
+
       var teardown = null
       effect(function () {
         teardown = function () {