@selfcommunity/react-ui 0.7.0-alpha.4 → 0.7.0-alpha.41

package/lib/cjs/components/TrendingFeed/TrendingFeed.js

@@ -55,6 +55,7 @@ const Skeleton_1 = __importDefault(require("./Skeleton"));
 const system_1 = require("@mui/system");
 const HiddenPlaceholder_1 = __importDefault(require("../../shared/HiddenPlaceholder"));
 const react_core_1 = require("@selfcommunity/react-core");
+const tools_1 = require("../../utils/tools");
 const PREFIX = 'SCTrendingFeed';
 const classes = {
     root: `${PREFIX}-root`,
@@ -107,73 +108,87 @@ function TrendingFeed(inProps) {
         props: inProps,
         name: PREFIX
     });
-    const { className = null, categoryId = null, template = null, autoHide = null } = props, rest = __rest(props, ["className", "categoryId", "template", "autoHide"]);
+    const { className = null, categoryId = null, template = null, autoHide = null, cacheStrategy = utils_1.CacheStrategies.NETWORK_ONLY, onHeightChange, onStateChange, pageUrl = null } = props, rest = __rest(props, ["className", "categoryId", "template", "autoHide", "cacheStrategy", "onHeightChange", "onStateChange", "pageUrl"]);
     // REFS
     const isMountedRef = (0, react_core_1.useIsComponentMountedRef)();
     // STATE
-    const [posts, setPosts] = (0, react_1.useState)([]);
-    const [loading, setLoading] = (0, react_1.useState)(true);
-    const [hasMore, setHasMore] = (0, react_1.useState)(false);
+    const [state, dispatch] = (0, react_1.useReducer)(tools_1.dataToolsReducer, {
+        isLoadingNext: true,
+        next: `${api_services_1.Endpoints.CategoryTrendingFeed.url({ id: categoryId })}?limit=10`,
+        cacheKey: react_core_1.SCCache.getToolsStateCacheKey(react_core_1.SCCache.TRENDING_FEED_TOOLS_STATE_CACHE_PREFIX_KEY, categoryId),
+        cacheStrategy
+    }, tools_1.stateToolsInitializer);
     const [openTrendingPostDialog, setOpenTrendingPostDialog] = (0, react_1.useState)(false);
-    const [total, setTotal] = (0, react_1.useState)(0);
-    const [visible, setVisible] = (0, react_1.useState)(limit);
-    const [next, setNext] = (0, react_1.useState)(`${api_services_1.Endpoints.CategoryTrendingFeed.url({ id: categoryId })}?limit=10`);
     /**
      * Fetches a list of trending posts
      */
-    function fetchTrendingPost() {
-        if (next) {
-            api_services_1.http
-                .request({
-                url: next,
-                method: api_services_1.Endpoints.CategoryTrendingFeed.method
-            })
+    const fetchTrendingPost = (0, react_1.useMemo)(() => () => {
+        return api_services_1.http.request({
+            url: state.next,
+            method: api_services_1.Endpoints.CategoryTrendingFeed.method
+        });
+    }, [dispatch, state.next, state.isLoadingNext]);
+    const handleDialogOpening = () => {
+        setOpenTrendingPostDialog(true);
+    };
+    (0, react_1.useEffect)(() => {
+        if (cacheStrategy === utils_1.CacheStrategies.NETWORK_ONLY) {
+            onStateChange && onStateChange({ cacheStrategy: utils_1.CacheStrategies.CACHE_FIRST });
+        }
+    }, []);
+    /**
+     * On mount, fetches trending posts list
+     */
+    (0, react_1.useEffect)(() => {
+        let ignore = false;
+        if (state.next) {
+            fetchTrendingPost()
                 .then((res) => {
-                if (isMountedRef.current) {
+                if (res.status < 300 && isMountedRef.current && !ignore) {
                     const data = res.data;
-                    setPosts([...posts, ...data.results]);
-                    setHasMore(data.count > visible);
-                    setLoading(false);
-                    setTotal(data.count);
-                    setNext(data['next']);
+                    dispatch({
+                        type: tools_1.actionToolsTypes.LOAD_NEXT_SUCCESS,
+                        payload: {
+                            results: data.results,
+                            count: data.count,
+                            next: data.next
+                        }
+                    });
                 }
             })
                 .catch((error) => {
-                setLoading(false);
+                dispatch({ type: tools_1.actionToolsTypes.LOAD_NEXT_FAILURE, payload: { errorLoadNext: error } });
                 utils_1.Logger.error(Errors_1.SCOPE_SC_UI, error);
             });
+            return () => {
+                ignore = true;
+            };
         }
-    }
-    /**
-     * On mount, fetches trending posts list
-     */
-    (0, react_1.useEffect)(() => {
-        fetchTrendingPost();
-    }, []);
+    }, [state.next]);
     /**
      * Renders the list
      */
-    if (loading) {
+    if (state.isLoadingNext) {
         return react_1.default.createElement(Skeleton_1.default, null);
     }
     const f = (react_1.default.createElement(material_1.CardContent, null,
         react_1.default.createElement(material_1.Typography, { className: classes.title, variant: "h5" },
             react_1.default.createElement(react_intl_1.FormattedMessage, { id: "ui.trendingFeed.title", defaultMessage: "ui.trendingFeed.title" })),
-        !total ? (react_1.default.createElement(material_1.Typography, { className: classes.noResults, variant: "body2" },
+        !state.count ? (react_1.default.createElement(material_1.Typography, { className: classes.noResults, variant: "body2" },
             react_1.default.createElement(react_intl_1.FormattedMessage, { id: "ui.trendingFeed.noResults", defaultMessage: "ui.trendingFeed.noResults" }))) : (react_1.default.createElement(react_1.default.Fragment, null,
-            react_1.default.createElement(List_1.default, null, posts.slice(0, visible).map((obj, index) => (react_1.default.createElement(material_1.ListItem, { key: index },
+            react_1.default.createElement(List_1.default, null, state.results.slice(0, limit).map((obj, index) => (react_1.default.createElement(material_1.ListItem, { key: index },
                 react_1.default.createElement(FeedObject_1.default, { elevation: 0, feedObject: obj[obj.type], template: template, className: classes.trendingItem }))))),
-            hasMore && (react_1.default.createElement(material_1.Button, { size: "small", className: classes.showMore, onClick: () => setOpenTrendingPostDialog(true) },
+            limit < state.count && (react_1.default.createElement(material_1.Button, { size: "small", className: classes.showMore, onClick: pageUrl !== null && pageUrl !== void 0 ? pageUrl : handleDialogOpening },
                 react_1.default.createElement(react_intl_1.FormattedMessage, { id: "ui.trendingFeed.button.showMore", defaultMessage: "ui.trendingFeed.button.showMore" }))))),
-        openTrendingPostDialog && (react_1.default.createElement(BaseDialog_1.default, { title: react_1.default.createElement(react_intl_1.FormattedMessage, { id: "ui.trendingFeed.title", defaultMessage: "ui.trendingFeed.title" }), onClose: () => setOpenTrendingPostDialog(false), open: openTrendingPostDialog }, loading ? (react_1.default.createElement(CentralProgress_1.default, { size: 50 })) : (react_1.default.createElement(InfiniteScroll_1.default, { dataLength: posts.length, next: fetchTrendingPost, hasMoreNext: Boolean(next), loaderNext: react_1.default.createElement(CentralProgress_1.default, { size: 30 }), height: 400, endMessage: react_1.default.createElement("p", { style: { textAlign: 'center' } },
+        openTrendingPostDialog && (react_1.default.createElement(BaseDialog_1.default, { title: react_1.default.createElement(react_intl_1.FormattedMessage, { id: "ui.trendingFeed.title", defaultMessage: "ui.trendingFeed.title" }), onClose: () => setOpenTrendingPostDialog(false), open: openTrendingPostDialog }, state.isLoadingNext ? (react_1.default.createElement(CentralProgress_1.default, { size: 50 })) : (react_1.default.createElement(InfiniteScroll_1.default, { dataLength: state.results.length, next: fetchTrendingPost, hasMoreNext: Boolean(state.next), loaderNext: react_1.default.createElement(CentralProgress_1.default, { size: 30 }), height: 400, endMessage: react_1.default.createElement("p", { style: { textAlign: 'center' } },
                 react_1.default.createElement("b", null,
                     react_1.default.createElement(react_intl_1.FormattedMessage, { id: "ui.trendingFeed.noMoreResults", defaultMessage: "ui.trendingFeed.noMoreResults" }))) },
-            react_1.default.createElement(List_1.default, null, posts.map((obj, index) => (react_1.default.createElement(material_1.ListItem, { key: index },
+            react_1.default.createElement(List_1.default, null, state.results.map((obj, index) => (react_1.default.createElement(material_1.ListItem, { key: index },
                 react_1.default.createElement(FeedObject_1.default, { elevation: 0, feedObject: obj[obj.type], template: template, className: classes.trendingItem })))))))))));
     /**
      * Renders root object (if results and autoHide prop is set to false, otherwise component is hidden)
      */
-    if (autoHide && !total) {
+    if (autoHide && !state.count) {
         return react_1.default.createElement(HiddenPlaceholder_1.default, null);
     }
     return (react_1.default.createElement(Root, Object.assign({ className: (0, classnames_1.default)(classes.root, className) }, rest), f));

package/lib/cjs/components/TrendingFeed/TrendingFeed.js.map

@@ -1 +1 @@
-{"version":3,"file":"TrendingFeed.js","sourceRoot":"","sources":["../../../../src/components/TrendingFeed/TrendingFeed.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA,+CAAiD;AACjD,iDAA4C;AAC5C,8DAAsC;AACtC,4CAAwE;AACxE,uDAA+B;AAE/B,8DAA0E;AAC1E,gDAA4C;AAC5C,mDAAmD;AACnD,+DAAuC;AACvC,2CAA4C;AAE5C,4DAAoC;AACpC,yEAAiD;AACjD,mFAA2D;AAC3D,iFAAyD;AACzD,0DAAkC;AAClC,wCAA0C;AAC1C,uFAA+D;AAC/D,0DAAmE;AAGnE,MAAM,MAAM,GAAG,gBAAgB,CAAC;AAEhC,MAAM,OAAO,GAAG;IACd,IAAI,EAAE,GAAG,MAAM,OAAO;IACtB,KAAK,EAAE,GAAG,MAAM,QAAQ;IACxB,SAAS,EAAE,GAAG,MAAM,aAAa;IACjC,YAAY,EAAE,GAAG,MAAM,gBAAgB;IACvC,QAAQ,EAAE,GAAG,MAAM,YAAY;CAChC,CAAC;AAEF,MAAM,IAAI,GAAG,IAAA,eAAM,EAAC,gBAAM,EAAE;IAC1B,IAAI,EAAE,MAAM;IACZ,IAAI,EAAE,MAAM;IACZ,iBAAiB,EAAE,CAAC,KAAK,EAAE,MAAM,EAAE,EAAE,CAAC,MAAM,CAAC,IAAI;CAClD,CAAC,CAAC,CAAC,EAAC,KAAK,EAAC,EAAE,EAAE,CAAC,CAAC;IACf,YAAY,EAAE,KAAK,CAAC,OAAO,CAAC,CAAC,CAAC;IAC9B,CAAC,MAAM,OAAO,CAAC,YAAY,EAAE,CAAC,EAAE;QAC9B,YAAY,EAAE,CAAC;KAChB;CACF,CAAC,CAAC,CAAC;AA4BJ;;;;;;;;;;;;;;;;;;;;;;;;;GAyBG;AACH,SAAwB,YAAY,CAAC,OAA0B;IAC7D,OAAO;IACP,MAAM,KAAK,GAAG,CAAC,CAAC;IAEhB,QAAQ;IACR,MAAM,KAAK,GAAsB,IAAA,sBAAa,EAAC;QAC7C,KAAK,EAAE,OAAO;QACd,IAAI,EAAE,MAAM;KACb,CAAC,CAAC;IAEH,MAAM,EAAC,SAAS,GAAG,IAAI,EAAE,UAAU,GAAG,IAAI,EAAE,QAAQ,GAAG,IAAI,EAAE,QAAQ,GAAG,IAAI,KAAa,KAAK,EAAb,IAAI,UAAI,KAAK,EAAxF,mDAAgF,CAAQ,CAAC;IAE/F,OAAO;IACP,MAAM,YAAY,GAAG,IAAA,qCAAwB,GAAE,CAAC;IAEhD,QAAQ;IACR,MAAM,CAAC,KAAK,EAAE,QAAQ,CAAC,GAAG,IAAA,gBAAQ,EAAQ,EAAE,CAAC,CAAC;IAC9C,MAAM,CAAC,OAAO,EAAE,UAAU,CAAC,GAAG,IAAA,gBAAQ,EAAU,IAAI,CAAC,CAAC;IACtD,MAAM,CAAC,OAAO,EAAE,UAAU,CAAC,GAAG,IAAA,gBAAQ,EAAU,KAAK,CAAC,CAAC;IACvD,MAAM,CAAC,sBAAsB,EAAE,yBAAyB,CAAC,GAAG,IAAA,gBAAQ,EAAU,KAAK,CAAC,CAAC;IACrF,MAAM,CAAC,KAAK,EAAE,QAAQ,CAAC,GAAG,IAAA,gBAAQ,EAAS,CAAC,CAAC,CAAC;IAC9C,MAAM,CAAC,OAAO,EAAE,UAAU,CAAC,GAAG,IAAA,gBAAQ,EAAS,KAAK,CAAC,CAAC;IACtD,MAAM,CAAC,IAAI,EAAE,OAAO,CAAC,GAAG,IAAA,gBAAQ,EAAS,GAAG,wBAAS,CAAC,oBAAoB,CAAC,GAAG,CAAC,EAAC,EAAE,EAAE,UAAU,EAAC,CAAC,WAAW,CAAC,CAAC;IAE7G;;OAEG;IACH,SAAS,iBAAiB;QACxB,IAAI,IAAI,EAAE;YACR,mBAAI;iBACD,OAAO,CAAC;gBACP,GAAG,EAAE,IAAI;gBACT,MAAM,EAAE,wBAAS,CAAC,oBAAoB,CAAC,MAAM;aAC9C,CAAC;iBACD,IAAI,CAAC,CAAC,GAAsB,EAAE,EAAE;gBAC/B,IAAI,YAAY,CAAC,OAAO,EAAE;oBACxB,MAAM,IAAI,GAAG,GAAG,CAAC,IAAI,CAAC;oBACtB,QAAQ,CAAC,CAAC,GAAG,KAAK,EAAE,GAAG,IAAI,CAAC,OAAO,CAAC,CAAC,CAAC;oBACtC,UAAU,CAAC,IAAI,CAAC,KAAK,GAAG,OAAO,CAAC,CAAC;oBACjC,UAAU,CAAC,KAAK,CAAC,CAAC;oBAClB,QAAQ,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC;oBACrB,OAAO,CAAC,IAAI,CAAC,MAAM,CAAC,CAAC,CAAC;iBACvB;YACH,CAAC,CAAC;iBACD,KAAK,CAAC,CAAC,KAAK,EAAE,EAAE;gBACf,UAAU,CAAC,KAAK,CAAC,CAAC;gBAClB,cAAM,CAAC,KAAK,CAAC,oBAAW,EAAE,KAAK,CAAC,CAAC;YACnC,CAAC,CAAC,CAAC;SACN;IACH,CAAC;IAED;;OAEG;IACH,IAAA,iBAAS,EAAC,GAAG,EAAE;QACb,iBAAiB,EAAE,CAAC;IACtB,CAAC,EAAE,EAAE,CAAC,CAAC;IAEP;;OAEG;IACH,IAAI,OAAO,EAAE;QACX,OAAO,8BAAC,kBAAQ,OAAG,CAAC;KACrB;IACD,MAAM,CAAC,GAAG,CACR,8BAAC,sBAAW;QACV,8BAAC,qBAAU,IAAC,SAAS,EAAE,OAAO,CAAC,KAAK,EAAE,OAAO,EAAC,IAAI;YAChD,8BAAC,6BAAgB,IAAC,EAAE,EAAC,uBAAuB,EAAC,cAAc,EAAC,uBAAuB,GAAG,CAC3E;QACZ,CAAC,KAAK,CAAC,CAAC,CAAC,CACR,8BAAC,qBAAU,IAAC,SAAS,EAAE,OAAO,CAAC,SAAS,EAAE,OAAO,EAAC,OAAO;YACvD,8BAAC,6BAAgB,IAAC,EAAE,EAAC,2BAA2B,EAAC,cAAc,EAAC,2BAA2B,GAAG,CACnF,CACd,CAAC,CAAC,CAAC,CACF,8BAAC,eAAK,CAAC,QAAQ;YACb,8BAAC,cAAI,QACF,KAAK,CAAC,KAAK,CAAC,CAAC,EAAE,OAAO,CAAC,CAAC,GAAG,CAAC,CAAC,GAAqB,EAAE,KAAK,EAAE,EAAE,CAAC,CAC7D,8BAAC,mBAAQ,IAAC,GAAG,EAAE,KAAK;gBAClB,8BAAC,oBAAU,IAAC,SAAS,EAAE,CAAC,EAAE,UAAU,EAAE,GAAG,CAAC,GAAG,CAAC,IAAI,CAAC,EAAE,QAAQ,EAAE,QAAQ,EAAE,SAAS,EAAE,OAAO,CAAC,YAAY,GAAI,CACnG,CACZ,CAAC,CACG;YACN,OAAO,IAAI,CACV,8BAAC,iBAAM,IAAC,IAAI,EAAC,OAAO,EAAC,SAAS,EAAE,OAAO,CAAC,QAAQ,EAAE,OAAO,EAAE,GAAG,EAAE,CAAC,yBAAyB,CAAC,IAAI,CAAC;gBAC9F,8BAAC,6BAAgB,IAAC,EAAE,EAAC,iCAAiC,EAAC,cAAc,EAAC,iCAAiC,GAAG,CACnG,CACV,CACc,CAClB;QACA,sBAAsB,IAAI,CACzB,8BAAC,oBAAU,IACT,KAAK,EAAE,8BAAC,6BAAgB,IAAC,EAAE,EAAC,uBAAuB,EAAC,cAAc,EAAC,uBAAuB,GAAG,EAC7F,OAAO,EAAE,GAAG,EAAE,CAAC,yBAAyB,CAAC,KAAK,CAAC,EAC/C,IAAI,EAAE,sBAAsB,IAC3B,OAAO,CAAC,CAAC,CAAC,CACT,8BAAC,yBAAe,IAAC,IAAI,EAAE,EAAE,GAAI,CAC9B,CAAC,CAAC,CAAC,CACF,8BAAC,wBAAc,IACb,UAAU,EAAE,KAAK,CAAC,MAAM,EACxB,IAAI,EAAE,iBAAiB,EACvB,WAAW,EAAE,OAAO,CAAC,IAAI,CAAC,EAC1B,UAAU,EAAE,8BAAC,yBAAe,IAAC,IAAI,EAAE,EAAE,GAAI,EACzC,MAAM,EAAE,GAAG,EACX,UAAU,EACR,qCAAG,KAAK,EAAE,EAAC,SAAS,EAAE,QAAQ,EAAC;gBAC7B;oBACE,8BAAC,6BAAgB,IAAC,EAAE,EAAC,+BAA+B,EAAC,cAAc,EAAC,+BAA+B,GAAG,CACpG,CACF;YAEN,8BAAC,cAAI,QACF,KAAK,CAAC,GAAG,CAAC,CAAC,GAAqB,EAAE,KAAK,EAAE,EAAE,CAAC,CAC3C,8BAAC,mBAAQ,IAAC,GAAG,EAAE,KAAK;gBAClB,8BAAC,oBAAU,IAAC,SAAS,EAAE,CAAC,EAAE,UAAU,EAAE,GAAG,CAAC,GAAG,CAAC,IAAI,CAAC,EAAE,QAAQ,EAAE,QAAQ,EAAE,SAAS,EAAE,OAAO,CAAC,YAAY,GAAI,CACnG,CACZ,CAAC,CACG,CACQ,CAClB,CACU,CACd,CACW,CACf,CAAC;IAEF;;OAEG;IACH,IAAI,QAAQ,IAAI,CAAC,KAAK,EAAE;QACtB,OAAO,8BAAC,2BAAiB,OAAG,CAAC;KAC9B;IACD,OAAO,CACL,8BAAC,IAAI,kBAAC,SAAS,EAAE,IAAA,oBAAU,EAAC,OAAO,CAAC,IAAI,EAAE,SAAS,CAAC,IAAM,IAAI,GAC3D,CAAC,CACG,CACR,CAAC;AACJ,CAAC;AAvID,+BAuIC"}
+{"version":3,"file":"TrendingFeed.js","sourceRoot":"","sources":["../../../../src/components/TrendingFeed/TrendingFeed.tsx"],"names":[],"mappings":"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"}

package/lib/cjs/components/TrendingPeople/TrendingPeople.d.ts

@@ -1,5 +1,6 @@
 import { UserProps } from '../User';
 import { VirtualScrollerItemProps } from '../../types/virtualScroller';
+import { CacheStrategies } from '@selfcommunity/utils';
 export interface TrendingPeopleProps extends VirtualScrollerItemProps {
     /**
      * Category id
@@ -21,6 +22,11 @@ export interface TrendingPeopleProps extends VirtualScrollerItemProps {
      * @default empty object
      */
     UserProps?: UserProps;
+    /**
+     * Caching strategies
+     * @default CacheStrategies.CACHE_FIRST
+     */
+    cacheStrategy?: CacheStrategies;
     /**
      * Other props
      */

package/lib/cjs/components/TrendingPeople/TrendingPeople.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"TrendingPeople.d.ts","sourceRoot":"","sources":["../../../../src/components/TrendingPeople/TrendingPeople.tsx"],"names":[],"mappings":"AAeA,OAAa,EAAC,SAAS,EAAC,MAAM,SAAS,CAAC;AAQxC,OAAO,EAAC,wBAAwB,EAAC,MAAM,6BAA6B,CAAC;AAuBrE,MAAM,WAAW,mBAAoB,SAAQ,wBAAwB;IACnE;;;OAGG;IACH,UAAU,CAAC,EAAE,MAAM,CAAC;IAEpB;;;OAGG;IACH,QAAQ,CAAC,EAAE,OAAO,CAAC;IAEnB;;;OAGG;IACH,SAAS,CAAC,EAAE,MAAM,CAAC;IAEnB;;;OAGG;IACH,SAAS,CAAC,EAAE,SAAS,CAAC;IAEtB;;OAEG;IACH,CAAC,CAAC,EAAE,MAAM,GAAG,GAAG,CAAC;CAClB;AAED;;;;;;;;;;;;;;;;;;;;;;;;;GAyBG;AACH,MAAM,CAAC,OAAO,UAAU,cAAc,CAAC,OAAO,EAAE,mBAAmB,GAAG,GAAG,CAAC,OAAO,CAmLhF"}
+{"version":3,"file":"TrendingPeople.d.ts","sourceRoot":"","sources":["../../../../src/components/TrendingPeople/TrendingPeople.tsx"],"names":[],"mappings":"AAgBA,OAAa,EAAC,SAAS,EAAC,MAAM,SAAS,CAAC;AAQxC,OAAO,EAAC,wBAAwB,EAAC,MAAM,6BAA6B,CAAC;AACrE,OAAO,EAAC,eAAe,EAAS,MAAM,sBAAsB,CAAC;AAyB7D,MAAM,WAAW,mBAAoB,SAAQ,wBAAwB;IACnE;;;OAGG;IACH,UAAU,CAAC,EAAE,MAAM,CAAC;IAEpB;;;OAGG;IACH,QAAQ,CAAC,EAAE,OAAO,CAAC;IAEnB;;;OAGG;IACH,SAAS,CAAC,EAAE,MAAM,CAAC;IAEnB;;;OAGG;IACH,SAAS,CAAC,EAAE,SAAS,CAAC;IACtB;;;OAGG;IACH,aAAa,CAAC,EAAE,eAAe,CAAC;IAChC;;OAEG;IACH,CAAC,CAAC,EAAE,MAAM,GAAG,GAAG,CAAC;CAClB;AAED;;;;;;;;;;;;;;;;;;;;;;;;;GAyBG;AACH,MAAM,CAAC,OAAO,UAAU,cAAc,CAAC,OAAO,EAAE,mBAAmB,GAAG,GAAG,CAAC,OAAO,CA+MhF"}

package/lib/cjs/components/TrendingPeople/TrendingPeople.js

@@ -53,6 +53,9 @@ const InfiniteScroll_1 = __importDefault(require("../../shared/InfiniteScroll"))
 const Skeleton_1 = __importDefault(require("./Skeleton"));
 const system_1 = require("@mui/system");
 const HiddenPlaceholder_1 = __importDefault(require("../../shared/HiddenPlaceholder"));
+const utils_1 = require("@selfcommunity/utils");
+const tools_1 = require("../../utils/tools");
+const Errors_1 = require("../../constants/Errors");
 const PREFIX = 'SCTrendingPeople';
 const classes = {
     root: `${PREFIX}-root`,
@@ -105,19 +108,19 @@ function TrendingPeople(inProps) {
         props: inProps,
         name: PREFIX
     });
-    const { categoryId, autoHide, className, UserProps = {} } = props, rest = __rest(props, ["categoryId", "autoHide", "className", "UserProps"]);
+    const { categoryId, autoHide, className, UserProps = {}, cacheStrategy = utils_1.CacheStrategies.NETWORK_ONLY, onHeightChange, onStateChange } = props, rest = __rest(props, ["categoryId", "autoHide", "className", "UserProps", "cacheStrategy", "onHeightChange", "onStateChange"]);
     // REFS
     const isMountedRef = (0, react_core_1.useIsComponentMountedRef)();
     // STATE
     const theme = (0, material_1.useTheme)();
     const isMobile = (0, material_1.useMediaQuery)(theme.breakpoints.down('md'));
-    const [people, setPeople] = (0, react_1.useState)([]);
-    const [visiblePeople, setVisiblePeople] = (0, react_1.useState)(limit);
-    const [loading, setLoading] = (0, react_1.useState)(true);
-    const [hasMore, setHasMore] = (0, react_1.useState)(false);
+    const [state, dispatch] = (0, react_1.useReducer)(tools_1.dataToolsReducer, {
+        isLoadingNext: true,
+        next: `${api_services_1.Endpoints.CategoryTrendingPeople.url({ id: categoryId })}?limit=10`,
+        cacheKey: react_core_1.SCCache.getToolsStateCacheKey(react_core_1.SCCache.TRENDING_PEOPLE_TOOLS_STATE_CACHE_PREFIX_KEY, categoryId),
+        cacheStrategy
+    }, tools_1.stateToolsInitializer);
     const [openTrendingPeopleDialog, setOpenTrendingPeopleDialog] = (0, react_1.useState)(false);
-    const [total, setTotal] = (0, react_1.useState)(0);
-    const [next, setNext] = (0, react_1.useState)(`${api_services_1.Endpoints.CategoryTrendingPeople.url({ id: categoryId })}?limit=10`);
     // CONTEXT
     const scUserContext = (0, react_1.useContext)(react_core_1.SCUserContext);
     const scPreferencesContext = (0, react_1.useContext)(react_core_1.SCPreferencesContext);
@@ -126,42 +129,52 @@ function TrendingPeople(inProps) {
     /**
      * Fetches trending people list
      */
-    function fetchTrendingPeople() {
-        setLoading(true);
-        if (next) {
-            api_services_1.http
-                .request({
-                url: next,
-                method: api_services_1.Endpoints.CategoryTrendingPeople.method
-            })
+    const fetchTrendingPeople = (0, react_1.useMemo)(() => () => {
+        return api_services_1.http.request({
+            url: state.next,
+            method: api_services_1.Endpoints.CategoryTrendingPeople.method
+        });
+    }, [dispatch, state.next, state.isLoadingNext]);
+    (0, react_1.useEffect)(() => {
+        if (cacheStrategy === utils_1.CacheStrategies.NETWORK_ONLY) {
+            onStateChange && onStateChange({ cacheStrategy: utils_1.CacheStrategies.CACHE_FIRST });
+        }
+    }, []);
+    /**
+     * On mount, fetches trending people list
+     */
+    (0, react_1.useEffect)(() => {
+        let ignore = false;
+        if (state.next) {
+            fetchTrendingPeople()
                 .then((res) => {
-                if (isMountedRef.current) {
+                if (res.status < 300 && isMountedRef.current && !ignore) {
                     const data = res.data;
-                    setPeople([...people, ...data.results]);
-                    setHasMore(data.count > visiblePeople);
-                    setNext(data['next']);
-                    setLoading(false);
-                    setTotal(data.count);
+                    dispatch({
+                        type: tools_1.actionToolsTypes.LOAD_NEXT_SUCCESS,
+                        payload: {
+                            results: data.results,
+                            count: data.count,
+                            next: data.next
+                        }
+                    });
                 }
             })
                 .catch((error) => {
-                setLoading(false);
-                console.log(error);
+                dispatch({ type: tools_1.actionToolsTypes.LOAD_NEXT_FAILURE, payload: { errorLoadNext: error } });
+                utils_1.Logger.error(Errors_1.SCOPE_SC_UI, error);
             });
+            return () => {
+                ignore = true;
+            };
         }
-    }
-    /**
-     * On mount, fetches trending people list
-     */
-    (0, react_1.useEffect)(() => {
-        fetchTrendingPeople();
-    }, []);
+    }, [state.next]);
     /**
      * Handles followers counter update on follow/unfollow action.
      * @param user
      */
     function handleFollowersUpdate(user) {
-        const newUsers = [...people];
+        const newUsers = [...state.results];
         const index = newUsers.findIndex((u) => u.id === user.id);
         if (index !== -1) {
             if (user.connection_status === 'followed') {
@@ -172,37 +185,40 @@ function TrendingPeople(inProps) {
                 newUsers[index].followers_counter = user.followers_counter + 1;
                 newUsers[index].connection_status = 'followed';
             }
-            setPeople(newUsers);
+            dispatch({
+                type: tools_1.actionToolsTypes.SET_RESULTS,
+                payload: { results: newUsers }
+            });
         }
     }
     /**
      * Renders trending people list
      */
-    if (loading) {
+    if (state.isLoadingNext) {
         return react_1.default.createElement(Skeleton_1.default, null);
     }
     const p = (react_1.default.createElement(material_1.CardContent, null,
         react_1.default.createElement(material_1.Typography, { className: classes.title, variant: "h5" },
             react_1.default.createElement(react_intl_1.FormattedMessage, { id: "ui.trendingPeople.title", defaultMessage: "ui.trendingPeople.title" })),
-        !total ? (react_1.default.createElement(material_1.Typography, { className: classes.noResults, variant: "body2" },
+        !state.count ? (react_1.default.createElement(material_1.Typography, { className: classes.noResults, variant: "body2" },
             react_1.default.createElement(react_intl_1.FormattedMessage, { id: "ui.trendingPeople.noResults", defaultMessage: "ui.trendingPeople.noResults" }))) : (react_1.default.createElement(react_1.default.Fragment, null,
-            react_1.default.createElement(List_1.default, null, people.slice(0, visiblePeople).map((user) => (react_1.default.createElement(material_1.ListItem, { key: user.id },
+            react_1.default.createElement(List_1.default, null, state.results.slice(0, limit).map((user) => (react_1.default.createElement(material_1.ListItem, { key: user.id },
                 react_1.default.createElement(User_1.default, Object.assign({ elevation: 0, user: user, className: classes.trendingUserItem }, (followEnabled
                     ? { followConnectUserButtonProps: { onFollow: handleFollowersUpdate } }
                     : { followConnectUserButtonProps: { onChangeConnectionStatus: handleFollowersUpdate } }), UserProps)))))))),
-        hasMore && (react_1.default.createElement(material_1.Button, { size: "small", className: classes.showMore, onClick: () => setOpenTrendingPeopleDialog(true) },
+        limit < state.count && (react_1.default.createElement(material_1.Button, { size: "small", className: classes.showMore, onClick: () => setOpenTrendingPeopleDialog(true) },
             react_1.default.createElement(react_intl_1.FormattedMessage, { id: "ui.trendingPeople.button.showAll", defaultMessage: "ui.trendingPeople.button.showAll" }))),
-        openTrendingPeopleDialog && (react_1.default.createElement(BaseDialog_1.default, { title: react_1.default.createElement(react_intl_1.FormattedMessage, { defaultMessage: "ui.trendingPeople.title", id: "ui.trendingPeople.title" }), onClose: () => setOpenTrendingPeopleDialog(false), open: openTrendingPeopleDialog }, loading ? (react_1.default.createElement(CentralProgress_1.default, { size: 50 })) : (react_1.default.createElement(InfiniteScroll_1.default, { dataLength: people.length, next: fetchTrendingPeople, hasMoreNext: Boolean(next), loaderNext: react_1.default.createElement(CentralProgress_1.default, { size: 30 }), height: isMobile ? '100vh' : 400, endMessage: react_1.default.createElement("p", { style: { textAlign: 'center' } },
+        openTrendingPeopleDialog && (react_1.default.createElement(BaseDialog_1.default, { title: react_1.default.createElement(react_intl_1.FormattedMessage, { defaultMessage: "ui.trendingPeople.title", id: "ui.trendingPeople.title" }), onClose: () => setOpenTrendingPeopleDialog(false), open: openTrendingPeopleDialog }, state.isLoadingNext ? (react_1.default.createElement(CentralProgress_1.default, { size: 50 })) : (react_1.default.createElement(InfiniteScroll_1.default, { dataLength: state.results.length, next: fetchTrendingPeople, hasMoreNext: Boolean(state.next), loaderNext: react_1.default.createElement(CentralProgress_1.default, { size: 30 }), height: isMobile ? '100vh' : 400, endMessage: react_1.default.createElement("p", { style: { textAlign: 'center' } },
                 react_1.default.createElement("b", null,
                     react_1.default.createElement(react_intl_1.FormattedMessage, { id: "ui.trendingPeople.noMoreResults", defaultMessage: "ui.trendingPeople.noMoreResults" }))) },
-            react_1.default.createElement(List_1.default, null, people.map((p, index) => (react_1.default.createElement(material_1.ListItem, { key: p.id },
+            react_1.default.createElement(List_1.default, null, state.results.map((p) => (react_1.default.createElement(material_1.ListItem, { key: p.id },
                 react_1.default.createElement(User_1.default, Object.assign({ elevation: 0, user: p, className: classes.trendingUserItem }, (followEnabled
                     ? { followConnectUserButtonProps: { onFollow: handleFollowersUpdate } }
                     : { followConnectUserButtonProps: { onChangeConnectionStatus: handleFollowersUpdate } }), UserProps))))))))))));
     /**
      * Renders root object (if results and autoHide prop is set to false, otherwise component is hidden)
      */
-    if (autoHide && !total) {
+    if (autoHide && !state.count) {
         return react_1.default.createElement(HiddenPlaceholder_1.default, null);
     }
     return (react_1.default.createElement(Root, Object.assign({ className: (0, classnames_1.default)(classes.root, className) }, rest), p));

package/lib/cjs/components/TrendingPeople/TrendingPeople.js.map

@@ -1 +1 @@
-{"version":3,"file":"TrendingPeople.js","sourceRoot":"","sources":["../../../../src/components/TrendingPeople/TrendingPeople.tsx"],"names":[],"mappings":"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"}
+{"version":3,"file":"TrendingPeople.js","sourceRoot":"","sources":["../../../../src/components/TrendingPeople/TrendingPeople.tsx"],"names":[],"mappings":"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"}

package/lib/cjs/components/UserFollowers/UserFollowers.d.ts

@@ -1,3 +1,4 @@
+import { CacheStrategies } from '@selfcommunity/utils';
 import { UserProps } from '../User';
 import { VirtualScrollerItemProps } from '../../types/virtualScroller';
 export interface UserFollowersProps extends VirtualScrollerItemProps {
@@ -21,6 +22,11 @@ export interface UserFollowersProps extends VirtualScrollerItemProps {
      * @default empty object
      */
     UserProps?: UserProps;
+    /**
+     * Caching strategies
+     * @default CacheStrategies.CACHE_FIRST
+     */
+    cacheStrategy?: CacheStrategies;
 }
 /**
  * > API documentation for the Community-JS User Followers component. Learn about the available props and the CSS API.

package/lib/cjs/components/UserFollowers/UserFollowers.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"UserFollowers.d.ts","sourceRoot":"","sources":["../../../../src/components/UserFollowers/UserFollowers.tsx"],"names":[],"mappings":"AAiBA,OAAa,EAAC,SAAS,EAAC,MAAM,SAAS,CAAC;AASxC,OAAO,EAAC,wBAAwB,EAAC,MAAM,6BAA6B,CAAC;AAkCrE,MAAM,WAAW,kBAAmB,SAAQ,wBAAwB;IAClE;;;OAGG;IACH,MAAM,EAAE,MAAM,CAAC;IACf;;;OAGG;IACH,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB;;;OAGG;IACH,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB;;;OAGG;IACH,SAAS,CAAC,EAAE,SAAS,CAAC;CACvB;AAED;;;;;;;;;;;;;;;;;;;;;;;;;GAyBG;AACH,MAAM,CAAC,OAAO,UAAU,aAAa,CAAC,OAAO,EAAE,kBAAkB,GAAG,GAAG,CAAC,OAAO,CA2M9E"}
+{"version":3,"file":"UserFollowers.d.ts","sourceRoot":"","sources":["../../../../src/components/UserFollowers/UserFollowers.tsx"],"names":[],"mappings":"AAOA,OAAO,EAAC,eAAe,EAAS,MAAM,sBAAsB,CAAC;AAY7D,OAAa,EAAC,SAAS,EAAC,MAAM,SAAS,CAAC;AASxC,OAAO,EAAC,wBAAwB,EAAC,MAAM,6BAA6B,CAAC;AAkCrE,MAAM,WAAW,kBAAmB,SAAQ,wBAAwB;IAClE;;;OAGG;IACH,MAAM,EAAE,MAAM,CAAC;IACf;;;OAGG;IACH,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB;;;OAGG;IACH,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB;;;OAGG;IACH,SAAS,CAAC,EAAE,SAAS,CAAC;IACtB;;;OAGG;IACH,aAAa,CAAC,EAAE,eAAe,CAAC;CACjC;AAED;;;;;;;;;;;;;;;;;;;;;;;;;GAyBG;AACH,MAAM,CAAC,OAAO,UAAU,aAAa,CAAC,OAAO,EAAE,kBAAkB,GAAG,GAAG,CAAC,OAAO,CAyO9E"}

package/lib/cjs/components/UserFollowers/UserFollowers.js

@@ -34,6 +34,7 @@ const Widget_1 = __importDefault(require("../Widget"));
 const api_services_1 = require("@selfcommunity/api-services");
 const utils_1 = require("@selfcommunity/utils");
 const react_core_1 = require("@selfcommunity/react-core");
+const tools_1 = require("../../utils/tools");
 const Skeleton_1 = __importDefault(require("./Skeleton"));
 const User_1 = __importDefault(require("../User"));
 const react_intl_1 = require("react-intl");
@@ -115,63 +116,82 @@ function UserFollowers(inProps) {
         props: inProps,
         name: PREFIX
     });
-    const { userId, autoHide, className, UserProps = {} } = props;
+    const { userId, autoHide, className, UserProps = {}, cacheStrategy = utils_1.CacheStrategies.NETWORK_ONLY, onHeightChange, onStateChange } = props;
     // REFS
     const isMountedRef = (0, react_core_1.useIsComponentMountedRef)();
     // STATE
     const theme = (0, material_1.useTheme)();
     const isMobile = (0, material_1.useMediaQuery)(theme.breakpoints.down('md'));
-    const [followers, setFollowers] = (0, react_1.useState)([]);
-    const [visibleUsers, setVisibleUsers] = (0, react_1.useState)(limit);
-    const [loading, setLoading] = (0, react_1.useState)(true);
-    const [hasMore, setHasMore] = (0, react_1.useState)(false);
-    const [total, setTotal] = (0, react_1.useState)(0);
+    const [state, dispatch] = (0, react_1.useReducer)(tools_1.dataToolsReducer, {
+        isLoadingNext: true,
+        next: `${api_services_1.Endpoints.UserFollowers.url({ id: userId })}?limit=10`,
+        cacheKey: react_core_1.SCCache.getToolsStateCacheKey(react_core_1.SCCache.USER_FOLLOWERS_TOOLS_STATE_CACHE_PREFIX_KEY, userId),
+        cacheStrategy
+    }, tools_1.stateToolsInitializer);
     const [openUserFollowersDialog, setOpenUserFollowersDialog] = (0, react_1.useState)(false);
-    const [next, setNext] = (0, react_1.useState)(`${api_services_1.Endpoints.UserFollowers.url({ id: userId })}?limit=10`);
+    // CONST
+    const authUserId = scUserContext.user ? scUserContext.user.id : null;
     /**
      * Fetches the list of users followers
      */
-    function fetchFollowers() {
-        if (next) {
-            api_services_1.http
-                .request({
-                url: next,
-                method: api_services_1.Endpoints.UserFollowers.method
-            })
+    const fetchFollowers = (0, react_1.useMemo)(() => () => {
+        return api_services_1.http.request({
+            url: state.next,
+            method: api_services_1.Endpoints.UserFollowers.method
+        });
+    }, [dispatch, state.next, state.isLoadingNext]);
+    (0, react_1.useEffect)(() => {
+        if (!userId) {
+            return;
+        }
+        else if (!contentAvailability && !authUserId) {
+            return;
+        }
+        else if (cacheStrategy === utils_1.CacheStrategies.NETWORK_ONLY) {
+            onStateChange && onStateChange({ cacheStrategy: utils_1.CacheStrategies.CACHE_FIRST });
+        }
+    }, [authUserId]);
+    /**
+     * On mount, fetches the list of users followers
+     */
+    (0, react_1.useEffect)(() => {
+        let ignore = false;
+        if (state.next) {
+            fetchFollowers()
                 .then((res) => {
-                if (isMountedRef.current) {
+                if (res.status < 300 && isMountedRef.current && !ignore) {
                     const data = res.data;
-                    setFollowers([...followers, ...data.results]);
-                    setHasMore(data.count > visibleUsers);
-                    setNext(data['next']);
-                    setLoading(false);
-                    setTotal(data.count);
+                    dispatch({
+                        type: tools_1.actionToolsTypes.LOAD_NEXT_SUCCESS,
+                        payload: {
+                            results: data.results,
+                            count: data.count,
+                            next: data.next
+                        }
+                    });
                 }
             })
                 .catch((error) => {
-                setLoading(false);
+                dispatch({ type: tools_1.actionToolsTypes.LOAD_NEXT_FAILURE, payload: { errorLoadNext: error } });
                 utils_1.Logger.error(Errors_1.SCOPE_SC_UI, error);
             });
+            return () => {
+                ignore = true;
+            };
         }
-    }
+    }, [state.next]);
     /**
-     * On mount, fetches the list of users followers
+     * Virtual feed update
      */
     (0, react_1.useEffect)(() => {
-        if (!contentAvailability && !scUserContext.user) {
-            return;
-        }
-        if (!userId) {
-            return;
-        }
-        fetchFollowers();
-    }, [scUserContext.user]);
+        onHeightChange && onHeightChange();
+    }, [state.results.length]);
     /**
      * Handles followers counter update on follow/unfollow action.
      * @param user
      */
     function handleFollowersUpdate(user) {
-        const newUsers = [...followers];
+        const newUsers = [...state.results];
         const index = newUsers.findIndex((u) => u.id === user.id);
         if (index !== -1) {
             if (user.connection_status === 'followed') {
@@ -182,41 +202,44 @@ function UserFollowers(inProps) {
                 newUsers[index].followers_counter = user.followers_counter + 1;
                 newUsers[index].connection_status = 'followed';
             }
-            setFollowers(newUsers);
+            dispatch({
+                type: tools_1.actionToolsTypes.SET_RESULTS,
+                payload: { results: newUsers }
+            });
         }
     }
     /**
      * Renders the list of users followers
      */
-    if (loading) {
-        react_1.default.createElement(Skeleton_1.default, null);
+    if (state.isLoadingNext) {
+        return react_1.default.createElement(Skeleton_1.default, null);
     }
     const u = (react_1.default.createElement(material_1.CardContent, null,
-        react_1.default.createElement(material_1.Typography, { className: classes.title, variant: "h5" }, `${intl.formatMessage(messages.title, { total: total })}`),
-        !total ? (react_1.default.createElement(material_1.Typography, { className: classes.noResults, variant: "body2" }, `${intl.formatMessage(messages.noFollowers)}`)) : (react_1.default.createElement(react_1.default.Fragment, null,
-            react_1.default.createElement(List_1.default, null, followers.slice(0, visibleUsers).map((user) => (react_1.default.createElement(material_1.ListItem, { key: user.id },
+        react_1.default.createElement(material_1.Typography, { className: classes.title, variant: "h5" }, `${intl.formatMessage(messages.title, { total: state.count })}`),
+        !state.count ? (react_1.default.createElement(material_1.Typography, { className: classes.noResults, variant: "body2" }, `${intl.formatMessage(messages.noFollowers)}`)) : (react_1.default.createElement(react_1.default.Fragment, null,
+            react_1.default.createElement(List_1.default, null, state.results.slice(0, limit).map((user) => (react_1.default.createElement(material_1.ListItem, { key: user.id },
                 react_1.default.createElement(User_1.default, Object.assign({ elevation: 0, user: user, className: classes.followersItem }, (followEnabled
                     ? { followConnectUserButtonProps: { onFollow: handleFollowersUpdate } }
                     : { followConnectUserButtonProps: { onChangeConnectionStatus: handleFollowersUpdate } }), UserProps)))))),
-            hasMore && (react_1.default.createElement(material_1.Button, { size: "small", className: classes.showMore, onClick: () => setOpenUserFollowersDialog(true) },
+            limit < state.count && (react_1.default.createElement(material_1.Button, { size: "small", className: classes.showMore, onClick: () => setOpenUserFollowersDialog(true) },
                 react_1.default.createElement(react_intl_1.FormattedMessage, { id: "ui.userFollowers.button.showAll", defaultMessage: "ui.userFollowers.button.showAll" }))),
-            openUserFollowersDialog && (react_1.default.createElement(BaseDialog_1.default, { title: isMobile ? (react_1.default.createElement(react_intl_1.FormattedMessage, { id: "ui.userFollowers.modal.title", defaultMessage: "ui.userFollowers.modal.title" })) : (`${intl.formatMessage(messages.title, { total: total })}`), onClose: () => setOpenUserFollowersDialog(false), open: openUserFollowersDialog }, loading ? (react_1.default.createElement(CentralProgress_1.default, { size: 50 })) : (react_1.default.createElement(InfiniteScroll_1.default, { dataLength: followers.length, next: fetchFollowers, hasMoreNext: Boolean(next), loaderNext: react_1.default.createElement(CentralProgress_1.default, { size: 30 }), height: isMobile ? '100vh' : 400, endMessage: react_1.default.createElement("p", { style: { textAlign: 'center' } },
+            openUserFollowersDialog && (react_1.default.createElement(BaseDialog_1.default, { title: isMobile ? (react_1.default.createElement(react_intl_1.FormattedMessage, { id: "ui.userFollowers.modal.title", defaultMessage: "ui.userFollowers.modal.title" })) : (`${intl.formatMessage(messages.title, { total: state.count })}`), onClose: () => setOpenUserFollowersDialog(false), open: openUserFollowersDialog }, state.isLoadingNext ? (react_1.default.createElement(CentralProgress_1.default, { size: 50 })) : (react_1.default.createElement(InfiniteScroll_1.default, { dataLength: state.results.length, next: fetchFollowers, hasMoreNext: Boolean(state.next), loaderNext: react_1.default.createElement(CentralProgress_1.default, { size: 30 }), height: isMobile ? '100vh' : 400, endMessage: react_1.default.createElement("p", { style: { textAlign: 'center' } },
                     react_1.default.createElement("b", null,
                         react_1.default.createElement(react_intl_1.FormattedMessage, { id: "ui.userFollowers.noMoreResults", defaultMessage: "ui.userFollowers.noMoreResults" }))) },
-                react_1.default.createElement(List_1.default, null, followers.map((f) => (react_1.default.createElement(material_1.ListItem, { key: f.id },
+                react_1.default.createElement(List_1.default, null, state.results.map((f) => (react_1.default.createElement(material_1.ListItem, { key: f.id },
                     react_1.default.createElement(User_1.default, Object.assign({ elevation: 0, user: f, className: classes.followersItem }, (followEnabled
                         ? { followConnectUserButtonProps: { onFollow: handleFollowersUpdate } }
                         : { followConnectUserButtonProps: { onChangeConnectionStatus: handleFollowersUpdate } }), UserProps))))))))))))));
     /**
      * if there are no results and autoHide prop is set to true ,component is hidden
      */
-    if (autoHide && !total) {
+    if (autoHide && !state.count) {
         return react_1.default.createElement(HiddenPlaceholder_1.default, null);
     }
     /**
      * If content availability community option is false and user is anonymous , component is hidden.
      */
-    if (!contentAvailability && !scUserContext.user) {
+    if (!contentAvailability && !authUserId) {
         return react_1.default.createElement(HiddenPlaceholder_1.default, null);
     }
     /**