@selfcommunity/react-core 0.4.9-alpha.2 → 0.4.9-alpha.4

package/lib/cjs/constants/Cache.d.ts

@@ -20,6 +20,9 @@ export declare const getCategoryObjectCacheKey: (id: any) => string;
 /** GROUP OBJECT **/
 export declare const GROUP_OBJECT_CACHE_PREFIX_KEY = "_grp_";
 export declare const getGroupObjectCacheKey: (id: any) => string;
+/** GROUPS OBJECT **/
+export declare const GROUPS_OBJECT_CACHE_PREFIX_KEY = "_grps_";
+export declare const getGroupsObjectCacheKey: () => string;
 /** INCUBATOR OBJECT **/
 export declare const INCUBATOR_OBJECT_CACHE_PREFIX_KEY = "_inc_";
 export declare const getIncubatorObjectCacheKey: (id: any) => string;

package/lib/cjs/constants/Cache.js

@@ -3,8 +3,8 @@
  * Cache prefixes
  */
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.POLL_SUGGESTION_TOOLS_STATE_CACHE_PREFIX_KEY = exports.INCUBATOR_SUGGESTION_TOOLS_STATE_CACHE_PREFIX_KEY = exports.INCUBATOR_LIST_TOOLS_STATE_CACHE_PREFIX_KEY = exports.PEOPLE_SUGGESTION_TOOLS_STATE_CACHE_PREFIX_KEY = exports.TRENDING_PEOPLE_TOOLS_STATE_CACHE_PREFIX_KEY = exports.RELATED_FEED_TOOLS_STATE_CACHE_PREFIX_KEY = exports.TRENDING_FEED_TOOLS_STATE_CACHE_PREFIX_KEY = exports.USER_CONNECTIONS_REQUESTS_SENT_TOOLS_STATE_CACHE_PREFIX_KEY = exports.USER_CONNECTIONS_REQUESTS_TOOLS_STATE_CACHE_PREFIX_KEY = exports.USER_CONNECTIONS_TOOLS_STATE_CACHE_PREFIX_KEY = exports.USER_FOLLOWED_TOOLS_STATE_CACHE_PREFIX_KEY = exports.USER_FOLLOWERS_TOOLS_STATE_CACHE_PREFIX_KEY = exports.CATEGORIES_POPULAR_TOOLS_STATE_CACHE_PREFIX_KEY = exports.CATEGORIES_SUGGESTION_TOOLS_STATE_CACHE_PREFIX_KEY = exports.CATEGORIES_FOLLOWED_TOOLS_STATE_CACHE_PREFIX_KEY = exports.CATEGORIES_LIST_TOOLS_STATE_CACHE_PREFIX_KEY = exports.getPmSnippetObjectCacheKey = exports.PM_SNIPPET_OBJECT_CACHE_PREFIX_KEY = exports.getPmSnippetsObjectCacheKey = exports.PM_SNIPPETS_OBJECT_CACHE_PREFIX_KEY = exports.getAdvObjectCacheKey = exports.ADV_OBJECT_CACHE_PREFIX_KEY = exports.getFeedSPCacheKey = exports.FEED_CACHE_SP_KEY = exports.getVirtualizedScrollStateCacheKey = exports.VIRTUALIZED_SCROLL_STATE_CACHE_PREFIX_KEY = exports.getStateFeedCacheKey = exports.FEED_STATE_CACHE_PREFIX_KEY = exports.getFeedCacheKey = exports.FEED_CACHE_PREFIX_KEY = exports.getBroadcastMessagesObjectCacheKey = exports.BROADCAST_MESSAGES_OBJECT_CACHE_PREFIX_KEY = exports.getContributorsCachePrefixKeys = exports.getContributorsCacheKey = exports.CONTRIBUTORS_CACHE_PREFIX_KEY = exports.getIncubatorObjectCacheKey = exports.INCUBATOR_OBJECT_CACHE_PREFIX_KEY = exports.getGroupObjectCacheKey = exports.GROUP_OBJECT_CACHE_PREFIX_KEY = exports.getCategoryObjectCacheKey = exports.CATEGORY_OBJECT_CACHE_PREFIX_KEY = exports.getCategoriesObjectCacheKey = exports.CATEGORIES_OBJECT_CACHE_PREFIX_KEY = exports.getCommentObjectsCachePrefixKeys = exports.getCommentObjectsCacheKey = exports.COMMENT_OBJECTS_CACHE_PREFIX_KEY = exports.getCommentObjectCacheKey = exports.COMMENT_OBJECT_CACHE_PREFIX_KEY = exports.getFeedObjectCacheKey = exports.FEED_OBJECT_CACHE_PREFIX_KEY = void 0;
-exports.getWidgetStateCacheKey = exports.GROUPS_LIST_TOOLS_STATE_CACHE_PREFIX_KEY = exports.GROUP_REQUESTS_TOOLS_STATE_CACHE_PREFIX_KEY = exports.GROUP_MEMBERS_TOOLS_STATE_CACHE_PREFIX_KEY = void 0;
+exports.INCUBATOR_LIST_TOOLS_STATE_CACHE_PREFIX_KEY = exports.PEOPLE_SUGGESTION_TOOLS_STATE_CACHE_PREFIX_KEY = exports.TRENDING_PEOPLE_TOOLS_STATE_CACHE_PREFIX_KEY = exports.RELATED_FEED_TOOLS_STATE_CACHE_PREFIX_KEY = exports.TRENDING_FEED_TOOLS_STATE_CACHE_PREFIX_KEY = exports.USER_CONNECTIONS_REQUESTS_SENT_TOOLS_STATE_CACHE_PREFIX_KEY = exports.USER_CONNECTIONS_REQUESTS_TOOLS_STATE_CACHE_PREFIX_KEY = exports.USER_CONNECTIONS_TOOLS_STATE_CACHE_PREFIX_KEY = exports.USER_FOLLOWED_TOOLS_STATE_CACHE_PREFIX_KEY = exports.USER_FOLLOWERS_TOOLS_STATE_CACHE_PREFIX_KEY = exports.CATEGORIES_POPULAR_TOOLS_STATE_CACHE_PREFIX_KEY = exports.CATEGORIES_SUGGESTION_TOOLS_STATE_CACHE_PREFIX_KEY = exports.CATEGORIES_FOLLOWED_TOOLS_STATE_CACHE_PREFIX_KEY = exports.CATEGORIES_LIST_TOOLS_STATE_CACHE_PREFIX_KEY = exports.getPmSnippetObjectCacheKey = exports.PM_SNIPPET_OBJECT_CACHE_PREFIX_KEY = exports.getPmSnippetsObjectCacheKey = exports.PM_SNIPPETS_OBJECT_CACHE_PREFIX_KEY = exports.getAdvObjectCacheKey = exports.ADV_OBJECT_CACHE_PREFIX_KEY = exports.getFeedSPCacheKey = exports.FEED_CACHE_SP_KEY = exports.getVirtualizedScrollStateCacheKey = exports.VIRTUALIZED_SCROLL_STATE_CACHE_PREFIX_KEY = exports.getStateFeedCacheKey = exports.FEED_STATE_CACHE_PREFIX_KEY = exports.getFeedCacheKey = exports.FEED_CACHE_PREFIX_KEY = exports.getBroadcastMessagesObjectCacheKey = exports.BROADCAST_MESSAGES_OBJECT_CACHE_PREFIX_KEY = exports.getContributorsCachePrefixKeys = exports.getContributorsCacheKey = exports.CONTRIBUTORS_CACHE_PREFIX_KEY = exports.getIncubatorObjectCacheKey = exports.INCUBATOR_OBJECT_CACHE_PREFIX_KEY = exports.getGroupsObjectCacheKey = exports.GROUPS_OBJECT_CACHE_PREFIX_KEY = exports.getGroupObjectCacheKey = exports.GROUP_OBJECT_CACHE_PREFIX_KEY = exports.getCategoryObjectCacheKey = exports.CATEGORY_OBJECT_CACHE_PREFIX_KEY = exports.getCategoriesObjectCacheKey = exports.CATEGORIES_OBJECT_CACHE_PREFIX_KEY = exports.getCommentObjectsCachePrefixKeys = exports.getCommentObjectsCacheKey = exports.COMMENT_OBJECTS_CACHE_PREFIX_KEY = exports.getCommentObjectCacheKey = exports.COMMENT_OBJECT_CACHE_PREFIX_KEY = exports.getFeedObjectCacheKey = exports.FEED_OBJECT_CACHE_PREFIX_KEY = void 0;
+exports.getWidgetStateCacheKey = exports.GROUPS_LIST_TOOLS_STATE_CACHE_PREFIX_KEY = exports.GROUP_REQUESTS_TOOLS_STATE_CACHE_PREFIX_KEY = exports.GROUP_MEMBERS_TOOLS_STATE_CACHE_PREFIX_KEY = exports.POLL_SUGGESTION_TOOLS_STATE_CACHE_PREFIX_KEY = exports.INCUBATOR_SUGGESTION_TOOLS_STATE_CACHE_PREFIX_KEY = void 0;
 /** FEED OBJECT **/
 exports.FEED_OBJECT_CACHE_PREFIX_KEY = '_fo_';
 const getFeedObjectCacheKey = (id, type) => `${exports.FEED_OBJECT_CACHE_PREFIX_KEY}${type}_${id}`;
@@ -31,6 +31,10 @@ exports.getCategoryObjectCacheKey = getCategoryObjectCacheKey;
 exports.GROUP_OBJECT_CACHE_PREFIX_KEY = '_grp_';
 const getGroupObjectCacheKey = (id) => `${exports.GROUP_OBJECT_CACHE_PREFIX_KEY}${id}`;
 exports.getGroupObjectCacheKey = getGroupObjectCacheKey;
+/** GROUPS OBJECT **/
+exports.GROUPS_OBJECT_CACHE_PREFIX_KEY = '_grps_';
+const getGroupsObjectCacheKey = () => `${exports.GROUPS_OBJECT_CACHE_PREFIX_KEY}`;
+exports.getGroupsObjectCacheKey = getGroupsObjectCacheKey;
 /** INCUBATOR OBJECT **/
 exports.INCUBATOR_OBJECT_CACHE_PREFIX_KEY = '_inc_';
 const getIncubatorObjectCacheKey = (id) => `${exports.INCUBATOR_OBJECT_CACHE_PREFIX_KEY}${id}`;

package/lib/cjs/constants/Routes.js

@@ -69,6 +69,6 @@ exports.defaultRoutes = {
     [exports.RECOVER_ROUTE_NAME]: '/recover/',
     [exports.CUSTOM_PAGES_ROUTE_NAME]: '/:id/:slug/',
     [exports.LEGAL_PAGES_ROUTE_NAME]: '/legal/:policy/',
-    [exports.GROUP_ROUTE_NAME]: '/group/:id/',
+    [exports.GROUP_ROUTE_NAME]: '/group/:id/:slug/',
     [exports.GROUPS_ROUTE_NAME]: '/groups/',
 };

package/lib/cjs/hooks/useSCFetchGroups.d.ts

@@ -0,0 +1,22 @@
+import { SCGroupType } from '@selfcommunity/types';
+import { CacheStrategies } from '@selfcommunity/utils';
+/**
+ :::info
+ This custom hook is used to fetch groups.
+ @param object.cacheStrategy
+
+ :::tip Context can be consumed in this way:
+
+ ```jsx
+ const {groups, isLoading} = useSCFetchGroups();
+ ```
+ :::
+ * @param props
+ */
+declare const useSCFetchGroups: (props?: {
+    cacheStrategy?: CacheStrategies;
+}) => {
+    groups: SCGroupType[];
+    isLoading: boolean;
+};
+export default useSCFetchGroups;

package/lib/cjs/hooks/useSCFetchGroups.js

@@ -0,0 +1,83 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+const tslib_1 = require("tslib");
+const react_1 = require("react");
+const Errors_1 = require("../constants/Errors");
+const api_services_1 = require("@selfcommunity/api-services");
+const utils_1 = require("@selfcommunity/utils");
+const Cache_1 = require("../constants/Cache");
+const init = { groups: [], isLoading: true };
+// HYDRATE the cache
+const hydrate = (ids) => {
+    if (!ids) {
+        return null;
+    }
+    const groups = ids.map((id) => {
+        const __groupCacheKey = (0, Cache_1.getGroupObjectCacheKey)(id);
+        return utils_1.LRUCache.get(__groupCacheKey);
+    });
+    if (groups.filter((c) => !c).length > 0) {
+        // REVALIDATE CACHE
+        return null;
+    }
+    return groups;
+};
+/**
+ :::info
+ This custom hook is used to fetch groups.
+ @param object.cacheStrategy
+
+ :::tip Context can be consumed in this way:
+
+ ```jsx
+ const {groups, isLoading} = useSCFetchGroups();
+ ```
+ :::
+ * @param props
+ */
+const useSCFetchGroups = (props) => {
+    // PROPS
+    const { cacheStrategy = utils_1.CacheStrategies.CACHE_FIRST } = props || {};
+    // CACHE
+    const __groupsCacheKey = (0, Cache_1.getGroupsObjectCacheKey)();
+    // STATE
+    const groups = cacheStrategy !== utils_1.CacheStrategies.NETWORK_ONLY ? hydrate(utils_1.LRUCache.get(__groupsCacheKey, null)) : null;
+    const [data, setData] = (0, react_1.useState)(groups !== null ? { groups, isLoading: false } : init);
+    /**
+     * Fetch groups
+     */
+    const fetchGroups = (next = api_services_1.Endpoints.GetAllGroups.url()) => tslib_1.__awaiter(void 0, void 0, void 0, function* () {
+        const response = yield api_services_1.http.request({
+            url: next,
+            method: api_services_1.Endpoints.GetAllGroups.method,
+        });
+        const data = response.data;
+        if (data.next) {
+            return data.results.concat(yield fetchGroups(data.next));
+        }
+        return data.results;
+    });
+    /**
+     * Get groups
+     */
+    (0, react_1.useEffect)(() => {
+        if (cacheStrategy === utils_1.CacheStrategies.CACHE_FIRST && groups) {
+            return;
+        }
+        fetchGroups()
+            .then((data) => {
+            setData({ groups: data, isLoading: false });
+            utils_1.LRUCache.set(__groupsCacheKey, data.map((group) => {
+                const __groupCacheKey = (0, Cache_1.getGroupObjectCacheKey)(group.id);
+                utils_1.LRUCache.set(__groupCacheKey, group);
+                return group.id;
+            }));
+        })
+            .catch((error) => {
+            console.log(error);
+            utils_1.Logger.error(Errors_1.SCOPE_SC_CORE, 'Unable to retrieve groups');
+        });
+    }, []);
+    return data;
+};
+exports.default = useSCFetchGroups;

package/lib/cjs/hooks/useSCSubscribedGroupsManager.d.ts

@@ -20,6 +20,7 @@ export default function useSCSubscribedGroupsManager(user?: SCUserType): {
         id: number;
     }) => boolean;
     subscribe?: undefined;
+    unsubscribe?: undefined;
     subscriptionStatus?: undefined;
     refresh?: undefined;
     emptyCache?: undefined;
@@ -30,6 +31,7 @@ export default function useSCSubscribedGroupsManager(user?: SCUserType): {
         id: number;
     }) => boolean;
     subscribe: (group: SCGroupType) => Promise<any>;
+    unsubscribe: (group: SCGroupType) => Promise<any>;
     subscriptionStatus: (group: SCGroupType) => string;
     refresh: () => void;
     emptyCache: () => void;

package/lib/cjs/hooks/useSCSubscribedGroupsManager.js

@@ -75,6 +75,28 @@ function useSCSubscribedGroupsManager(user) {
             return Promise.resolve(res.data);
         });
     }, [data, loading, cache]);
+    /**
+     * Memoized subscribe Group
+     * Toggle action
+     */
+    const unsubscribe = (0, react_1.useMemo)(() => (group) => {
+        setLoading(group.id);
+        return api_services_1.http
+            .request({
+            url: api_services_1.Endpoints.UnsubscribeFromGroup.url({ id: group.id }),
+            method: api_services_1.Endpoints.UnsubscribeFromGroup.method,
+        })
+            .then((res) => {
+            if (res.status >= 300) {
+                return Promise.reject(res);
+            }
+            updateCache([group.id]);
+            const isSubscribed = data.includes(group.id);
+            setData((prev) => (isSubscribed ? prev.filter((id) => id !== group.id) : [...[group.id], ...prev]));
+            setUnLoading(group.id);
+            return Promise.resolve(res.data);
+        });
+    }, [data, loading, cache]);
     /**
      * Check the authenticated user subscription status to the group
      * Update the groups cached
@@ -171,6 +193,6 @@ function useSCSubscribedGroupsManager(user) {
     if (!user) {
         return { groups: data, loading, isLoading };
     }
-    return { groups: data, loading, isLoading, subscribe, subscriptionStatus, refresh, emptyCache };
+    return { groups: data, loading, isLoading, subscribe, unsubscribe, subscriptionStatus, refresh, emptyCache };
 }
 exports.default = useSCSubscribedGroupsManager;

package/lib/cjs/index.d.ts

@@ -61,6 +61,7 @@ import useSCFetchBroadcastMessages from './hooks/useSCFetchBroadcastMessages';
 import useSCFetchUserBlockedBy from './hooks/useSCFetchUserBlockedBy';
 import useSCUserIsBlocked from './hooks/useSCUserIsBlocked';
 import useSCFetchGroup from './hooks/useSCFetchGroup';
+import useSCFetchGroups from './hooks/useSCFetchGroups';
 /**
  * Routing component
  */
@@ -80,4 +81,4 @@ import * as Locale from './constants/Locale';
 /**
  * List all exports
  */
-export { SCUserContextType, SCFollowedCategoriesManagerType, SCContextProviderType, SCContextType, SCSettingsType, SCSessionType, SCSettingsManagerType, SCFollowedManagerType, SCFollowersManagerType, SCConnectionsManagerType, SCSubscribedIncubatorsManagerType, SCLocaleType, SCNotificationContextType, SCPreferencesContextType, SCThemeContextType, SCRoutingContextType, SCLocaleContextType, SCAlertMessagesContextType, SCThemeAvatarVariableType, SCThemeCategoryIconVariableType, SCThemeCategoryVariableType, SCThemeVariablesType, SCThemeType, SCSubscribedGroupsManagerType, SCContext, SCUserContext, SCThemeContext, SCRoutingContext, SCLocaleContext, SCPreferencesContext, useSCContext, SCContextProvider, SCUserProvider, useSCUser, useSCPreferences, SCThemeProvider, useSCTheme, withSCTheme, SCRoutingProvider, useSCRouting, SCLocaleProvider, useSCLocale, withSCLocale, SCPreferencesProvider, SCPreferences, SCFeatures, SCNotification, SCNotificationProvider, SCNotificationContext, useSCNotification, SCAlertMessagesProvider, SCAlertMessagesContext, useSCAlertMessages, Link, SCRoutes, SCCache, UserUtils, Locale, useSCFetchUser, useSCFetchUserProviders, useSCFetchVote, useSCFetchFeedObject, useSCFetchCommentObject, useSCFetchCommentObjects, useSCFetchCustomAdv, useSCFetchTag, useSCFetchAddressingTagList, useSCFetchCategory, useSCFetchCategories, useSCFetchIncubator, useSCMediaClick, useSCFetchContributors, useSCFetchFeed, useIsComponentMountedRef, usePreviousValue, useIsomorphicLayoutEffect, useEffectOnce, useNoInitialEffect, useSCFetchPrivateMessageSnippets, useSCFetchBroadcastMessages, useSCFetchUserBlockedBy, useSCUserIsBlocked, useSCFetchGroup, };
+export { SCUserContextType, SCFollowedCategoriesManagerType, SCContextProviderType, SCContextType, SCSettingsType, SCSessionType, SCSettingsManagerType, SCFollowedManagerType, SCFollowersManagerType, SCConnectionsManagerType, SCSubscribedIncubatorsManagerType, SCLocaleType, SCNotificationContextType, SCPreferencesContextType, SCThemeContextType, SCRoutingContextType, SCLocaleContextType, SCAlertMessagesContextType, SCThemeAvatarVariableType, SCThemeCategoryIconVariableType, SCThemeCategoryVariableType, SCThemeVariablesType, SCThemeType, SCSubscribedGroupsManagerType, SCContext, SCUserContext, SCThemeContext, SCRoutingContext, SCLocaleContext, SCPreferencesContext, useSCContext, SCContextProvider, SCUserProvider, useSCUser, useSCPreferences, SCThemeProvider, useSCTheme, withSCTheme, SCRoutingProvider, useSCRouting, SCLocaleProvider, useSCLocale, withSCLocale, SCPreferencesProvider, SCPreferences, SCFeatures, SCNotification, SCNotificationProvider, SCNotificationContext, useSCNotification, SCAlertMessagesProvider, SCAlertMessagesContext, useSCAlertMessages, Link, SCRoutes, SCCache, UserUtils, Locale, useSCFetchUser, useSCFetchUserProviders, useSCFetchVote, useSCFetchFeedObject, useSCFetchCommentObject, useSCFetchCommentObjects, useSCFetchCustomAdv, useSCFetchTag, useSCFetchAddressingTagList, useSCFetchCategory, useSCFetchCategories, useSCFetchIncubator, useSCMediaClick, useSCFetchContributors, useSCFetchFeed, useIsComponentMountedRef, usePreviousValue, useIsomorphicLayoutEffect, useEffectOnce, useNoInitialEffect, useSCFetchPrivateMessageSnippets, useSCFetchBroadcastMessages, useSCFetchUserBlockedBy, useSCUserIsBlocked, useSCFetchGroup, useSCFetchGroups, };

package/lib/cjs/index.js

@@ -1,7 +1,7 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.useIsComponentMountedRef = exports.useSCFetchFeed = exports.useSCFetchContributors = exports.useSCMediaClick = exports.useSCFetchIncubator = exports.useSCFetchCategories = exports.useSCFetchCategory = exports.useSCFetchAddressingTagList = exports.useSCFetchTag = exports.useSCFetchCustomAdv = exports.useSCFetchCommentObjects = exports.useSCFetchCommentObject = exports.useSCFetchFeedObject = exports.useSCFetchVote = exports.useSCFetchUserProviders = exports.useSCFetchUser = exports.Locale = exports.UserUtils = exports.SCCache = exports.SCRoutes = exports.Link = exports.useSCAlertMessages = exports.SCAlertMessagesContext = exports.SCAlertMessagesProvider = exports.useSCNotification = exports.SCNotificationContext = exports.SCNotificationProvider = exports.SCNotification = exports.SCFeatures = exports.SCPreferences = exports.SCPreferencesProvider = exports.withSCLocale = exports.useSCLocale = exports.SCLocaleProvider = exports.useSCRouting = exports.SCRoutingProvider = exports.withSCTheme = exports.useSCTheme = exports.SCThemeProvider = exports.useSCPreferences = exports.useSCUser = exports.SCUserProvider = exports.SCContextProvider = exports.useSCContext = exports.SCPreferencesContext = exports.SCLocaleContext = exports.SCRoutingContext = exports.SCThemeContext = exports.SCUserContext = exports.SCContext = void 0;
-exports.useSCFetchGroup = exports.useSCUserIsBlocked = exports.useSCFetchUserBlockedBy = exports.useSCFetchBroadcastMessages = exports.useSCFetchPrivateMessageSnippets = exports.useNoInitialEffect = exports.useEffectOnce = exports.useIsomorphicLayoutEffect = exports.usePreviousValue = void 0;
+exports.useSCFetchGroups = exports.useSCFetchGroup = exports.useSCUserIsBlocked = exports.useSCFetchUserBlockedBy = exports.useSCFetchBroadcastMessages = exports.useSCFetchPrivateMessageSnippets = exports.useNoInitialEffect = exports.useEffectOnce = exports.useIsomorphicLayoutEffect = exports.usePreviousValue = void 0;
 const tslib_1 = require("tslib");
 /**
  * ContextProvider component
@@ -112,6 +112,8 @@ const useSCUserIsBlocked_1 = tslib_1.__importDefault(require("./hooks/useSCUserI
 exports.useSCUserIsBlocked = useSCUserIsBlocked_1.default;
 const useSCFetchGroup_1 = tslib_1.__importDefault(require("./hooks/useSCFetchGroup"));
 exports.useSCFetchGroup = useSCFetchGroup_1.default;
+const useSCFetchGroups_1 = tslib_1.__importDefault(require("./hooks/useSCFetchGroups"));
+exports.useSCFetchGroups = useSCFetchGroups_1.default;
 /**
  * Routing component
  */

package/lib/cjs/types/context.d.ts

@@ -266,6 +266,10 @@ export interface SCSubscribedGroupsManagerType {
      * Handle user subscription to a group
      */
     subscribe?: (group: SCGroupType) => Promise<any>;
+    /**
+     * Handle user unsubscription from a group
+     */
+    unsubscribe?: (group: SCGroupType) => Promise<any>;
     /**
      * Handles a user subscription status to a group, caching data
      */

package/lib/esm/constants/Cache.d.ts

@@ -20,6 +20,9 @@ export declare const getCategoryObjectCacheKey: (id: any) => string;
 /** GROUP OBJECT **/
 export declare const GROUP_OBJECT_CACHE_PREFIX_KEY = "_grp_";
 export declare const getGroupObjectCacheKey: (id: any) => string;
+/** GROUPS OBJECT **/
+export declare const GROUPS_OBJECT_CACHE_PREFIX_KEY = "_grps_";
+export declare const getGroupsObjectCacheKey: () => string;
 /** INCUBATOR OBJECT **/
 export declare const INCUBATOR_OBJECT_CACHE_PREFIX_KEY = "_inc_";
 export declare const getIncubatorObjectCacheKey: (id: any) => string;

package/lib/esm/constants/Cache.js

@@ -20,6 +20,9 @@ export const getCategoryObjectCacheKey = (id) => `${CATEGORY_OBJECT_CACHE_PREFIX
 /** GROUP OBJECT **/
 export const GROUP_OBJECT_CACHE_PREFIX_KEY = '_grp_';
 export const getGroupObjectCacheKey = (id) => `${GROUP_OBJECT_CACHE_PREFIX_KEY}${id}`;
+/** GROUPS OBJECT **/
+export const GROUPS_OBJECT_CACHE_PREFIX_KEY = '_grps_';
+export const getGroupsObjectCacheKey = () => `${GROUPS_OBJECT_CACHE_PREFIX_KEY}`;
 /** INCUBATOR OBJECT **/
 export const INCUBATOR_OBJECT_CACHE_PREFIX_KEY = '_inc_';
 export const getIncubatorObjectCacheKey = (id) => `${INCUBATOR_OBJECT_CACHE_PREFIX_KEY}${id}`;

package/lib/esm/constants/Routes.js

@@ -66,6 +66,6 @@ export const defaultRoutes = {
     [RECOVER_ROUTE_NAME]: '/recover/',
     [CUSTOM_PAGES_ROUTE_NAME]: '/:id/:slug/',
     [LEGAL_PAGES_ROUTE_NAME]: '/legal/:policy/',
-    [GROUP_ROUTE_NAME]: '/group/:id/',
+    [GROUP_ROUTE_NAME]: '/group/:id/:slug/',
     [GROUPS_ROUTE_NAME]: '/groups/',
 };

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

@@ -0,0 +1,22 @@
+import { SCGroupType } from '@selfcommunity/types';
+import { CacheStrategies } from '@selfcommunity/utils';
+/**
+ :::info
+ This custom hook is used to fetch groups.
+ @param object.cacheStrategy
+
+ :::tip Context can be consumed in this way:
+
+ ```jsx
+ const {groups, isLoading} = useSCFetchGroups();
+ ```
+ :::
+ * @param props
+ */
+declare const useSCFetchGroups: (props?: {
+    cacheStrategy?: CacheStrategies;
+}) => {
+    groups: SCGroupType[];
+    isLoading: boolean;
+};
+export default useSCFetchGroups;

package/lib/esm/hooks/useSCFetchGroups.js

@@ -0,0 +1,81 @@
+import { __awaiter } from "tslib";
+import { useEffect, useState } from 'react';
+import { SCOPE_SC_CORE } from '../constants/Errors';
+import { Endpoints, http } from '@selfcommunity/api-services';
+import { CacheStrategies, Logger, LRUCache } from '@selfcommunity/utils';
+import { getGroupObjectCacheKey, getGroupsObjectCacheKey } from '../constants/Cache';
+const init = { groups: [], isLoading: true };
+// HYDRATE the cache
+const hydrate = (ids) => {
+    if (!ids) {
+        return null;
+    }
+    const groups = ids.map((id) => {
+        const __groupCacheKey = getGroupObjectCacheKey(id);
+        return LRUCache.get(__groupCacheKey);
+    });
+    if (groups.filter((c) => !c).length > 0) {
+        // REVALIDATE CACHE
+        return null;
+    }
+    return groups;
+};
+/**
+ :::info
+ This custom hook is used to fetch groups.
+ @param object.cacheStrategy
+
+ :::tip Context can be consumed in this way:
+
+ ```jsx
+ const {groups, isLoading} = useSCFetchGroups();
+ ```
+ :::
+ * @param props
+ */
+const useSCFetchGroups = (props) => {
+    // PROPS
+    const { cacheStrategy = CacheStrategies.CACHE_FIRST } = props || {};
+    // CACHE
+    const __groupsCacheKey = getGroupsObjectCacheKey();
+    // STATE
+    const groups = cacheStrategy !== CacheStrategies.NETWORK_ONLY ? hydrate(LRUCache.get(__groupsCacheKey, null)) : null;
+    const [data, setData] = useState(groups !== null ? { groups, isLoading: false } : init);
+    /**
+     * Fetch groups
+     */
+    const fetchGroups = (next = Endpoints.GetAllGroups.url()) => __awaiter(void 0, void 0, void 0, function* () {
+        const response = yield http.request({
+            url: next,
+            method: Endpoints.GetAllGroups.method,
+        });
+        const data = response.data;
+        if (data.next) {
+            return data.results.concat(yield fetchGroups(data.next));
+        }
+        return data.results;
+    });
+    /**
+     * Get groups
+     */
+    useEffect(() => {
+        if (cacheStrategy === CacheStrategies.CACHE_FIRST && groups) {
+            return;
+        }
+        fetchGroups()
+            .then((data) => {
+            setData({ groups: data, isLoading: false });
+            LRUCache.set(__groupsCacheKey, data.map((group) => {
+                const __groupCacheKey = getGroupObjectCacheKey(group.id);
+                LRUCache.set(__groupCacheKey, group);
+                return group.id;
+            }));
+        })
+            .catch((error) => {
+            console.log(error);
+            Logger.error(SCOPE_SC_CORE, 'Unable to retrieve groups');
+        });
+    }, []);
+    return data;
+};
+export default useSCFetchGroups;

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

@@ -20,6 +20,7 @@ export default function useSCSubscribedGroupsManager(user?: SCUserType): {
         id: number;
     }) => boolean;
     subscribe?: undefined;
+    unsubscribe?: undefined;
     subscriptionStatus?: undefined;
     refresh?: undefined;
     emptyCache?: undefined;
@@ -30,6 +31,7 @@ export default function useSCSubscribedGroupsManager(user?: SCUserType): {
         id: number;
     }) => boolean;
     subscribe: (group: SCGroupType) => Promise<any>;
+    unsubscribe: (group: SCGroupType) => Promise<any>;
     subscriptionStatus: (group: SCGroupType) => string;
     refresh: () => void;
     emptyCache: () => void;

package/lib/esm/hooks/useSCSubscribedGroupsManager.js

@@ -72,6 +72,28 @@ export default function useSCSubscribedGroupsManager(user) {
             return Promise.resolve(res.data);
         });
     }, [data, loading, cache]);
+    /**
+     * Memoized subscribe Group
+     * Toggle action
+     */
+    const unsubscribe = useMemo(() => (group) => {
+        setLoading(group.id);
+        return http
+            .request({
+            url: Endpoints.UnsubscribeFromGroup.url({ id: group.id }),
+            method: Endpoints.UnsubscribeFromGroup.method,
+        })
+            .then((res) => {
+            if (res.status >= 300) {
+                return Promise.reject(res);
+            }
+            updateCache([group.id]);
+            const isSubscribed = data.includes(group.id);
+            setData((prev) => (isSubscribed ? prev.filter((id) => id !== group.id) : [...[group.id], ...prev]));
+            setUnLoading(group.id);
+            return Promise.resolve(res.data);
+        });
+    }, [data, loading, cache]);
     /**
      * Check the authenticated user subscription status to the group
      * Update the groups cached
@@ -168,5 +190,5 @@ export default function useSCSubscribedGroupsManager(user) {
     if (!user) {
         return { groups: data, loading, isLoading };
     }
-    return { groups: data, loading, isLoading, subscribe, subscriptionStatus, refresh, emptyCache };
+    return { groups: data, loading, isLoading, subscribe, unsubscribe, subscriptionStatus, refresh, emptyCache };
 }

package/lib/esm/index.d.ts

@@ -61,6 +61,7 @@ import useSCFetchBroadcastMessages from './hooks/useSCFetchBroadcastMessages';
 import useSCFetchUserBlockedBy from './hooks/useSCFetchUserBlockedBy';
 import useSCUserIsBlocked from './hooks/useSCUserIsBlocked';
 import useSCFetchGroup from './hooks/useSCFetchGroup';
+import useSCFetchGroups from './hooks/useSCFetchGroups';
 /**
  * Routing component
  */
@@ -80,4 +81,4 @@ import * as Locale from './constants/Locale';
 /**
  * List all exports
  */
-export { SCUserContextType, SCFollowedCategoriesManagerType, SCContextProviderType, SCContextType, SCSettingsType, SCSessionType, SCSettingsManagerType, SCFollowedManagerType, SCFollowersManagerType, SCConnectionsManagerType, SCSubscribedIncubatorsManagerType, SCLocaleType, SCNotificationContextType, SCPreferencesContextType, SCThemeContextType, SCRoutingContextType, SCLocaleContextType, SCAlertMessagesContextType, SCThemeAvatarVariableType, SCThemeCategoryIconVariableType, SCThemeCategoryVariableType, SCThemeVariablesType, SCThemeType, SCSubscribedGroupsManagerType, SCContext, SCUserContext, SCThemeContext, SCRoutingContext, SCLocaleContext, SCPreferencesContext, useSCContext, SCContextProvider, SCUserProvider, useSCUser, useSCPreferences, SCThemeProvider, useSCTheme, withSCTheme, SCRoutingProvider, useSCRouting, SCLocaleProvider, useSCLocale, withSCLocale, SCPreferencesProvider, SCPreferences, SCFeatures, SCNotification, SCNotificationProvider, SCNotificationContext, useSCNotification, SCAlertMessagesProvider, SCAlertMessagesContext, useSCAlertMessages, Link, SCRoutes, SCCache, UserUtils, Locale, useSCFetchUser, useSCFetchUserProviders, useSCFetchVote, useSCFetchFeedObject, useSCFetchCommentObject, useSCFetchCommentObjects, useSCFetchCustomAdv, useSCFetchTag, useSCFetchAddressingTagList, useSCFetchCategory, useSCFetchCategories, useSCFetchIncubator, useSCMediaClick, useSCFetchContributors, useSCFetchFeed, useIsComponentMountedRef, usePreviousValue, useIsomorphicLayoutEffect, useEffectOnce, useNoInitialEffect, useSCFetchPrivateMessageSnippets, useSCFetchBroadcastMessages, useSCFetchUserBlockedBy, useSCUserIsBlocked, useSCFetchGroup, };
+export { SCUserContextType, SCFollowedCategoriesManagerType, SCContextProviderType, SCContextType, SCSettingsType, SCSessionType, SCSettingsManagerType, SCFollowedManagerType, SCFollowersManagerType, SCConnectionsManagerType, SCSubscribedIncubatorsManagerType, SCLocaleType, SCNotificationContextType, SCPreferencesContextType, SCThemeContextType, SCRoutingContextType, SCLocaleContextType, SCAlertMessagesContextType, SCThemeAvatarVariableType, SCThemeCategoryIconVariableType, SCThemeCategoryVariableType, SCThemeVariablesType, SCThemeType, SCSubscribedGroupsManagerType, SCContext, SCUserContext, SCThemeContext, SCRoutingContext, SCLocaleContext, SCPreferencesContext, useSCContext, SCContextProvider, SCUserProvider, useSCUser, useSCPreferences, SCThemeProvider, useSCTheme, withSCTheme, SCRoutingProvider, useSCRouting, SCLocaleProvider, useSCLocale, withSCLocale, SCPreferencesProvider, SCPreferences, SCFeatures, SCNotification, SCNotificationProvider, SCNotificationContext, useSCNotification, SCAlertMessagesProvider, SCAlertMessagesContext, useSCAlertMessages, Link, SCRoutes, SCCache, UserUtils, Locale, useSCFetchUser, useSCFetchUserProviders, useSCFetchVote, useSCFetchFeedObject, useSCFetchCommentObject, useSCFetchCommentObjects, useSCFetchCustomAdv, useSCFetchTag, useSCFetchAddressingTagList, useSCFetchCategory, useSCFetchCategories, useSCFetchIncubator, useSCMediaClick, useSCFetchContributors, useSCFetchFeed, useIsComponentMountedRef, usePreviousValue, useIsomorphicLayoutEffect, useEffectOnce, useNoInitialEffect, useSCFetchPrivateMessageSnippets, useSCFetchBroadcastMessages, useSCFetchUserBlockedBy, useSCUserIsBlocked, useSCFetchGroup, useSCFetchGroups, };

package/lib/esm/index.js

@@ -57,6 +57,7 @@ import useSCFetchBroadcastMessages from './hooks/useSCFetchBroadcastMessages';
 import useSCFetchUserBlockedBy from './hooks/useSCFetchUserBlockedBy';
 import useSCUserIsBlocked from './hooks/useSCUserIsBlocked';
 import useSCFetchGroup from './hooks/useSCFetchGroup';
+import useSCFetchGroups from './hooks/useSCFetchGroups';
 /**
  * Routing component
  */
@@ -76,4 +77,4 @@ import * as Locale from './constants/Locale';
 /**
  * List all exports
  */
-export { SCContext, SCUserContext, SCThemeContext, SCRoutingContext, SCLocaleContext, SCPreferencesContext, useSCContext, SCContextProvider, SCUserProvider, useSCUser, useSCPreferences, SCThemeProvider, useSCTheme, withSCTheme, SCRoutingProvider, useSCRouting, SCLocaleProvider, useSCLocale, withSCLocale, SCPreferencesProvider, SCPreferences, SCFeatures, SCNotification, SCNotificationProvider, SCNotificationContext, useSCNotification, SCAlertMessagesProvider, SCAlertMessagesContext, useSCAlertMessages, Link, SCRoutes, SCCache, UserUtils, Locale, useSCFetchUser, useSCFetchUserProviders, useSCFetchVote, useSCFetchFeedObject, useSCFetchCommentObject, useSCFetchCommentObjects, useSCFetchCustomAdv, useSCFetchTag, useSCFetchAddressingTagList, useSCFetchCategory, useSCFetchCategories, useSCFetchIncubator, useSCMediaClick, useSCFetchContributors, useSCFetchFeed, useIsComponentMountedRef, usePreviousValue, useIsomorphicLayoutEffect, useEffectOnce, useNoInitialEffect, useSCFetchPrivateMessageSnippets, useSCFetchBroadcastMessages, useSCFetchUserBlockedBy, useSCUserIsBlocked, useSCFetchGroup, };
+export { SCContext, SCUserContext, SCThemeContext, SCRoutingContext, SCLocaleContext, SCPreferencesContext, useSCContext, SCContextProvider, SCUserProvider, useSCUser, useSCPreferences, SCThemeProvider, useSCTheme, withSCTheme, SCRoutingProvider, useSCRouting, SCLocaleProvider, useSCLocale, withSCLocale, SCPreferencesProvider, SCPreferences, SCFeatures, SCNotification, SCNotificationProvider, SCNotificationContext, useSCNotification, SCAlertMessagesProvider, SCAlertMessagesContext, useSCAlertMessages, Link, SCRoutes, SCCache, UserUtils, Locale, useSCFetchUser, useSCFetchUserProviders, useSCFetchVote, useSCFetchFeedObject, useSCFetchCommentObject, useSCFetchCommentObjects, useSCFetchCustomAdv, useSCFetchTag, useSCFetchAddressingTagList, useSCFetchCategory, useSCFetchCategories, useSCFetchIncubator, useSCMediaClick, useSCFetchContributors, useSCFetchFeed, useIsComponentMountedRef, usePreviousValue, useIsomorphicLayoutEffect, useEffectOnce, useNoInitialEffect, useSCFetchPrivateMessageSnippets, useSCFetchBroadcastMessages, useSCFetchUserBlockedBy, useSCUserIsBlocked, useSCFetchGroup, useSCFetchGroups, };

package/lib/esm/types/context.d.ts

@@ -266,6 +266,10 @@ export interface SCSubscribedGroupsManagerType {
      * Handle user subscription to a group
      */
     subscribe?: (group: SCGroupType) => Promise<any>;
+    /**
+     * Handle user unsubscription from a group
+     */
+    unsubscribe?: (group: SCGroupType) => Promise<any>;
     /**
      * Handles a user subscription status to a group, caching data
      */