[Feature] Add a global toast/notification system replacing ad-hoc inline error messages

[grantfox-oss]

Getting Started

1. Fork the repository: https://github.com/JointSave-org/Joint_Save
2. Clone your fork:

   git clone https://github.com/<your-username>/Joint_Save.git
   cd Joint_Save

3. Create a new branch:

   git checkout -b feat/global-toast-system

---

Overview

The project has a toast.tsx, toaster.tsx, and use-toast.ts already scaffolded under components/ui/, but several components (group-actions.tsx, the create-group forms) currently render error and success messages as inline <div> blocks with manually managed local state, rather than using the existing toast system. This is inconsistent and means errors can be missed if they scroll out of view.

Requirements

Audit and Migration

• Audit group-actions.tsx, flexible-form.tsx, rotational-form.tsx, target-form.tsx, and create-group.tsx for inline success/error message rendering
• Replace all of them with calls to the existing useToast() hook from hooks/use-toast.ts
• Standardize toast variants: success, error, info, warning — verify toast.tsx supports distinct visual styling for each (add if missing)

Consistency Rules

• All blockchain transaction outcomes (success/failure) must use toasts, never inline divs
• Form validation errors (e.g., "amount must be greater than 0") can remain inline next to the relevant field, but submission-level errors (network failure, contract rejection) must use toasts
• Toasts for transaction confirmations should include a "View on Explorer" action button linking to the Stellar Expert transaction page

Acceptance Criteria

• No remaining inline success/error <div> blocks for transaction outcomes in the audited components
• All 4 toast variants render with visually distinct styling
• Transaction success toasts include a working "View on Explorer" link
• Toasts auto-dismiss after a reasonable duration (5-7 seconds) except errors, which require manual dismissal
• No regression in existing form validation UX

[Clement-coder]

Hi,

I'm a full-stack software and blockchain engineer with experience delivering production-grade solutions across frontend, backend, infrastructure, analytics, and blockchain systems.

I'd like to take ownership of this issue. I've reviewed the requirements and have a clear approach for implementing a robust, scalable, and maintainable solution that satisfies all acceptance criteria. I'll ensure the implementation follows project conventions, includes comprehensive testing, and is properly documented.

I can start immediately and will provide consistent updates throughout development. Looking forward to contributing to the project.

[gelluisaac]

Hi, I’m interested in working on this issue. I have experience with web and blockchain development, and I’d love to contribute to the project. Please assign this issue to me if it’s available. Thanks!

[kingjames511]

I'd love to take this on. I’m highly experienced with React and frontend architecture. I can quickly set up a global notification provider/context to handle these toasts cleanly and refactor the current inline errors. I can deliver this within 48 hours.

[grantfox-oss]

🦊 GrantFox — @gelluisaac has been assigned to this issue as part of the Official Campaign campaign!

Next steps:

1. Open a Pull Request referencing this issue (e.g., Closes #38)
2. Your PR will be reviewed by the JointSave-org maintainers

Good luck! Track your progress on GrantFox.