Skip to content

feat: add toast notifications#1343

Open
TUPM96 wants to merge 1 commit into
SolFoundry:mainfrom
TUPM96:feat/bounty-825-toasts
Open

feat: add toast notifications#1343
TUPM96 wants to merge 1 commit into
SolFoundry:mainfrom
TUPM96:feat/bounty-825-toasts

Conversation

@TUPM96
Copy link
Copy Markdown

@TUPM96 TUPM96 commented May 26, 2026

Closes #825

Summary

  • Add a global ToastProvider/useToast system with success, error, warning, and info variants.
  • Render accessible role=alert toasts that slide in from top-right, stack, auto-dismiss after 5 seconds, and support manual dismiss.
  • Wire toasts into key bounty actions: review fee verification, solution submission, treasury copy, bounty draft creation, escrow verification, and publish success/failure.
  • Add focused tests for variants, stacking, manual dismiss, and auto-dismiss.
  • Restore tracked frontend shared helpers needed by existing app imports and build.

Verification

  • git diff --check
  • npm run test -- toast-context.test.tsx
  • npm run build

Wallet

  • Not included by automation; contributor should add their Solana wallet address before payout.

Copilot AI review requested due to automatic review settings May 26, 2026 02:14
Copy link
Copy Markdown

Copilot AI left a comment

Choose a reason for hiding this comment

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

Pull request overview

Note

Copilot was unable to run its full agentic suite in this review.

Introduces a global toast/notification system and supports it with shared UI utilities and animations, then wires it into bounty creation/submission flows.

Changes:

  • Added ToastProvider/useToast context + UI rendering for toast notifications.
  • Integrated toast feedback into SubmissionForm and BountyCreateWizard user actions.
  • Added shared utils + animations modules and a Vitest test suite for the toast context.

Reviewed changes

Copilot reviewed 7 out of 8 changed files in this pull request and generated 4 comments.

Show a summary per file
File Description
frontend/src/main.tsx Wraps the app with ToastProvider so toasts can be shown anywhere.
frontend/src/contexts/ToastContext.tsx Implements toast state management, rendering, animations, and the useToast hook.
frontend/src/components/bounty/SubmissionForm.tsx Emits toast notifications for verification/submission/copy actions.
frontend/src/components/bounty/BountyCreateWizard.tsx Emits toast notifications for create/verify/publish/copy actions.
frontend/src/tests/toast-context.test.tsx Adds component tests validating toast variants, stacking, manual dismiss, and auto-dismiss.
frontend/src/lib/utils.ts Adds formatting/time helper utilities used across the UI.
frontend/src/lib/animations.ts Adds shared Framer Motion variant presets.
.gitignore Un-ignores frontend/src/lib so new shared modules are tracked.
Comments suppressed due to low confidence (1)

frontend/src/components/bounty/BountyCreateWizard.tsx:1

  • Same clipboard issue as in SubmissionForm: writeText(...) can reject and currently fails silently. Add a .catch(...) branch to show a toast error and keep copiedAddr unchanged when the copy fails.
import React, { useState, useCallback } from 'react';

Comment on lines 93 to 97
navigator.clipboard.writeText(TREASURY).then(() => {
setCopied(true);
toast.info('Treasury address copied.');
setTimeout(() => setCopied(false), 2000);
});
Comment on lines +60 to +73
it('auto-dismisses after five seconds by default', async () => {
vi.useFakeTimers();
renderHarness();

fireEvent.click(screen.getByText('Info'));
expect(screen.getByRole('alert')).toBeInTheDocument();

act(() => {
vi.advanceTimersByTime(5200);
});

vi.useRealTimers();
await waitFor(() => expect(screen.queryByRole('alert')).not.toBeInTheDocument());
});
exit={{ opacity: 0, x: 32, scale: 0.98 }}
transition={{ duration: 0.18, ease: 'easeOut' }}
role="alert"
aria-live="assertive"
Comment on lines +137 to +143
<div className="fixed right-4 top-20 z-[100] flex w-[calc(100vw-2rem)] max-w-sm flex-col gap-3 sm:right-6">
<AnimatePresence initial={false}>
{toasts.map((toast) => (
<ToastItem key={toast.id} toast={toast} onDismiss={dismissToast} />
))}
</AnimatePresence>
</div>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

missing-wallet PR is missing a Solana wallet for bounty payout

Projects

None yet

Development

Successfully merging this pull request may close these issues.

🏭 Bounty T1: Toast Notification System

2 participants