Feat/transac

[codesailor4]

✅ All requirements met:

1. Transaction notification system

• Added TransactionNotification and TransactionStatusType types to support pending, success, error, and dismissed statuses
• Built comprehensive store actions to manage notifications:
  • addTransactionNotification: Creates notifications with duplicate prevention via idempotency keys
  • updateTransactionNotification: Updates existing notifications
  • dismissTransactionNotification: Marks notifications as dismissed
  • removeTransactionNotification: Cleans up dismissed notifications
  • findNotificationByIdempotencyKey: Prevents duplicate notifications

2. UI Components

• TransactionStatus.tsx: Handles status display with appropriate icons, colors, and accessibility attributes
• TransactionToast.tsx: Manages the toast container, auto-dismissal, keyboard dismissal (Escape key), and cleanup

3. Accessibility features

• Added screen-reader announcements with aria-live regions
• Keyboard dismissal support (press Escape to dismiss most recent notification)
• Proper ARIA roles and labels for all interactive elements
• Screen-reader-only announcer element for better accessibility

4. Integration with vault mutations

Updated all vault operations in useVault.ts to use the notification system:

• createVault: Shows "Creating your vault..." → "Vault created successfully!"
• depositToVault: Shows "Processing deposit..." → "Successfully deposited..."
• withdrawFromVault: Shows "Processing withdrawal..." → "Successfully withdrew..."
• lockVault: Shows "Locking your vault..." → "Vault locked successfully!"
• unlockVault: Shows "Unlocking your vault..." → "Vault unlocked successfully!"
• closeVault: Shows "Closing your vault..." → "Vault closed successfully!"

5. Smart features

• Auto-dismisses success/error notifications after 5 seconds
• Cleans up dismissed notifications after 5 seconds to prevent memory leaks
• Prevents duplicate notifications using idempotency keys
• Shows transaction references for tracing
• Displays safe, user-friendly messages for all operations

6. Global availability

Added the TransactionToast component to the root layout.tsx so it's available throughout the entire app, and added the necessary CSS for screen readers in globals.css.

The system is now ready to be extended to funding, lending, and borrowing transactions in the future, as it's built to support all those transaction types out of the box.

closes #79