@selfcommunity/react-core 0.4.0-alpha.11 → 0.4.0-alpha.110

package/lib/esm/hooks/useSCSettingsManager.js

@@ -95,4 +95,3 @@ export default function useSCSettingsManager(user) {
     }, [user]);
     return { update, get, all, isLoading, refresh };
 }
-//# sourceMappingURL=useSCSettingsManager.js.map

package/lib/esm/hooks/useSCSubscribedIncubatorsManager.d.ts

@@ -15,8 +15,18 @@ import { SCIncubatorType, SCUserType } from '@selfcommunity/types';
  */
 export default function useSCSubscribedIncubatorsManager(user?: SCUserType): {
     incubators: any[];
-    loading: number[];
-    isLoading: (obj: {
+    loading: any[];
+    isLoading: (v: number | {
+        id: number;
+    }) => boolean;
+    subscribe?: undefined;
+    isSubscribed?: undefined;
+    refresh?: undefined;
+    emptyCache?: undefined;
+} | {
+    incubators: any[];
+    loading: any[];
+    isLoading: (v: number | {
         id: number;
     }) => boolean;
     subscribe: (incubator: SCIncubatorType) => Promise<any>;
@@ -24,4 +34,3 @@ export default function useSCSubscribedIncubatorsManager(user?: SCUserType): {
     refresh: () => void;
     emptyCache: () => void;
 };
-//# sourceMappingURL=useSCSubscribedIncubatorsManager.d.ts.map

package/lib/esm/hooks/useSCSubscribedIncubatorsManager.js

@@ -1,4 +1,4 @@
-import { useMemo } from 'react';
+import { useEffect, useMemo } from "react";
 import { http, Endpoints } from '@selfcommunity/api-services';
 import { Logger } from '@selfcommunity/utils';
 import { SCOPE_SC_CORE } from '../constants/Errors';
@@ -18,7 +18,8 @@ import useSCCachingManager from './useSCCachingManager';
  :::
  */
 export default function useSCSubscribedIncubatorsManager(user) {
-    const { cache, updateCache, emptyCache, data, setData, loading, setLoading, isLoading } = useSCCachingManager();
+    const { cache, updateCache, emptyCache, data, setData, loading, setLoading, setUnLoading, isLoading } = useSCCachingManager();
+    const authUserId = user ? user.id : null;
     /**
      * Memoized refresh all subscribed
      * It makes a single request to the server and retrieves
@@ -38,10 +39,9 @@ export default function useSCSubscribedIncubatorsManager(user) {
                 if (res.status >= 300) {
                     return Promise.reject(res);
                 }
-                updateCache(Object.keys(res.data.results).map((id) => parseInt(id)));
-                setData(Object.entries(res.data.results)
-                    .filter(([k, v]) => v === true)
-                    .map(([k, v]) => parseInt(k)));
+                const incubatorIds = res.data.results.map((i) => i.id);
+                updateCache(incubatorIds);
+                setData(incubatorIds);
                 return Promise.resolve(res.data);
             })
                 .catch((e) => {
@@ -55,7 +55,7 @@ export default function useSCSubscribedIncubatorsManager(user) {
      * Toggle action
      */
     const subscribe = useMemo(() => (incubator) => {
-        setLoading((prev) => [...prev, ...[incubator.id]]);
+        setLoading(incubator.id);
         return http
             .request({
             url: Endpoints.SubscribeToIncubator.url({ id: incubator.id }),
@@ -68,7 +68,7 @@ export default function useSCSubscribedIncubatorsManager(user) {
             updateCache([incubator.id]);
             const isSubscribed = data.includes(incubator.id);
             setData((prev) => (isSubscribed ? prev.filter((id) => id !== incubator.id) : [...[incubator.id], ...prev]));
-            setLoading((prev) => prev.filter((i) => i !== incubator.id));
+            setUnLoading(incubator.id);
             return Promise.resolve(res.data);
         });
     }, [data, loading, cache]);
@@ -79,7 +79,7 @@ export default function useSCSubscribedIncubatorsManager(user) {
      * @param incubator
      */
     const checkIsIncubatorFollowed = (incubator) => {
-        setLoading((prev) => (prev.includes(incubator.id) ? prev : [...prev, ...[incubator.id]]));
+        setLoading(incubator.id);
         http
             .request({
             url: Endpoints.CheckIncubatorSubscription.url({ id: incubator.id }),
@@ -91,22 +91,19 @@ export default function useSCSubscribedIncubatorsManager(user) {
             }
             updateCache([incubator.id]);
             setData((prev) => (res.data.subscribed ? [...prev, ...[incubator.id]] : prev.filter((id) => id !== incubator.id)));
-            setLoading((prev) => prev.filter((i) => i !== incubator.id));
+            setUnLoading(incubator.id);
             return Promise.resolve(res.data);
         });
     };
-    // /**
-    //  * Bypass remote check if the incubator is subscribed
-    //  */
-    // const getSubscriptionStatus = useMemo(
-    //   () => (incubator: SCIncubatorType) => {
-    //     const isSubscribed = incubator.subscribed === true;
-    //     updateCache([incubator.id]);
-    //     setData((prev) => (isSubscribed ? [...prev, ...[incubator.id]] : prev));
-    //     return isSubscribed;
-    //   },
-    //   [data, cache]
-    // );
+    /**
+     * Bypass remote check if the incubator is subscribed
+     */
+    const getSubscriptionStatus = useMemo(() => (incubator) => {
+        const isSubscribed = incubator.subscribed || false;
+        updateCache([incubator.id]);
+        setData((prev) => (isSubscribed ? [...prev, ...[incubator.id]] : prev));
+        return isSubscribed;
+    }, [data, cache]);
     /**
      * Memoized isSubscribed
      * If incubator is already in cache -> check if the incubator is in subscribed,
@@ -116,14 +113,26 @@ export default function useSCSubscribedIncubatorsManager(user) {
         if (cache.includes(incubator.id)) {
             return Boolean(data.includes(incubator.id));
         }
-        // if ('subscribed' in incubator) {
-        //   return getSubscriptionStatus(incubator);
-        // }
-        if (!loading.includes(incubator.id)) {
-            checkIsIncubatorFollowed(incubator);
+        if (authUserId) {
+            if ('subscribed' in incubator) {
+                return getSubscriptionStatus(incubator);
+            }
+            if (!isLoading(incubator)) {
+                checkIsIncubatorFollowed(incubator);
+            }
         }
         return false;
-    }, [data, loading, cache]);
+    }, [data, loading, cache, authUserId]);
+    /**
+     * Empty cache on logout
+     */
+    useEffect(() => {
+        if (!authUserId) {
+            emptyCache();
+        }
+    }, [authUserId]);
+    if (!user) {
+        return { incubators: data, loading, isLoading };
+    }
     return { incubators: data, loading, isLoading, subscribe, isSubscribed, refresh, emptyCache };
 }
-//# sourceMappingURL=useSCSubscribedIncubatorsManager.js.map

package/lib/esm/hooks/useSCUserIsBlocked.d.ts

@@ -0,0 +1,18 @@
+import { SCUserType } from '@selfcommunity/types';
+/**
+ :::info
+ This custom hook is used to check if the user is blocked by me or I am blocked by him.
+ :::
+ :::tipHow to use it:
+
+ Follow these steps:
+ ```jsx
+ 1. import useUserIsBlocked from '@selfcommunity/react-core';
+ 2.	const {blocked, loading: loadingBlockedBy} = useUserIsBlocked(user);
+ ```
+ :::
+ */
+export default function useSCUserIsBlocked(user: SCUserType): {
+    blocked: boolean;
+    loading: boolean;
+};

package/lib/esm/hooks/useSCUserIsBlocked.js

@@ -0,0 +1,29 @@
+import { useMemo } from 'react';
+import useSCFetchUserBlockedBy from './useSCFetchUserBlockedBy';
+import { useSCUser } from '../components/provider/SCUserProvider';
+/**
+ :::info
+ This custom hook is used to check if the user is blocked by me or I am blocked by him.
+ :::
+ :::tipHow to use it:
+
+ Follow these steps:
+ ```jsx
+ 1. import useUserIsBlocked from '@selfcommunity/react-core';
+ 2.	const {blocked, loading: loadingBlockedBy} = useUserIsBlocked(user);
+ ```
+ :::
+ */
+export default function useSCUserIsBlocked(user) {
+    // CONTEXT
+    const scUserContext = useSCUser();
+    // HOOKS
+    const { blockedBy, loading: loadingBlockedBy } = useSCFetchUserBlockedBy({ user });
+    // CONST
+    const isMe = useMemo(() => scUserContext.user && user.id === scUserContext.user.id, [scUserContext.user, user]);
+    // Status blocked
+    const blocked = !isMe && user && Boolean((scUserContext.user && scUserContext.managers.blockedUsers.isBlocked(user)) || blockedBy);
+    // Status loading
+    const loading = scUserContext.user && (scUserContext.managers.blockedUsers.isLoading() || loadingBlockedBy);
+    return { blocked, loading };
+}

package/lib/esm/hooks/useSCWebPushMessaging.d.ts

@@ -1,9 +1,19 @@
+import { SnackbarKey } from 'notistack';
+/**
+ * Browser supported on backend
+ */
+export declare const CHROME_BROWSER_TYPE = "chrome";
+export declare const FIREFOX_BROWSER_TYPE = "firefox";
+export declare const OPERA_BROWSER_TYPE = "opera";
+export declare const EDGE_BROWSER_TYPE = "edge";
+export declare const DEFAULT_BROWSER_TYPE = "chrome";
+export declare const SUPPORTED_BROWSER_TYPES: string[];
 /**
  :::info
- This custom hook is used to to init web push messaging.
+ This custom hook is used to init web push messaging.
  :::
  */
 export default function useSCWebPushMessaging(): {
     wpSubscription: any;
+    requestNotificationPermission: (snackbarId: SnackbarKey | null) => void;
 };
-//# sourceMappingURL=useSCWebPushMessaging.d.ts.map

package/lib/esm/hooks/useSCWebPushMessaging.js

@@ -1,16 +1,31 @@
-import { useContext, useEffect, useRef, useState } from 'react';
+import React, { useContext, useEffect, useRef, useState } from 'react';
 import { useSCContext } from '../components/provider/SCContextProvider';
 import { useSCUser } from '../components/provider/SCUserProvider';
 import { Logger } from '@selfcommunity/utils';
+import Button from '@mui/material/Button';
 import { loadVersionBrowser, urlB64ToUint8Array } from '@selfcommunity/utils';
 import { SCOPE_SC_CORE } from '../constants/Errors';
 import { http, Endpoints } from '@selfcommunity/api-services';
 import { WEB_PUSH_NOTIFICATION_DEVICE_TYPE } from '../constants/Device';
 import { SCPreferencesContext } from '../components/provider/SCPreferencesProvider';
+import { useSnackbar } from 'notistack';
 import * as SCPreferences from '../constants/Preferences';
+import { NOTIFICATIONS_WEB_PUSH_MESSAGING_DIALOG_COOKIE } from '../constants/Notifications';
+import Cookies from 'js-cookie';
+import { useIntl } from 'react-intl';
+import { isWebPushMessagingEnabled } from '../utils/notification';
+/**
+ * Browser supported on backend
+ */
+export const CHROME_BROWSER_TYPE = 'chrome';
+export const FIREFOX_BROWSER_TYPE = 'firefox';
+export const OPERA_BROWSER_TYPE = 'opera';
+export const EDGE_BROWSER_TYPE = 'edge';
+export const DEFAULT_BROWSER_TYPE = CHROME_BROWSER_TYPE;
+export const SUPPORTED_BROWSER_TYPES = [CHROME_BROWSER_TYPE, FIREFOX_BROWSER_TYPE, OPERA_BROWSER_TYPE, EDGE_BROWSER_TYPE];
 /**
  :::info
- This custom hook is used to to init web push messaging.
+ This custom hook is used to init web push messaging.
  :::
  */
 export default function useSCWebPushMessaging() {
@@ -18,6 +33,8 @@ export default function useSCWebPushMessaging() {
     const scContext = useSCContext();
     const scUserContext = useSCUser();
     const scPreferencesContext = useContext(SCPreferencesContext);
+    const intl = useIntl();
+    const { enqueueSnackbar, closeSnackbar } = useSnackbar();
     // STATE
     const [wpSubscription, setWpSubscription] = useState(null);
     // REFS
@@ -28,10 +45,43 @@ export default function useSCWebPushMessaging() {
         : SCPreferences.PROVIDERS_WEB_PUSH_PUBLIC_KEY in scPreferencesContext.preferences
             ? scPreferencesContext.preferences[SCPreferences.PROVIDERS_WEB_PUSH_PUBLIC_KEY].value
             : null;
-    const webPushEnabled = SCPreferences.PROVIDERS_WEB_PUSH_ENABLED in scPreferencesContext.preferences &&
+    const webPushPreferenceEnabled = SCPreferences.PROVIDERS_WEB_PUSH_ENABLED in scPreferencesContext.preferences &&
         scPreferencesContext.preferences[SCPreferences.PROVIDERS_WEB_PUSH_ENABLED].value
         ? scPreferencesContext.preferences[SCPreferences.PROVIDERS_WEB_PUSH_ENABLED].value
         : false;
+    /**
+     * Show custom Snackbar dialog to request permission
+     * User action required for some browser (ex. Safari)
+     */
+    const showCustomRequestNotificationSnackbar = () => {
+        if (!Cookies.get(NOTIFICATIONS_WEB_PUSH_MESSAGING_DIALOG_COOKIE)) {
+            enqueueSnackbar(intl.formatMessage({ id: 'ui.webPushNotification.requestPermission', defaultMessage: 'ui.webPushNotification.requestPermission' }), {
+                action: (snackbarId) => (React.createElement(React.Fragment, null,
+                    React.createElement(Button, { size: "small", sx: { color: '#FFF' }, onClick: () => requestNotificationPermission(snackbarId) }, intl.formatMessage({ id: 'ui.webPushNotification.allow', defaultMessage: 'ui.webPushNotification.allow' })),
+                    React.createElement(Button, { size: "small", sx: { color: '#FFF' }, onClick: () => closeRequestNotificationSnackbar(snackbarId) }, intl.formatMessage({ id: 'ui.webPushNotification.block', defaultMessage: 'ui.webPushNotification.block' })))),
+                variant: 'default',
+                anchorOrigin: { horizontal: 'center', vertical: 'bottom' },
+                preventDuplicate: true,
+            });
+        }
+        else {
+            Logger.info(SCOPE_SC_CORE, 'Skip show the dialog to request Web Push Notifications grant permission');
+        }
+    };
+    /**
+     * Close the SnackBar dialog if the request notification permission
+     * came from the custom dialog
+     * @param snackbarId
+     */
+    const closeRequestNotificationSnackbar = (snackbarId) => {
+        if (snackbarId) {
+            closeSnackbar(snackbarId);
+            // To set expiration in minutes:
+            // let inFifteenMinutes = new Date(new Date().getTime() + 15 * 60 * 1000);
+            // {expires: inFifteenMinutes}
+            Cookies.set(NOTIFICATIONS_WEB_PUSH_MESSAGING_DIALOG_COOKIE, '1', { expires: 1 });
+        }
+    };
     /**
      * perform update the Subscription
      * @param data
@@ -52,20 +102,45 @@ export default function useSCWebPushMessaging() {
             return Promise.resolve(res.data);
         });
     };
+    /**
+     * Return browser type
+     * Fallback to DEFAULT_BROWSER_TYPE if the browser detected not in SUPPORTED_BROWSER_TYPES
+     */
+    const getBrowserType = (browser) => {
+        if (SUPPORTED_BROWSER_TYPES.indexOf(browser.name) < 0) {
+            return DEFAULT_BROWSER_TYPE;
+        }
+        return browser.name;
+    };
+    /**
+     * Return registrationId based on browser type and subscription
+     * Fallback to subscription.endpoint if the browser detected not in SUPPORTED_BROWSER_TYPES
+     */
+    const getRegistrationId = (browser, sub) => {
+        if (SUPPORTED_BROWSER_TYPES.indexOf(browser.name) < 0) {
+            return sub.endpoint;
+        }
+        try {
+            const endpointParts = sub.endpoint.split('/');
+            return endpointParts[endpointParts.length - 1];
+        }
+        catch (e) {
+            return sub.endpoint;
+        }
+    };
     /**
      * updateSubscriptionOnServer to sync current subscription
      * @param sub
+     * @param remove
      */
     const updateSubscriptionOnServer = (sub, remove) => {
         const browser = loadVersionBrowser();
-        const endpointParts = sub.endpoint.split('/');
-        const registration_id = endpointParts[endpointParts.length - 1];
         const data = {
-            browser: browser.name.toUpperCase(),
+            browser: getBrowserType(browser).toUpperCase(),
             p256dh: btoa(String.fromCharCode.apply(null, new Uint8Array(sub.getKey('p256dh')))),
             auth: btoa(String.fromCharCode.apply(null, new Uint8Array(sub.getKey('auth')))),
             user: scUserContext.user ? scUserContext.user.username : '',
-            registration_id: registration_id,
+            registration_id: getRegistrationId(browser, sub),
         };
         return performUpdateSubscription(data, remove)
             .then((res) => {
@@ -73,6 +148,7 @@ export default function useSCWebPushMessaging() {
                 setWpSubscription(null);
             }
             else {
+                Logger.info(SCOPE_SC_CORE, 'Web Push Notifications subscription created successfully');
                 setWpSubscription(res);
             }
         })
@@ -86,87 +162,97 @@ export default function useSCWebPushMessaging() {
      */
     const unsubscribe = (callback = null) => {
         navigator.serviceWorker.ready.then(function (serviceWorkerRegistration) {
-            // To unsubscribe from push messaging, you need get the
-            // subcription object, which you can call unsubscribe() on.
-            serviceWorkerRegistration.pushManager
-                .getSubscription()
-                .then((pushSubscription) => {
-                // Check we have a subscription to unsubscribe
-                if (!pushSubscription) {
-                    // No subscription object, so set the state
-                    // to allow the user to subscribe to push
-                    return;
-                }
-                // We have a subscription, so call unsubscribe on it
-                pushSubscription
-                    .unsubscribe()
-                    .then(() => {
-                    Logger.info(SCOPE_SC_CORE, 'Unsubscription successfully');
-                    // Request to server to remove
-                    // the users data from your data store so you
-                    // don't attempt to send them push messages anymore
-                    updateSubscriptionOnServer(pushSubscription, true).then(() => {
-                        callback && callback();
+            if (serviceWorkerRegistration) {
+                // To unsubscribe from push messaging, you need get the
+                // subscription object, which you can call unsubscribe() on.
+                serviceWorkerRegistration.pushManager
+                    .getSubscription()
+                    .then((pushSubscription) => {
+                    // Check we have a subscription to unsubscribe
+                    if (!pushSubscription) {
+                        // No subscription object, so set the state
+                        // to allow the user to subscribe to push
+                        return;
+                    }
+                    // We have a subscription, so call unsubscribe on it
+                    pushSubscription
+                        .unsubscribe()
+                        .then(() => {
+                        Logger.info(SCOPE_SC_CORE, 'Unsubscription successfully');
+                        // Request to server to remove
+                        // the users data from your data store so you
+                        // don't attempt to send them push messages anymore
+                        void updateSubscriptionOnServer(pushSubscription, true).then(() => {
+                            callback && callback();
+                        });
+                    })
+                        .catch(function (e) {
+                        // We failed to unsubscribe, this can lead to
+                        // an unusual state, so may be best to remove
+                        // the subscription id from your data store and
+                        // inform the user that you disabled push
+                        Logger.info(SCOPE_SC_CORE, `Error on removing web push notification subscription.`);
+                        console.log(e);
                     });
                 })
                     .catch(function (e) {
-                    // We failed to unsubscribe, this can lead to
-                    // an unusual state, so may be best to remove
-                    // the subscription id from your data store and
-                    // inform the user that you disabled push
-                    Logger.info(SCOPE_SC_CORE, `Unsubscription error.`);
-                    console.log(e);
+                    Logger.info(SCOPE_SC_CORE, `Error thrown while unsubscribing from push messaging. ${e}`);
                 });
-            })
-                .catch(function (e) {
-                Logger.info(SCOPE_SC_CORE, `Error thrown while unsubscribing from push messaging. ${e}`);
-            });
+            }
         });
     };
     /**
      * Get subscription
      */
     const subscribe = () => {
-        navigator.serviceWorker.ready.then(function (serviceWorkerRegistration) {
-            serviceWorkerRegistration.pushManager
-                .subscribe({ userVisibleOnly: true, applicationServerKey: urlB64ToUint8Array(applicationServerKey) })
-                .then(function (subscription) {
-                if (!subscription) {
-                    Logger.info(SCOPE_SC_CORE, 'We aren’t subscribed to push.');
-                }
-                else {
-                    updateSubscriptionOnServer(subscription, false);
-                }
-            })
-                .catch(function (e) {
-                if (Notification.permission === 'denied') {
-                    // The user denied the notification permission which
-                    // means we failed to subscribe and the user will need
-                    // to manually change the notification permission to
-                    // subscribe to push messages
-                    Logger.info(SCOPE_SC_CORE, 'Permission for Notifications was denied');
-                }
-                else {
-                    // A problem occurred with the subscription
-                    subAttempts.current += 1;
-                    Logger.info(SCOPE_SC_CORE, `Unable to subscribe(${subAttempts.current}) to push. ${e}`);
-                    if (subAttempts.current < 3) {
-                        unsubscribe(() => subscribe());
+        navigator.serviceWorker.getRegistration().then(function (serviceWorkerRegistration) {
+            if (serviceWorkerRegistration) {
+                // service worker is registered
+                serviceWorkerRegistration.pushManager
+                    .subscribe({ userVisibleOnly: true, applicationServerKey: urlB64ToUint8Array(applicationServerKey) })
+                    .then(function (subscription) {
+                    if (!subscription) {
+                        Logger.info(SCOPE_SC_CORE, 'We aren’t subscribed to push.');
                     }
                     else {
-                        Logger.info(SCOPE_SC_CORE, `Unable to subscribe to push. ${e}`);
+                        void updateSubscriptionOnServer(subscription, false);
                     }
-                }
-            });
+                })
+                    .catch(function (e) {
+                    console.log(e);
+                    if (Notification.permission === 'denied') {
+                        // The user denied the notification permission which
+                        // means we failed to subscribe and the user will need
+                        // to manually change the notification permission to
+                        // subscribe to push messages
+                        Logger.info(SCOPE_SC_CORE, 'Permission for Web Push Notifications was denied');
+                    }
+                    else {
+                        // A problem occurred with the subscription
+                        subAttempts.current += 1;
+                        Logger.info(SCOPE_SC_CORE, `Unable to subscribe(${subAttempts.current}) to push. ${e}`);
+                        if (subAttempts.current < 3) {
+                            unsubscribe(() => subscribe());
+                        }
+                        else {
+                            Logger.info(SCOPE_SC_CORE, `Unable to subscribe to Web Push Notification. ${e}`);
+                        }
+                    }
+                });
+            }
+            else {
+                Logger.info(SCOPE_SC_CORE, `To receive Web Push Notifications the service worker must be registered.`);
+            }
         });
     };
     /**
      * Request web push notification permission
      * @type {(function(): void)|*}
      */
-    const requestNotificationPermission = () => {
+    const requestNotificationPermission = (snackbarId) => {
         if (Notification.permission !== 'granted') {
-            Notification.requestPermission().then(function (permission) {
+            Notification.requestPermission()
+                .then(function (permission) {
                 if (permission === 'granted') {
                     navigator.serviceWorker.ready.then((serviceWorkerRegistration) => {
                         // Do we already have a push message subscription?
@@ -180,7 +266,7 @@ export default function useSCWebPushMessaging() {
                                 return;
                             }
                             // Keep your server in sync with the latest subscription
-                            updateSubscriptionOnServer(subscription, false);
+                            void updateSubscriptionOnServer(subscription, false);
                         })
                             .catch((err) => {
                             Logger.info(SCOPE_SC_CORE, 'Error during getSubscription()');
@@ -191,8 +277,13 @@ export default function useSCWebPushMessaging() {
                 else {
                     Logger.info(SCOPE_SC_CORE, 'Permission for Notifications was denied');
                 }
+            })
+                .catch((err) => {
+                console.log(err);
+                Logger.info(SCOPE_SC_CORE, 'Request web push permission by a user generated gesture');
             });
         }
+        closeRequestNotificationSnackbar(snackbarId);
     };
     /**
      * Initialize state
@@ -201,7 +292,7 @@ export default function useSCWebPushMessaging() {
         /**
          * Check if Notifications supported in the service worker
          */
-        if (!('showNotification' in ServiceWorkerRegistration.prototype)) {
+        if (typeof ServiceWorkerRegistration === 'undefined') {
             Logger.info(SCOPE_SC_CORE, "Notifications aren't supported.");
             return;
         }
@@ -210,22 +301,27 @@ export default function useSCWebPushMessaging() {
          * so your development environment must serve content over HTTPS to match a production environment.
          * Check if push messaging is supported.
          */
-        if (!('PushManager' in window && 'serviceWorker' in navigator)) {
+        if (!('PushManager' in window && 'serviceWorker' in navigator && 'Notification' in window)) {
             Logger.info(SCOPE_SC_CORE, "Service Worker or Push messaging aren't supported.");
             return;
         }
         /**
          * Check the current Notification permission.
-         * If its denied, it's a permanent block until the user changes the permission
+         * If it's denied, it's a permanent block until the user changes the permission
          */
         if (Notification.permission === 'denied') {
-            Logger.info(SCOPE_SC_CORE, 'The user has blocked notifications.');
+            Logger.info(SCOPE_SC_CORE, 'The user has blocked Web Push Notifications.');
             return;
         }
         else {
             if (Notification.permission === 'default') {
-                Logger.info(SCOPE_SC_CORE, 'Request permission.');
-                requestNotificationPermission();
+                Logger.info(SCOPE_SC_CORE, 'Request permission');
+                if (navigator.userAgent.includes('Safari') && !navigator.userAgent.includes('Chrome')) {
+                    showCustomRequestNotificationSnackbar();
+                }
+                else {
+                    requestNotificationPermission(null);
+                }
             }
             else if (Notification.permission === 'granted') {
                 subscribe();
@@ -237,22 +333,29 @@ export default function useSCWebPushMessaging() {
      * If web push enabled, applicationServerKey and user is logged, check subscription
      */
     useEffect(() => {
-        if (!wpSubscription && !scContext.settings.notifications.webPushMessaging.disableToastMessage && scUserContext.user) {
-            if (!webPushEnabled) {
-                Logger.warn(SCOPE_SC_CORE, 'This instance is not configured to support notifications. Enable this feature.');
+        if (!wpSubscription && scUserContext.user) {
+            if (!isWebPushMessagingEnabled()) {
+                Logger.warn(SCOPE_SC_CORE, 'Mobile native notifications replace web push messages with this settings.');
+            }
+            else if (!webPushPreferenceEnabled || scContext.settings.notifications.webPushMessaging.disableToastMessage) {
+                Logger.warn(SCOPE_SC_CORE, 'This instance is not configured to support web push notifications or they have been disabled.');
             }
             else if (!applicationServerKey) {
                 Logger.warn(SCOPE_SC_CORE, 'Invalid or missing applicationServerKey. Check the configuration that is passed to the SCContextProvider.');
             }
             else {
+                Logger.info(SCOPE_SC_CORE, 'Initialize web push notification.');
                 initialiseState();
             }
         }
-        if (!scUserContext.user && wpSubscription) {
+        if ((!scUserContext.user || !isWebPushMessagingEnabled()) && wpSubscription) {
             // Unsubscribe if user not in session
-            unsubscribe();
+            unsubscribe(() => {
+                if (navigator.userAgent.includes('Safari') && !navigator.userAgent.includes('Chrome')) {
+                    Cookies.remove(NOTIFICATIONS_WEB_PUSH_MESSAGING_DIALOG_COOKIE);
+                }
+            });
         }
     }, [scUserContext.user, scContext.settings.notifications.webPushMessaging, wpSubscription]);
-    return { wpSubscription };
+    return { wpSubscription, requestNotificationPermission };
 }
-//# sourceMappingURL=useSCWebPushMessaging.js.map

package/lib/esm/hooks/useSCWebSocket.d.ts

@@ -2,11 +2,10 @@
 import { WSClientType } from '@selfcommunity/utils';
 /**
  :::info
- This custom hook is used to to init web socket.
+ This custom hook is used to init web socket.
  :::
  */
 export default function useSCWebSocket(): {
     wsInstance: WSClientType;
     setWsInstance: import("react").Dispatch<import("react").SetStateAction<WSClientType>>;
 };
-//# sourceMappingURL=useSCWebSocket.d.ts.map

package/lib/esm/hooks/useSCWebSocket.js

@@ -8,7 +8,7 @@ import { WS_FACILITY_NOTIFY, WS_SUB_PROTOCOL_PREFIX, WS_HEARTBEAT_MESSAGE, WS_PR
 import PubSub from 'pubsub-js';
 /**
  :::info
- This custom hook is used to to init web socket.
+ This custom hook is used to init web socket.
  :::
  */
 export default function useSCWebSocket() {
@@ -108,4 +108,3 @@ export default function useSCWebSocket() {
     };
     return { wsInstance, setWsInstance };
 }
-//# sourceMappingURL=useSCWebSocket.js.map