dsh-tiddlywiki 0.2.0 → 0.3.0

package/src/client/panel.ts

@@ -79,6 +79,7 @@ interface StatusPayload {
   wikiPath?: string
   error?: string
   note?: { tag?: string }
+  ui?: { showPanelStatus?: boolean }
 }
 
 function conversationColumn(): HTMLElement | undefined {
@@ -115,6 +116,8 @@ export function mountPanel(state: PanelState): () => void {
   let frameArea: HTMLDivElement | undefined
   let errorArea: HTMLDivElement | undefined
   let chip: HTMLSpanElement | undefined
+  let statusDot: HTMLSpanElement | undefined
+  let statusFloater: HTMLDivElement | undefined
   let refreshTimer: number | undefined
   let refreshAttempts = 0
 
@@ -123,27 +126,6 @@ export function mountPanel(state: PanelState): () => void {
     view.dataset.dshTwView = ''
     view.className = 'dsh-tw-view'
 
-    const bar = document.createElement('div')
-    bar.className = 'dsh-tw-panel-bar'
-    const title = document.createElement('span')
-    title.className = 'dsh-tw-panel-title'
-    title.textContent = 'TiddlyWiki 知识库'
-    chip = document.createElement('span')
-    chip.className = 'dsh-tw-status-chip'
-    chip.dataset.state = 'unknown'
-    chip.textContent = '—'
-    const reload = document.createElement('button')
-    reload.type = 'button'
-    reload.textContent = '重载'
-    reload.addEventListener('click', () => {
-      if (iframe !== undefined && !iframe.hidden) iframe.src = iframe.src
-    })
-    const refresh = document.createElement('button')
-    refresh.type = 'button'
-    refresh.textContent = '状态'
-    refresh.addEventListener('click', () => { void doRefresh() })
-    bar.append(title, chip, refresh, reload)
-
     frameArea = document.createElement('div')
     frameArea.className = 'dsh-tw-panel-frame-wrap'
     frameArea.style.cssText = 'flex:1;min-height:0;display:flex;flex-direction:column'
@@ -157,14 +139,50 @@ export function mountPanel(state: PanelState): () => void {
     errorArea.className = 'dsh-tw-panel-error'
     errorArea.hidden = true
 
-    view.append(bar, frameArea, errorArea)
+    view.append(frameArea, errorArea)
     return view
   }
 
+  /**
+   * Bottom-right floating status/reload buttons (same visual language as the
+   * quick-note toggle) — the top panel bar is gone, so TW's menubar reaches
+   * the very top of the panel and clears the host's top-right buttons. Mount
+   * is gated by `ui.showPanelStatus` (settings page toggle).
+   */
+  const buildStatusFloater = (): HTMLDivElement => {
+    const wrap = document.createElement('div')
+    wrap.className = 'dsh-tw-panel-status'
+
+    const statusBtn = document.createElement('button')
+    statusBtn.type = 'button'
+    statusBtn.className = 'dsh-tw-panel-status-btn'
+    statusBtn.title = '刷新状态'
+    statusDot = document.createElement('span')
+    statusDot.className = 'dsh-tw-status-dot'
+    statusDot.dataset.state = 'unknown'
+    chip = document.createElement('span')
+    chip.className = 'dsh-tw-panel-status-text'
+    chip.textContent = '—'
+    statusBtn.append(statusDot, chip)
+    statusBtn.addEventListener('click', () => { void doRefresh() })
+
+    const reloadBtn = document.createElement('button')
+    reloadBtn.type = 'button'
+    reloadBtn.className = 'dsh-tw-panel-status-btn'
+    reloadBtn.textContent = '重载'
+    reloadBtn.title = '重载 TiddlyWiki 面板'
+    reloadBtn.addEventListener('click', () => {
+      if (iframe !== undefined && !iframe.hidden) iframe.src = iframe.src
+    })
+
+    wrap.append(statusBtn, reloadBtn)
+    document.body.append(wrap)
+    return wrap
+  }
+
   const setChip = (stateName: string, text: string): void => {
-    if (chip === undefined) return
-    chip.dataset.state = stateName
-    chip.textContent = text
+    if (statusDot !== undefined) statusDot.dataset.state = stateName
+    if (chip !== undefined) chip.textContent = text
   }
 
   /** Pin the overlay to the center column's current viewport rect. */
@@ -329,6 +347,13 @@ export function mountPanel(state: PanelState): () => void {
   ensure()
   applyActive()
 
+  // Bottom-right status/reload buttons, gated by ui.showPanelStatus.
+  void (async () => {
+    const payload = await fetchStatus()
+    if (payload?.ui?.showPanelStatus === false) return
+    statusFloater = buildStatusFloater()
+  })()
+
   return () => {
     if (refreshTimer !== undefined) window.clearTimeout(refreshTimer)
     window.clearInterval(syncInterval)
@@ -341,5 +366,6 @@ export function mountPanel(state: PanelState): () => void {
     unsubscribe()
     document.documentElement.removeAttribute(ACTIVE_ATTR)
     container?.remove()
+    statusFloater?.remove()
   }
 }

package/src/client/settings-page.ts

@@ -23,6 +23,7 @@ const STATE_ENDPOINT = '/dsh-tiddlywiki/admin/state'
 const INFO_ENDPOINT = '/dsh-tiddlywiki/admin/info'
 const CONFIG_ENDPOINT = '/dsh-tiddlywiki/admin/config'
 const RESTART_ENDPOINT = '/dsh-tiddlywiki/admin/restart'
+const SYNC_ENDPOINT = '/dsh-tiddlywiki/sync'
 
 interface CatalogEntry {
   name: string
@@ -119,6 +120,34 @@ function renderStatus(row: HTMLElement, state: AdminState, refresh: () => Promis
     state.git?.dirty === true ? '有未提交改动' : '',
   ].filter(Boolean).join(' · ')
   const label = make('span', 'dsh-tw-settings-muted', info)
+  const sync = make('button', 'dsh-tw-settings-btn', '同步')
+  sync.type = 'button'
+  sync.title = 'git 同步（pull → commit → push）'
+  sync.addEventListener('click', () => {
+    sync.disabled = true
+    sync.textContent = '同步中…'
+    void (async () => {
+      try {
+        const res = await fetch(SYNC_ENDPOINT, { method: 'POST', signal: AbortSignal.timeout(120_000) })
+        const payload = (await res.json().catch(() => null)) as { ok?: boolean; message?: string; error?: string; changed?: boolean; restarted?: boolean; restartError?: string } | null
+        if (!res.ok || payload?.ok !== true) toast(`同步失败：${payload?.error ?? payload?.message ?? `HTTP ${res.status}`}`)
+        else {
+          let detail = ''
+          if (payload.changed === true) {
+            detail += payload.restarted === true ? '，TW 已重启' : '，TW 未自动重启'
+            if (payload.restartError) detail += `（${payload.restartError}）`
+          }
+          toast(`同步完成：${payload.message ?? 'OK'}${detail}`)
+        }
+      } catch (err) {
+        toast(`同步失败：${err instanceof Error ? err.message : String(err)}`)
+      } finally {
+        sync.disabled = false
+        sync.textContent = '同步'
+        void refresh()
+      }
+    })()
+  })
   const restart = make('button', 'dsh-tw-settings-btn', '重启 TW')
   restart.type = 'button'
   restart.addEventListener('click', () => {
@@ -137,7 +166,7 @@ function renderStatus(row: HTMLElement, state: AdminState, refresh: () => Promis
       }
     })()
   })
-  row.append(chip, label, restart)
+  row.append(chip, label, sync, restart)
 }
 
 /** Config section: fields bound to effective config, changed-only save. */
@@ -182,7 +211,8 @@ function renderConfigSection(body: HTMLElement, config: Record<string, unknown>,
   textField('git.remote', 'git 远端（空=仅本地）', typeof git.remote === 'string' ? git.remote : '')
   textField('git.branch', 'git 分支', typeof git.branch === 'string' ? git.branch : 'main')
   checkField('ui.showQuickNote', '显示「快速笔记」悬浮按钮', ui.showQuickNote !== false)
-  checkField('ui.sidebarLeftCss', '侧边栏移左 CSS（随启动补丁还原被删除的样式）', ui.sidebarLeftCss !== false)
+  checkField('ui.showPanelStatus', '显示 TW 面板右下角「状态/重载」悬浮按钮', ui.showPanelStatus !== false)
+  checkField('ui.showSyncButton', '显示右下角「同步」悬浮按钮', ui.showSyncButton !== false)
   // 界面语言在下方「语言管理」区块设置（config 的 uiLanguage 仅供启动时自动应用）。
 
   const save = make('button', 'dsh-tw-settings-btn dsh-tw-settings-primary', '保存配置')

package/src/client/sidebar-entry.ts

@@ -1,148 +1,148 @@
-/**
- * Sidebar entry injection — structure ported from dsh-taskboard's
- * sidebar-entry.ts (verified live in this shell): scope to the sidebar root,
- * find the New Session button, and insert the entry as a direct child of that
- * root next to the family block. A body-level MutationObserver self-heals
- * React re-renders; a slow timer covers shells that mount late without
- * further mutations. The row is plain DOM so it never disturbs the shell's
- * reconciliation.
- *
- * @module dsh-tiddlywiki/client/sidebar-entry
- */
-import type { PanelState } from './state.ts'
-
-/** Stable data attribute identifying this entry row. */
-export const ENTRY_SELECTOR = '[data-dsh-tw-entry]'
-
-/** Inline icon: a wiki page with a TiddlyWiki-style "T" (nav-icon look). */
-const ICON = '<svg viewBox="0 0 16 16" width="14" height="14" fill="none" stroke="currentColor" stroke-width="1.3" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true"><path d="M4 2.5h8a1 1 0 0 1 1 1v9a1 1 0 0 1-1 1H4a1 1 0 0 1-1-1v-9a1 1 0 0 1 1-1z"/><path d="M6 6h4M6 8.5h2.5"/></svg>'
-
-/** Family entries from sibling plugins, kept in a stable relative order. */
-const FAMILY_SELECTOR = '[data-dsh-tw-entry], [data-dsh-atb-entry], [data-dsh-taskboard-entry], [data-dsh-ssh-entry]'
-
-/** Find the sidebar shell root element, or undefined while not yet mounted. */
-function sidebarRoot(): HTMLElement | undefined {
-  const column = document.querySelector<HTMLElement>(
-    '[data-pane="sidebar"], [class*="sidebarCol"], .dshDesktopUpstreamSidebar, .dshDesktopSidebarSurface',
-  )
-  if (column === null) return undefined
-  const logoOwner = column.querySelector<HTMLElement>('[class*="logoRow"]')?.parentElement
-  return logoOwner ?? (column.firstElementChild as HTMLElement | undefined)
-}
-
-/** The New Session button inside the sidebar root. */
-function newSessionButton(root: HTMLElement): HTMLButtonElement | undefined {
-  const nested = root.querySelector<HTMLButtonElement>('button[class*="newSession"]')
-  if (nested !== null) return nested
-  for (const child of root.children) {
-    if (child instanceof HTMLButtonElement && !child.matches(ENTRY_SELECTOR)) return child
-  }
-  const byAria = root.querySelector<HTMLButtonElement>(
-    'button[aria-label="新建会话"], button[aria-label="New Session"], button[aria-label*="新会话"], button[aria-label*="new session" i]',
-  )
-  if (byAria !== null) return byAria
-  const buttons = Array.from(root.querySelectorAll<HTMLButtonElement>('button'))
-  return buttons.find(button => !button.matches(ENTRY_SELECTOR) && /新会话|新建会话|new session/i.test(button.textContent ?? ''))
-}
-
-/** Build the entry row (a detached button; insert once the shell is up). */
-function createEntry(state: PanelState): HTMLButtonElement {
-  const entry = document.createElement('button')
-  entry.type = 'button'
-  entry.dataset.dshTwEntry = ''
-  entry.className = 'dsh-tw-entry'
-  entry.setAttribute('aria-label', 'TiddlyWiki 知识库')
-  entry.innerHTML = `<span class="dsh-tw-entry-icon">${ICON}</span><span class="dsh-tw-entry-label">TiddlyWiki</span>`
-  entry.addEventListener('click', () => { state.toggle() })
-  return entry
-}
-
-/** Re-insert the entry before the whole family block (stable ordering). */
-function placeEntry(root: HTMLElement, entry: HTMLButtonElement): boolean {
-  const button = newSessionButton(root)
-  if (button === undefined) return false
-  if (entry.parentElement !== root) {
-    const row = button.closest('[class*="logoRow"]')
-    const base = (row !== null && row.parentElement === root) ? row : button
-    const family = Array.from(root.children).filter(
-      (el): el is HTMLElement => el instanceof HTMLElement && el.matches(FAMILY_SELECTOR),
-    )
-    const anchor = family.length > 0 ? (family[0] ?? null) : (base.nextElementSibling ?? null)
-    root.insertBefore(entry, anchor)
-  }
-  return true
-}
-
-/** Debug counters (window.__twDebug) — evidence if the entry fails to appear. */
-interface TwDebug { attempts: number; found: boolean; placed: boolean }
-
-/**
- * Mount the sidebar entry, waiting for the shell and self-healing on later
- * re-renders.
- * @param state - the shared panel state the entry toggles.
- * @returns disposer removing the entry and its observers.
- */
-export function mountSidebarEntry(state: PanelState): () => void {
-  const entry = createEntry(state)
-  const debug: TwDebug = { attempts: 0, found: false, placed: false }
-  const host = globalThis.location?.hostname
-  if (host === 'localhost' || host === '127.0.0.1') {
-    ;(window as unknown as { __twDebug?: TwDebug }).__twDebug = debug
-  }
-  let root: HTMLElement | undefined
-  let placed = false
-
-  const tryPlace = (): void => {
-    debug.attempts++
-    if (root !== undefined && !root.isConnected) {
-      rootObserver.disconnect()
-      root = undefined
-      placed = false
-    }
-    if (placed) {
-      if (document.body.contains(entry)) return
-      rootObserver.disconnect()
-      root = undefined
-      placed = false
-    }
-    root ??= sidebarRoot()
-    if (root === undefined) return
-    debug.found = newSessionButton(root) !== undefined
-    placed = placeEntry(root, entry)
-    debug.placed = placed
-    if (placed) rootObserver.observe(root, { childList: true, subtree: true })
-  }
-
-  // Body-level watcher as the whole-rebuild fallback.
-  const waitObserver = new MutationObserver(() => { tryPlace() })
-  waitObserver.observe(document.body, { childList: true, subtree: true })
-
-  // Self-heal: re-insert in the same frame when a re-render displaces the row.
-  const rootObserver = new MutationObserver(() => {
-    if (root === undefined || !root.isConnected) {
-      placed = false
-      tryPlace()
-      return
-    }
-    if (!root.contains(entry)) placed = placeEntry(root, entry)
-  })
-
-  // Belt-and-braces: a late shell mount with no further mutations still heals.
-  const retry = setInterval(() => { tryPlace() }, 2_000)
-
-  const syncActive = (): void => {
-    if (state.isOpen()) entry.dataset.active = 'true'
-    else delete entry.dataset.active
-  }
-  const unsubscribe = state.subscribe(syncActive)
-  syncActive()
-  tryPlace()
-
-  return () => {
-    clearInterval(retry)
-    waitObserver.disconnect()
-    rootObserver.disconnect()
-    unsubscribe()
-    entry.remove()
-  }
-}
+/**
+ * Sidebar entry injection — structure ported from dsh-taskboard's
+ * sidebar-entry.ts (verified live in this shell): scope to the sidebar root,
+ * find the New Session button, and insert the entry as a direct child of that
+ * root next to the family block. A body-level MutationObserver self-heals
+ * React re-renders; a slow timer covers shells that mount late without
+ * further mutations. The row is plain DOM so it never disturbs the shell's
+ * reconciliation.
+ *
+ * @module dsh-tiddlywiki/client/sidebar-entry
+ */
+import type { PanelState } from './state.ts'
+
+/** Stable data attribute identifying this entry row. */
+export const ENTRY_SELECTOR = '[data-dsh-tw-entry]'
+
+/** Inline icon: a wiki page with a TiddlyWiki-style "T" (nav-icon look). */
+const ICON = '<svg viewBox="0 0 16 16" width="14" height="14" fill="none" stroke="currentColor" stroke-width="1.3" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true"><path d="M4 2.5h8a1 1 0 0 1 1 1v9a1 1 0 0 1-1 1H4a1 1 0 0 1-1-1v-9a1 1 0 0 1 1-1z"/><path d="M6 6h4M6 8.5h2.5"/></svg>'
+
+/** Family entries from sibling plugins, kept in a stable relative order. */
+const FAMILY_SELECTOR = '[data-dsh-tw-entry], [data-dsh-atb-entry], [data-dsh-taskboard-entry], [data-dsh-ssh-entry]'
+
+/** Find the sidebar shell root element, or undefined while not yet mounted. */
+function sidebarRoot(): HTMLElement | undefined {
+  const column = document.querySelector<HTMLElement>(
+    '[data-pane="sidebar"], [class*="sidebarCol"], .dshDesktopUpstreamSidebar, .dshDesktopSidebarSurface',
+  )
+  if (column === null) return undefined
+  const logoOwner = column.querySelector<HTMLElement>('[class*="logoRow"]')?.parentElement
+  return logoOwner ?? (column.firstElementChild as HTMLElement | undefined)
+}
+
+/** The New Session button inside the sidebar root. */
+function newSessionButton(root: HTMLElement): HTMLButtonElement | undefined {
+  const nested = root.querySelector<HTMLButtonElement>('button[class*="newSession"]')
+  if (nested !== null) return nested
+  for (const child of root.children) {
+    if (child instanceof HTMLButtonElement && !child.matches(ENTRY_SELECTOR)) return child
+  }
+  const byAria = root.querySelector<HTMLButtonElement>(
+    'button[aria-label="新建会话"], button[aria-label="New Session"], button[aria-label*="新会话"], button[aria-label*="new session" i]',
+  )
+  if (byAria !== null) return byAria
+  const buttons = Array.from(root.querySelectorAll<HTMLButtonElement>('button'))
+  return buttons.find(button => !button.matches(ENTRY_SELECTOR) && /新会话|新建会话|new session/i.test(button.textContent ?? ''))
+}
+
+/** Build the entry row (a detached button; insert once the shell is up). */
+function createEntry(state: PanelState): HTMLButtonElement {
+  const entry = document.createElement('button')
+  entry.type = 'button'
+  entry.dataset.dshTwEntry = ''
+  entry.className = 'dsh-tw-entry'
+  entry.setAttribute('aria-label', 'TiddlyWiki 知识库')
+  entry.innerHTML = `<span class="dsh-tw-entry-icon">${ICON}</span><span class="dsh-tw-entry-label">TiddlyWiki</span>`
+  entry.addEventListener('click', () => { state.toggle() })
+  return entry
+}
+
+/** Re-insert the entry before the whole family block (stable ordering). */
+function placeEntry(root: HTMLElement, entry: HTMLButtonElement): boolean {
+  const button = newSessionButton(root)
+  if (button === undefined) return false
+  if (entry.parentElement !== root) {
+    const row = button.closest('[class*="logoRow"]')
+    const base = (row !== null && row.parentElement === root) ? row : button
+    const family = Array.from(root.children).filter(
+      (el): el is HTMLElement => el instanceof HTMLElement && el.matches(FAMILY_SELECTOR),
+    )
+    const anchor = family.length > 0 ? (family[0] ?? null) : (base.nextElementSibling ?? null)
+    root.insertBefore(entry, anchor)
+  }
+  return true
+}
+
+/** Debug counters (window.__twDebug) — evidence if the entry fails to appear. */
+interface TwDebug { attempts: number; found: boolean; placed: boolean }
+
+/**
+ * Mount the sidebar entry, waiting for the shell and self-healing on later
+ * re-renders.
+ * @param state - the shared panel state the entry toggles.
+ * @returns disposer removing the entry and its observers.
+ */
+export function mountSidebarEntry(state: PanelState): () => void {
+  const entry = createEntry(state)
+  const debug: TwDebug = { attempts: 0, found: false, placed: false }
+  const host = globalThis.location?.hostname
+  if (host === 'localhost' || host === '127.0.0.1') {
+    ;(window as unknown as { __twDebug?: TwDebug }).__twDebug = debug
+  }
+  let root: HTMLElement | undefined
+  let placed = false
+
+  const tryPlace = (): void => {
+    debug.attempts++
+    if (root !== undefined && !root.isConnected) {
+      rootObserver.disconnect()
+      root = undefined
+      placed = false
+    }
+    if (placed) {
+      if (document.body.contains(entry)) return
+      rootObserver.disconnect()
+      root = undefined
+      placed = false
+    }
+    root ??= sidebarRoot()
+    if (root === undefined) return
+    debug.found = newSessionButton(root) !== undefined
+    placed = placeEntry(root, entry)
+    debug.placed = placed
+    if (placed) rootObserver.observe(root, { childList: true, subtree: true })
+  }
+
+  // Body-level watcher as the whole-rebuild fallback.
+  const waitObserver = new MutationObserver(() => { tryPlace() })
+  waitObserver.observe(document.body, { childList: true, subtree: true })
+
+  // Self-heal: re-insert in the same frame when a re-render displaces the row.
+  const rootObserver = new MutationObserver(() => {
+    if (root === undefined || !root.isConnected) {
+      placed = false
+      tryPlace()
+      return
+    }
+    if (!root.contains(entry)) placed = placeEntry(root, entry)
+  })
+
+  // Belt-and-braces: a late shell mount with no further mutations still heals.
+  const retry = setInterval(() => { tryPlace() }, 2_000)
+
+  const syncActive = (): void => {
+    if (state.isOpen()) entry.dataset.active = 'true'
+    else delete entry.dataset.active
+  }
+  const unsubscribe = state.subscribe(syncActive)
+  syncActive()
+  tryPlace()
+
+  return () => {
+    clearInterval(retry)
+    waitObserver.disconnect()
+    rootObserver.disconnect()
+    unsubscribe()
+    entry.remove()
+  }
+}

package/src/client/state.ts

@@ -1,39 +1,39 @@
-/**
- * Tiny pub/sub panel state shared by the sidebar entry and the center panel.
- *
- * @module dsh-tiddlywiki/client/state
- */
-
-export type PanelListener = (open: boolean) => void
-
-export class PanelState {
-  private open = false
-  private readonly listeners = new Set<PanelListener>()
-
-  isOpen(): boolean {
-    return this.open
-  }
-
-  toggle(): void {
-    this.set(!this.open)
-  }
-
-  openPanel(): void {
-    this.set(true)
-  }
-
-  closePanel(): void {
-    this.set(false)
-  }
-
-  set(value: boolean): void {
-    if (this.open === value) return
-    this.open = value
-    for (const listener of [...this.listeners]) listener(value)
-  }
-
-  subscribe(listener: PanelListener): () => void {
-    this.listeners.add(listener)
-    return () => { this.listeners.delete(listener) }
-  }
-}
+/**
+ * Tiny pub/sub panel state shared by the sidebar entry and the center panel.
+ *
+ * @module dsh-tiddlywiki/client/state
+ */
+
+export type PanelListener = (open: boolean) => void
+
+export class PanelState {
+  private open = false
+  private readonly listeners = new Set<PanelListener>()
+
+  isOpen(): boolean {
+    return this.open
+  }
+
+  toggle(): void {
+    this.set(!this.open)
+  }
+
+  openPanel(): void {
+    this.set(true)
+  }
+
+  closePanel(): void {
+    this.set(false)
+  }
+
+  set(value: boolean): void {
+    if (this.open === value) return
+    this.open = value
+    for (const listener of [...this.listeners]) listener(value)
+  }
+
+  subscribe(listener: PanelListener): () => void {
+    this.listeners.add(listener)
+    return () => { this.listeners.delete(listener) }
+  }
+}