Improve error toast readability

[myieye]

Error toasts could grow taller than the screen and sometimes showed the same message in both the title and the description. This caps the title height, splits .NET error strings at the inner-exception marker (` ---> `) as well as at the first stack frame so the title stays short, and de-duplicates JS errors whose stack already repeats the message. Also fixes the copy-button checkmark, which rendered white (invisible) in light mode.

Frontend-only; unit tests cover the error-string parsing. Not yet visually verified on a device.

Before:

After:

Before:

After:

🤖 Generated with Claude Code

[coderabbitai]

📝 Walkthrough

Walkthrough

Updates .NET error string parsing in global-errors.ts to split at both stack-frame markers and inner-exception (--->) boundaries, adds a stackFrames helper to strip Error.toString() headers, and introduces a Vitest test suite for processErrorIntoDetails. Also scopes toast actionButton copy/copied icon selectors to data-type="error" toasts in sonner.svelte.

Changes

Error parsing improvements and toast icon scoping

Layer / File(s)	Summary
Updated .NET error parsing and stackFrames helper frontend/viewer/src/lib/errors/global-errors.ts	The .NET regex now splits at either " at " or " ---> ". A new stackFrames helper strips the Error.toString() header from Error.stack. processErrorIntoDetails derives title from error.message and detail from frames-only stack output.
processErrorIntoDetails test suite frontend/viewer/src/lib/errors/global-errors.test.ts	New Vitest tests cover .NET stack splitting, inner-exception cascade boundaries, messages without stack frames, and JS Error title/detail deduplication.
Toast actionButton icon selectors scoped to error toasts frontend/viewer/src/lib/components/ui/sonner/sonner.svelte	Copy and copied-check icon selectors are now scoped to data-type="error" toasts; the promise-loading hidden state uses an explicit data-promise="true" nested selector.

Estimated code review effort

🎯 2 (Simple) | ⏱️ ~10 minutes

Possibly related PRs

• sillsdev/languageforge-lexbox#2053: Related to the sonner.svelte toast actionButton scoping change — that PR introduced "Copy error" behavior on failed sync toasts which this PR now further refines by scoping icon selectors to data-type="error".

Suggested labels

💻 FW Lite, 📦 Lexbox

Suggested reviewers

• hahn-kev

Poem

🐇 A rabbit parsed the stack one day,
And split the errors right away —
.NET frames? Now neatly trimmed!
Copy icons? Error-scoped and primmed.
The toast knows exactly when to show,
Hop hop, the details now all flow! 🌿

🚥 Pre-merge checks | ✅ 4 | ❌ 1

❌ Failed checks (1 warning)

Check name	Status	Explanation	Resolution
Docstring Coverage	⚠️ Warning	Docstring coverage is 0.00% which is insufficient. The required threshold is 80.00%.	Write docstrings for the functions missing them to satisfy the coverage threshold.

✅ Passed checks (4 passed)

Check name	Status	Explanation
Title check	✅ Passed	The title 'Improve error toast readability' directly describes the main objective of the changeset—improving readability of error toasts through styling and parsing improvements.
Linked Issues check	✅ Passed	Check skipped because no linked issues were found for this pull request.
Out of Scope Changes check	✅ Passed	Check skipped because no linked issues were found for this pull request.
Description check	✅ Passed	The PR description clearly relates to the changeset, detailing fixes for error toast display including height capping, .NET error string parsing, message de-duplication, and copy-button styling.

_{✏️ Tip: You can configure your own custom pre-merge checks in the settings.}

✨ Finishing Touches

📝 Generate docstrings

• Create stacked PR
• Commit on current branch

🧪 Generate unit tests (beta)

• Create PR with unit tests
• Commit unit tests in branch error-toast-readability

---

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

❤️ Share

• X
• Mastodon
• Reddit
• LinkedIn

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

[coderabbitai]

Caution

Failed to replace (edit) comment. This is likely due to insufficient permissions or the comment being deleted.

Error details

{}

[argos-ci]

The latest updates on your projects. Learn more about Argos notifications ↗︎

Build	Status	Details	Updated (UTC)
default (Inspect)	✅ No changes detected	-	Jun 23, 2026, 12:09 PM