♻️ 资产表单标签页化与配置驱动重构 - #205
Merged
Merged
Conversation
- 新增 fields.tsx:Field/FieldLabel/Segmented 共享原语 - ConfigTabs 改为下划线坐于发丝线的标签,移除可选标/红点/focusGroup 跳转 - AssetForm:图标+名称+分组单行布局,test 连接按钮改 ghost,弹窗与间距调优 - 各 ConfigSection 改用 Field/Segmented,精简字段编排 - 同步移除 formContract 的 focusGroup/invalidGroupKey 与相关 i18n、测试 - go.sum 清理过期 cago-frame/agents 版本
对 text / number / textarea 三处 placeholder 渲染改用
t(key, { defaultValue: key })，使 i18next nsSeparator 不截断
含 ":" 的字面量占位符(如 "192.168.100.50:9092"、":")；
真实 i18n 键仍正常解析，defaultValue 仅在键缺失时生效。
为消除组件里硬编码调色板色做准备: - info(+fg):蓝色「运行/进行中/信息」状态槽 - success/warning 补 .dark 值与 *-foreground,可作深浅两套下可读的徽章 - syntax-string/number/boolean/null:值类型着色(Redis/etcd/JSON) - chart-1..5:分类色板(代码片段分类等任意分类场景) 均含 :root/.dark/@theme inline 三处定义
把 AI/审批/策略/k8s/审计/终端状态/设置/查询/etcd 等组件里硬编码的 调色板类(green/amber/red/sky…)换成 success/warning/destructive/info, 软徽章 bg-X-100…dark:bg-X-900/50 收敛为 bg-<token>/15 text-<token>(token 自带深浅值); ThinkingBlock 的 thinking 紫色归为 primary。同步更新断言相应 class 的测试。
字符串/数字/布尔/null 的着色换成 text-syntax-string/number/boolean/null (去掉 dark: 变体,token 自适配);RedisKeyDetail 的 key 类型徽章归为 chart-*; 拆出独立 null 分支以匹配值类型语义。更新 RedisKeyDetail 测试断言。
insert=success / delete=destructive / modify=warning / remote=info; IdeaFrame 的 bg-[#343b45]、MergeWorkbench 的 slate 链、CompareWorkbench 的 bg-[#1f2329]/#f8fafc 等硬编码色换成自适配 token。Monaco 装饰层(globals.css .external-edit-*、CodeDiffViewer/merge-decorations 取值)仍按既定例外保留原始色。
CATEGORY_BADGE_COLORS 的 5 个任意分类色按位映射 chart-1..5, 去掉 dark: 变体、ring 不透明度 20→25。
- §3.5 状态色:success/warning 补 .dark 值与 *-foreground,新增 info(+fg); 补「软徽章配方」bg-<status>/15 text-<status> - §3.8:区分 diff/merge 的 Monaco 装饰取值(例外保留原始色)与 React 外壳(走状态 token) - 新增 §3.9 syntax-*(值类型着色)、§3.10 chart-*(分类色板)、§3.11 原始色例外清单 - §6.1 徽章说明同步 info 与 *-foreground
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
1 participant
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
背景
资产添加/编辑表单的类型配置区原本是单列平铺:必填连接项和高级旋钮(TLS、代理、超时、Schema Registry、Kafka Connect 集群等)全挤在一列,重型类型尤其 Kafka 越堆越乱。后续继续扩展字段时,每个资产类型也容易复制渲染/校验/布局逻辑。
方案
本 PR 把资产配置区拆成两条主线推进:
useConfigSection、字段 schema 渲染器和buildConfigGroups,逐步将 SSH、数据库、Redis、MongoDB、etcd、Kafka、K8s、Serial、Local 配置区迁到统一字段描述与分组模型。SectionValidity.invalidGroupKey和AssetFormHandle.focusGroup,底部禁用原因可以点名具体标签并跳转,不在 shell 按资产类型分支。ConfigTabs、DescriptionBar,补齐字段渲染器 composite kind、segmented、textarea、select 写回、placeholder/i18n 等能力。主要变化
ConfigSection保留原 state 和序列化边界,把重复 JSX/校验组织迁到共享 hook/schema,降低后续新增字段的重复成本。t()翻译,同时保留无翻译时的字面量 defaultValue。docs/DESIGN.md,补充 semantic status、info、syntax-、chart- token;多处 UI 颜色迁移到语义 token,包含值渲染、代码片段分类色、diff/merge 外壳、状态徽章等。类型标签布局
影响面
docs/superpowers/specs/、docs/superpowers/plans/和docs/DESIGN.md。测试
pnpm lint通过。pnpm test通过:152 个测试文件、1541 个用例。pnpm exec vitest run src/components/asset/__tests__/configFields.test.tsx:20 个用例通过。ImportTableDataDialogcopy import 用例:通过。