Skip to content

[UI/UX] Cap active toast queue to 3 with error coalescing #702

Description

@nanaf6203-bit

Problem Statement

src/components/ui/toast (presumed; uses sonner) shows overlapping toasts during error storms. When the structured logger flushes a batch with 30 errors, 30 toasts pile up off-screen.

Acceptance Criteria

  • Toast queue max depth = 3
  • Errors coalesce into a single "5 errors since your last view" toast
  • User can dismiss the queue with one click without affecting underlying logs

Implementation Notes

sonner has a toastOptions and a toast.promise pattern. Configure a custom id strategy so duplicates merge.

Files Likely Affected

  • src/components/toast/
  • src/utils/structuredLogger.ts

Difficulty / Effort

  • Difficulty: Easy
  • Effort: T-Shirt S

Labels

ux, priority:medium

Metadata

Metadata

Assignees

No one assigned

    Labels

    No labels
    No labels

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions