Wearesho Notifications Frontend

This library is a front-end adapter for Wearesho Notifications service. You can easily connect to notifications server and listen for updates.

Setup

npm i --save @sho-js/notifications-frontend

Usage

Setting up environment

Create a Notification Adapter instance

import { NotificationsAdapter } from "@sho-js/notifications-frontend";

const notificationServerUrl = new URL("http://url.to.your.notification.server/");
const notificationsAdapter = new NotificationsAdapter(notificationServerUrl);

You need to create a callback function that returns authorization token for user.

import axios, { AxiosResponse } from "axios";

async function receiveAuthorizationToken() {
    const response: AxiosResponse<{ token: string }> = await axios.get("/receive-authorization-token");
    return response.data.token;
}

Pass this callback to function authorize()

notificationsAdapter.authorize(receiveAuthorizationToken);

Note that this function is async, so it returns Promise

The next step is to call connect() for connecting socket and adding event listeners

notificationsAdapter.connect();

Notifications list

All notifications can be received by using loadNotifications()

notificationsAdapter.loadNotifications()
    .then((notifications) => {
        // you have received all notifications for current user
    });

Subscribers

To handle updates you may create an implementation of SubscriberInterface

import { SubscriberInterface, NotificationInterface } from "@sho-js/notifications-frontend";

class Subscriber implements SubscriberInterface {
    public handleNew = (notification: NotificationInterface) => {
        // do anything you want with notification
        // you can show it, add to notifications list etc.
    }

    public handleRead = (notificationId: string) => {
        // you can mark notification with specified id as read
    }

    public handleDelete = (notificationId: string) => {
        // you can delete notification from notifications list
    }
}

and then you should pass it to subscribe()

notificationsAdapter.subscribe(new Subscriber);

Actions with notifications

Read

To mark notification as read you should call readNotification() and pass notification`s id

const readNotificationId = 'id of read notification';
notificationsAdapter.readNotification(readNotificationId);

Delete

To delete notification you should use deleteNotification()

const deletedNotificationId = 'id of deleted notification';
notificationsAdapter.deleteNotification(deletedNotificationId);

Logout

If you want to close connection with notification server, you should call logout()

user.logout(); // example action when you need to close connection
notificationsAdapter.logout();