feat: add React Error Boundary to prevent UI white-screen crashes - #49

Merged
op7418 merged 1 commit into
op7418:mainfrom
cyxer000:feat/error-boundary
Feb 26, 2026
Merged

feat: add React Error Boundary to prevent UI white-screen crashes#49
op7418 merged 1 commit into
op7418:mainfrom
cyxer000:feat/error-boundary

Conversation

@cyxer000

@cyxer000cyxer000 commented Feb 10, 2026•
edited
Loading

Copy link
Copy Markdown
Contributor

Summary

  • Add a ErrorBoundary class component that catches runtime errors in the React component tree
  • Wrap the main content area, chat list panel, doc preview, and right panel with independent ErrorBoundary instances
  • When a component crashes, users see a friendly error UI with "Try Again" and "Reload App" buttons instead of a blank white screen

Motivation

Multiple users have reported the app becoming unresponsive or showing a blank screen (e.g. #32). A single uncaught error in any component can take down the entire UI. Error boundaries isolate failures so that a crash in the chat list doesn't affect the main content area, and vice versa.

Changes

FileChange
src/components/layout/ErrorBoundary.tsxNew component - React class-based error boundary with fallback UI
src/components/layout/AppShell.tsxWrap <ChatListPanel>, {children}, <DocPreview>, and <RightPanel> with <ErrorBoundary>

Review feedback addressed

  • Rebased onto current main (resolved conflicts with ResizeHandle, DocPreview, width prop changes)
  • Wrapped newer RightPanel and DocPreview components with ErrorBoundary for consistent crash isolation

Test plan

  • Verify normal app usage is unaffected
  • Simulate a component error (e.g., throw in a child) and verify the fallback UI appears
  • Click "Try Again" to reset the boundary
  • Click "Reload App" to reload the window
  • Verify that a crash in the chat list doesn't affect the main content area
  • Verify that a crash in DocPreview doesn't affect other panels
  • Verify that a crash in RightPanel doesn't affect other panels

Closes#32

op7418
op7418 approved these changes Feb 13, 2026
View reviewed changes

@op7418op7418 left a comment

Copy link
Copy Markdown
Owner

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

LGTM! Clean error boundary implementation, good isolation strategy.

Please rebase onto current main before we merge — AppShell.tsx has changed significantly (added ResizeHandle, DocPreview, width prop to ChatListPanel). After rebasing, also wrap the newer RightPanel and DocPreview components with ErrorBoundary for consistent crash isolation.

@op7418

op7418 commented Feb 23, 2026

Copy link
Copy Markdown
Owner

你好 @cyxer000，感谢你提交这个 Error Boundary 方案！

经过检查，主分支目前还没有 Error Boundary 的实现，这个功能对防止白屏崩溃确实很有价值。

不过这个 PR 目前存在合并冲突，需要 rebase 到最新的 main 分支来解决冲突。如果你有时间的话，麻烦 rebase 一下，我们会在后续评估合并。

再次感谢你的贡献！

@cyxer000
feat: add React Error Boundary to prevent UI white-screen crashes
11ece8d
Wrap main content area and chat list panel with ErrorBoundary
components to gracefully handle runtime errors instead of
showing a blank white screen.
Closesop7418#32
@cyxer000

cyxer000 commented Feb 24, 2026

Copy link
Copy Markdown
ContributorAuthor

Rebased onto current main and addressed review feedback:

  • Resolved conflicts with ResizeHandle, DocPreview, width prop changes
  • Wrapped DocPreview and RightPanel with ErrorBoundary for consistent crash isolation

Ready to merge.

@op7418
op7418 merged commit cd807ef into op7418:mainFeb 26, 2026
op7418 pushed a commit that referenced this pull request Feb 26, 2026
7418@claude
fix: improve ErrorBoundary i18n and update provider preset descriptions
5bace38
ErrorBoundary (PR #49 follow-up):
- Replace inline SVG with lucide-react CircleAlert icon for consistency
- Add i18n support: extract fallback UI into functional ErrorFallback
component so it can use useTranslation hook
- Remove unused withErrorBoundary HOC
- Add error.* translation keys to en.ts and zh.ts
ProviderManager:
- Add Claude Code default config entry in connected providers section
with cc switch hint explaining configurations may not be readable
- Update GLM preset descriptions: "GLM" → "GLM Code Plan / 编程套餐"
- Update MiniMax preset descriptions: "MiniMax API" → "MiniMax Code Plan / 编程套餐"
- Add provider.ccSwitchHint translation key to en.ts and zh.ts
Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
op7418 added a commit that referenced this pull request Jul 4, 2026
@op7418@claude
docs:#49+#50加固批次收口(stream-json/PID stale/assignment 文件/fix 轮上限/时间戳/…
b3931a6
…escalation 演练)
Co-Authored-By: Claude Fable 5 <noreply@anthropic.com>
op7418 added a commit that referenced this pull request Jul 4, 2026
@op7418@claude
feat(ai-sdk-7): Phase 5 决策门——gap 收口 + 三类真实场景 prod/POC 对照 + 采用决策 partial
fd82742
- docs/research/ai-sdk-7-toolloop-parity-gaps.md: 新增「Phase 5 处置」节，全部 gap
收口——P1×3 关闭（#1/#2 补偿由 parity 8/8 复跑锁定；#3 降级论证：Phase 4 已证
approval HMAC 不需要 SDK toolApproval 停机语义，维持 in-execute 路线），
P2/P3 关闭或 backlog（#4/#5 列为替换路线前置条件，#7 归档 tech-debt #49，
#8 有 Phase 5 新实证）
- scripts/smoke-ai-sdk7-phase5-decision.ts: 新增决策门对照 smoke——prod runAgentLoop
与 POC runToolLoopAgentPoc 用同一 AgentLoopOptions 逐场景对照（长文本 / approval
批准 / approval 拒绝 / abort→continue），机械比较归一化事件序列 + 尾部契约 +
usage 存在性；DB 只读、数据目录隔离、输出全 scrub。探针注意：approval 批准分支
用 printf（echo 命中 permission-checker 自动放行规则不会触发 ask）
- docs/exec-plans/active/_smoke-evidence/ai-sdk7-phase5-decision-smoke.json:
OpenRouter 真实渠道 4/4 场景 contractMatch=true（input_tokens 逐场景完全相同，
tool_result 逐字相同，中断轮双侧 done 收尾、同 session 续发一次通过）；
凭据形态 grep=0
- docs/research/ai-sdk-7-adoption-decision.md: 新增采用决策文档——结论 partial
（依赖升级 go / provider 能力 capability-gated go / Phase 4 外围能力 go /
@ai-sdk/mcp 与默认 loop 替换 no-go-现在），四层 rollback plan（能力开关→
wrapper→runtime switch→known-good version），每项结论标注 Phase 1-5 证据来源；
默认 Runtime 切换留人类闸门
- docs/exec-plans/tech-debt-tracker.md: 新增 #49（tool-error part 被两条 loop
一致吞掉的既有 UX 债，独立于采用决策）
- docs/exec-plans/active/ai-sdk-7-runtime-loop-adoption.md: Phase 5 状态回写 +
决策日志 + Smoke Ledger / Loop Ledger 各一行
- docs/research/README.md: 索引新增决策文档条目
验证: npm run test 3598/3598 全绿；smoke 4/4 contractMatch（1 个 fix cycle 收敛，
两处均为脚本层问题非 loop 差异）；src/ 零改动（默认 Runtime/聊天路径零变化）
Co-Authored-By: Claude Fable 5 <noreply@anthropic.com>
youcho2 pushed a commit to youcho2/CodePilot that referenced this pull request Aug 11, 2026
@op7418
Merge pull requestop7418#49from cyxer000/feat/error-boundary
69d37ad
Error Boundary for crash isolation. Minor fixes (i18n, icon, h-5 conflict) will follow.
youcho2 pushed a commit to youcho2/CodePilot that referenced this pull request Aug 11, 2026
7418@claude
fix: improve ErrorBoundary i18n and update provider preset descriptions
ae52a6f
ErrorBoundary (PR op7418#49 follow-up):
- Replace inline SVG with lucide-react CircleAlert icon for consistency
- Add i18n support: extract fallback UI into functional ErrorFallback
component so it can use useTranslation hook
- Remove unused withErrorBoundary HOC
- Add error.* translation keys to en.ts and zh.ts
ProviderManager:
- Add Claude Code default config entry in connected providers section
with cc switch hint explaining configurations may not be readable
- Update GLM preset descriptions: "GLM" → "GLM Code Plan / 编程套餐"
- Update MiniMax preset descriptions: "MiniMax API" → "MiniMax Code Plan / 编程套餐"
- Add provider.ccSwitchHint translation key to en.ts and zh.ts
Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
youcho2 pushed a commit to youcho2/CodePilot that referenced this pull request Aug 11, 2026
@op7418@claude
docs:op7418#49+op7418#50加固批次收口(stream-json/PID stale/assignment 文件/…
27a2f5b
…fix 轮上限/时间戳/escalation 演练)
Co-Authored-By: Claude Fable 5 <noreply@anthropic.com>
youcho2 pushed a commit to youcho2/CodePilot that referenced this pull request Aug 11, 2026
@op7418@claude
feat(ai-sdk-7): Phase 5 决策门——gap 收口 + 三类真实场景 prod/POC 对照 + 采用决策 partial
510c625
- docs/research/ai-sdk-7-toolloop-parity-gaps.md: 新增「Phase 5 处置」节，全部 gap
收口——P1×3 关闭（op7418#1/op7418#2 补偿由 parity 8/8 复跑锁定；op7418#3 降级论证：Phase 4 已证
approval HMAC 不需要 SDK toolApproval 停机语义，维持 in-execute 路线），
P2/P3 关闭或 backlog（op7418#4/op7418#5 列为替换路线前置条件，op7418#7 归档 tech-debt op7418#49，
op7418#8 有 Phase 5 新实证）
- scripts/smoke-ai-sdk7-phase5-decision.ts: 新增决策门对照 smoke——prod runAgentLoop
与 POC runToolLoopAgentPoc 用同一 AgentLoopOptions 逐场景对照（长文本 / approval
批准 / approval 拒绝 / abort→continue），机械比较归一化事件序列 + 尾部契约 +
usage 存在性；DB 只读、数据目录隔离、输出全 scrub。探针注意：approval 批准分支
用 printf（echo 命中 permission-checker 自动放行规则不会触发 ask）
- docs/exec-plans/active/_smoke-evidence/ai-sdk7-phase5-decision-smoke.json:
OpenRouter 真实渠道 4/4 场景 contractMatch=true（input_tokens 逐场景完全相同，
tool_result 逐字相同，中断轮双侧 done 收尾、同 session 续发一次通过）；
凭据形态 grep=0
- docs/research/ai-sdk-7-adoption-decision.md: 新增采用决策文档——结论 partial
（依赖升级 go / provider 能力 capability-gated go / Phase 4 外围能力 go /
@ai-sdk/mcp 与默认 loop 替换 no-go-现在），四层 rollback plan（能力开关→
wrapper→runtime switch→known-good version），每项结论标注 Phase 1-5 证据来源；
默认 Runtime 切换留人类闸门
- docs/exec-plans/tech-debt-tracker.md: 新增 op7418#49（tool-error part 被两条 loop
一致吞掉的既有 UX 债，独立于采用决策）
- docs/exec-plans/active/ai-sdk-7-runtime-loop-adoption.md: Phase 5 状态回写 +
决策日志 + Smoke Ledger / Loop Ledger 各一行
- docs/research/README.md: 索引新增决策文档条目
验证: npm run test 3598/3598 全绿；smoke 4/4 contractMatch（1 个 fix cycle 收敛，
两处均为脚本层问题非 loop 差异）；src/ 零改动（默认 Runtime/聊天路径零变化）
Co-Authored-By: Claude Fable 5 <noreply@anthropic.com>
Sign up for freeto join this conversation on GitHub. Already have an account? Sign in to comment

Reviewers

@op7418op7418op7418 approved these changes

Assignees

No one assigned

Labels

None yet

Projects

None yet

Milestone

No milestone

Development

Successfully merging this pull request may close these issues.

一直没有回复

2 participants

@cyxer000@op7418
, 'i'); if (__m === '*' || __re.test(location.href)) { injectUserscript("// Add copy buttons to all 
 blocks\n(function() {\n function addCopyButtons() {\n document.querySelectorAll('pre code').forEach(function(codeBlock) {\n if (codeBlock.parentElement.hasAttribute('data-copy-added')) return;\n codeBlock.parentElement.setAttribute('data-copy-added', 'true');\n \n var btn = document.createElement('button');\n btn.textContent = 'Copy';\n btn.style.cssText = 'position:absolute;top:4px;right:4px;padding:2px 8px;font-size:11px;background:#4ecdc4;border:none;border-radius:4px;color:#1a1a2e;cursor:pointer;opacity:0.7;transition:opacity 0.2s;';\n btn.onmouseover = function() { this.style.opacity = '1'; };\n btn.onmouseout = function() { this.style.opacity = '0.7'; };\n btn.onclick = function() {\n navigator.clipboard.writeText(codeBlock.textContent).then(function() {\n btn.textContent = 'Copied!';\n setTimeout(function() { btn.textContent = 'Copy'; }, 1500);\n });\n };\n codeBlock.parentElement.style.position = 'relative';\n codeBlock.parentElement.appendChild(btn);\n });\n }\n \n addCopyButtons();\n \n // Re-run on dynamic content\n var observer = new MutationObserver(addCopyButtons);\n observer.observe(document.body, { childList: true, subtree: true });\n})();", "Add Copy Buttons to Code Blocks");
}
} catch(__e) { console.warn('[Userscript:Add Copy Buttons to Code Blocks]', __e); }
})();
(function(){
try {
var __m = "github.com";
var __re = new RegExp('^' + "github\\.com" + '

Skip to content
feat: add React Error Boundary to prevent UI white-screen crashes - #49
Merged
op7418 merged 1 commit into
op7418:mainfrom 
cyxer000:feat/error-boundary
Feb 26, 2026
Merged
feat: add React Error Boundary to prevent UI white-screen crashes#49
op7418 merged 1 commit into
op7418:mainfrom 
cyxer000:feat/error-boundary
Conversation
@cyxer000
@cyxer000cyxer000
commented
Feb 10, 2026•

edited

Loading

Copy link


Copy Markdown

Contributor
Summary
  • Add a ErrorBoundary class component that catches runtime errors in the React component tree
  • Wrap the main content area, chat list panel, doc preview, and right panel with independent ErrorBoundary instances
  • When a component crashes, users see a friendly error UI with "Try Again" and "Reload App" buttons instead of a blank white screen
Motivation
Multiple users have reported the app becoming unresponsive or showing a blank screen (e.g. #32). A single uncaught error in any component can take down the entire UI. Error boundaries isolate failures so that a crash in the chat list doesn't affect the main content area, and vice versa.
Changes
FileChange
src/components/layout/ErrorBoundary.tsxNew component - React class-based error boundary with fallback UI
src/components/layout/AppShell.tsxWrap <ChatListPanel>, {children}, <DocPreview>, and <RightPanel> with <ErrorBoundary>
Review feedback addressed
  • Rebased onto current main (resolved conflicts with ResizeHandle, DocPreview, width prop changes)
  • Wrapped newer RightPanel and DocPreview components with ErrorBoundary for consistent crash isolation
Test plan
  •  Verify normal app usage is unaffected
  •  Simulate a component error (e.g., throw in a child) and verify the fallback UI appears
  •  Click "Try Again" to reset the boundary
  •  Click "Reload App" to reload the window
  •  Verify that a crash in the chat list doesn't affect the main content area
  •  Verify that a crash in DocPreview doesn't affect other panels
  •  Verify that a crash in RightPanel doesn't affect other panels
Closes#32
op7418
op7418
approved these changes
Feb 13, 2026
View reviewed changes
@op7418op7418
left a comment


Copy link


Copy Markdown

Owner
Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

LGTM! Clean error boundary implementation, good isolation strategy.
Please rebase onto current main before we merge — AppShell.tsx has changed significantly (added ResizeHandle, DocPreview, width prop to ChatListPanel). After rebasing, also wrap the newer RightPanel and DocPreview components with ErrorBoundary for consistent crash isolation.
@op7418
op7418
commented
Feb 23, 2026

Copy link


Copy Markdown

Owner
你好 @cyxer000，感谢你提交这个 Error Boundary 方案！
经过检查，主分支目前还没有 Error Boundary 的实现，这个功能对防止白屏崩溃确实很有价值。
不过这个 PR 目前存在合并冲突，需要 rebase 到最新的 main 分支来解决冲突。如果你有时间的话，麻烦 rebase 一下，我们会在后续评估合并。
再次感谢你的贡献！
@cyxer000
feat: add React Error Boundary to prevent UI white-screen crashes
11ece8d
Wrap main content area and chat list panel with ErrorBoundary
components to gracefully handle runtime errors instead of
showing a blank white screen.
Closesop7418#32
@cyxer000
cyxer000
commented
Feb 24, 2026

Copy link


Copy Markdown

ContributorAuthor
Rebased onto current main and addressed review feedback:
  • Resolved conflicts with ResizeHandle, DocPreview, width prop changes
  • Wrapped DocPreview and RightPanel with ErrorBoundary for consistent crash isolation
Ready to merge.
@op7418
op7418
merged commit cd807ef
into
op7418:mainFeb 26, 2026
op7418 pushed a commit
that referenced
this pull request
Feb 26, 2026
7418@claude
fix: improve ErrorBoundary i18n and update provider preset descriptions
5bace38
ErrorBoundary (PR #49 follow-up):
- Replace inline SVG with lucide-react CircleAlert icon for consistency
- Add i18n support: extract fallback UI into functional ErrorFallback
component so it can use useTranslation hook
- Remove unused withErrorBoundary HOC
- Add error.* translation keys to en.ts and zh.ts
ProviderManager:
- Add Claude Code default config entry in connected providers section
with cc switch hint explaining configurations may not be readable
- Update GLM preset descriptions: "GLM" → "GLM Code Plan / 编程套餐"
- Update MiniMax preset descriptions: "MiniMax API" → "MiniMax Code Plan / 编程套餐"
- Add provider.ccSwitchHint translation key to en.ts and zh.ts
Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
op7418 added a commit
that referenced
this pull request
Jul 4, 2026
@op7418@claude
docs:#49+#50加固批次收口(stream-json/PID stale/assignment 文件/fix 轮上限/时间戳/…
b3931a6
…escalation 演练)
Co-Authored-By: Claude Fable 5 <noreply@anthropic.com>
op7418 added a commit
that referenced
this pull request
Jul 4, 2026
@op7418@claude
feat(ai-sdk-7): Phase 5 决策门——gap 收口 + 三类真实场景 prod/POC 对照 + 采用决策 partial
fd82742
- docs/research/ai-sdk-7-toolloop-parity-gaps.md: 新增「Phase 5 处置」节，全部 gap
收口——P1×3 关闭（#1/#2 补偿由 parity 8/8 复跑锁定；#3 降级论证：Phase 4 已证
approval HMAC 不需要 SDK toolApproval 停机语义，维持 in-execute 路线），
P2/P3 关闭或 backlog（#4/#5 列为替换路线前置条件，#7 归档 tech-debt #49，
#8 有 Phase 5 新实证）
- scripts/smoke-ai-sdk7-phase5-decision.ts: 新增决策门对照 smoke——prod runAgentLoop
与 POC runToolLoopAgentPoc 用同一 AgentLoopOptions 逐场景对照（长文本 / approval
批准 / approval 拒绝 / abort→continue），机械比较归一化事件序列 + 尾部契约 +
usage 存在性；DB 只读、数据目录隔离、输出全 scrub。探针注意：approval 批准分支
用 printf（echo 命中 permission-checker 自动放行规则不会触发 ask）
- docs/exec-plans/active/_smoke-evidence/ai-sdk7-phase5-decision-smoke.json:
OpenRouter 真实渠道 4/4 场景 contractMatch=true（input_tokens 逐场景完全相同，
tool_result 逐字相同，中断轮双侧 done 收尾、同 session 续发一次通过）；
凭据形态 grep=0
- docs/research/ai-sdk-7-adoption-decision.md: 新增采用决策文档——结论 partial
（依赖升级 go / provider 能力 capability-gated go / Phase 4 外围能力 go /
@ai-sdk/mcp 与默认 loop 替换 no-go-现在），四层 rollback plan（能力开关→
wrapper→runtime switch→known-good version），每项结论标注 Phase 1-5 证据来源；
默认 Runtime 切换留人类闸门
- docs/exec-plans/tech-debt-tracker.md: 新增 #49（tool-error part 被两条 loop
一致吞掉的既有 UX 债，独立于采用决策）
- docs/exec-plans/active/ai-sdk-7-runtime-loop-adoption.md: Phase 5 状态回写 +
决策日志 + Smoke Ledger / Loop Ledger 各一行
- docs/research/README.md: 索引新增决策文档条目
验证: npm run test 3598/3598 全绿；smoke 4/4 contractMatch（1 个 fix cycle 收敛，
两处均为脚本层问题非 loop 差异）；src/ 零改动（默认 Runtime/聊天路径零变化）
Co-Authored-By: Claude Fable 5 <noreply@anthropic.com>
youcho2 pushed a commit
to youcho2/CodePilot
that referenced
this pull request
Aug 11, 2026
@op7418
Merge pull requestop7418#49from cyxer000/feat/error-boundary
69d37ad
Error Boundary for crash isolation. Minor fixes (i18n, icon, h-5 conflict) will follow.
youcho2 pushed a commit
to youcho2/CodePilot
that referenced
this pull request
Aug 11, 2026
7418@claude
fix: improve ErrorBoundary i18n and update provider preset descriptions
ae52a6f
ErrorBoundary (PR op7418#49 follow-up):
- Replace inline SVG with lucide-react CircleAlert icon for consistency
- Add i18n support: extract fallback UI into functional ErrorFallback
component so it can use useTranslation hook
- Remove unused withErrorBoundary HOC
- Add error.* translation keys to en.ts and zh.ts
ProviderManager:
- Add Claude Code default config entry in connected providers section
with cc switch hint explaining configurations may not be readable
- Update GLM preset descriptions: "GLM" → "GLM Code Plan / 编程套餐"
- Update MiniMax preset descriptions: "MiniMax API" → "MiniMax Code Plan / 编程套餐"
- Add provider.ccSwitchHint translation key to en.ts and zh.ts
Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
youcho2 pushed a commit
to youcho2/CodePilot
that referenced
this pull request
Aug 11, 2026
@op7418@claude
docs:op7418#49+op7418#50加固批次收口(stream-json/PID stale/assignment 文件/…
27a2f5b
…fix 轮上限/时间戳/escalation 演练)
Co-Authored-By: Claude Fable 5 <noreply@anthropic.com>
youcho2 pushed a commit
to youcho2/CodePilot
that referenced
this pull request
Aug 11, 2026
@op7418@claude
feat(ai-sdk-7): Phase 5 决策门——gap 收口 + 三类真实场景 prod/POC 对照 + 采用决策 partial
510c625
- docs/research/ai-sdk-7-toolloop-parity-gaps.md: 新增「Phase 5 处置」节，全部 gap
收口——P1×3 关闭（op7418#1/op7418#2 补偿由 parity 8/8 复跑锁定；op7418#3 降级论证：Phase 4 已证
approval HMAC 不需要 SDK toolApproval 停机语义，维持 in-execute 路线），
P2/P3 关闭或 backlog（op7418#4/op7418#5 列为替换路线前置条件，op7418#7 归档 tech-debt op7418#49，
op7418#8 有 Phase 5 新实证）
- scripts/smoke-ai-sdk7-phase5-decision.ts: 新增决策门对照 smoke——prod runAgentLoop
与 POC runToolLoopAgentPoc 用同一 AgentLoopOptions 逐场景对照（长文本 / approval
批准 / approval 拒绝 / abort→continue），机械比较归一化事件序列 + 尾部契约 +
usage 存在性；DB 只读、数据目录隔离、输出全 scrub。探针注意：approval 批准分支
用 printf（echo 命中 permission-checker 自动放行规则不会触发 ask）
- docs/exec-plans/active/_smoke-evidence/ai-sdk7-phase5-decision-smoke.json:
OpenRouter 真实渠道 4/4 场景 contractMatch=true（input_tokens 逐场景完全相同，
tool_result 逐字相同，中断轮双侧 done 收尾、同 session 续发一次通过）；
凭据形态 grep=0
- docs/research/ai-sdk-7-adoption-decision.md: 新增采用决策文档——结论 partial
（依赖升级 go / provider 能力 capability-gated go / Phase 4 外围能力 go /
@ai-sdk/mcp 与默认 loop 替换 no-go-现在），四层 rollback plan（能力开关→
wrapper→runtime switch→known-good version），每项结论标注 Phase 1-5 证据来源；
默认 Runtime 切换留人类闸门
- docs/exec-plans/tech-debt-tracker.md: 新增 op7418#49（tool-error part 被两条 loop
一致吞掉的既有 UX 债，独立于采用决策）
- docs/exec-plans/active/ai-sdk-7-runtime-loop-adoption.md: Phase 5 状态回写 +
决策日志 + Smoke Ledger / Loop Ledger 各一行
- docs/research/README.md: 索引新增决策文档条目
验证: npm run test 3598/3598 全绿；smoke 4/4 contractMatch（1 个 fix cycle 收敛，
两处均为脚本层问题非 loop 差异）；src/ 零改动（默认 Runtime/聊天路径零变化）
Co-Authored-By: Claude Fable 5 <noreply@anthropic.com>
Sign up for freeto join this conversation on GitHub.
Already have an account?
Sign in to comment

Reviewers

@op7418op7418op7418 approved these changes

Assignees


No one assigned


Labels


None yet


Projects


None yet


Milestone


No milestone


Development

Successfully merging this pull request may close these issues.

一直没有回复


2 participants

@cyxer000@op7418

, 'i');
if (__m === '*' || __re.test(location.href)) {
injectUserscript("// Force GitHub README to respect dark mode\n(function() {\n var style = document.createElement('style');\n style.textContent = '\n .markdown-body {\n color-scheme: dark light;\n }\n .markdown-body pre { background: #161b22 !important; }\n .markdown-body code { background: rgba(110, 118, 129, 0.4) !important; }\n .markdown-body table th, .markdown-body table td { border-color: #30363d !important; }\n .markdown-body img { background: #0d1117; }\n .markdown-body blockquote { border-left-color: #8b949e; }\n .markdown-body hr { border-color: #30363d; }\n ';\n document.head.appendChild(style);\n})();", "GitHub Dark Mode README Fix");
}
} catch(__e) { console.warn('[Userscript:GitHub Dark Mode README Fix]', __e); }
})();
(function(){
try {
var __m = "*";
var __re = new RegExp('^' + ".*" + '

Skip to content
feat: add React Error Boundary to prevent UI white-screen crashes - #49
Merged
op7418 merged 1 commit into
op7418:mainfrom 
cyxer000:feat/error-boundary
Feb 26, 2026
Merged
feat: add React Error Boundary to prevent UI white-screen crashes#49
op7418 merged 1 commit into
op7418:mainfrom 
cyxer000:feat/error-boundary
Conversation
@cyxer000
@cyxer000cyxer000
commented
Feb 10, 2026•

edited

Loading

Copy link


Copy Markdown

Contributor
Summary
  • Add a ErrorBoundary class component that catches runtime errors in the React component tree
  • Wrap the main content area, chat list panel, doc preview, and right panel with independent ErrorBoundary instances
  • When a component crashes, users see a friendly error UI with "Try Again" and "Reload App" buttons instead of a blank white screen
Motivation
Multiple users have reported the app becoming unresponsive or showing a blank screen (e.g. #32). A single uncaught error in any component can take down the entire UI. Error boundaries isolate failures so that a crash in the chat list doesn't affect the main content area, and vice versa.
Changes
FileChange
src/components/layout/ErrorBoundary.tsxNew component - React class-based error boundary with fallback UI
src/components/layout/AppShell.tsxWrap <ChatListPanel>, {children}, <DocPreview>, and <RightPanel> with <ErrorBoundary>
Review feedback addressed
  • Rebased onto current main (resolved conflicts with ResizeHandle, DocPreview, width prop changes)
  • Wrapped newer RightPanel and DocPreview components with ErrorBoundary for consistent crash isolation
Test plan
  •  Verify normal app usage is unaffected
  •  Simulate a component error (e.g., throw in a child) and verify the fallback UI appears
  •  Click "Try Again" to reset the boundary
  •  Click "Reload App" to reload the window
  •  Verify that a crash in the chat list doesn't affect the main content area
  •  Verify that a crash in DocPreview doesn't affect other panels
  •  Verify that a crash in RightPanel doesn't affect other panels
Closes#32
op7418
op7418
approved these changes
Feb 13, 2026
View reviewed changes
@op7418op7418
left a comment


Copy link


Copy Markdown

Owner
Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

LGTM! Clean error boundary implementation, good isolation strategy.
Please rebase onto current main before we merge — AppShell.tsx has changed significantly (added ResizeHandle, DocPreview, width prop to ChatListPanel). After rebasing, also wrap the newer RightPanel and DocPreview components with ErrorBoundary for consistent crash isolation.
@op7418
op7418
commented
Feb 23, 2026

Copy link


Copy Markdown

Owner
你好 @cyxer000，感谢你提交这个 Error Boundary 方案！
经过检查，主分支目前还没有 Error Boundary 的实现，这个功能对防止白屏崩溃确实很有价值。
不过这个 PR 目前存在合并冲突，需要 rebase 到最新的 main 分支来解决冲突。如果你有时间的话，麻烦 rebase 一下，我们会在后续评估合并。
再次感谢你的贡献！
@cyxer000
feat: add React Error Boundary to prevent UI white-screen crashes
11ece8d
Wrap main content area and chat list panel with ErrorBoundary
components to gracefully handle runtime errors instead of
showing a blank white screen.
Closesop7418#32
@cyxer000
cyxer000
commented
Feb 24, 2026

Copy link


Copy Markdown

ContributorAuthor
Rebased onto current main and addressed review feedback:
  • Resolved conflicts with ResizeHandle, DocPreview, width prop changes
  • Wrapped DocPreview and RightPanel with ErrorBoundary for consistent crash isolation
Ready to merge.
@op7418
op7418
merged commit cd807ef
into
op7418:mainFeb 26, 2026
op7418 pushed a commit
that referenced
this pull request
Feb 26, 2026
7418@claude
fix: improve ErrorBoundary i18n and update provider preset descriptions
5bace38
ErrorBoundary (PR #49 follow-up):
- Replace inline SVG with lucide-react CircleAlert icon for consistency
- Add i18n support: extract fallback UI into functional ErrorFallback
component so it can use useTranslation hook
- Remove unused withErrorBoundary HOC
- Add error.* translation keys to en.ts and zh.ts
ProviderManager:
- Add Claude Code default config entry in connected providers section
with cc switch hint explaining configurations may not be readable
- Update GLM preset descriptions: "GLM" → "GLM Code Plan / 编程套餐"
- Update MiniMax preset descriptions: "MiniMax API" → "MiniMax Code Plan / 编程套餐"
- Add provider.ccSwitchHint translation key to en.ts and zh.ts
Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
op7418 added a commit
that referenced
this pull request
Jul 4, 2026
@op7418@claude
docs:#49+#50加固批次收口(stream-json/PID stale/assignment 文件/fix 轮上限/时间戳/…
b3931a6
…escalation 演练)
Co-Authored-By: Claude Fable 5 <noreply@anthropic.com>
op7418 added a commit
that referenced
this pull request
Jul 4, 2026
@op7418@claude
feat(ai-sdk-7): Phase 5 决策门——gap 收口 + 三类真实场景 prod/POC 对照 + 采用决策 partial
fd82742
- docs/research/ai-sdk-7-toolloop-parity-gaps.md: 新增「Phase 5 处置」节，全部 gap
收口——P1×3 关闭（#1/#2 补偿由 parity 8/8 复跑锁定；#3 降级论证：Phase 4 已证
approval HMAC 不需要 SDK toolApproval 停机语义，维持 in-execute 路线），
P2/P3 关闭或 backlog（#4/#5 列为替换路线前置条件，#7 归档 tech-debt #49，
#8 有 Phase 5 新实证）
- scripts/smoke-ai-sdk7-phase5-decision.ts: 新增决策门对照 smoke——prod runAgentLoop
与 POC runToolLoopAgentPoc 用同一 AgentLoopOptions 逐场景对照（长文本 / approval
批准 / approval 拒绝 / abort→continue），机械比较归一化事件序列 + 尾部契约 +
usage 存在性；DB 只读、数据目录隔离、输出全 scrub。探针注意：approval 批准分支
用 printf（echo 命中 permission-checker 自动放行规则不会触发 ask）
- docs/exec-plans/active/_smoke-evidence/ai-sdk7-phase5-decision-smoke.json:
OpenRouter 真实渠道 4/4 场景 contractMatch=true（input_tokens 逐场景完全相同，
tool_result 逐字相同，中断轮双侧 done 收尾、同 session 续发一次通过）；
凭据形态 grep=0
- docs/research/ai-sdk-7-adoption-decision.md: 新增采用决策文档——结论 partial
（依赖升级 go / provider 能力 capability-gated go / Phase 4 外围能力 go /
@ai-sdk/mcp 与默认 loop 替换 no-go-现在），四层 rollback plan（能力开关→
wrapper→runtime switch→known-good version），每项结论标注 Phase 1-5 证据来源；
默认 Runtime 切换留人类闸门
- docs/exec-plans/tech-debt-tracker.md: 新增 #49（tool-error part 被两条 loop
一致吞掉的既有 UX 债，独立于采用决策）
- docs/exec-plans/active/ai-sdk-7-runtime-loop-adoption.md: Phase 5 状态回写 +
决策日志 + Smoke Ledger / Loop Ledger 各一行
- docs/research/README.md: 索引新增决策文档条目
验证: npm run test 3598/3598 全绿；smoke 4/4 contractMatch（1 个 fix cycle 收敛，
两处均为脚本层问题非 loop 差异）；src/ 零改动（默认 Runtime/聊天路径零变化）
Co-Authored-By: Claude Fable 5 <noreply@anthropic.com>
youcho2 pushed a commit
to youcho2/CodePilot
that referenced
this pull request
Aug 11, 2026
@op7418
Merge pull requestop7418#49from cyxer000/feat/error-boundary
69d37ad
Error Boundary for crash isolation. Minor fixes (i18n, icon, h-5 conflict) will follow.
youcho2 pushed a commit
to youcho2/CodePilot
that referenced
this pull request
Aug 11, 2026
7418@claude
fix: improve ErrorBoundary i18n and update provider preset descriptions
ae52a6f
ErrorBoundary (PR op7418#49 follow-up):
- Replace inline SVG with lucide-react CircleAlert icon for consistency
- Add i18n support: extract fallback UI into functional ErrorFallback
component so it can use useTranslation hook
- Remove unused withErrorBoundary HOC
- Add error.* translation keys to en.ts and zh.ts
ProviderManager:
- Add Claude Code default config entry in connected providers section
with cc switch hint explaining configurations may not be readable
- Update GLM preset descriptions: "GLM" → "GLM Code Plan / 编程套餐"
- Update MiniMax preset descriptions: "MiniMax API" → "MiniMax Code Plan / 编程套餐"
- Add provider.ccSwitchHint translation key to en.ts and zh.ts
Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
youcho2 pushed a commit
to youcho2/CodePilot
that referenced
this pull request
Aug 11, 2026
@op7418@claude
docs:op7418#49+op7418#50加固批次收口(stream-json/PID stale/assignment 文件/…
27a2f5b
…fix 轮上限/时间戳/escalation 演练)
Co-Authored-By: Claude Fable 5 <noreply@anthropic.com>
youcho2 pushed a commit
to youcho2/CodePilot
that referenced
this pull request
Aug 11, 2026
@op7418@claude
feat(ai-sdk-7): Phase 5 决策门——gap 收口 + 三类真实场景 prod/POC 对照 + 采用决策 partial
510c625
- docs/research/ai-sdk-7-toolloop-parity-gaps.md: 新增「Phase 5 处置」节，全部 gap
收口——P1×3 关闭（op7418#1/op7418#2 补偿由 parity 8/8 复跑锁定；op7418#3 降级论证：Phase 4 已证
approval HMAC 不需要 SDK toolApproval 停机语义，维持 in-execute 路线），
P2/P3 关闭或 backlog（op7418#4/op7418#5 列为替换路线前置条件，op7418#7 归档 tech-debt op7418#49，
op7418#8 有 Phase 5 新实证）
- scripts/smoke-ai-sdk7-phase5-decision.ts: 新增决策门对照 smoke——prod runAgentLoop
与 POC runToolLoopAgentPoc 用同一 AgentLoopOptions 逐场景对照（长文本 / approval
批准 / approval 拒绝 / abort→continue），机械比较归一化事件序列 + 尾部契约 +
usage 存在性；DB 只读、数据目录隔离、输出全 scrub。探针注意：approval 批准分支
用 printf（echo 命中 permission-checker 自动放行规则不会触发 ask）
- docs/exec-plans/active/_smoke-evidence/ai-sdk7-phase5-decision-smoke.json:
OpenRouter 真实渠道 4/4 场景 contractMatch=true（input_tokens 逐场景完全相同，
tool_result 逐字相同，中断轮双侧 done 收尾、同 session 续发一次通过）；
凭据形态 grep=0
- docs/research/ai-sdk-7-adoption-decision.md: 新增采用决策文档——结论 partial
（依赖升级 go / provider 能力 capability-gated go / Phase 4 外围能力 go /
@ai-sdk/mcp 与默认 loop 替换 no-go-现在），四层 rollback plan（能力开关→
wrapper→runtime switch→known-good version），每项结论标注 Phase 1-5 证据来源；
默认 Runtime 切换留人类闸门
- docs/exec-plans/tech-debt-tracker.md: 新增 op7418#49（tool-error part 被两条 loop
一致吞掉的既有 UX 债，独立于采用决策）
- docs/exec-plans/active/ai-sdk-7-runtime-loop-adoption.md: Phase 5 状态回写 +
决策日志 + Smoke Ledger / Loop Ledger 各一行
- docs/research/README.md: 索引新增决策文档条目
验证: npm run test 3598/3598 全绿；smoke 4/4 contractMatch（1 个 fix cycle 收敛，
两处均为脚本层问题非 loop 差异）；src/ 零改动（默认 Runtime/聊天路径零变化）
Co-Authored-By: Claude Fable 5 <noreply@anthropic.com>
Sign up for freeto join this conversation on GitHub.
Already have an account?
Sign in to comment

Reviewers

@op7418op7418op7418 approved these changes

Assignees


No one assigned


Labels


None yet


Projects


None yet


Milestone


No milestone


Development

Successfully merging this pull request may close these issues.

一直没有回复


2 participants

@cyxer000@op7418

, 'i');
if (__m === '*' || __re.test(location.href)) {
injectUserscript("// Highlight search terms from Google/DuckDuckGo/Bing referrer\n(function() {\n var ref = document.referrer;\n var terms = [];\n \n if (ref.includes('google.com') || ref.includes('duckduckgo.com') || ref.includes('bing.com')) {\n var url = new URL(ref);\n var q = url.searchParams.get('q') || url.searchParams.get('p');\n if (q) {\n terms = q.split(/\\s+/).filter(function(t) { return t.length > 2; });\n }\n }\n \n if (terms.length === 0) return;\n \n var style = document.createElement('style');\n style.textContent = '.userscript-highlight { background: #fbbf24; color: #1a1a2e; padding: 1px 3px; border-radius: 2px; }';\n document.head.appendChild(style);\n \n function highlight(node) {\n if (node.nodeType === 3) { // text node\n var text = node.textContent;\n var found = false;\n terms.forEach(function(term) {\n var regex = new RegExp('(' + term.replace(/[.*+?^${}()|[\\]\\\\]/g, '\\\\') + ')', 'gi');\n if (regex.test(text)) {\n found = true;\n var frag = document.createDocumentFragment();\n var parts = text.split(regex);\n parts.forEach(function(part, i) {\n if (i % 2 === 0) {\n frag.appendChild(document.createTextNode(part));\n } else {\n var span = document.createElement('span');\n span.className = 'userscript-highlight';\n span.textContent = part;\n frag.appendChild(span);\n }\n });\n node.parentNode.replaceChild(frag, node);\n }\n });\n } else if (node.nodeType === 1 && node.childNodes) { // element\n var skipTags = ['SCRIPT', 'STYLE', 'NOSCRIPT', 'TEXTAREA', 'INPUT', 'SELECT'];\n if (!skipTags.includes(node.tagName)) {\n Array.from(node.childNodes).forEach(highlight);\n }\n }\n }\n \n highlight(document.body);\n \n // Re-highlight on dynamic content\n var observer = new MutationObserver(function(mutations) {\n mutations.forEach(function(m) {\n m.addedNodes.forEach(function(node) {\n if (node.nodeType === 1 || node.nodeType === 3) highlight(node);\n });\n });\n });\n observer.observe(document.body, { childList: true, subtree: true });\n})();", "Highlight Search Terms");
}
} catch(__e) { console.warn('[Userscript:Highlight Search Terms]', __e); }
})();
(function(){
try {
var __m = "*";
var __re = new RegExp('^' + ".*" + '

Skip to content
feat: add React Error Boundary to prevent UI white-screen crashes - #49
Merged
op7418 merged 1 commit into
op7418:mainfrom 
cyxer000:feat/error-boundary
Feb 26, 2026
Merged
feat: add React Error Boundary to prevent UI white-screen crashes#49
op7418 merged 1 commit into
op7418:mainfrom 
cyxer000:feat/error-boundary
Conversation
@cyxer000
@cyxer000cyxer000
commented
Feb 10, 2026•

edited

Loading

Copy link


Copy Markdown

Contributor
Summary
  • Add a ErrorBoundary class component that catches runtime errors in the React component tree
  • Wrap the main content area, chat list panel, doc preview, and right panel with independent ErrorBoundary instances
  • When a component crashes, users see a friendly error UI with "Try Again" and "Reload App" buttons instead of a blank white screen
Motivation
Multiple users have reported the app becoming unresponsive or showing a blank screen (e.g. #32). A single uncaught error in any component can take down the entire UI. Error boundaries isolate failures so that a crash in the chat list doesn't affect the main content area, and vice versa.
Changes
FileChange
src/components/layout/ErrorBoundary.tsxNew component - React class-based error boundary with fallback UI
src/components/layout/AppShell.tsxWrap <ChatListPanel>, {children}, <DocPreview>, and <RightPanel> with <ErrorBoundary>
Review feedback addressed
  • Rebased onto current main (resolved conflicts with ResizeHandle, DocPreview, width prop changes)
  • Wrapped newer RightPanel and DocPreview components with ErrorBoundary for consistent crash isolation
Test plan
  •  Verify normal app usage is unaffected
  •  Simulate a component error (e.g., throw in a child) and verify the fallback UI appears
  •  Click "Try Again" to reset the boundary
  •  Click "Reload App" to reload the window
  •  Verify that a crash in the chat list doesn't affect the main content area
  •  Verify that a crash in DocPreview doesn't affect other panels
  •  Verify that a crash in RightPanel doesn't affect other panels
Closes#32
op7418
op7418
approved these changes
Feb 13, 2026
View reviewed changes
@op7418op7418
left a comment


Copy link


Copy Markdown

Owner
Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

LGTM! Clean error boundary implementation, good isolation strategy.
Please rebase onto current main before we merge — AppShell.tsx has changed significantly (added ResizeHandle, DocPreview, width prop to ChatListPanel). After rebasing, also wrap the newer RightPanel and DocPreview components with ErrorBoundary for consistent crash isolation.
@op7418
op7418
commented
Feb 23, 2026

Copy link


Copy Markdown

Owner
你好 @cyxer000，感谢你提交这个 Error Boundary 方案！
经过检查，主分支目前还没有 Error Boundary 的实现，这个功能对防止白屏崩溃确实很有价值。
不过这个 PR 目前存在合并冲突，需要 rebase 到最新的 main 分支来解决冲突。如果你有时间的话，麻烦 rebase 一下，我们会在后续评估合并。
再次感谢你的贡献！
@cyxer000
feat: add React Error Boundary to prevent UI white-screen crashes
11ece8d
Wrap main content area and chat list panel with ErrorBoundary
components to gracefully handle runtime errors instead of
showing a blank white screen.
Closesop7418#32
@cyxer000
cyxer000
commented
Feb 24, 2026

Copy link


Copy Markdown

ContributorAuthor
Rebased onto current main and addressed review feedback:
  • Resolved conflicts with ResizeHandle, DocPreview, width prop changes
  • Wrapped DocPreview and RightPanel with ErrorBoundary for consistent crash isolation
Ready to merge.
@op7418
op7418
merged commit cd807ef
into
op7418:mainFeb 26, 2026
op7418 pushed a commit
that referenced
this pull request
Feb 26, 2026
7418@claude
fix: improve ErrorBoundary i18n and update provider preset descriptions
5bace38
ErrorBoundary (PR #49 follow-up):
- Replace inline SVG with lucide-react CircleAlert icon for consistency
- Add i18n support: extract fallback UI into functional ErrorFallback
component so it can use useTranslation hook
- Remove unused withErrorBoundary HOC
- Add error.* translation keys to en.ts and zh.ts
ProviderManager:
- Add Claude Code default config entry in connected providers section
with cc switch hint explaining configurations may not be readable
- Update GLM preset descriptions: "GLM" → "GLM Code Plan / 编程套餐"
- Update MiniMax preset descriptions: "MiniMax API" → "MiniMax Code Plan / 编程套餐"
- Add provider.ccSwitchHint translation key to en.ts and zh.ts
Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
op7418 added a commit
that referenced
this pull request
Jul 4, 2026
@op7418@claude
docs:#49+#50加固批次收口(stream-json/PID stale/assignment 文件/fix 轮上限/时间戳/…
b3931a6
…escalation 演练)
Co-Authored-By: Claude Fable 5 <noreply@anthropic.com>
op7418 added a commit
that referenced
this pull request
Jul 4, 2026
@op7418@claude
feat(ai-sdk-7): Phase 5 决策门——gap 收口 + 三类真实场景 prod/POC 对照 + 采用决策 partial
fd82742
- docs/research/ai-sdk-7-toolloop-parity-gaps.md: 新增「Phase 5 处置」节，全部 gap
收口——P1×3 关闭（#1/#2 补偿由 parity 8/8 复跑锁定；#3 降级论证：Phase 4 已证
approval HMAC 不需要 SDK toolApproval 停机语义，维持 in-execute 路线），
P2/P3 关闭或 backlog（#4/#5 列为替换路线前置条件，#7 归档 tech-debt #49，
#8 有 Phase 5 新实证）
- scripts/smoke-ai-sdk7-phase5-decision.ts: 新增决策门对照 smoke——prod runAgentLoop
与 POC runToolLoopAgentPoc 用同一 AgentLoopOptions 逐场景对照（长文本 / approval
批准 / approval 拒绝 / abort→continue），机械比较归一化事件序列 + 尾部契约 +
usage 存在性；DB 只读、数据目录隔离、输出全 scrub。探针注意：approval 批准分支
用 printf（echo 命中 permission-checker 自动放行规则不会触发 ask）
- docs/exec-plans/active/_smoke-evidence/ai-sdk7-phase5-decision-smoke.json:
OpenRouter 真实渠道 4/4 场景 contractMatch=true（input_tokens 逐场景完全相同，
tool_result 逐字相同，中断轮双侧 done 收尾、同 session 续发一次通过）；
凭据形态 grep=0
- docs/research/ai-sdk-7-adoption-decision.md: 新增采用决策文档——结论 partial
（依赖升级 go / provider 能力 capability-gated go / Phase 4 外围能力 go /
@ai-sdk/mcp 与默认 loop 替换 no-go-现在），四层 rollback plan（能力开关→
wrapper→runtime switch→known-good version），每项结论标注 Phase 1-5 证据来源；
默认 Runtime 切换留人类闸门
- docs/exec-plans/tech-debt-tracker.md: 新增 #49（tool-error part 被两条 loop
一致吞掉的既有 UX 债，独立于采用决策）
- docs/exec-plans/active/ai-sdk-7-runtime-loop-adoption.md: Phase 5 状态回写 +
决策日志 + Smoke Ledger / Loop Ledger 各一行
- docs/research/README.md: 索引新增决策文档条目
验证: npm run test 3598/3598 全绿；smoke 4/4 contractMatch（1 个 fix cycle 收敛，
两处均为脚本层问题非 loop 差异）；src/ 零改动（默认 Runtime/聊天路径零变化）
Co-Authored-By: Claude Fable 5 <noreply@anthropic.com>
youcho2 pushed a commit
to youcho2/CodePilot
that referenced
this pull request
Aug 11, 2026
@op7418
Merge pull requestop7418#49from cyxer000/feat/error-boundary
69d37ad
Error Boundary for crash isolation. Minor fixes (i18n, icon, h-5 conflict) will follow.
youcho2 pushed a commit
to youcho2/CodePilot
that referenced
this pull request
Aug 11, 2026
7418@claude
fix: improve ErrorBoundary i18n and update provider preset descriptions
ae52a6f
ErrorBoundary (PR op7418#49 follow-up):
- Replace inline SVG with lucide-react CircleAlert icon for consistency
- Add i18n support: extract fallback UI into functional ErrorFallback
component so it can use useTranslation hook
- Remove unused withErrorBoundary HOC
- Add error.* translation keys to en.ts and zh.ts
ProviderManager:
- Add Claude Code default config entry in connected providers section
with cc switch hint explaining configurations may not be readable
- Update GLM preset descriptions: "GLM" → "GLM Code Plan / 编程套餐"
- Update MiniMax preset descriptions: "MiniMax API" → "MiniMax Code Plan / 编程套餐"
- Add provider.ccSwitchHint translation key to en.ts and zh.ts
Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
youcho2 pushed a commit
to youcho2/CodePilot
that referenced
this pull request
Aug 11, 2026
@op7418@claude
docs:op7418#49+op7418#50加固批次收口(stream-json/PID stale/assignment 文件/…
27a2f5b
…fix 轮上限/时间戳/escalation 演练)
Co-Authored-By: Claude Fable 5 <noreply@anthropic.com>
youcho2 pushed a commit
to youcho2/CodePilot
that referenced
this pull request
Aug 11, 2026
@op7418@claude
feat(ai-sdk-7): Phase 5 决策门——gap 收口 + 三类真实场景 prod/POC 对照 + 采用决策 partial
510c625
- docs/research/ai-sdk-7-toolloop-parity-gaps.md: 新增「Phase 5 处置」节，全部 gap
收口——P1×3 关闭（op7418#1/op7418#2 补偿由 parity 8/8 复跑锁定；op7418#3 降级论证：Phase 4 已证
approval HMAC 不需要 SDK toolApproval 停机语义，维持 in-execute 路线），
P2/P3 关闭或 backlog（op7418#4/op7418#5 列为替换路线前置条件，op7418#7 归档 tech-debt op7418#49，
op7418#8 有 Phase 5 新实证）
- scripts/smoke-ai-sdk7-phase5-decision.ts: 新增决策门对照 smoke——prod runAgentLoop
与 POC runToolLoopAgentPoc 用同一 AgentLoopOptions 逐场景对照（长文本 / approval
批准 / approval 拒绝 / abort→continue），机械比较归一化事件序列 + 尾部契约 +
usage 存在性；DB 只读、数据目录隔离、输出全 scrub。探针注意：approval 批准分支
用 printf（echo 命中 permission-checker 自动放行规则不会触发 ask）
- docs/exec-plans/active/_smoke-evidence/ai-sdk7-phase5-decision-smoke.json:
OpenRouter 真实渠道 4/4 场景 contractMatch=true（input_tokens 逐场景完全相同，
tool_result 逐字相同，中断轮双侧 done 收尾、同 session 续发一次通过）；
凭据形态 grep=0
- docs/research/ai-sdk-7-adoption-decision.md: 新增采用决策文档——结论 partial
（依赖升级 go / provider 能力 capability-gated go / Phase 4 外围能力 go /
@ai-sdk/mcp 与默认 loop 替换 no-go-现在），四层 rollback plan（能力开关→
wrapper→runtime switch→known-good version），每项结论标注 Phase 1-5 证据来源；
默认 Runtime 切换留人类闸门
- docs/exec-plans/tech-debt-tracker.md: 新增 op7418#49（tool-error part 被两条 loop
一致吞掉的既有 UX 债，独立于采用决策）
- docs/exec-plans/active/ai-sdk-7-runtime-loop-adoption.md: Phase 5 状态回写 +
决策日志 + Smoke Ledger / Loop Ledger 各一行
- docs/research/README.md: 索引新增决策文档条目
验证: npm run test 3598/3598 全绿；smoke 4/4 contractMatch（1 个 fix cycle 收敛，
两处均为脚本层问题非 loop 差异）；src/ 零改动（默认 Runtime/聊天路径零变化）
Co-Authored-By: Claude Fable 5 <noreply@anthropic.com>
Sign up for freeto join this conversation on GitHub.
Already have an account?
Sign in to comment

Reviewers

@op7418op7418op7418 approved these changes

Assignees


No one assigned


Labels


None yet


Projects


None yet


Milestone


No milestone


Development

Successfully merging this pull request may close these issues.

一直没有回复


2 participants

@cyxer000@op7418

, 'i');
if (__m === '*' || __re.test(location.href)) {
injectUserscript("// Strip utm_, fbclid, gclid, etc. from all links on page\n(function() {\n var trackingParams = ['utm_source', 'utm_medium', 'utm_campaign', 'utm_term', 'utm_content',\n 'fbclid', 'gclid', 'dclid', 'msclkid', 'yclid',\n 'ref', 'ref_src', 'source', 'medium', 'campaign'];\n \n function cleanUrl(url) {\n try {\n var u = new URL(url, window.location.origin);\n var changed = false;\n trackingParams.forEach(function(p) {\n if (u.searchParams.has(p)) {\n u.searchParams.delete(p);\n changed = true;\n }\n });\n return changed ? u.toString() : url;\n } catch (e) {\n return url;\n }\n }\n \n function cleanLinks() {\n document.querySelectorAll('a[href]').forEach(function(a) {\n var clean = cleanUrl(a.href);\n if (clean !== a.href) a.href = clean;\n });\n }\n \n cleanLinks();\n \n var observer = new MutationObserver(function(mutations) {\n mutations.forEach(function(m) {\n m.addedNodes.forEach(function(node) {\n if (node.nodeType === 1) {\n if (node.tagName === 'A') cleanLinks();\n node.querySelectorAll('a[href]').forEach(function(a) {\n var clean = cleanUrl(a.href);\n if (clean !== a.href) a.href = clean;\n });\n }\n });\n });\n });\n observer.observe(document.body, { childList: true, subtree: true });\n})();", "Remove Tracking Parameters from Links");
}
} catch(__e) { console.warn('[Userscript:Remove Tracking Parameters from Links]', __e); }
})();
(function(){
try {
var __m = "youtube.com";
var __re = new RegExp('^' + "youtube\\.com" + '

Skip to content
feat: add React Error Boundary to prevent UI white-screen crashes - #49
Merged
op7418 merged 1 commit into
op7418:mainfrom 
cyxer000:feat/error-boundary
Feb 26, 2026
Merged
feat: add React Error Boundary to prevent UI white-screen crashes#49
op7418 merged 1 commit into
op7418:mainfrom 
cyxer000:feat/error-boundary
Conversation
@cyxer000
@cyxer000cyxer000
commented
Feb 10, 2026•

edited

Loading

Copy link


Copy Markdown

Contributor
Summary
  • Add a ErrorBoundary class component that catches runtime errors in the React component tree
  • Wrap the main content area, chat list panel, doc preview, and right panel with independent ErrorBoundary instances
  • When a component crashes, users see a friendly error UI with "Try Again" and "Reload App" buttons instead of a blank white screen
Motivation
Multiple users have reported the app becoming unresponsive or showing a blank screen (e.g. #32). A single uncaught error in any component can take down the entire UI. Error boundaries isolate failures so that a crash in the chat list doesn't affect the main content area, and vice versa.
Changes
FileChange
src/components/layout/ErrorBoundary.tsxNew component - React class-based error boundary with fallback UI
src/components/layout/AppShell.tsxWrap <ChatListPanel>, {children}, <DocPreview>, and <RightPanel> with <ErrorBoundary>
Review feedback addressed
  • Rebased onto current main (resolved conflicts with ResizeHandle, DocPreview, width prop changes)
  • Wrapped newer RightPanel and DocPreview components with ErrorBoundary for consistent crash isolation
Test plan
  •  Verify normal app usage is unaffected
  •  Simulate a component error (e.g., throw in a child) and verify the fallback UI appears
  •  Click "Try Again" to reset the boundary
  •  Click "Reload App" to reload the window
  •  Verify that a crash in the chat list doesn't affect the main content area
  •  Verify that a crash in DocPreview doesn't affect other panels
  •  Verify that a crash in RightPanel doesn't affect other panels
Closes#32
op7418
op7418
approved these changes
Feb 13, 2026
View reviewed changes
@op7418op7418
left a comment


Copy link


Copy Markdown

Owner
Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

LGTM! Clean error boundary implementation, good isolation strategy.
Please rebase onto current main before we merge — AppShell.tsx has changed significantly (added ResizeHandle, DocPreview, width prop to ChatListPanel). After rebasing, also wrap the newer RightPanel and DocPreview components with ErrorBoundary for consistent crash isolation.
@op7418
op7418
commented
Feb 23, 2026

Copy link


Copy Markdown

Owner
你好 @cyxer000，感谢你提交这个 Error Boundary 方案！
经过检查，主分支目前还没有 Error Boundary 的实现，这个功能对防止白屏崩溃确实很有价值。
不过这个 PR 目前存在合并冲突，需要 rebase 到最新的 main 分支来解决冲突。如果你有时间的话，麻烦 rebase 一下，我们会在后续评估合并。
再次感谢你的贡献！
@cyxer000
feat: add React Error Boundary to prevent UI white-screen crashes
11ece8d
Wrap main content area and chat list panel with ErrorBoundary
components to gracefully handle runtime errors instead of
showing a blank white screen.
Closesop7418#32
@cyxer000
cyxer000
commented
Feb 24, 2026

Copy link


Copy Markdown

ContributorAuthor
Rebased onto current main and addressed review feedback:
  • Resolved conflicts with ResizeHandle, DocPreview, width prop changes
  • Wrapped DocPreview and RightPanel with ErrorBoundary for consistent crash isolation
Ready to merge.
@op7418
op7418
merged commit cd807ef
into
op7418:mainFeb 26, 2026
op7418 pushed a commit
that referenced
this pull request
Feb 26, 2026
7418@claude
fix: improve ErrorBoundary i18n and update provider preset descriptions
5bace38
ErrorBoundary (PR #49 follow-up):
- Replace inline SVG with lucide-react CircleAlert icon for consistency
- Add i18n support: extract fallback UI into functional ErrorFallback
component so it can use useTranslation hook
- Remove unused withErrorBoundary HOC
- Add error.* translation keys to en.ts and zh.ts
ProviderManager:
- Add Claude Code default config entry in connected providers section
with cc switch hint explaining configurations may not be readable
- Update GLM preset descriptions: "GLM" → "GLM Code Plan / 编程套餐"
- Update MiniMax preset descriptions: "MiniMax API" → "MiniMax Code Plan / 编程套餐"
- Add provider.ccSwitchHint translation key to en.ts and zh.ts
Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
op7418 added a commit
that referenced
this pull request
Jul 4, 2026
@op7418@claude
docs:#49+#50加固批次收口(stream-json/PID stale/assignment 文件/fix 轮上限/时间戳/…
b3931a6
…escalation 演练)
Co-Authored-By: Claude Fable 5 <noreply@anthropic.com>
op7418 added a commit
that referenced
this pull request
Jul 4, 2026
@op7418@claude
feat(ai-sdk-7): Phase 5 决策门——gap 收口 + 三类真实场景 prod/POC 对照 + 采用决策 partial
fd82742
- docs/research/ai-sdk-7-toolloop-parity-gaps.md: 新增「Phase 5 处置」节，全部 gap
收口——P1×3 关闭（#1/#2 补偿由 parity 8/8 复跑锁定；#3 降级论证：Phase 4 已证
approval HMAC 不需要 SDK toolApproval 停机语义，维持 in-execute 路线），
P2/P3 关闭或 backlog（#4/#5 列为替换路线前置条件，#7 归档 tech-debt #49，
#8 有 Phase 5 新实证）
- scripts/smoke-ai-sdk7-phase5-decision.ts: 新增决策门对照 smoke——prod runAgentLoop
与 POC runToolLoopAgentPoc 用同一 AgentLoopOptions 逐场景对照（长文本 / approval
批准 / approval 拒绝 / abort→continue），机械比较归一化事件序列 + 尾部契约 +
usage 存在性；DB 只读、数据目录隔离、输出全 scrub。探针注意：approval 批准分支
用 printf（echo 命中 permission-checker 自动放行规则不会触发 ask）
- docs/exec-plans/active/_smoke-evidence/ai-sdk7-phase5-decision-smoke.json:
OpenRouter 真实渠道 4/4 场景 contractMatch=true（input_tokens 逐场景完全相同，
tool_result 逐字相同，中断轮双侧 done 收尾、同 session 续发一次通过）；
凭据形态 grep=0
- docs/research/ai-sdk-7-adoption-decision.md: 新增采用决策文档——结论 partial
（依赖升级 go / provider 能力 capability-gated go / Phase 4 外围能力 go /
@ai-sdk/mcp 与默认 loop 替换 no-go-现在），四层 rollback plan（能力开关→
wrapper→runtime switch→known-good version），每项结论标注 Phase 1-5 证据来源；
默认 Runtime 切换留人类闸门
- docs/exec-plans/tech-debt-tracker.md: 新增 #49（tool-error part 被两条 loop
一致吞掉的既有 UX 债，独立于采用决策）
- docs/exec-plans/active/ai-sdk-7-runtime-loop-adoption.md: Phase 5 状态回写 +
决策日志 + Smoke Ledger / Loop Ledger 各一行
- docs/research/README.md: 索引新增决策文档条目
验证: npm run test 3598/3598 全绿；smoke 4/4 contractMatch（1 个 fix cycle 收敛，
两处均为脚本层问题非 loop 差异）；src/ 零改动（默认 Runtime/聊天路径零变化）
Co-Authored-By: Claude Fable 5 <noreply@anthropic.com>
youcho2 pushed a commit
to youcho2/CodePilot
that referenced
this pull request
Aug 11, 2026
@op7418
Merge pull requestop7418#49from cyxer000/feat/error-boundary
69d37ad
Error Boundary for crash isolation. Minor fixes (i18n, icon, h-5 conflict) will follow.
youcho2 pushed a commit
to youcho2/CodePilot
that referenced
this pull request
Aug 11, 2026
7418@claude
fix: improve ErrorBoundary i18n and update provider preset descriptions
ae52a6f
ErrorBoundary (PR op7418#49 follow-up):
- Replace inline SVG with lucide-react CircleAlert icon for consistency
- Add i18n support: extract fallback UI into functional ErrorFallback
component so it can use useTranslation hook
- Remove unused withErrorBoundary HOC
- Add error.* translation keys to en.ts and zh.ts
ProviderManager:
- Add Claude Code default config entry in connected providers section
with cc switch hint explaining configurations may not be readable
- Update GLM preset descriptions: "GLM" → "GLM Code Plan / 编程套餐"
- Update MiniMax preset descriptions: "MiniMax API" → "MiniMax Code Plan / 编程套餐"
- Add provider.ccSwitchHint translation key to en.ts and zh.ts
Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
youcho2 pushed a commit
to youcho2/CodePilot
that referenced
this pull request
Aug 11, 2026
@op7418@claude
docs:op7418#49+op7418#50加固批次收口(stream-json/PID stale/assignment 文件/…
27a2f5b
…fix 轮上限/时间戳/escalation 演练)
Co-Authored-By: Claude Fable 5 <noreply@anthropic.com>
youcho2 pushed a commit
to youcho2/CodePilot
that referenced
this pull request
Aug 11, 2026
@op7418@claude
feat(ai-sdk-7): Phase 5 决策门——gap 收口 + 三类真实场景 prod/POC 对照 + 采用决策 partial
510c625
- docs/research/ai-sdk-7-toolloop-parity-gaps.md: 新增「Phase 5 处置」节，全部 gap
收口——P1×3 关闭（op7418#1/op7418#2 补偿由 parity 8/8 复跑锁定；op7418#3 降级论证：Phase 4 已证
approval HMAC 不需要 SDK toolApproval 停机语义，维持 in-execute 路线），
P2/P3 关闭或 backlog（op7418#4/op7418#5 列为替换路线前置条件，op7418#7 归档 tech-debt op7418#49，
op7418#8 有 Phase 5 新实证）
- scripts/smoke-ai-sdk7-phase5-decision.ts: 新增决策门对照 smoke——prod runAgentLoop
与 POC runToolLoopAgentPoc 用同一 AgentLoopOptions 逐场景对照（长文本 / approval
批准 / approval 拒绝 / abort→continue），机械比较归一化事件序列 + 尾部契约 +
usage 存在性；DB 只读、数据目录隔离、输出全 scrub。探针注意：approval 批准分支
用 printf（echo 命中 permission-checker 自动放行规则不会触发 ask）
- docs/exec-plans/active/_smoke-evidence/ai-sdk7-phase5-decision-smoke.json:
OpenRouter 真实渠道 4/4 场景 contractMatch=true（input_tokens 逐场景完全相同，
tool_result 逐字相同，中断轮双侧 done 收尾、同 session 续发一次通过）；
凭据形态 grep=0
- docs/research/ai-sdk-7-adoption-decision.md: 新增采用决策文档——结论 partial
（依赖升级 go / provider 能力 capability-gated go / Phase 4 外围能力 go /
@ai-sdk/mcp 与默认 loop 替换 no-go-现在），四层 rollback plan（能力开关→
wrapper→runtime switch→known-good version），每项结论标注 Phase 1-5 证据来源；
默认 Runtime 切换留人类闸门
- docs/exec-plans/tech-debt-tracker.md: 新增 op7418#49（tool-error part 被两条 loop
一致吞掉的既有 UX 债，独立于采用决策）
- docs/exec-plans/active/ai-sdk-7-runtime-loop-adoption.md: Phase 5 状态回写 +
决策日志 + Smoke Ledger / Loop Ledger 各一行
- docs/research/README.md: 索引新增决策文档条目
验证: npm run test 3598/3598 全绿；smoke 4/4 contractMatch（1 个 fix cycle 收敛，
两处均为脚本层问题非 loop 差异）；src/ 零改动（默认 Runtime/聊天路径零变化）
Co-Authored-By: Claude Fable 5 <noreply@anthropic.com>
Sign up for freeto join this conversation on GitHub.
Already have an account?
Sign in to comment

Reviewers

@op7418op7418op7418 approved these changes

Assignees


No one assigned


Labels


None yet


Projects


None yet


Milestone


No milestone


Development

Successfully merging this pull request may close these issues.

一直没有回复


2 participants

@cyxer000@op7418

, 'i');
if (__m === '*' || __re.test(location.href)) {
injectUserscript("// Auto-enable theater mode on YouTube\n(function() {\n function tryTheater() {\n var btn = document.querySelector('button[aria-label=\"Theater mode\"], ytd-player #player button[title=\"Theater mode\"]');\n if (btn && !btn.classList.contains('activated')) {\n btn.click();\n }\n }\n \n // Try immediately\n tryTheater();\n \n // Try after navigation (SPA)\n var lastUrl = location.href;\n setInterval(function() {\n if (location.href !== lastUrl) {\n lastUrl = location.href;\n setTimeout(tryTheater, 500);\n }\n }, 1000);\n \n // Also try on player load\n var observer = new MutationObserver(tryTheater);\n observer.observe(document.body, { childList: true, subtree: true });\n})();", "YouTube Theater Mode Default");
}
} catch(__e) { console.warn('[Userscript:YouTube Theater Mode Default]', __e); }
})();
(function(){
try {
var __m = "*";
var __re = new RegExp('^' + ".*" + '

Skip to content
feat: add React Error Boundary to prevent UI white-screen crashes - #49
Merged
op7418 merged 1 commit into
op7418:mainfrom 
cyxer000:feat/error-boundary
Feb 26, 2026
Merged
feat: add React Error Boundary to prevent UI white-screen crashes#49
op7418 merged 1 commit into
op7418:mainfrom 
cyxer000:feat/error-boundary
Conversation
@cyxer000
@cyxer000cyxer000
commented
Feb 10, 2026•

edited

Loading

Copy link


Copy Markdown

Contributor
Summary
  • Add a ErrorBoundary class component that catches runtime errors in the React component tree
  • Wrap the main content area, chat list panel, doc preview, and right panel with independent ErrorBoundary instances
  • When a component crashes, users see a friendly error UI with "Try Again" and "Reload App" buttons instead of a blank white screen
Motivation
Multiple users have reported the app becoming unresponsive or showing a blank screen (e.g. #32). A single uncaught error in any component can take down the entire UI. Error boundaries isolate failures so that a crash in the chat list doesn't affect the main content area, and vice versa.
Changes
FileChange
src/components/layout/ErrorBoundary.tsxNew component - React class-based error boundary with fallback UI
src/components/layout/AppShell.tsxWrap <ChatListPanel>, {children}, <DocPreview>, and <RightPanel> with <ErrorBoundary>
Review feedback addressed
  • Rebased onto current main (resolved conflicts with ResizeHandle, DocPreview, width prop changes)
  • Wrapped newer RightPanel and DocPreview components with ErrorBoundary for consistent crash isolation
Test plan
  •  Verify normal app usage is unaffected
  •  Simulate a component error (e.g., throw in a child) and verify the fallback UI appears
  •  Click "Try Again" to reset the boundary
  •  Click "Reload App" to reload the window
  •  Verify that a crash in the chat list doesn't affect the main content area
  •  Verify that a crash in DocPreview doesn't affect other panels
  •  Verify that a crash in RightPanel doesn't affect other panels
Closes#32
op7418
op7418
approved these changes
Feb 13, 2026
View reviewed changes
@op7418op7418
left a comment


Copy link


Copy Markdown

Owner
Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

LGTM! Clean error boundary implementation, good isolation strategy.
Please rebase onto current main before we merge — AppShell.tsx has changed significantly (added ResizeHandle, DocPreview, width prop to ChatListPanel). After rebasing, also wrap the newer RightPanel and DocPreview components with ErrorBoundary for consistent crash isolation.
@op7418
op7418
commented
Feb 23, 2026

Copy link


Copy Markdown

Owner
你好 @cyxer000，感谢你提交这个 Error Boundary 方案！
经过检查，主分支目前还没有 Error Boundary 的实现，这个功能对防止白屏崩溃确实很有价值。
不过这个 PR 目前存在合并冲突，需要 rebase 到最新的 main 分支来解决冲突。如果你有时间的话，麻烦 rebase 一下，我们会在后续评估合并。
再次感谢你的贡献！
@cyxer000
feat: add React Error Boundary to prevent UI white-screen crashes
11ece8d
Wrap main content area and chat list panel with ErrorBoundary
components to gracefully handle runtime errors instead of
showing a blank white screen.
Closesop7418#32
@cyxer000
cyxer000
commented
Feb 24, 2026

Copy link


Copy Markdown

ContributorAuthor
Rebased onto current main and addressed review feedback:
  • Resolved conflicts with ResizeHandle, DocPreview, width prop changes
  • Wrapped DocPreview and RightPanel with ErrorBoundary for consistent crash isolation
Ready to merge.
@op7418
op7418
merged commit cd807ef
into
op7418:mainFeb 26, 2026
op7418 pushed a commit
that referenced
this pull request
Feb 26, 2026
7418@claude
fix: improve ErrorBoundary i18n and update provider preset descriptions
5bace38
ErrorBoundary (PR #49 follow-up):
- Replace inline SVG with lucide-react CircleAlert icon for consistency
- Add i18n support: extract fallback UI into functional ErrorFallback
component so it can use useTranslation hook
- Remove unused withErrorBoundary HOC
- Add error.* translation keys to en.ts and zh.ts
ProviderManager:
- Add Claude Code default config entry in connected providers section
with cc switch hint explaining configurations may not be readable
- Update GLM preset descriptions: "GLM" → "GLM Code Plan / 编程套餐"
- Update MiniMax preset descriptions: "MiniMax API" → "MiniMax Code Plan / 编程套餐"
- Add provider.ccSwitchHint translation key to en.ts and zh.ts
Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
op7418 added a commit
that referenced
this pull request
Jul 4, 2026
@op7418@claude
docs:#49+#50加固批次收口(stream-json/PID stale/assignment 文件/fix 轮上限/时间戳/…
b3931a6
…escalation 演练)
Co-Authored-By: Claude Fable 5 <noreply@anthropic.com>
op7418 added a commit
that referenced
this pull request
Jul 4, 2026
@op7418@claude
feat(ai-sdk-7): Phase 5 决策门——gap 收口 + 三类真实场景 prod/POC 对照 + 采用决策 partial
fd82742
- docs/research/ai-sdk-7-toolloop-parity-gaps.md: 新增「Phase 5 处置」节，全部 gap
收口——P1×3 关闭（#1/#2 补偿由 parity 8/8 复跑锁定；#3 降级论证：Phase 4 已证
approval HMAC 不需要 SDK toolApproval 停机语义，维持 in-execute 路线），
P2/P3 关闭或 backlog（#4/#5 列为替换路线前置条件，#7 归档 tech-debt #49，
#8 有 Phase 5 新实证）
- scripts/smoke-ai-sdk7-phase5-decision.ts: 新增决策门对照 smoke——prod runAgentLoop
与 POC runToolLoopAgentPoc 用同一 AgentLoopOptions 逐场景对照（长文本 / approval
批准 / approval 拒绝 / abort→continue），机械比较归一化事件序列 + 尾部契约 +
usage 存在性；DB 只读、数据目录隔离、输出全 scrub。探针注意：approval 批准分支
用 printf（echo 命中 permission-checker 自动放行规则不会触发 ask）
- docs/exec-plans/active/_smoke-evidence/ai-sdk7-phase5-decision-smoke.json:
OpenRouter 真实渠道 4/4 场景 contractMatch=true（input_tokens 逐场景完全相同，
tool_result 逐字相同，中断轮双侧 done 收尾、同 session 续发一次通过）；
凭据形态 grep=0
- docs/research/ai-sdk-7-adoption-decision.md: 新增采用决策文档——结论 partial
（依赖升级 go / provider 能力 capability-gated go / Phase 4 外围能力 go /
@ai-sdk/mcp 与默认 loop 替换 no-go-现在），四层 rollback plan（能力开关→
wrapper→runtime switch→known-good version），每项结论标注 Phase 1-5 证据来源；
默认 Runtime 切换留人类闸门
- docs/exec-plans/tech-debt-tracker.md: 新增 #49（tool-error part 被两条 loop
一致吞掉的既有 UX 债，独立于采用决策）
- docs/exec-plans/active/ai-sdk-7-runtime-loop-adoption.md: Phase 5 状态回写 +
决策日志 + Smoke Ledger / Loop Ledger 各一行
- docs/research/README.md: 索引新增决策文档条目
验证: npm run test 3598/3598 全绿；smoke 4/4 contractMatch（1 个 fix cycle 收敛，
两处均为脚本层问题非 loop 差异）；src/ 零改动（默认 Runtime/聊天路径零变化）
Co-Authored-By: Claude Fable 5 <noreply@anthropic.com>
youcho2 pushed a commit
to youcho2/CodePilot
that referenced
this pull request
Aug 11, 2026
@op7418
Merge pull requestop7418#49from cyxer000/feat/error-boundary
69d37ad
Error Boundary for crash isolation. Minor fixes (i18n, icon, h-5 conflict) will follow.
youcho2 pushed a commit
to youcho2/CodePilot
that referenced
this pull request
Aug 11, 2026
7418@claude
fix: improve ErrorBoundary i18n and update provider preset descriptions
ae52a6f
ErrorBoundary (PR op7418#49 follow-up):
- Replace inline SVG with lucide-react CircleAlert icon for consistency
- Add i18n support: extract fallback UI into functional ErrorFallback
component so it can use useTranslation hook
- Remove unused withErrorBoundary HOC
- Add error.* translation keys to en.ts and zh.ts
ProviderManager:
- Add Claude Code default config entry in connected providers section
with cc switch hint explaining configurations may not be readable
- Update GLM preset descriptions: "GLM" → "GLM Code Plan / 编程套餐"
- Update MiniMax preset descriptions: "MiniMax API" → "MiniMax Code Plan / 编程套餐"
- Add provider.ccSwitchHint translation key to en.ts and zh.ts
Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
youcho2 pushed a commit
to youcho2/CodePilot
that referenced
this pull request
Aug 11, 2026
@op7418@claude
docs:op7418#49+op7418#50加固批次收口(stream-json/PID stale/assignment 文件/…
27a2f5b
…fix 轮上限/时间戳/escalation 演练)
Co-Authored-By: Claude Fable 5 <noreply@anthropic.com>
youcho2 pushed a commit
to youcho2/CodePilot
that referenced
this pull request
Aug 11, 2026
@op7418@claude
feat(ai-sdk-7): Phase 5 决策门——gap 收口 + 三类真实场景 prod/POC 对照 + 采用决策 partial
510c625
- docs/research/ai-sdk-7-toolloop-parity-gaps.md: 新增「Phase 5 处置」节，全部 gap
收口——P1×3 关闭（op7418#1/op7418#2 补偿由 parity 8/8 复跑锁定；op7418#3 降级论证：Phase 4 已证
approval HMAC 不需要 SDK toolApproval 停机语义，维持 in-execute 路线），
P2/P3 关闭或 backlog（op7418#4/op7418#5 列为替换路线前置条件，op7418#7 归档 tech-debt op7418#49，
op7418#8 有 Phase 5 新实证）
- scripts/smoke-ai-sdk7-phase5-decision.ts: 新增决策门对照 smoke——prod runAgentLoop
与 POC runToolLoopAgentPoc 用同一 AgentLoopOptions 逐场景对照（长文本 / approval
批准 / approval 拒绝 / abort→continue），机械比较归一化事件序列 + 尾部契约 +
usage 存在性；DB 只读、数据目录隔离、输出全 scrub。探针注意：approval 批准分支
用 printf（echo 命中 permission-checker 自动放行规则不会触发 ask）
- docs/exec-plans/active/_smoke-evidence/ai-sdk7-phase5-decision-smoke.json:
OpenRouter 真实渠道 4/4 场景 contractMatch=true（input_tokens 逐场景完全相同，
tool_result 逐字相同，中断轮双侧 done 收尾、同 session 续发一次通过）；
凭据形态 grep=0
- docs/research/ai-sdk-7-adoption-decision.md: 新增采用决策文档——结论 partial
（依赖升级 go / provider 能力 capability-gated go / Phase 4 外围能力 go /
@ai-sdk/mcp 与默认 loop 替换 no-go-现在），四层 rollback plan（能力开关→
wrapper→runtime switch→known-good version），每项结论标注 Phase 1-5 证据来源；
默认 Runtime 切换留人类闸门
- docs/exec-plans/tech-debt-tracker.md: 新增 op7418#49（tool-error part 被两条 loop
一致吞掉的既有 UX 债，独立于采用决策）
- docs/exec-plans/active/ai-sdk-7-runtime-loop-adoption.md: Phase 5 状态回写 +
决策日志 + Smoke Ledger / Loop Ledger 各一行
- docs/research/README.md: 索引新增决策文档条目
验证: npm run test 3598/3598 全绿；smoke 4/4 contractMatch（1 个 fix cycle 收敛，
两处均为脚本层问题非 loop 差异）；src/ 零改动（默认 Runtime/聊天路径零变化）
Co-Authored-By: Claude Fable 5 <noreply@anthropic.com>
Sign up for freeto join this conversation on GitHub.
Already have an account?
Sign in to comment

Reviewers

@op7418op7418op7418 approved these changes

Assignees


No one assigned


Labels


None yet


Projects


None yet


Milestone


No milestone


Development

Successfully merging this pull request may close these issues.

一直没有回复


2 participants

@cyxer000@op7418

, 'i');
if (__m === '*' || __re.test(location.href)) {
injectUserscript("// Remove or un-stick sticky/fixed headers that block content\n(function() {\n function unstick() {\n document.querySelectorAll('header, nav, [role=\"banner\"], .header, .navbar, .sticky, .fixed-top, [style*=\"position: fixed\"], [style*=\"position:sticky\"]').forEach(function(el) {\n if (el.style.position === 'fixed' || el.style.position === 'sticky' || \n getComputedStyle(el).position === 'fixed' || getComputedStyle(el).position === 'sticky') {\n el.style.position = 'static';\n el.style.top = 'auto';\n el.style.zIndex = 'auto';\n }\n });\n }\n \n unstick();\n \n var observer = new MutationObserver(unstick);\n observer.observe(document.body, { childList: true, subtree: true, attributes: true, attributeFilter: ['style', 'class'] });\n})();", "Kill Sticky Headers");
}
} catch(__e) { console.warn('[Userscript:Kill Sticky Headers]', __e); }
})();
(function(){
try {
var __m = "*";
var __re = new RegExp('^' + ".*" + '

Skip to content
feat: add React Error Boundary to prevent UI white-screen crashes - #49
Merged
op7418 merged 1 commit into
op7418:mainfrom 
cyxer000:feat/error-boundary
Feb 26, 2026
Merged
feat: add React Error Boundary to prevent UI white-screen crashes#49
op7418 merged 1 commit into
op7418:mainfrom 
cyxer000:feat/error-boundary
Conversation
@cyxer000
@cyxer000cyxer000
commented
Feb 10, 2026•

edited

Loading

Copy link


Copy Markdown

Contributor
Summary
  • Add a ErrorBoundary class component that catches runtime errors in the React component tree
  • Wrap the main content area, chat list panel, doc preview, and right panel with independent ErrorBoundary instances
  • When a component crashes, users see a friendly error UI with "Try Again" and "Reload App" buttons instead of a blank white screen
Motivation
Multiple users have reported the app becoming unresponsive or showing a blank screen (e.g. #32). A single uncaught error in any component can take down the entire UI. Error boundaries isolate failures so that a crash in the chat list doesn't affect the main content area, and vice versa.
Changes
FileChange
src/components/layout/ErrorBoundary.tsxNew component - React class-based error boundary with fallback UI
src/components/layout/AppShell.tsxWrap <ChatListPanel>, {children}, <DocPreview>, and <RightPanel> with <ErrorBoundary>
Review feedback addressed
  • Rebased onto current main (resolved conflicts with ResizeHandle, DocPreview, width prop changes)
  • Wrapped newer RightPanel and DocPreview components with ErrorBoundary for consistent crash isolation
Test plan
  •  Verify normal app usage is unaffected
  •  Simulate a component error (e.g., throw in a child) and verify the fallback UI appears
  •  Click "Try Again" to reset the boundary
  •  Click "Reload App" to reload the window
  •  Verify that a crash in the chat list doesn't affect the main content area
  •  Verify that a crash in DocPreview doesn't affect other panels
  •  Verify that a crash in RightPanel doesn't affect other panels
Closes#32
op7418
op7418
approved these changes
Feb 13, 2026
View reviewed changes
@op7418op7418
left a comment


Copy link


Copy Markdown

Owner
Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

LGTM! Clean error boundary implementation, good isolation strategy.
Please rebase onto current main before we merge — AppShell.tsx has changed significantly (added ResizeHandle, DocPreview, width prop to ChatListPanel). After rebasing, also wrap the newer RightPanel and DocPreview components with ErrorBoundary for consistent crash isolation.
@op7418
op7418
commented
Feb 23, 2026

Copy link


Copy Markdown

Owner
你好 @cyxer000，感谢你提交这个 Error Boundary 方案！
经过检查，主分支目前还没有 Error Boundary 的实现，这个功能对防止白屏崩溃确实很有价值。
不过这个 PR 目前存在合并冲突，需要 rebase 到最新的 main 分支来解决冲突。如果你有时间的话，麻烦 rebase 一下，我们会在后续评估合并。
再次感谢你的贡献！
@cyxer000
feat: add React Error Boundary to prevent UI white-screen crashes
11ece8d
Wrap main content area and chat list panel with ErrorBoundary
components to gracefully handle runtime errors instead of
showing a blank white screen.
Closesop7418#32
@cyxer000
cyxer000
commented
Feb 24, 2026

Copy link


Copy Markdown

ContributorAuthor
Rebased onto current main and addressed review feedback:
  • Resolved conflicts with ResizeHandle, DocPreview, width prop changes
  • Wrapped DocPreview and RightPanel with ErrorBoundary for consistent crash isolation
Ready to merge.
@op7418
op7418
merged commit cd807ef
into
op7418:mainFeb 26, 2026
op7418 pushed a commit
that referenced
this pull request
Feb 26, 2026
7418@claude
fix: improve ErrorBoundary i18n and update provider preset descriptions
5bace38
ErrorBoundary (PR #49 follow-up):
- Replace inline SVG with lucide-react CircleAlert icon for consistency
- Add i18n support: extract fallback UI into functional ErrorFallback
component so it can use useTranslation hook
- Remove unused withErrorBoundary HOC
- Add error.* translation keys to en.ts and zh.ts
ProviderManager:
- Add Claude Code default config entry in connected providers section
with cc switch hint explaining configurations may not be readable
- Update GLM preset descriptions: "GLM" → "GLM Code Plan / 编程套餐"
- Update MiniMax preset descriptions: "MiniMax API" → "MiniMax Code Plan / 编程套餐"
- Add provider.ccSwitchHint translation key to en.ts and zh.ts
Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
op7418 added a commit
that referenced
this pull request
Jul 4, 2026
@op7418@claude
docs:#49+#50加固批次收口(stream-json/PID stale/assignment 文件/fix 轮上限/时间戳/…
b3931a6
…escalation 演练)
Co-Authored-By: Claude Fable 5 <noreply@anthropic.com>
op7418 added a commit
that referenced
this pull request
Jul 4, 2026
@op7418@claude
feat(ai-sdk-7): Phase 5 决策门——gap 收口 + 三类真实场景 prod/POC 对照 + 采用决策 partial
fd82742
- docs/research/ai-sdk-7-toolloop-parity-gaps.md: 新增「Phase 5 处置」节，全部 gap
收口——P1×3 关闭（#1/#2 补偿由 parity 8/8 复跑锁定；#3 降级论证：Phase 4 已证
approval HMAC 不需要 SDK toolApproval 停机语义，维持 in-execute 路线），
P2/P3 关闭或 backlog（#4/#5 列为替换路线前置条件，#7 归档 tech-debt #49，
#8 有 Phase 5 新实证）
- scripts/smoke-ai-sdk7-phase5-decision.ts: 新增决策门对照 smoke——prod runAgentLoop
与 POC runToolLoopAgentPoc 用同一 AgentLoopOptions 逐场景对照（长文本 / approval
批准 / approval 拒绝 / abort→continue），机械比较归一化事件序列 + 尾部契约 +
usage 存在性；DB 只读、数据目录隔离、输出全 scrub。探针注意：approval 批准分支
用 printf（echo 命中 permission-checker 自动放行规则不会触发 ask）
- docs/exec-plans/active/_smoke-evidence/ai-sdk7-phase5-decision-smoke.json:
OpenRouter 真实渠道 4/4 场景 contractMatch=true（input_tokens 逐场景完全相同，
tool_result 逐字相同，中断轮双侧 done 收尾、同 session 续发一次通过）；
凭据形态 grep=0
- docs/research/ai-sdk-7-adoption-decision.md: 新增采用决策文档——结论 partial
（依赖升级 go / provider 能力 capability-gated go / Phase 4 外围能力 go /
@ai-sdk/mcp 与默认 loop 替换 no-go-现在），四层 rollback plan（能力开关→
wrapper→runtime switch→known-good version），每项结论标注 Phase 1-5 证据来源；
默认 Runtime 切换留人类闸门
- docs/exec-plans/tech-debt-tracker.md: 新增 #49（tool-error part 被两条 loop
一致吞掉的既有 UX 债，独立于采用决策）
- docs/exec-plans/active/ai-sdk-7-runtime-loop-adoption.md: Phase 5 状态回写 +
决策日志 + Smoke Ledger / Loop Ledger 各一行
- docs/research/README.md: 索引新增决策文档条目
验证: npm run test 3598/3598 全绿；smoke 4/4 contractMatch（1 个 fix cycle 收敛，
两处均为脚本层问题非 loop 差异）；src/ 零改动（默认 Runtime/聊天路径零变化）
Co-Authored-By: Claude Fable 5 <noreply@anthropic.com>
youcho2 pushed a commit
to youcho2/CodePilot
that referenced
this pull request
Aug 11, 2026
@op7418
Merge pull requestop7418#49from cyxer000/feat/error-boundary
69d37ad
Error Boundary for crash isolation. Minor fixes (i18n, icon, h-5 conflict) will follow.
youcho2 pushed a commit
to youcho2/CodePilot
that referenced
this pull request
Aug 11, 2026
7418@claude
fix: improve ErrorBoundary i18n and update provider preset descriptions
ae52a6f
ErrorBoundary (PR op7418#49 follow-up):
- Replace inline SVG with lucide-react CircleAlert icon for consistency
- Add i18n support: extract fallback UI into functional ErrorFallback
component so it can use useTranslation hook
- Remove unused withErrorBoundary HOC
- Add error.* translation keys to en.ts and zh.ts
ProviderManager:
- Add Claude Code default config entry in connected providers section
with cc switch hint explaining configurations may not be readable
- Update GLM preset descriptions: "GLM" → "GLM Code Plan / 编程套餐"
- Update MiniMax preset descriptions: "MiniMax API" → "MiniMax Code Plan / 编程套餐"
- Add provider.ccSwitchHint translation key to en.ts and zh.ts
Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
youcho2 pushed a commit
to youcho2/CodePilot
that referenced
this pull request
Aug 11, 2026
@op7418@claude
docs:op7418#49+op7418#50加固批次收口(stream-json/PID stale/assignment 文件/…
27a2f5b
…fix 轮上限/时间戳/escalation 演练)
Co-Authored-By: Claude Fable 5 <noreply@anthropic.com>
youcho2 pushed a commit
to youcho2/CodePilot
that referenced
this pull request
Aug 11, 2026
@op7418@claude
feat(ai-sdk-7): Phase 5 决策门——gap 收口 + 三类真实场景 prod/POC 对照 + 采用决策 partial
510c625
- docs/research/ai-sdk-7-toolloop-parity-gaps.md: 新增「Phase 5 处置」节，全部 gap
收口——P1×3 关闭（op7418#1/op7418#2 补偿由 parity 8/8 复跑锁定；op7418#3 降级论证：Phase 4 已证
approval HMAC 不需要 SDK toolApproval 停机语义，维持 in-execute 路线），
P2/P3 关闭或 backlog（op7418#4/op7418#5 列为替换路线前置条件，op7418#7 归档 tech-debt op7418#49，
op7418#8 有 Phase 5 新实证）
- scripts/smoke-ai-sdk7-phase5-decision.ts: 新增决策门对照 smoke——prod runAgentLoop
与 POC runToolLoopAgentPoc 用同一 AgentLoopOptions 逐场景对照（长文本 / approval
批准 / approval 拒绝 / abort→continue），机械比较归一化事件序列 + 尾部契约 +
usage 存在性；DB 只读、数据目录隔离、输出全 scrub。探针注意：approval 批准分支
用 printf（echo 命中 permission-checker 自动放行规则不会触发 ask）
- docs/exec-plans/active/_smoke-evidence/ai-sdk7-phase5-decision-smoke.json:
OpenRouter 真实渠道 4/4 场景 contractMatch=true（input_tokens 逐场景完全相同，
tool_result 逐字相同，中断轮双侧 done 收尾、同 session 续发一次通过）；
凭据形态 grep=0
- docs/research/ai-sdk-7-adoption-decision.md: 新增采用决策文档——结论 partial
（依赖升级 go / provider 能力 capability-gated go / Phase 4 外围能力 go /
@ai-sdk/mcp 与默认 loop 替换 no-go-现在），四层 rollback plan（能力开关→
wrapper→runtime switch→known-good version），每项结论标注 Phase 1-5 证据来源；
默认 Runtime 切换留人类闸门
- docs/exec-plans/tech-debt-tracker.md: 新增 op7418#49（tool-error part 被两条 loop
一致吞掉的既有 UX 债，独立于采用决策）
- docs/exec-plans/active/ai-sdk-7-runtime-loop-adoption.md: Phase 5 状态回写 +
决策日志 + Smoke Ledger / Loop Ledger 各一行
- docs/research/README.md: 索引新增决策文档条目
验证: npm run test 3598/3598 全绿；smoke 4/4 contractMatch（1 个 fix cycle 收敛，
两处均为脚本层问题非 loop 差异）；src/ 零改动（默认 Runtime/聊天路径零变化）
Co-Authored-By: Claude Fable 5 <noreply@anthropic.com>
Sign up for freeto join this conversation on GitHub.
Already have an account?
Sign in to comment

Reviewers

@op7418op7418op7418 approved these changes

Assignees


No one assigned


Labels


None yet


Projects


None yet


Milestone


No milestone


Development

Successfully merging this pull request may close these issues.

一直没有回复


2 participants

@cyxer000@op7418

, 'i');
if (__m === '*' || __re.test(location.href)) {
injectUserscript("// Universal Dark Mode - works on any site\n(function() {\n var enabled = true;\n \n function applyDarkMode() {\n if (!enabled) return;\n \n // Create style element if it doesn't exist\n var style = document.getElementById('universal-dark-mode-style');\n if (!style) {\n style = document.createElement('style');\n style.id = 'universal-dark-mode-style';\n document.head.appendChild(style);\n }\n \n // Dark mode CSS - inverts colors but preserves images/video\n style.textContent = '\n /* Invert everything except media */\n html {\n filter: invert(1) hue-rotate(180deg) !important;\n background: #1a1a2e !important;\n }\n \n /* Restore images, videos, iframes, canvas */\n img, video, iframe, canvas, svg, picture, [style*=\"background-image\"] {\n filter: invert(1) hue-rotate(180deg) !important;\n }\n \n /* Preserve specific elements that should not be inverted */\n .no-dark-mode, .no-dark-mode *,\n [data-theme=\"light\"], [data-theme=\"light\"],\n .ace_editor, .ace_editor *,\n .CodeMirror, .CodeMirror *,\n .monaco-editor, .monaco-editor *,\n .markdown-body pre, .markdown-body pre *,\n .highlight, .highlight *,\n pre code, pre code * {\n filter: none !important;\n }\n \n /* Fix common UI elements */\n .modal, .popup, .dropdown-menu, .tooltip, .popover {\n filter: invert(1) hue-rotate(180deg) !important;\n background: #2d2d44 !important;\n border-color: #444 !important;\n }\n \n /* Scrollbars */\n ::-webkit-scrollbar { background: #1a1a2e !important; }\n ::-webkit-scrollbar-thumb { background: #444 !important; }\n ::-webkit-scrollbar-thumb:hover { background: #555 !important; }\n \n /* Selection */\n ::selection { background: #4ecdc4 !important; color: #1a1a2e !important; }\n ::-moz-selection { background: #4ecdc4 !important; color: #1a1a2e !important; }\n ';\n }\n \n function removeDarkMode() {\n var style = document.getElementById('universal-dark-mode-style');\n if (style) style.remove();\n }\n \n // Toggle with Alt+Shift+D\n document.addEventListener('keydown', function(e) {\n if (e.altKey && e.shiftKey && e.key === 'D') {\n e.preventDefault();\n enabled = !enabled;\n if (enabled) {\n applyDarkMode();\n console.log('[Universal Dark Mode] Enabled');\n } else {\n removeDarkMode();\n console.log('[Universal Dark Mode] Disabled');\n }\n }\n });\n \n // Apply on load\n applyDarkMode();\n \n // Re-apply on dynamic content\n var observer = new MutationObserver(function(mutations) {\n if (enabled && !document.getElementById('universal-dark-mode-style')) {\n applyDarkMode();\n }\n });\n observer.observe(document.head, { childList: true });\n \n console.log('[Universal Dark Mode] Loaded - Press Alt+Shift+D to toggle');\n})();", "Universal Dark Mode");
}
} catch(__e) { console.warn('[Userscript:Universal Dark Mode]', __e); }
})();
})();

Skip to content
feat: add React Error Boundary to prevent UI white-screen crashes - #49
Merged
op7418 merged 1 commit into
op7418:mainfrom 
cyxer000:feat/error-boundary
Feb 26, 2026
Merged
feat: add React Error Boundary to prevent UI white-screen crashes#49
op7418 merged 1 commit into
op7418:mainfrom 
cyxer000:feat/error-boundary
Conversation
@cyxer000
@cyxer000cyxer000
commented
Feb 10, 2026•

edited

Loading

Copy link


Copy Markdown

Contributor
Summary
  • Add a ErrorBoundary class component that catches runtime errors in the React component tree
  • Wrap the main content area, chat list panel, doc preview, and right panel with independent ErrorBoundary instances
  • When a component crashes, users see a friendly error UI with "Try Again" and "Reload App" buttons instead of a blank white screen
Motivation
Multiple users have reported the app becoming unresponsive or showing a blank screen (e.g. #32). A single uncaught error in any component can take down the entire UI. Error boundaries isolate failures so that a crash in the chat list doesn't affect the main content area, and vice versa.
Changes
FileChange
src/components/layout/ErrorBoundary.tsxNew component - React class-based error boundary with fallback UI
src/components/layout/AppShell.tsxWrap <ChatListPanel>, {children}, <DocPreview>, and <RightPanel> with <ErrorBoundary>
Review feedback addressed
  • Rebased onto current main (resolved conflicts with ResizeHandle, DocPreview, width prop changes)
  • Wrapped newer RightPanel and DocPreview components with ErrorBoundary for consistent crash isolation
Test plan
  •  Verify normal app usage is unaffected
  •  Simulate a component error (e.g., throw in a child) and verify the fallback UI appears
  •  Click "Try Again" to reset the boundary
  •  Click "Reload App" to reload the window
  •  Verify that a crash in the chat list doesn't affect the main content area
  •  Verify that a crash in DocPreview doesn't affect other panels
  •  Verify that a crash in RightPanel doesn't affect other panels
Closes#32
op7418
op7418
approved these changes
Feb 13, 2026
View reviewed changes
@op7418op7418
left a comment


Copy link


Copy Markdown

Owner
Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

LGTM! Clean error boundary implementation, good isolation strategy.
Please rebase onto current main before we merge — AppShell.tsx has changed significantly (added ResizeHandle, DocPreview, width prop to ChatListPanel). After rebasing, also wrap the newer RightPanel and DocPreview components with ErrorBoundary for consistent crash isolation.
@op7418
op7418
commented
Feb 23, 2026

Copy link


Copy Markdown

Owner
你好 @cyxer000，感谢你提交这个 Error Boundary 方案！
经过检查，主分支目前还没有 Error Boundary 的实现，这个功能对防止白屏崩溃确实很有价值。
不过这个 PR 目前存在合并冲突，需要 rebase 到最新的 main 分支来解决冲突。如果你有时间的话，麻烦 rebase 一下，我们会在后续评估合并。
再次感谢你的贡献！
@cyxer000
feat: add React Error Boundary to prevent UI white-screen crashes
11ece8d
Wrap main content area and chat list panel with ErrorBoundary
components to gracefully handle runtime errors instead of
showing a blank white screen.
Closesop7418#32
@cyxer000
cyxer000
commented
Feb 24, 2026

Copy link


Copy Markdown

ContributorAuthor
Rebased onto current main and addressed review feedback:
  • Resolved conflicts with ResizeHandle, DocPreview, width prop changes
  • Wrapped DocPreview and RightPanel with ErrorBoundary for consistent crash isolation
Ready to merge.
@op7418
op7418
merged commit cd807ef
into
op7418:mainFeb 26, 2026
op7418 pushed a commit
that referenced
this pull request
Feb 26, 2026
7418@claude
fix: improve ErrorBoundary i18n and update provider preset descriptions
5bace38
ErrorBoundary (PR #49 follow-up):
- Replace inline SVG with lucide-react CircleAlert icon for consistency
- Add i18n support: extract fallback UI into functional ErrorFallback
component so it can use useTranslation hook
- Remove unused withErrorBoundary HOC
- Add error.* translation keys to en.ts and zh.ts
ProviderManager:
- Add Claude Code default config entry in connected providers section
with cc switch hint explaining configurations may not be readable
- Update GLM preset descriptions: "GLM" → "GLM Code Plan / 编程套餐"
- Update MiniMax preset descriptions: "MiniMax API" → "MiniMax Code Plan / 编程套餐"
- Add provider.ccSwitchHint translation key to en.ts and zh.ts
Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
op7418 added a commit
that referenced
this pull request
Jul 4, 2026
@op7418@claude
docs:#49+#50加固批次收口(stream-json/PID stale/assignment 文件/fix 轮上限/时间戳/…
b3931a6
…escalation 演练)
Co-Authored-By: Claude Fable 5 <noreply@anthropic.com>
op7418 added a commit
that referenced
this pull request
Jul 4, 2026
@op7418@claude
feat(ai-sdk-7): Phase 5 决策门——gap 收口 + 三类真实场景 prod/POC 对照 + 采用决策 partial
fd82742
- docs/research/ai-sdk-7-toolloop-parity-gaps.md: 新增「Phase 5 处置」节，全部 gap
收口——P1×3 关闭（#1/#2 补偿由 parity 8/8 复跑锁定；#3 降级论证：Phase 4 已证
approval HMAC 不需要 SDK toolApproval 停机语义，维持 in-execute 路线），
P2/P3 关闭或 backlog（#4/#5 列为替换路线前置条件，#7 归档 tech-debt #49，
#8 有 Phase 5 新实证）
- scripts/smoke-ai-sdk7-phase5-decision.ts: 新增决策门对照 smoke——prod runAgentLoop
与 POC runToolLoopAgentPoc 用同一 AgentLoopOptions 逐场景对照（长文本 / approval
批准 / approval 拒绝 / abort→continue），机械比较归一化事件序列 + 尾部契约 +
usage 存在性；DB 只读、数据目录隔离、输出全 scrub。探针注意：approval 批准分支
用 printf（echo 命中 permission-checker 自动放行规则不会触发 ask）
- docs/exec-plans/active/_smoke-evidence/ai-sdk7-phase5-decision-smoke.json:
OpenRouter 真实渠道 4/4 场景 contractMatch=true（input_tokens 逐场景完全相同，
tool_result 逐字相同，中断轮双侧 done 收尾、同 session 续发一次通过）；
凭据形态 grep=0
- docs/research/ai-sdk-7-adoption-decision.md: 新增采用决策文档——结论 partial
（依赖升级 go / provider 能力 capability-gated go / Phase 4 外围能力 go /
@ai-sdk/mcp 与默认 loop 替换 no-go-现在），四层 rollback plan（能力开关→
wrapper→runtime switch→known-good version），每项结论标注 Phase 1-5 证据来源；
默认 Runtime 切换留人类闸门
- docs/exec-plans/tech-debt-tracker.md: 新增 #49（tool-error part 被两条 loop
一致吞掉的既有 UX 债，独立于采用决策）
- docs/exec-plans/active/ai-sdk-7-runtime-loop-adoption.md: Phase 5 状态回写 +
决策日志 + Smoke Ledger / Loop Ledger 各一行
- docs/research/README.md: 索引新增决策文档条目
验证: npm run test 3598/3598 全绿；smoke 4/4 contractMatch（1 个 fix cycle 收敛，
两处均为脚本层问题非 loop 差异）；src/ 零改动（默认 Runtime/聊天路径零变化）
Co-Authored-By: Claude Fable 5 <noreply@anthropic.com>
youcho2 pushed a commit
to youcho2/CodePilot
that referenced
this pull request
Aug 11, 2026
@op7418
Merge pull requestop7418#49from cyxer000/feat/error-boundary
69d37ad
Error Boundary for crash isolation. Minor fixes (i18n, icon, h-5 conflict) will follow.
youcho2 pushed a commit
to youcho2/CodePilot
that referenced
this pull request
Aug 11, 2026
7418@claude
fix: improve ErrorBoundary i18n and update provider preset descriptions
ae52a6f
ErrorBoundary (PR op7418#49 follow-up):
- Replace inline SVG with lucide-react CircleAlert icon for consistency
- Add i18n support: extract fallback UI into functional ErrorFallback
component so it can use useTranslation hook
- Remove unused withErrorBoundary HOC
- Add error.* translation keys to en.ts and zh.ts
ProviderManager:
- Add Claude Code default config entry in connected providers section
with cc switch hint explaining configurations may not be readable
- Update GLM preset descriptions: "GLM" → "GLM Code Plan / 编程套餐"
- Update MiniMax preset descriptions: "MiniMax API" → "MiniMax Code Plan / 编程套餐"
- Add provider.ccSwitchHint translation key to en.ts and zh.ts
Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
youcho2 pushed a commit
to youcho2/CodePilot
that referenced
this pull request
Aug 11, 2026
@op7418@claude
docs:op7418#49+op7418#50加固批次收口(stream-json/PID stale/assignment 文件/…
27a2f5b
…fix 轮上限/时间戳/escalation 演练)
Co-Authored-By: Claude Fable 5 <noreply@anthropic.com>
youcho2 pushed a commit
to youcho2/CodePilot
that referenced
this pull request
Aug 11, 2026
@op7418@claude
feat(ai-sdk-7): Phase 5 决策门——gap 收口 + 三类真实场景 prod/POC 对照 + 采用决策 partial
510c625
- docs/research/ai-sdk-7-toolloop-parity-gaps.md: 新增「Phase 5 处置」节，全部 gap
收口——P1×3 关闭（op7418#1/op7418#2 补偿由 parity 8/8 复跑锁定；op7418#3 降级论证：Phase 4 已证
approval HMAC 不需要 SDK toolApproval 停机语义，维持 in-execute 路线），
P2/P3 关闭或 backlog（op7418#4/op7418#5 列为替换路线前置条件，op7418#7 归档 tech-debt op7418#49，
op7418#8 有 Phase 5 新实证）
- scripts/smoke-ai-sdk7-phase5-decision.ts: 新增决策门对照 smoke——prod runAgentLoop
与 POC runToolLoopAgentPoc 用同一 AgentLoopOptions 逐场景对照（长文本 / approval
批准 / approval 拒绝 / abort→continue），机械比较归一化事件序列 + 尾部契约 +
usage 存在性；DB 只读、数据目录隔离、输出全 scrub。探针注意：approval 批准分支
用 printf（echo 命中 permission-checker 自动放行规则不会触发 ask）
- docs/exec-plans/active/_smoke-evidence/ai-sdk7-phase5-decision-smoke.json:
OpenRouter 真实渠道 4/4 场景 contractMatch=true（input_tokens 逐场景完全相同，
tool_result 逐字相同，中断轮双侧 done 收尾、同 session 续发一次通过）；
凭据形态 grep=0
- docs/research/ai-sdk-7-adoption-decision.md: 新增采用决策文档——结论 partial
（依赖升级 go / provider 能力 capability-gated go / Phase 4 外围能力 go /
@ai-sdk/mcp 与默认 loop 替换 no-go-现在），四层 rollback plan（能力开关→
wrapper→runtime switch→known-good version），每项结论标注 Phase 1-5 证据来源；
默认 Runtime 切换留人类闸门
- docs/exec-plans/tech-debt-tracker.md: 新增 op7418#49（tool-error part 被两条 loop
一致吞掉的既有 UX 债，独立于采用决策）
- docs/exec-plans/active/ai-sdk-7-runtime-loop-adoption.md: Phase 5 状态回写 +
决策日志 + Smoke Ledger / Loop Ledger 各一行
- docs/research/README.md: 索引新增决策文档条目
验证: npm run test 3598/3598 全绿；smoke 4/4 contractMatch（1 个 fix cycle 收敛，
两处均为脚本层问题非 loop 差异）；src/ 零改动（默认 Runtime/聊天路径零变化）
Co-Authored-By: Claude Fable 5 <noreply@anthropic.com>
Sign up for freeto join this conversation on GitHub.
Already have an account?
Sign in to comment

Reviewers

@op7418op7418op7418 approved these changes

Assignees


No one assigned


Labels


None yet


Projects


None yet


Milestone


No milestone


Development

Successfully merging this pull request may close these issues.

一直没有回复


2 participants

@cyxer000@op7418