Skip to content

UI 重新设计:P0 打磨 + P1 单一活动栏 + P2 引用查找/发布预览 - #41

Open
AliceJumpGrokBot wants to merge 29 commits into
AliceJump:mainfrom
AliceJumpGrokBot:ui/redesign-p0-p2
Open

AliceJumpGrokBot wants to merge 29 commits into
AliceJump:mainfrom
AliceJumpGrokBot:ui/redesign-p0-p2

Conversation

@AliceJumpGrokBot

@AliceJumpGrokBot AliceJumpGrokBot commented Oct 11, 2026 •

Copy link
Copy Markdown

本 PR 由 Alice 的机器人账号(AliceJumpGrokBot)准备并提交。

冲突处理(相对 main / #42)

简洁工具风格(clean tokens)

  • 统一设计 token 与“简洁工具”外观,作为 P0–P2 的基础。

P0 打磨

  • 统一命名;设置归为 5 类
  • 修正 openAnnotationEditor / openResourcePublisher
  • 新增 10 条控制台命令 / 菜单 / 状态栏 / 徽标
  • 无角色数据时隐藏相关入口
  • 使用 codicons;控制台适配窄宽布局
  • 空态 / 错误态
  • 交换操作可撤销;统一卡片手势
  • 删除 boxPanel 死代码
  • 命令契约测试

P1 信息架构

  • 活动栏 3→1(运行 TreeView / 参数 / 资源)
  • run 服务层拆分
  • 资源收件箱 / 草稿 / 已发布
  • Ctrl+Alt+S → 截图到收件箱(与系统级热键同终点)
  • 标注编辑器:原图条 + 检查器
  • 角色问题接入 Problems 面板

P2 打磨

  • 图片右键“用标注编辑器打开”
  • 查找模板引用;悬停命令链接;在资源中定位
  • 发布预览
  • 修复资源视图按模板名比较的问题
  • 激活冒烟测试
  • JetBrains 对齐文档

未做 / 降级

  • 截图回归测试(test-electron)
  • 参数视图完整复用 ConfigPanel
  • JetBrains UI

验证

  • tsc 通过;npm test 通过(含 test:background-screenshot / test:global-hotkey / test:command-contract)
  • VS Code 中的手动检查:待进行

文档

  • 设计与计划见 docs/design-system.md、docs/interaction-parity-audit.md、docs/feature-parity.md(含英文版)。
  • README / docs/project-config / docs/box-resources 已按「Ctrl+Alt+S → 收件箱」对齐。

@coderabbitai

coderabbitai Bot commented Oct 11, 2026 •

Copy link
Copy Markdown
Contributor

Important

Review skipped

Too many files!

This PR contains 119 files, which is 19 over the limit of 100.

To get a review, reduce the PR to 100 files or fewer by splitting it into smaller PRs or changing its base branch.

Upgrade to a paid plan to raise the limit.

This review couldn't start because sufficient usage credits or metered capacity aren't available. Add credits or update usage-based reviews in the billing tab, then retry.

⚙️ Run configuration
  • Configuration used: Organization UI
  • Review profile: CHILL
  • Plan: Advanced
  • Run ID: a80a8e67-0356-444a-9983-a1b10ece30d4

📥 Commits

Reviewing files that changed from the base of the PR and between d950b21 and 4bee3d5.


⛔ Files ignored due to path filters (1)
  • media/shared/codicons/codicon.ttf is excluded by !**/*.ttf

📒 Files selected for processing (119)
  • README.en.md
  • README.md
  • docs/box-resources.en.md
  • docs/box-resources.md
  • docs/design-system.en.md
  • docs/design-system.md
  • docs/feature-parity.en.md
  • docs/feature-parity.md
  • docs/interaction-parity-audit.en.md
  • docs/interaction-parity-audit.md
  • docs/project-config.en.md
  • docs/project-config.md
  • docs/testing.en.md
  • docs/testing.md
  • l10n/bundle.l10n.es.json
  • l10n/bundle.l10n.ja.json
  • l10n/bundle.l10n.json
  • l10n/bundle.l10n.ko.json
  • l10n/bundle.l10n.zh-cn.json
  • l10n/bundle.l10n.zh-tw.json
  • l10n/webview.en.json
  • l10n/webview.es.json
  • l10n/webview.ja.json
  • l10n/webview.ko.json
  • l10n/webview.zh-cn.json
  • l10n/webview.zh-tw.json
  • media/annotationPanel/app.js
  • media/annotationPanel/conflict.css
  • media/annotationPanel/index.html
  • media/annotationPanel/style.css
  • media/characterManager/app.js
  • media/characterManager/characterManager.css
  • media/characterManager/index.html
  • media/console/app.js
  • media/console/configPanel.js
  • media/console/console.css
  • media/console/console.js
  • media/console/core.js
  • media/console/index.html
  • media/console/taskCard.js
  • media/params/app.js
  • media/params/index.html
  • media/params/params.css
  • media/resources/app.js
  • media/resources/index.html
  • media/resources/resources.css
  • media/shared/codicons/LICENSE
  • media/shared/codicons/LICENSE-CODE
  • media/shared/codicons/README.txt
  • media/shared/codicons/codicon.css
  • media/shared/controls.css
  • media/shared/icons.js
  • media/shared/thumbnailActions.js
  • media/shared/tokens.css
  • media/tempScreenshots/app.js
  • media/tempScreenshots/index.html
  • media/tempScreenshots/style.css
  • media/templateAssetPanel/app.js
  • media/templateAssetPanel/index.html
  • media/templateAssetPanel/style.css
  • media/templatePanel/app.js
  • media/templatePanel/index.html
  • media/templatePanel/style.css
  • package.json
  • package.nls.es.json
  • package.nls.ja.json
  • package.nls.json
  • package.nls.ko.json
  • package.nls.zh-cn.json
  • package.nls.zh-tw.json
  • scripts/test_activation_smoke.js
  • scripts/test_annotation_clipboard.js
  • scripts/test_annotation_coords.js
  • scripts/test_annotation_history.js
  • scripts/test_annotation_mode_cycle.js
  • scripts/test_asset_swap_picker.js
  • scripts/test_background_screenshot.js
  • scripts/test_character_diagnostics.js
  • scripts/test_command_contract.js
  • scripts/test_console_accountseg.js
  • scripts/test_console_configseg.js
  • scripts/test_convention_sources.js
  • scripts/test_design_system.js
  • scripts/test_hover_links.js
  • scripts/test_publish_diff.js
  • scripts/test_publish_preview.js
  • scripts/test_resource_host_contract.js
  • scripts/test_run_tree_model.js
  • scripts/test_task_launcher_executor.js
  • scripts/test_task_launcher_subconfigs.js
  • scripts/test_temp_screenshots.js
  • scripts/test_template_references.js
  • scripts/test_thumbnail_actions.js
  • src/annotationPanel.ts
  • src/backgroundScreenshot.ts
  • src/characterPanel.ts
  • src/consolePanel.ts
  • src/entrypoint.ts
  • src/extension.ts
  • src/hoverLinks.ts
  • src/positionPreview.ts
  • src/projectConfig.ts
  • src/providers.ts
  • src/publishPreview.ts
  • src/run/characterDiagnostics.ts
  • src/run/index.ts
  • src/run/paramsView.ts
  • src/run/publishDiff.ts
  • src/run/python.ts
  • src/run/resourcesView.ts
  • src/run/runTree.ts
  • src/run/status.ts
  • src/run/treeModel.ts
  • src/run/types.ts
  • src/tempScreenshotPanel.ts
  • src/templateAssetPanel.ts
  • src/templatePanel.ts
  • src/templateReferences.ts
  • src/webviewHtml.ts

You can disable this status message by setting the reviews.review_status to false in the CodeRabbit configuration file.

  • Autofix · Keep fixing CodeRabbit findings and required CI, and resolving merge conflicts

Thanks for using CodeRabbit! It's free for OSS, and your support helps us grow. If you like it, consider giving us a shout-out.

❤️ Share

Comment @coderabbitai help to get the list of available commands.

Tune shared tokens and controls toward more whitespace and fewer
gray border boxes: lighter --bg-row, softer --border, slightly larger
spacing scale, lighter secondary/mini/icon buttons, and cards that
rely more on background than heavy outlines. Accent stays on primary
actions and status. Panel CSS polished to match; design-system spacing
hard rules updated.
The standalone box panel/gallery (media/boxPanel) was folded into the
unified annotation editor long ago, but leftovers stayed behind:
openBoxEditor() had no caller, view.boxAssets/boxGallery nls keys and the
boxAssetsTitle webview key had no consumer, and the design-system audit
still registered a media/boxPanel host that no longer exists.

Keep the position-preview helpers used by hover/completion and move them
to src/positionPreview.ts so the file name says what it does.
- Console / Resource Preview / Annotation Management / Annotation Editor
  used consistently across package.json, host bundles and webviews (6 langs)
- contributes.configuration split into 5 titled categories
- tests flatten the configuration array
… they say

- openAnnotationEditor accepts an image Uri or shows a QuickPick of images
  in Annotation Management, then opens the annotation editor
- openResourcePublisher (now titled "Publish Resources…") runs the
  Template/Rect/Point publish flow instead of only opening the panel
…ar, badges

- console.* commands (run task, start/pause/resume/stop, stop current task,
  show logs, refresh, connect/disconnect game) sharing the webview logic
- menus: view/title actions per view, commandPalette when clauses driven by
  okScriptToolkit.projectReady / executorRunning / executorPaused / taskRunning
- status bar item mirroring executor state; console badge for running+queued
  tasks; temp screenshot badge for unsorted shots
- okScriptToolkit.hasCharacterData context key hides the character & skill
  manager in the palette, console title menu and Game segment when no data
- isSupportedProject moved to projectConfig for reuse
- vendor @vscode/codicons 0.0.36 (css+ttf, licenses) into media/shared/codicons
- shared/icons.js (OkIcons.icon/label/iconOnly) loaded by every panel;
  CSP gains font-src; applySharedAssets fills the two new placeholders
- console, resource preview, annotation management, temp shots, annotation
  editor and character manager use codicons; icon-only buttons get aria-label
- distinct icons: sync default (sync) vs restore (discard) vs swap (arrow-swap)
- design-system doc + audit step 7 enforce codicons and forbid glyph icons
- jsdom tests inline shared/icons.js like thumbnailActions.js
- side nav gets codicons + tooltips; collapses to a 44px icon rail at
  <=640px and to a top segmented bar at <=480px (labels only <=340px)
- arrow keys move between segments (tablist pattern)
- status bar rows and card actions wrap instead of overflowing
- denser task cards (smaller header padding/title, 2-line description)
- snapshot buttons are neutral secondary buttons, not primary
- Annotation Management empty state explains what goes here and offers
  Screenshot / Import (no longer reuses Resource Preview's COCO hint)
- invalid annotation source shows a persistent banner with Open source file
- Resource Preview empty state lists the COCO paths actually checked and
  links to Annotation Management; Box/Point modes get their own hint
- Console status banner renders icon + action buttons (Set Project Path,
  Set Python Path, Show Logs, Retry, Reload Tasks, Stop Executor);
  executor start/exit errors go inline, falling back to a notification
  with the same buttons only when the Console is hidden
- shared .panel-empty__*/.panel-actions/.panel-banner styles; unused
  noTemplatesWithHint/noTemplateAssets* strings removed
The swap was already behind a modal confirm; after it is written the
notification now offers Undo, which restores both images' original boxes
only if neither image changed since the swap.
…ete apart

- single click selects (no more 500ms delayed insert vs double-click copy);
  double-click / Enter = primary action (Resource Preview: insert reference,
  Annotation Management: open annotation editor, Temp Shots: preview)
- keyboard: roving tabindex, role=listbox/option, arrows/Home/End move,
  E = annotate, Ctrl/Cmd+C = copy reference, Delete = delete (host confirms)
- delete moved out of the view/swap row into its own top-right slot with
  danger styling on hover/focus; selected/focus card states
- hints and card tooltips describe the gestures (6 languages)
- tests updated for the new gestures; keyboard navigation covered
… segment

It is project data, not part of the game connection; the entry stays hidden
unless okScriptToolkit.hasCharacterData is true.
Canonical names, new commands, status bar, inline errors, gestures,
swap undo, settings categories; parity audit flags the gesture change as
pending on the JetBrains side.
…ebars

- .gbar is a grid: give its rows min-width:0 so long game/executor text
  no longer widens the bar past the viewport (overflowed at ~700px).
- ≤640: status-bar action group may shrink and wrap (was flex:0 0 auto,
  so '关闭执行器' was cut off at 260px).
- Task cards: the primary action (启动 / 启用) never shrinks; the 参数
  button is the one that gives way. ≤340: the title may wrap instead of
  collapsing to an ellipsis.
Checked at 700/640/560/480/400/340/300/260 with no horizontal overflow.
…onsolePanel

Pure move for the P1 TreeView/params split. consolePanel re-exports the
same helpers so toolboxConnect and extension keep working.
…references)

MarkdownString.isTrusted uses an enabledCommands allowlist with only the
two extension commands; link targets are encoded so names cannot close
the markdown link. Snapshot test in scripts/test_hover_links.js.
… explorer menu

- okScriptToolkit.findTemplateReferences: fL.xxx / self.pos.xxx / "key"
  in workspace Python files → QuickPick → jump (pure finder + test)
- revealResource now filters the Resources view to the name
- Explorer '用标注编辑器打开' only on .png/.jpg/.jpeg/.webp
After every publish decision is collected and before anything is
written, a QuickPick lists the files that will be written and the
template set change (new / overwrite / removed), compared by name only
since saveToAssets re-packs bboxes. Esc writes nothing; saveToAssets and
position publish semantics are unchanged.
… by name only

P1 keyed draft cards by image file name, so they never matched the
published fL.<name> entries, and compared bboxes across coordinate
systems (publish re-packs crops), flagging everything as modified.
@vscode/test-electron is not a dependency and needs a display, so no
real Extension Host or screenshot regression; documented in docs/testing.md.
…AliceJump#42

Rebase ui/redesign-p0-p2 onto main (includes AliceJump#42). Keep one capture flow:
VS Code keybinding and Windows RegisterHotKey both land in the AliceJump#41
Resources inbox (lossless BMP), not the old templates-only path.

Keep AliceJump#42 prewarm, GlobalScreenshotHotkey, and local review-time scripts.
Update docs/keymap notes and background-screenshot tests accordingly.
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.

2 participants