Ameerul /Bug 76675 Deriv P2P notification disappears when we refresh …

…the page (#6603)

* fixed notifications on refresh in cashier page

* removed old function for getting unseen notifications

* added jsdoc for p2p_unseen_notifications

* Update packages/cashier/src/stores/general-store.js

Co-authored-by: Farrah Mae Ochoa <82315152+farrah-deriv@users.noreply.github.com>

Co-authored-by: Farrah Mae Ochoa <82315152+farrah-deriv@users.noreply.github.com>

packages/cashier/src/stores/general-store.js

@@ -1,6 +1,6 @@
 import React from 'react';
 import { action, computed, observable, reaction, when } from 'mobx';
-import { isCryptocurrency, getPropertyValue, routes } from '@deriv/shared';
+import { isCryptocurrency, isEmptyObject, getPropertyValue, routes } from '@deriv/shared';
 import { localize } from '@deriv/translations';
 import Constants from 'Constants/constants';
 import CashierNotifications from 'Components/cashier-notifications';
@@ -72,6 +72,28 @@ export default class GeneralStore extends BaseStore {
         return this.is_p2p_visible && !this.root_store.client.is_eu;
     }
 
+    /**
+     * Gets the notifications from local storage, within p2p_settings, where it checks which notification has
+     * been seen. The number of unseen notifications is displayed in vertical tab, notifications count, for P2P.
+     *
+     * @returns {number} Notifications that have not been seen by the user.
+     */
+    @computed
+    get p2p_unseen_notifications() {
+        const p2p_settings = JSON.parse(localStorage.getItem('p2p_settings') || '{}');
+        const local_storage_settings = p2p_settings[this.root_store.client.loginid];
+
+        if (isEmptyObject(local_storage_settings)) {
+            return 0;
+        }
+
+        const unseen_notifications = local_storage_settings.notifications.filter(
+            notification => !notification.is_seen
+        );
+
+        return unseen_notifications.length;
+    }
+
     @action.bound
     showP2pInCashierOnboarding() {
         const { account_list, is_virtual } = this.root_store.client;
@@ -284,6 +306,8 @@ export default class GeneralStore extends BaseStore {
         const { account_transfer, onramp, payment_agent, payment_agent_transfer, transaction_history } =
             modules.cashier;
 
+        this.setNotificationCount(this.p2p_unseen_notifications);
+
         if (client.is_logged_in) {
             // avoid calling this again
             if (this.is_populating_values) {