Inbox View - senior-design-marketplace/vue-typescript-client GitHub Wiki

Basics

The inbox view provides a place for users to view the full information about their notifications.

Toolbar

The view has a toolbar at the top of the page that adds notifications to the inbox. Both unread and read notifications can be seen at the same time if they are both selected. By default, it displays only unread notifications. The amount of notifications in each category is displayed as a badge on its corresponding button.

  • Closed - unread notifications
  • Opened - read notifications

Adding notification types

Each notification object in the store's notifications array has a type contained in the document object. If a new type of notification needs to be supported, first it needs to be added to the displayType method. After this, another v-list-item needs to be created in the <template v-slot:item="{ item, expand, isExpanded }"> that displays the basic information about the notification. Finally, a v-container must be added within the <template v-slot:expanded-item="{ headers, item }"> that displays the expanded information of the notification.