评审 P1 修正一批

设置：显式主题补 color-scheme，滚动条和 select 弹层这些 UA 部件不看
变量。连接：断开失败的提示与轮询取数分成两条通道，不再被下一秒的轮询
成功抹掉；排序加 id 决胜，内核快照的遍历序无序，空闲连接下载量普遍
相同，没有决胜键行会在断开按钮下面跳。仪表盘与请求：一条流断了连带
收掉同组连接；断流不等于内核没了（配置重载掐断流而 online 从未翻转），
5 秒自动重连。规则：正则类规则（DOMAIN-REGEX 等三种）按内核的
payloadCanContainComma 语义拆分与禁入结构化编辑，顶层逗号不再把正则
截一半当目标；findRuleIssues 注释里对内核校验的错误断言改正。

shared/connections.ts

@@ -83,7 +83,12 @@ export function sortConnections(
     const started = Date.parse(c.start)
     return Number.isNaN(started) ? -1 : now - started
   }
-  return [...list].sort((a, b) => (key === 'download' ? b.download - a.download : age(b) - age(a)))
+  // 平局按 id 决胜。输入顺序来自内核快照的 map 遍历，本身无序且每秒在变；
+  // 空闲连接的下载量普遍相同，没有决胜键的话行会在指针（和断开按钮）下面跳
+  return [...list].sort((a, b) => {
+    const main = key === 'download' ? b.download - a.download : age(b) - age(a)
+    return main !== 0 ? main : a.id.localeCompare(b.id)
+  })
 }
 
 /** 按主机名筛选。大小写不敏感，空串不筛。 */

shared/rules.test.ts

@@ -62,11 +62,22 @@ describe('规则字符串的拆分与拼装', () => {
     expect(parsed.target).toBe('PROXY')
   })
 
-  it('结构化编辑只给常见形状，逻辑规则和子规则按原文编辑', () => {
+  it('正则类规则的顶层逗号不拆坏：最后一段是目标，其余全归载荷', () => {
+    // 内核对 DOMAIN-REGEX 这几类按「载荷可含逗号、不许带选项」读（rules/common/base.go:47-79）
+    expect(parseRule('DOMAIN-REGEX,^(a|b),c$,PROXY')).toEqual({
+      type: 'DOMAIN-REGEX',
+      payload: '^(a|b),c$',
+      target: 'PROXY',
+      extras: [],
+    })
+  })
+
+  it('结构化编辑只给常见形状，逻辑规则、子规则和正则类按原文编辑', () => {
     expect(isStructuredEditable('DOMAIN-SUFFIX,youtube.com,PROXY')).toBe(true)
     expect(isStructuredEditable('MATCH,PROXY')).toBe(true)
     expect(isStructuredEditable('AND,((DOMAIN-SUFFIX,a.com),(DST-PORT,443)),PROXY')).toBe(false)
     expect(isStructuredEditable('SUB-RULE,(DOMAIN-SUFFIX,a.com),sub1')).toBe(false)
+    expect(isStructuredEditable('DOMAIN-REGEX,^ads?,b$,REJECT')).toBe(false)
     expect(isStructuredEditable('孤零零一段')).toBe(false)
   })
 })

shared/rules.ts

@@ -22,9 +22,15 @@ export interface ParsedRule {
 export function parseRule(rule: string): ParsedRule {
   const fields = splitRuleFields(rule)
   const type = fields[0] ?? ''
-  if (type.toUpperCase() === 'MATCH') {
+  const upper = type.toUpperCase()
+  if (upper === 'MATCH') {
     return { type, payload: null, target: fields[1] ?? null, extras: fields.slice(2) }
   }
+  // 载荷可含顶层逗号的类型，内核把最后一段读成目标、其余全归载荷、不许带选项
+  // （rules/common/base.go:47-79）。按普通形状拆会把正则截一半当目标。
+  if (RAW_ONLY_TYPES.has(upper) && fields.length >= 3) {
+    return { type, payload: fields.slice(1, -1).join(','), target: fields.at(-1) ?? null, extras: [] }
+  }
   return { type, payload: fields[1] ?? null, target: fields[2] ?? null, extras: fields.slice(3) }
 }
 
@@ -38,9 +44,19 @@ export function buildRule(parsed: ParsedRule): string {
 /**
  * 界面能按「类型,载荷,目标」结构化编辑的规则。
  *
- * 逻辑规则和子规则的结构不是这个形状，让它们进表单只会把原文拆坏，按整行编辑。
+ * 这份清单必须和内核 `rules/common/base.go:56` 的 `payloadCanContainComma` 一致：
+ * 那些类型内核按「载荷可含逗号、最后一段是目标、不许带选项」读，按普通形状拆的话，
+ * 正则里的顶层逗号会被当成字段分隔，显示错的目标、编辑后悄悄改变语义。
  */
-const RAW_ONLY_TYPES = new Set(['AND', 'OR', 'NOT', 'SUB-RULE'])
+const RAW_ONLY_TYPES = new Set([
+  'AND',
+  'OR',
+  'NOT',
+  'SUB-RULE',
+  'DOMAIN-REGEX',
+  'PROCESS-NAME-REGEX',
+  'PROCESS-PATH-REGEX',
+])
 
 export function isStructuredEditable(rule: string): boolean {
   const parsed = parseRule(rule)
@@ -80,9 +96,10 @@ export interface RuleIssue {
 /**
  * 找出引用了不存在的出站或规则组的规则。
  *
- * 内核自带的校验命令不检查这类引用，只在有流量经过时才报错，所以保存前的自检
- * （vendor 的 validateDocument）和界面上的标注都要自己查。SUB-RULE 的目标段是
- * 子规则集合名而不是出站，跳过——那是路由页的段落，这里不认。
+ * 内核在配置解析时就会拒绝这类引用（config/config.go:1102-1118），坏配置最终会被
+ * 校验重载链拦下并还原；这里的标注是为了让人在保存前就看见、改得快，而 vendor 自检
+ * 对规则目标只给 warning 不拦保存。SUB-RULE 的目标段是子规则集合名而不是出站，
+ * 跳过——那是路由页的段落，这里不认。
  */
 export function findRuleIssues(
   rules: string[],