Skip to content

refactor(settings): consolidate per-page skeletons and extract page helpers - #655

Merged
Astro-Han merged 3 commits into
mainfrom
refactor/settings-skeleton-and-page-extracts
Jul 8, 2026
Merged

refactor(settings): consolidate per-page skeletons and extract page helpers#655
Astro-Han merged 3 commits into
mainfrom
refactor/settings-skeleton-and-page-extracts

Conversation

@Astro-Han

Copy link
Copy Markdown
Contributor

Summary

Three small, behavior-preserving refactors consolidating duplicated and inlined code in the settings surface. No user-visible change; rendered DOM is equivalent.

  • Loading skeletons: permission-center, health-center, and about each hand-wrote a near-identical maka-skeleton-stack with aria-busy/aria-label. Extracted SettingsSkeletonStack (label + optional lines, snapshot preset as default) and routed the three pages through it. SettingsSkeleton (the settings-surface shell) is untouched.
  • Memory page helpers: the 11 React-free label/format/filter helpers at the tail of memory-settings-page.tsx (~115 lines) moved to memory-settings-labels.ts and imported back.
  • WeChat login flow: BotWeChatFields, WeChatScanLoginModal, and WechatQrLoginModal (~370 lines of self-contained scan/QR login) moved from bot-chat-settings-page.tsx to bot-wechat-login.tsx; dropped the now-unused X / DialogRoot / DialogContent / WechatBridgeQrCodeResult imports from the host page.

Why

The three largest settings pages each carried a chunk of code that was either duplicated across pages or self-contained enough to live on its own. This trims bot-chat-settings-page.tsx (1323 → 937) and memory-settings-page.tsx (1213 → 1096) and removes the per-page skeleton copy-paste. app-shell.tsx (1687) and chat-view.tsx (1744) were intentionally left alone — both already have extensive sibling modules and are large because they are coordination hubs, not because they are under-factored.

Scope

Changed:

  • settings-skeleton.tsx — added SettingsSkeletonStack
  • permission-center-page.tsx, health-center-page.tsx, about-settings-page.tsx — route through SettingsSkeletonStack
  • memory-settings-labels.ts (new) + memory-settings-page.tsx
  • bot-wechat-login.tsx (new) + bot-chat-settings-page.tsx
  • settings-contract-source-helpers.ts — registered the two new files in SETTINGS_SOURCE_REPO_PATHS
  • settings-app-info-contract.test.ts — synced one assertion literal

Not included: app-shell.tsx, chat-view.tsx, ProvidersPanel loading state (different pattern, not a maka-skeleton-stack).

Verification

  • npm run build:main (tsc typecheck) — pass
  • npm run build:renderer (vite) — pass
  • node --test "dist/main/**/*.test.js"2262 pass, 0 fail
  • npm run test:checks (console / a11y / copy) — pass

User-facing impact

None. Pure refactor.

Reviewer notes

  • The settings contract tests are source-text based: they regex over a concatenated mirror of the settings source files. The two new files are registered in SETTINGS_SOURCE_REPO_PATHS right after their host pages, so the concatenated mirror contains the same code and the blockBetween boundaries still resolve — some now span two files (e.g. MemoryEntryList … filterLocalMemoryEntries), which the non-greedy match handles fine.
  • One assertion in settings-app-info-contract matched the literal aria-label="正在加载关于页" source; synced to label="正在加载关于页" to follow the new component prop. Same intent: the skeleton carries that accessible label while loading.
  • Skeleton DOM equivalence is preserved per page: same line count, widths, and data-size values render to the same markup.
  • Three commits, one per concern (skeleton / memory / WeChat), each independently revertable.

Checklist

  • Scope matches the PR title and excludes unrelated changes
  • Verification lists commands/results
  • User-facing impact: none
  • Risk: source-text contract tests called out above
  • UI changes: none (refactor only, no screenshot needed)

Astro-Han added 3 commits July 9, 2026 02:43
…letonStack

permission-center, health-center, and about each hand-wrote a near-identical
maka-skeleton-stack with aria-busy/aria-label. Extract SettingsSkeletonStack
(label + optional lines, snapshot preset default) and route the three pages
through it. SettingsSkeleton (settings-surface shell) is untouched.

The about-page loading contract asserted the literal aria-label source text;
synced it to the new label= prop form (same intent: skeleton carries the
accessible label while loading).
…odule

The 11 React-free label/format/filter helpers (memoryOriginLabel,
memoryStatusLabel, memoryStatusTone, filterLocalMemoryEntries, the backup
summarizers, etc.) lived at the tail of memory-settings-page.tsx. Move them
to memory-settings-labels.ts and import them back.

memory-settings-labels.ts is registered in SETTINGS_SOURCE_REPO_PATHS right
after memory-settings-page.tsx so the contract source mirror still contains
the same code and the MemoryEntryList .. filterLocalMemoryEntries block
boundary still resolves (now across the two files).
BotWeChatFields, WeChatScanLoginModal, and WechatQrLoginModal (the
self-contained WeChat scan/QR login flow, ~370 lines) lived inside
bot-chat-settings-page.tsx. Move them to bot-wechat-login.tsx and import
them back, dropping the now-unused X / DialogRoot / DialogContent /
WechatBridgeQrCodeResult imports from the host page.

bot-wechat-login.tsx is registered in SETTINGS_SOURCE_REPO_PATHS right
after bot-chat-settings-page.tsx so the contract source mirror still
contains the WeChat modal code.
@Astro-Han
Astro-Han merged commit c058ab5 into main Jul 8, 2026
3 checks passed
@Astro-Han
Astro-Han deleted the refactor/settings-skeleton-and-page-extracts branch July 8, 2026 18:58
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

1 participant