Skip to main content

System Features

  • Pop-up Cards (Toast): ⏳ Last 8 seconds and hide automatically.
  • Header Badge: 🔢 Shows the total number of unread notifications.
  • Synchronization: 🔄 Read/unread status syncs across all devices.
  • Automatic Cleanup: 🗑️ Read notifications are automatically deleted after 1 month.
  • Deletion: ❌ No deletion confirmation and no 'undo' option.
  • Essential Notifications: 📩 Are always sent via Web and Email.

Bell (Header): States and Actions 🔔​

  • Animation: ✨ Brief animation when a new notification arrives.
  • Badge: Displays a numeric badge with the total of unread items.
  • Action: Click → opens the sidesheet (side panel) with the history.

Notification

Pop-up card (Toast) 📲​

  • Position:
    • Desktop 💻: Top right corner.
    • Mobile 📱: Bottom.
  • Duration: ⏱️ 8 seconds (auto-dismiss).
  • Actionable: Clicking the card navigates to the corresponding section.

Side panel (Sidesheet) 📖​

  • Opening: Opens when clicking the bell.
  • Initial Load: Displays all notifications by default.
  • Filters: 🏷️ Chips to filter by section (General, Reports, Wallet, Settings).
  • Top Actions: ⚙️ Includes buttons to:
    • Mark all as read ✔️
    • Delete all 🗑️
    • Go to settings 🔧

Cards inside the sidesheet

  • Anatomy: section icon, title, summary, date/time, badge if unread.
  • Desktop interactions: hover to show ‘Mark as read’ and ‘Delete’.
  • Mobile interactions: swipe to show the same actions.
  • Clicking the card: navigates to the associated section.

Sidebar