Skip to content

feat: add notification/toast system for error feedback#14

Merged
vparys merged 1 commit intomainfrom
feat/notification-toast-system
Apr 8, 2026
Merged

feat: add notification/toast system for error feedback#14
vparys merged 1 commit intomainfrom
feat/notification-toast-system

Conversation

@vparys
Copy link
Copy Markdown
Member

@vparys vparys commented Apr 8, 2026

Summary

  • Adds NotificationStore to @contember/bindx core – framework-agnostic store with subscriber pattern, auto-dismiss timers (error=60s, warning=15s, success=6s), and deduplication
  • Adds React hooks (useNotifications, useShowNotification, useDismissNotification, usePersistWithFeedback) to @contember/bindx-react
  • Adds ToastContainer/ToastItem components, ErrorOverlay for critical load errors, and BindxErrorBoundary to @contember/bindx-ui
  • PersistButton now automatically shows success/error/warning toasts via usePersistWithFeedback

Mirrors the error handling UX from the original Contember binding (full-screen overlay for load errors, toast notifications for persist results). Field-level errors already worked via FormContainerFormError.

Usage

<BindxProvider ...>
  <BindxErrorBoundary>
    <App />
    <ToastContainer />
  </BindxErrorBoundary>
</BindxProvider>

Test plan

  • bun run typecheck passes
  • bun run build passes
  • 14 new unit tests for NotificationStore (add, dismiss, clear, dedup, subscribe, destroy)
  • All 1204 existing unit/react tests pass
  • Visual verification of toasts in playground (bun run playground)

Add user-facing error handling UI that was missing in bindx compared to
the original Contember binding. The implementation adds three layers:

- NotificationStore (core): framework-agnostic store with subscriber
  pattern, auto-dismiss timers, and deduplication
- React hooks: useNotifications, useShowNotification, useDismissNotification,
  and usePersistWithFeedback (wraps usePersist with automatic toasts)
- UI components: ToastContainer/ToastItem for toast display,
  ErrorOverlay for critical load errors, BindxErrorBoundary for
  React error boundaries

PersistButton now uses usePersistWithFeedback for automatic feedback
on save (success/error/validation warning toasts).
@vparys vparys merged commit 72d95b1 into main Apr 8, 2026
3 checks passed
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

1 participant