Skip to content

feat: add toast notification system (#825)#1357

Open
CHY9213 wants to merge 1 commit into
SolFoundry:mainfrom
CHY9213:feat/toast-notification-system
Open

feat: add toast notification system (#825)#1357
CHY9213 wants to merge 1 commit into
SolFoundry:mainfrom
CHY9213:feat/toast-notification-system

Conversation

@CHY9213
Copy link
Copy Markdown

@CHY9213 CHY9213 commented May 27, 2026

Toast Notification System

A complete toast notification system for bounty status changes, errors, and success messages.

Features

  • 4 variants: success (green), error (red), warning (amber), info (blue)
  • Auto-dismiss after 5 seconds (configurable)
  • Slide-in animation from top-right
  • Stack multiple toasts
  • Manual close button on each toast
  • Accessible with role="alert"
  • Dark mode compatible
  • Hook-based API for easy usage

Usage

// Wrap your app
import { ToastProvider } from '../contexts/ToastContext';

function App() {
  return (
    <ToastProvider>
      <YourApp />
    </ToastProvider>
  );
}

// Use anywhere
import { useToast } from '../contexts/ToastContext';

function YourComponent() {
  const toast = useToast();
  
  return (
    <button onClick={() => toast.success('Bounty created!')}>
      Create
    </button>
  );
}

Files

  • frontend/src/contexts/ToastContext.tsx — Context, Provider, and hook
  • frontend/src/components/bounty/ToastContainer.tsx — Visual component with animations
  • frontend/src/contexts/toast.ts — Re-export

Closes #825

Wallet: 2oWEBzKDQo9KYxAFYMPrR8QiwKJia4vbSXrbV4ep7eTz

Build a complete toast notification system for bounty status changes,
errors, and success messages.

Features:
- Success, error, warning, info variants with color coding
- Auto-dismiss after 5 seconds
- Slide-in animation from top-right
- Stack multiple toasts
- Accessible (role=alert)
- Manual close button
- Dark mode compatible
- Hook-based API: useToast().success(), .error(), etc.

Closes SolFoundry#825

Wallet: 2oWEBzKDQo9KYxAFYMPrR8QiwKJia4vbSXrbV4ep7eTz
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.

🏭 Bounty T1: Toast Notification System

1 participant