@selfcommunity/react-ui 0.7.0-alpha.24 → 0.7.0-alpha.26
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/lib/cjs/components/CategoriesFollowed/CategoriesFollowed.d.ts.map +1 -1
- package/lib/cjs/components/CategoriesFollowed/CategoriesFollowed.js +41 -29
- package/lib/cjs/components/CategoriesFollowed/CategoriesFollowed.js.map +1 -1
- package/lib/cjs/components/CategoriesFollowed/Skeleton.d.ts.map +1 -1
- package/lib/cjs/components/CategoriesFollowed/Skeleton.js +3 -1
- package/lib/cjs/components/CategoriesFollowed/Skeleton.js.map +1 -1
- package/lib/cjs/components/CategoriesPopular/CategoriesPopular.d.ts.map +1 -1
- package/lib/cjs/components/CategoriesPopular/CategoriesPopular.js +37 -26
- package/lib/cjs/components/CategoriesPopular/CategoriesPopular.js.map +1 -1
- package/lib/cjs/components/CategoriesPopular/Skeleton.d.ts.map +1 -1
- package/lib/cjs/components/CategoriesPopular/Skeleton.js +3 -1
- package/lib/cjs/components/CategoriesPopular/Skeleton.js.map +1 -1
- package/lib/cjs/components/CategoriesSuggestion/CategoriesSuggestion.d.ts +6 -0
- package/lib/cjs/components/CategoriesSuggestion/CategoriesSuggestion.d.ts.map +1 -1
- package/lib/cjs/components/CategoriesSuggestion/CategoriesSuggestion.js +31 -25
- package/lib/cjs/components/CategoriesSuggestion/CategoriesSuggestion.js.map +1 -1
- package/lib/cjs/components/CategoriesSuggestion/Skeleton.d.ts.map +1 -1
- package/lib/cjs/components/CategoriesSuggestion/Skeleton.js +3 -1
- package/lib/cjs/components/CategoriesSuggestion/Skeleton.js.map +1 -1
- package/lib/cjs/components/IncubatorSuggestion/IncubatorSuggestion.d.ts +6 -0
- package/lib/cjs/components/IncubatorSuggestion/IncubatorSuggestion.d.ts.map +1 -1
- package/lib/cjs/components/IncubatorSuggestion/IncubatorSuggestion.js +33 -25
- package/lib/cjs/components/IncubatorSuggestion/IncubatorSuggestion.js.map +1 -1
- package/lib/cjs/components/IncubatorsList/IncubatorsList.d.ts +7 -1
- package/lib/cjs/components/IncubatorsList/IncubatorsList.d.ts.map +1 -1
- package/lib/cjs/components/IncubatorsList/IncubatorsList.js +45 -27
- package/lib/cjs/components/IncubatorsList/IncubatorsList.js.map +1 -1
- package/lib/cjs/components/PeopleSuggestion/PeopleSuggestion.d.ts +6 -0
- package/lib/cjs/components/PeopleSuggestion/PeopleSuggestion.d.ts.map +1 -1
- package/lib/cjs/components/PeopleSuggestion/PeopleSuggestion.js +34 -38
- package/lib/cjs/components/PeopleSuggestion/PeopleSuggestion.js.map +1 -1
- package/lib/cjs/components/PollSuggestion/PollSuggestion.d.ts +7 -1
- package/lib/cjs/components/PollSuggestion/PollSuggestion.d.ts.map +1 -1
- package/lib/cjs/components/PollSuggestion/PollSuggestion.js +32 -24
- package/lib/cjs/components/PollSuggestion/PollSuggestion.js.map +1 -1
- package/lib/cjs/components/RelatedFeedObjects/RelatedFeedObjects.d.ts +7 -1
- package/lib/cjs/components/RelatedFeedObjects/RelatedFeedObjects.d.ts.map +1 -1
- package/lib/cjs/components/RelatedFeedObjects/RelatedFeedObjects.js +37 -27
- package/lib/cjs/components/RelatedFeedObjects/RelatedFeedObjects.js.map +1 -1
- package/lib/cjs/components/TrendingFeed/TrendingFeed.d.ts +6 -0
- package/lib/cjs/components/TrendingFeed/TrendingFeed.d.ts.map +1 -1
- package/lib/cjs/components/TrendingFeed/TrendingFeed.js +31 -24
- package/lib/cjs/components/TrendingFeed/TrendingFeed.js.map +1 -1
- package/lib/cjs/components/TrendingPeople/TrendingPeople.d.ts +6 -0
- package/lib/cjs/components/TrendingPeople/TrendingPeople.d.ts.map +1 -1
- package/lib/cjs/components/TrendingPeople/TrendingPeople.js +39 -28
- package/lib/cjs/components/TrendingPeople/TrendingPeople.js.map +1 -1
- package/lib/cjs/components/UserFollowers/UserFollowers.d.ts +6 -0
- package/lib/cjs/components/UserFollowers/UserFollowers.d.ts.map +1 -1
- package/lib/cjs/components/UserFollowers/UserFollowers.js +67 -41
- package/lib/cjs/components/UserFollowers/UserFollowers.js.map +1 -1
- package/lib/cjs/components/UserProfileEdit/Section/PublicInfo.d.ts.map +1 -1
- package/lib/cjs/components/UserProfileEdit/Section/PublicInfo.js +6 -8
- package/lib/cjs/components/UserProfileEdit/Section/PublicInfo.js.map +1 -1
- package/lib/cjs/components/UsersFollowed/UsersFollowed.d.ts +6 -0
- package/lib/cjs/components/UsersFollowed/UsersFollowed.d.ts.map +1 -1
- package/lib/cjs/components/UsersFollowed/UsersFollowed.js +46 -32
- package/lib/cjs/components/UsersFollowed/UsersFollowed.js.map +1 -1
- package/lib/cjs/utils/tools.d.ts +29 -0
- package/lib/cjs/utils/tools.d.ts.map +1 -0
- package/lib/cjs/utils/tools.js +81 -0
- package/lib/cjs/utils/tools.js.map +1 -0
- package/lib/esm/components/CategoriesFollowed/CategoriesFollowed.d.ts.map +1 -1
- package/lib/esm/components/CategoriesFollowed/CategoriesFollowed.js +46 -34
- package/lib/esm/components/CategoriesFollowed/CategoriesFollowed.js.map +1 -1
- package/lib/esm/components/CategoriesFollowed/Skeleton.d.ts.map +1 -1
- package/lib/esm/components/CategoriesFollowed/Skeleton.js +3 -1
- package/lib/esm/components/CategoriesFollowed/Skeleton.js.map +1 -1
- package/lib/esm/components/CategoriesPopular/CategoriesPopular.d.ts.map +1 -1
- package/lib/esm/components/CategoriesPopular/CategoriesPopular.js +40 -29
- package/lib/esm/components/CategoriesPopular/CategoriesPopular.js.map +1 -1
- package/lib/esm/components/CategoriesPopular/Skeleton.d.ts.map +1 -1
- package/lib/esm/components/CategoriesPopular/Skeleton.js +3 -1
- package/lib/esm/components/CategoriesPopular/Skeleton.js.map +1 -1
- package/lib/esm/components/CategoriesSuggestion/CategoriesSuggestion.d.ts +6 -0
- package/lib/esm/components/CategoriesSuggestion/CategoriesSuggestion.d.ts.map +1 -1
- package/lib/esm/components/CategoriesSuggestion/CategoriesSuggestion.js +35 -29
- package/lib/esm/components/CategoriesSuggestion/CategoriesSuggestion.js.map +1 -1
- package/lib/esm/components/CategoriesSuggestion/Skeleton.d.ts.map +1 -1
- package/lib/esm/components/CategoriesSuggestion/Skeleton.js +3 -1
- package/lib/esm/components/CategoriesSuggestion/Skeleton.js.map +1 -1
- package/lib/esm/components/IncubatorSuggestion/IncubatorSuggestion.d.ts +6 -0
- package/lib/esm/components/IncubatorSuggestion/IncubatorSuggestion.d.ts.map +1 -1
- package/lib/esm/components/IncubatorSuggestion/IncubatorSuggestion.js +36 -28
- package/lib/esm/components/IncubatorSuggestion/IncubatorSuggestion.js.map +1 -1
- package/lib/esm/components/IncubatorsList/IncubatorsList.d.ts +7 -1
- package/lib/esm/components/IncubatorsList/IncubatorsList.d.ts.map +1 -1
- package/lib/esm/components/IncubatorsList/IncubatorsList.js +47 -29
- package/lib/esm/components/IncubatorsList/IncubatorsList.js.map +1 -1
- package/lib/esm/components/PeopleSuggestion/PeopleSuggestion.d.ts +6 -0
- package/lib/esm/components/PeopleSuggestion/PeopleSuggestion.d.ts.map +1 -1
- package/lib/esm/components/PeopleSuggestion/PeopleSuggestion.js +36 -40
- package/lib/esm/components/PeopleSuggestion/PeopleSuggestion.js.map +1 -1
- package/lib/esm/components/PollSuggestion/PollSuggestion.d.ts +7 -1
- package/lib/esm/components/PollSuggestion/PollSuggestion.d.ts.map +1 -1
- package/lib/esm/components/PollSuggestion/PollSuggestion.js +35 -27
- package/lib/esm/components/PollSuggestion/PollSuggestion.js.map +1 -1
- package/lib/esm/components/RelatedFeedObjects/RelatedFeedObjects.d.ts +7 -1
- package/lib/esm/components/RelatedFeedObjects/RelatedFeedObjects.d.ts.map +1 -1
- package/lib/esm/components/RelatedFeedObjects/RelatedFeedObjects.js +40 -30
- package/lib/esm/components/RelatedFeedObjects/RelatedFeedObjects.js.map +1 -1
- package/lib/esm/components/TrendingFeed/TrendingFeed.d.ts +6 -0
- package/lib/esm/components/TrendingFeed/TrendingFeed.d.ts.map +1 -1
- package/lib/esm/components/TrendingFeed/TrendingFeed.js +34 -27
- package/lib/esm/components/TrendingFeed/TrendingFeed.js.map +1 -1
- package/lib/esm/components/TrendingPeople/TrendingPeople.d.ts +6 -0
- package/lib/esm/components/TrendingPeople/TrendingPeople.d.ts.map +1 -1
- package/lib/esm/components/TrendingPeople/TrendingPeople.js +41 -30
- package/lib/esm/components/TrendingPeople/TrendingPeople.js.map +1 -1
- package/lib/esm/components/UserFollowers/UserFollowers.d.ts +6 -0
- package/lib/esm/components/UserFollowers/UserFollowers.d.ts.map +1 -1
- package/lib/esm/components/UserFollowers/UserFollowers.js +70 -44
- package/lib/esm/components/UserFollowers/UserFollowers.js.map +1 -1
- package/lib/esm/components/UserProfileEdit/Section/PublicInfo.d.ts.map +1 -1
- package/lib/esm/components/UserProfileEdit/Section/PublicInfo.js +7 -9
- package/lib/esm/components/UserProfileEdit/Section/PublicInfo.js.map +1 -1
- package/lib/esm/components/UsersFollowed/UsersFollowed.d.ts +6 -0
- package/lib/esm/components/UsersFollowed/UsersFollowed.d.ts.map +1 -1
- package/lib/esm/components/UsersFollowed/UsersFollowed.js +49 -35
- package/lib/esm/components/UsersFollowed/UsersFollowed.js.map +1 -1
- package/lib/esm/utils/tools.d.ts +29 -0
- package/lib/esm/utils/tools.d.ts.map +1 -0
- package/lib/esm/utils/tools.js +76 -0
- package/lib/esm/utils/tools.js.map +1 -0
- package/lib/umd/react-ui.js +11 -11
- package/lib/umd/react-ui.js.LICENSE.txt +1 -1
- package/lib/umd/react-ui.js.map +1 -1
- package/package.json +3 -3
|
@@ -1,13 +1,14 @@
|
|
|
1
|
-
import React, { useContext, useEffect, useState } from 'react';
|
|
1
|
+
import React, { useContext, useEffect, useReducer, useState } from 'react';
|
|
2
2
|
import { styled } from '@mui/material/styles';
|
|
3
3
|
import List from '@mui/material/List';
|
|
4
4
|
import { Button, CardContent, ListItem, Typography, useMediaQuery, useTheme } from '@mui/material';
|
|
5
|
-
import {
|
|
6
|
-
import { Logger } from '@selfcommunity/utils';
|
|
7
|
-
import { SCUserContext, useIsComponentMountedRef } from '@selfcommunity/react-core';
|
|
5
|
+
import { Endpoints, http } from '@selfcommunity/api-services';
|
|
6
|
+
import { CacheStrategies, Logger } from '@selfcommunity/utils';
|
|
7
|
+
import { SCCache, SCUserContext, useIsComponentMountedRef } from '@selfcommunity/react-core';
|
|
8
|
+
import { actionToolsTypes, dataToolsReducer, stateToolsInitializer } from '../../utils/tools';
|
|
8
9
|
import Category from '../Category';
|
|
9
10
|
import { SCOPE_SC_UI } from '../../constants/Errors';
|
|
10
|
-
import { defineMessages,
|
|
11
|
+
import { defineMessages, FormattedMessage, useIntl } from 'react-intl';
|
|
11
12
|
import Skeleton from './Skeleton';
|
|
12
13
|
import classNames from 'classnames';
|
|
13
14
|
import BaseDialog from '../../shared/BaseDialog';
|
|
@@ -73,18 +74,19 @@ export default function CategoriesFollowed(inProps) {
|
|
|
73
74
|
props: inProps,
|
|
74
75
|
name: PREFIX
|
|
75
76
|
});
|
|
76
|
-
const { userId, autoHide, className, CategoryProps = {}, onHeightChange, onStateChange } = props;
|
|
77
|
+
const { userId, autoHide, className, CategoryProps = {}, cacheStrategy = CacheStrategies.NETWORK_ONLY, onHeightChange, onStateChange } = props;
|
|
77
78
|
// REFS
|
|
78
79
|
const isMountedRef = useIsComponentMountedRef();
|
|
79
80
|
// STATE
|
|
80
81
|
const theme = useTheme();
|
|
81
82
|
const isMobile = useMediaQuery(theme.breakpoints.down('md'));
|
|
82
|
-
const [
|
|
83
|
-
|
|
84
|
-
|
|
85
|
-
|
|
83
|
+
const [state, dispatch] = useReducer(dataToolsReducer, {
|
|
84
|
+
isLoadingNext: true,
|
|
85
|
+
next: `${Endpoints.FollowedCategories.url({ id: userId })}?limit=10`,
|
|
86
|
+
cacheKey: SCCache.getToolsStateCacheKey(SCCache.CATEGORIES_FOLLOWED_TOOLS_STATE_CACHE_PREFIX_KEY, userId),
|
|
87
|
+
cacheStrategy
|
|
88
|
+
}, stateToolsInitializer);
|
|
86
89
|
const [openCategoriesFollowedDialog, setOpenCategoriesFollowedDialog] = useState(false);
|
|
87
|
-
const [next, setNext] = useState(`${Endpoints.FollowedCategories.url({ id: userId })}?limit=10`);
|
|
88
90
|
// CONST
|
|
89
91
|
const authUserId = scUserContext.user ? scUserContext.user.id : null;
|
|
90
92
|
/**
|
|
@@ -92,12 +94,13 @@ export default function CategoriesFollowed(inProps) {
|
|
|
92
94
|
*/
|
|
93
95
|
function handleOnFollowCategory(category) {
|
|
94
96
|
if (scUserContext.user['id'] === userId) {
|
|
95
|
-
|
|
96
|
-
|
|
97
|
-
|
|
97
|
+
dispatch({
|
|
98
|
+
type: actionToolsTypes.SET_RESULTS,
|
|
99
|
+
payload: { results: state.results.filter((c) => c.id !== category.id), count: state.count - 1 }
|
|
100
|
+
});
|
|
98
101
|
}
|
|
99
102
|
else {
|
|
100
|
-
const newCategories = [...
|
|
103
|
+
const newCategories = [...state.results];
|
|
101
104
|
const index = newCategories.findIndex((u) => u.id === category.id);
|
|
102
105
|
if (index !== -1) {
|
|
103
106
|
if (category.followed) {
|
|
@@ -108,7 +111,10 @@ export default function CategoriesFollowed(inProps) {
|
|
|
108
111
|
newCategories[index].followers_counter = category.followers_counter + 1;
|
|
109
112
|
newCategories[index].followed = !category.followed;
|
|
110
113
|
}
|
|
111
|
-
|
|
114
|
+
dispatch({
|
|
115
|
+
type: actionToolsTypes.SET_RESULTS,
|
|
116
|
+
payload: { results: newCategories }
|
|
117
|
+
});
|
|
112
118
|
}
|
|
113
119
|
}
|
|
114
120
|
}
|
|
@@ -116,24 +122,27 @@ export default function CategoriesFollowed(inProps) {
|
|
|
116
122
|
* fetches Categories Followed
|
|
117
123
|
*/
|
|
118
124
|
function fetchCategoriesFollowed() {
|
|
119
|
-
if (next) {
|
|
125
|
+
if (state.next) {
|
|
126
|
+
dispatch({ type: actionToolsTypes.LOADING_NEXT });
|
|
120
127
|
http
|
|
121
128
|
.request({
|
|
122
|
-
url: next,
|
|
129
|
+
url: state.next,
|
|
123
130
|
method: Endpoints.FollowedCategories.method
|
|
124
131
|
})
|
|
125
132
|
.then((res) => {
|
|
126
133
|
if (isMountedRef.current) {
|
|
127
134
|
const data = res.data;
|
|
128
|
-
|
|
129
|
-
|
|
130
|
-
|
|
131
|
-
|
|
132
|
-
|
|
135
|
+
dispatch({
|
|
136
|
+
type: actionToolsTypes.LOAD_NEXT_SUCCESS,
|
|
137
|
+
payload: {
|
|
138
|
+
results: data,
|
|
139
|
+
count: data.length
|
|
140
|
+
}
|
|
141
|
+
});
|
|
133
142
|
}
|
|
134
143
|
})
|
|
135
144
|
.catch((error) => {
|
|
136
|
-
|
|
145
|
+
dispatch({ type: actionToolsTypes.LOAD_NEXT_FAILURE, payload: { errorLoadNext: error } });
|
|
137
146
|
Logger.error(SCOPE_SC_UI, error);
|
|
138
147
|
});
|
|
139
148
|
}
|
|
@@ -145,38 +154,41 @@ export default function CategoriesFollowed(inProps) {
|
|
|
145
154
|
if (!userId) {
|
|
146
155
|
return;
|
|
147
156
|
}
|
|
148
|
-
|
|
157
|
+
else if (cacheStrategy === CacheStrategies.NETWORK_ONLY) {
|
|
158
|
+
fetchCategoriesFollowed();
|
|
159
|
+
onStateChange && onStateChange({ cacheStrategy: CacheStrategies.CACHE_FIRST });
|
|
160
|
+
}
|
|
149
161
|
}, [authUserId]);
|
|
150
162
|
/**
|
|
151
163
|
* Virtual feed update
|
|
152
164
|
*/
|
|
153
165
|
useEffect(() => {
|
|
154
166
|
onHeightChange && onHeightChange();
|
|
155
|
-
}, [
|
|
167
|
+
}, [state.results.length]);
|
|
156
168
|
/**
|
|
157
169
|
* Renders the list of categories followed
|
|
158
170
|
*/
|
|
159
|
-
if (
|
|
171
|
+
if (state.isLoadingNext) {
|
|
160
172
|
return React.createElement(Skeleton, null);
|
|
161
173
|
}
|
|
162
174
|
const c = (React.createElement(CardContent, null,
|
|
163
175
|
React.createElement(Typography, { className: classes.title, variant: "h5" }, `${intl.formatMessage(messages.title, {
|
|
164
|
-
total:
|
|
176
|
+
total: state.count
|
|
165
177
|
})}`),
|
|
166
|
-
!
|
|
167
|
-
React.createElement(List, null,
|
|
178
|
+
!state.count ? (React.createElement(Typography, { className: classes.noResults, variant: "body2" }, `${intl.formatMessage(messages.noCategories)}`)) : (React.createElement(React.Fragment, null,
|
|
179
|
+
React.createElement(List, null, state.results.slice(0, limit).map((category) => (React.createElement(ListItem, { key: category.id },
|
|
168
180
|
React.createElement(Category, Object.assign({ elevation: 0, category: category, followCategoryButtonProps: { onFollow: handleOnFollowCategory } }, CategoryProps)))))),
|
|
169
|
-
|
|
181
|
+
limit < state.count && (React.createElement(Button, { size: "small", className: classes.showMore, onClick: () => setOpenCategoriesFollowedDialog(true) },
|
|
170
182
|
React.createElement(FormattedMessage, { id: "ui.categoriesFollowed.button.showAll", defaultMessage: "ui.categoriesFollowed.button.showAll" }))),
|
|
171
|
-
openCategoriesFollowedDialog && (React.createElement(BaseDialog, { title: isMobile ? (React.createElement(FormattedMessage, { id: "ui.categoriesFollowed.modal.title", defaultMessage: "ui.categoriesFollowed.modal.title" })) : (`${intl.formatMessage(messages.title, { total:
|
|
183
|
+
openCategoriesFollowedDialog && (React.createElement(BaseDialog, { title: isMobile ? (React.createElement(FormattedMessage, { id: "ui.categoriesFollowed.modal.title", defaultMessage: "ui.categoriesFollowed.modal.title" })) : (`${intl.formatMessage(messages.title, { total: state.count })}`), onClose: () => setOpenCategoriesFollowedDialog(false), open: openCategoriesFollowedDialog }, state.isLoadingNext ? (React.createElement(CentralProgress, { size: 50 })) : (React.createElement(InfiniteScroll, { dataLength: state.results.length, next: fetchCategoriesFollowed, hasMoreNext: Boolean(state.next), loaderNext: React.createElement(CentralProgress, { size: 30 }), height: isMobile ? '100vh' : 400, endMessage: React.createElement("p", { style: { textAlign: 'center' } },
|
|
172
184
|
React.createElement("b", null,
|
|
173
185
|
React.createElement(FormattedMessage, { id: "ui.categoriesFollowed.noMoreResults", defaultMessage: "ui.categoriesFollowed.noMoreResults" }))) },
|
|
174
|
-
React.createElement(List, null,
|
|
186
|
+
React.createElement(List, null, state.results.map((c) => (React.createElement(ListItem, { key: c.id },
|
|
175
187
|
React.createElement(Category, Object.assign({ elevation: 0, category: c, sx: { m: 0 }, followCategoryButtonProps: { onFollow: handleOnFollowCategory } }, CategoryProps))))))))))))));
|
|
176
188
|
/**
|
|
177
189
|
* Renders root object (if results and if user is logged, otherwise component is hidden)
|
|
178
190
|
*/
|
|
179
|
-
if (autoHide && !
|
|
191
|
+
if (autoHide && !state.count) {
|
|
180
192
|
return React.createElement(HiddenPlaceholder, null);
|
|
181
193
|
}
|
|
182
194
|
/**
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"CategoriesFollowed.js","sourceRoot":"","sources":["../../../../src/components/CategoriesFollowed/CategoriesFollowed.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAC,UAAU,EAAE,SAAS,EAAE,QAAQ,EAAC,MAAM,OAAO,CAAC;
|
|
1
|
+
{"version":3,"file":"CategoriesFollowed.js","sourceRoot":"","sources":["../../../../src/components/CategoriesFollowed/CategoriesFollowed.tsx"],"names":[],"mappings":"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"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Skeleton.d.ts","sourceRoot":"","sources":["../../../../src/components/CategoriesFollowed/Skeleton.tsx"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"Skeleton.d.ts","sourceRoot":"","sources":["../../../../src/components/CategoriesFollowed/Skeleton.tsx"],"names":[],"mappings":"AAiBA;;;;;;;;;;;;;;;;;;;GAmBG;AACH,MAAM,CAAC,OAAO,UAAU,0BAA0B,CAAC,KAAK,KAAA,GAAG,GAAG,CAAC,OAAO,CAErE"}
|
|
@@ -9,7 +9,9 @@ const Root = styled(CategoriesSuggestionSkeleton, {
|
|
|
9
9
|
name: PREFIX,
|
|
10
10
|
slot: 'Root',
|
|
11
11
|
overridesResolver: (props, styles) => styles.root
|
|
12
|
-
})(({ theme }) => ({
|
|
12
|
+
})(({ theme }) => ({
|
|
13
|
+
marginBottom: theme.spacing(2),
|
|
14
|
+
}));
|
|
13
15
|
/**
|
|
14
16
|
* > API documentation for the Community-JS Categories Followed Skeleton component. Learn about the available props and the CSS API.
|
|
15
17
|
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Skeleton.js","sourceRoot":"","sources":["../../../../src/components/CategoriesFollowed/Skeleton.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,4BAA4B,MAAM,kCAAkC,CAAC;AAC5E,OAAO,EAAC,MAAM,EAAC,MAAM,sBAAsB,CAAC;AAE5C,MAAM,MAAM,GAAG,8BAA8B,CAAC;AAE9C,MAAM,OAAO,GAAG;IACd,IAAI,EAAE,GAAG,MAAM,OAAO;CACvB,CAAC;AAEF,MAAM,IAAI,GAAG,MAAM,CAAC,4BAA4B,EAAE;IAChD,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,EAAE,CAAC,CAAC,CAAC;
|
|
1
|
+
{"version":3,"file":"Skeleton.js","sourceRoot":"","sources":["../../../../src/components/CategoriesFollowed/Skeleton.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,4BAA4B,MAAM,kCAAkC,CAAC;AAC5E,OAAO,EAAC,MAAM,EAAC,MAAM,sBAAsB,CAAC;AAE5C,MAAM,MAAM,GAAG,8BAA8B,CAAC;AAE9C,MAAM,OAAO,GAAG;IACd,IAAI,EAAE,GAAG,MAAM,OAAO;CACvB,CAAC;AAEF,MAAM,IAAI,GAAG,MAAM,CAAC,4BAA4B,EAAE;IAChD,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;CAC/B,CAAC,CAAC,CAAC;AACJ;;;;;;;;;;;;;;;;;;;GAmBG;AACH,MAAM,CAAC,OAAO,UAAU,0BAA0B,CAAC,KAAK;IACtD,OAAO,oBAAC,IAAI,kBAAC,SAAS,EAAE,OAAO,CAAC,IAAI,IAAM,KAAK,EAAI,CAAC;AACtD,CAAC"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"CategoriesPopular.d.ts","sourceRoot":"","sources":["../../../../src/components/CategoriesPopular/CategoriesPopular.tsx"],"names":[],"mappings":"AAUA,OAAO,EAAC,mBAAmB,EAAC,MAAM,yBAAyB,CAAC;
|
|
1
|
+
{"version":3,"file":"CategoriesPopular.d.ts","sourceRoot":"","sources":["../../../../src/components/CategoriesPopular/CategoriesPopular.tsx"],"names":[],"mappings":"AAUA,OAAO,EAAC,mBAAmB,EAAC,MAAM,yBAAyB,CAAC;AA4B5D;;;;;;;;;;;;;;;;;;;;;GAqBG;AACH,MAAM,CAAC,OAAO,UAAU,iBAAiB,CAAC,OAAO,EAAE,mBAAmB,GAAG,GAAG,CAAC,OAAO,CAsLnF"}
|
|
@@ -9,11 +9,11 @@ var __rest = (this && this.__rest) || function (s, e) {
|
|
|
9
9
|
}
|
|
10
10
|
return t;
|
|
11
11
|
};
|
|
12
|
-
import React, { useEffect, useMemo, useState } from 'react';
|
|
12
|
+
import React, { useEffect, useMemo, useReducer, useState } from 'react';
|
|
13
13
|
import { styled } from '@mui/material/styles';
|
|
14
14
|
import { Button, CardContent, List, ListItem, Typography, useMediaQuery, useTheme } from '@mui/material';
|
|
15
15
|
import { http, Endpoints } from '@selfcommunity/api-services';
|
|
16
|
-
import { Logger } from '@selfcommunity/utils';
|
|
16
|
+
import { CacheStrategies, Logger } from '@selfcommunity/utils';
|
|
17
17
|
import Skeleton from './Skeleton';
|
|
18
18
|
import { SCOPE_SC_UI } from '../../constants/Errors';
|
|
19
19
|
import { FormattedMessage } from 'react-intl';
|
|
@@ -25,7 +25,8 @@ import InfiniteScroll from '../../shared/InfiniteScroll';
|
|
|
25
25
|
import Widget from '../Widget';
|
|
26
26
|
import { useThemeProps } from '@mui/system';
|
|
27
27
|
import HiddenPlaceholder from '../../shared/HiddenPlaceholder';
|
|
28
|
-
import { useIsComponentMountedRef } from '@selfcommunity/react-core';
|
|
28
|
+
import { SCCache, useIsComponentMountedRef } from '@selfcommunity/react-core';
|
|
29
|
+
import { actionToolsTypes, dataToolsReducer, stateToolsInitializer } from '../../utils/tools';
|
|
29
30
|
const PREFIX = 'SCCategoriesPopular';
|
|
30
31
|
const classes = {
|
|
31
32
|
root: `${PREFIX}-root`,
|
|
@@ -70,57 +71,64 @@ export default function CategoriesPopular(inProps) {
|
|
|
70
71
|
props: inProps,
|
|
71
72
|
name: PREFIX
|
|
72
73
|
});
|
|
73
|
-
const { autoHide = true, className, CategoryProps = {}, onHeightChange, onStateChange } = props, rest = __rest(props, ["autoHide", "className", "CategoryProps", "onHeightChange", "onStateChange"]);
|
|
74
|
+
const { autoHide = true, className, CategoryProps = {}, onHeightChange, onStateChange, cacheStrategy = CacheStrategies.NETWORK_ONLY } = props, rest = __rest(props, ["autoHide", "className", "CategoryProps", "onHeightChange", "onStateChange", "cacheStrategy"]);
|
|
74
75
|
// REFS
|
|
75
76
|
const isMountedRef = useIsComponentMountedRef();
|
|
76
77
|
// STATE
|
|
77
78
|
const theme = useTheme();
|
|
78
79
|
const isMobile = useMediaQuery(theme.breakpoints.down('md'));
|
|
79
|
-
const [
|
|
80
|
-
|
|
81
|
-
|
|
82
|
-
|
|
83
|
-
|
|
80
|
+
const [state, dispatch] = useReducer(dataToolsReducer, {
|
|
81
|
+
isLoadingNext: true,
|
|
82
|
+
next: `${Endpoints.PopularCategories.url()}?limit=10`,
|
|
83
|
+
cacheKey: SCCache.getToolsStateCacheKey(SCCache.CATEGORIES_POPULAR_TOOLS_STATE_CACHE_PREFIX_KEY),
|
|
84
|
+
cacheStrategy,
|
|
85
|
+
visibleItems: limit
|
|
86
|
+
}, stateToolsInitializer);
|
|
84
87
|
const [openPopularCategoriesDialog, setOpenPopularCategoriesDialog] = useState(false);
|
|
85
|
-
const [next, setNext] = useState(`${Endpoints.PopularCategories.url()}?limit=10`);
|
|
86
88
|
/**
|
|
87
89
|
* Fetches popular categories list
|
|
88
90
|
*/
|
|
89
91
|
const fetchPopularCategories = useMemo(() => () => {
|
|
90
|
-
if (next) {
|
|
92
|
+
if (state.next) {
|
|
91
93
|
http
|
|
92
94
|
.request({
|
|
93
|
-
url: next,
|
|
95
|
+
url: state.next,
|
|
94
96
|
method: Endpoints.PopularCategories.method
|
|
95
97
|
})
|
|
96
98
|
.then((res) => {
|
|
97
99
|
if (res.status < 300 && isMountedRef.current) {
|
|
98
100
|
const data = res.data;
|
|
99
|
-
|
|
100
|
-
|
|
101
|
-
|
|
102
|
-
|
|
103
|
-
|
|
101
|
+
dispatch({
|
|
102
|
+
type: actionToolsTypes.LOAD_NEXT_SUCCESS,
|
|
103
|
+
payload: {
|
|
104
|
+
results: data.results,
|
|
105
|
+
count: data.count,
|
|
106
|
+
next: data.next
|
|
107
|
+
}
|
|
108
|
+
});
|
|
104
109
|
}
|
|
105
110
|
})
|
|
106
111
|
.catch((error) => {
|
|
107
|
-
|
|
112
|
+
dispatch({ type: actionToolsTypes.LOAD_NEXT_FAILURE, payload: { errorLoadNext: error } });
|
|
108
113
|
Logger.error(SCOPE_SC_UI, error);
|
|
109
114
|
});
|
|
110
115
|
}
|
|
111
|
-
}, [
|
|
116
|
+
}, [dispatch, state.next, state.isLoadingNext]);
|
|
112
117
|
/**
|
|
113
118
|
* On mount, fetches popular categories list
|
|
114
119
|
*/
|
|
115
120
|
useEffect(() => {
|
|
116
|
-
|
|
121
|
+
if (cacheStrategy === CacheStrategies.NETWORK_ONLY) {
|
|
122
|
+
fetchPopularCategories();
|
|
123
|
+
onStateChange && onStateChange({ cacheStrategy: CacheStrategies.CACHE_FIRST });
|
|
124
|
+
}
|
|
117
125
|
}, []);
|
|
118
126
|
/**
|
|
119
127
|
* Handles followers counter update on follow/unfollow action.
|
|
120
128
|
* @param category
|
|
121
129
|
*/
|
|
122
130
|
function handleFollowersUpdate(category) {
|
|
123
|
-
const newCategories = [...
|
|
131
|
+
const newCategories = [...state.results];
|
|
124
132
|
const index = newCategories.findIndex((u) => u.id === category.id);
|
|
125
133
|
if (index !== -1) {
|
|
126
134
|
if (category.followed) {
|
|
@@ -131,33 +139,36 @@ export default function CategoriesPopular(inProps) {
|
|
|
131
139
|
newCategories[index].followers_counter = category.followers_counter + 1;
|
|
132
140
|
newCategories[index].followed = !category.followed;
|
|
133
141
|
}
|
|
134
|
-
|
|
142
|
+
dispatch({
|
|
143
|
+
type: actionToolsTypes.SET_RESULTS,
|
|
144
|
+
payload: { results: newCategories }
|
|
145
|
+
});
|
|
135
146
|
}
|
|
136
147
|
}
|
|
137
148
|
/**
|
|
138
149
|
* Renders popular categories list
|
|
139
150
|
*/
|
|
140
|
-
if (
|
|
151
|
+
if (state.isLoadingNext) {
|
|
141
152
|
return React.createElement(Skeleton, null);
|
|
142
153
|
}
|
|
143
154
|
const c = (React.createElement(CardContent, null,
|
|
144
155
|
React.createElement(Typography, { className: classes.title, variant: "h5" },
|
|
145
156
|
React.createElement(FormattedMessage, { id: "ui.categoriesPopular.title", defaultMessage: "ui.categoriesPopular.title" })),
|
|
146
|
-
!
|
|
157
|
+
!state.count ? (React.createElement(Typography, { className: classes.noResults, variant: "body2" },
|
|
147
158
|
React.createElement(FormattedMessage, { id: "ui.categoriesPopular.noResults", defaultMessage: "ui.categoriesPopular.noResults" }))) : (React.createElement(React.Fragment, null,
|
|
148
|
-
React.createElement(List, null,
|
|
159
|
+
React.createElement(List, null, state.results.slice(0, state.visibleItems).map((category) => (React.createElement(ListItem, { key: category.id },
|
|
149
160
|
React.createElement(Category, Object.assign({ elevation: 0, category: category, followCategoryButtonProps: { onFollow: handleFollowersUpdate } }, CategoryProps)))))),
|
|
150
|
-
|
|
161
|
+
state.count > state.visibleItems && (React.createElement(Button, { size: "small", className: classes.showMore, onClick: () => setOpenPopularCategoriesDialog(true) },
|
|
151
162
|
React.createElement(FormattedMessage, { id: "ui.categoriesPopular.button.showAll", defaultMessage: "ui.categoriesPopular.button.showAll" }))))),
|
|
152
|
-
openPopularCategoriesDialog && (React.createElement(BaseDialog, { title: React.createElement(FormattedMessage, { defaultMessage: "ui.categoriesPopular.title", id: "ui.categoriesPopular.title" }), onClose: () => setOpenPopularCategoriesDialog(false), open: openPopularCategoriesDialog },
|
|
163
|
+
openPopularCategoriesDialog && (React.createElement(BaseDialog, { title: React.createElement(FormattedMessage, { defaultMessage: "ui.categoriesPopular.title", id: "ui.categoriesPopular.title" }), onClose: () => setOpenPopularCategoriesDialog(false), open: openPopularCategoriesDialog }, state.isLoadingNext ? (React.createElement(CentralProgress, { size: 50 })) : (React.createElement(InfiniteScroll, { dataLength: state.results.length, next: fetchPopularCategories, hasMoreNext: Boolean(state.next), loaderNext: React.createElement(CentralProgress, { size: 30 }), height: isMobile ? '100vh' : 400, endMessage: React.createElement("p", { style: { textAlign: 'center' } },
|
|
153
164
|
React.createElement("b", null,
|
|
154
165
|
React.createElement(FormattedMessage, { id: "ui.categoriesPopular.noMoreResults", defaultMessage: "ui.categoriesPopular.noMoreResults" }))) },
|
|
155
|
-
React.createElement(List, null,
|
|
166
|
+
React.createElement(List, null, state.results.map((c) => (React.createElement(ListItem, { key: c.id },
|
|
156
167
|
React.createElement(Category, Object.assign({ elevation: 0, category: c }, CategoryProps, { followCategoryButtonProps: { onFollow: handleFollowersUpdate } }))))))))))));
|
|
157
168
|
/**
|
|
158
169
|
* Renders root object (if results and autoHide prop is set to false, otherwise component is hidden)
|
|
159
170
|
*/
|
|
160
|
-
if (autoHide && !
|
|
171
|
+
if (autoHide && !state.count) {
|
|
161
172
|
return React.createElement(HiddenPlaceholder, null);
|
|
162
173
|
}
|
|
163
174
|
return (React.createElement(Root, Object.assign({ className: classNames(classes.root, className) }, rest), c));
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"CategoriesPopular.js","sourceRoot":"","sources":["../../../../src/components/CategoriesPopular/CategoriesPopular.tsx"],"names":[],"mappings":";;;;;;;;;;;AAAA,OAAO,KAAK,EAAE,EAAC,SAAS,EAAE,OAAO,EAAE,QAAQ,EAAC,MAAM,OAAO,CAAC;
|
|
1
|
+
{"version":3,"file":"CategoriesPopular.js","sourceRoot":"","sources":["../../../../src/components/CategoriesPopular/CategoriesPopular.tsx"],"names":[],"mappings":"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"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Skeleton.d.ts","sourceRoot":"","sources":["../../../../src/components/CategoriesPopular/Skeleton.tsx"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"Skeleton.d.ts","sourceRoot":"","sources":["../../../../src/components/CategoriesPopular/Skeleton.tsx"],"names":[],"mappings":"AAiBA;;;;;;;;;;;;;;;;;;;GAmBG;AACH,MAAM,CAAC,OAAO,UAAU,yBAAyB,CAAC,KAAK,KAAA,GAAG,GAAG,CAAC,OAAO,CAEpE"}
|
|
@@ -9,7 +9,9 @@ const Root = styled(CategoriesSuggestionSkeleton, {
|
|
|
9
9
|
name: PREFIX,
|
|
10
10
|
slot: 'Root',
|
|
11
11
|
overridesResolver: (props, styles) => styles.root
|
|
12
|
-
})(({ theme }) => ({
|
|
12
|
+
})(({ theme }) => ({
|
|
13
|
+
marginBottom: theme.spacing(2)
|
|
14
|
+
}));
|
|
13
15
|
/**
|
|
14
16
|
* > API documentation for the Community-JS Categories Popular Skeleton component. Learn about the available props and the CSS API.
|
|
15
17
|
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Skeleton.js","sourceRoot":"","sources":["../../../../src/components/CategoriesPopular/Skeleton.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,4BAA4B,MAAM,kCAAkC,CAAC;AAC5E,OAAO,EAAC,MAAM,EAAC,MAAM,sBAAsB,CAAC;AAE5C,MAAM,MAAM,GAAG,6BAA6B,CAAC;AAE7C,MAAM,OAAO,GAAG;IACd,IAAI,EAAE,GAAG,MAAM,OAAO;CACvB,CAAC;AAEF,MAAM,IAAI,GAAG,MAAM,CAAC,4BAA4B,EAAE;IAChD,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,EAAE,CAAC,CAAC,CAAC;
|
|
1
|
+
{"version":3,"file":"Skeleton.js","sourceRoot":"","sources":["../../../../src/components/CategoriesPopular/Skeleton.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,4BAA4B,MAAM,kCAAkC,CAAC;AAC5E,OAAO,EAAC,MAAM,EAAC,MAAM,sBAAsB,CAAC;AAE5C,MAAM,MAAM,GAAG,6BAA6B,CAAC;AAE7C,MAAM,OAAO,GAAG;IACd,IAAI,EAAE,GAAG,MAAM,OAAO;CACvB,CAAC;AAEF,MAAM,IAAI,GAAG,MAAM,CAAC,4BAA4B,EAAE;IAChD,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;CAC/B,CAAC,CAAC,CAAC;AACJ;;;;;;;;;;;;;;;;;;;GAmBG;AACH,MAAM,CAAC,OAAO,UAAU,yBAAyB,CAAC,KAAK;IACrD,OAAO,oBAAC,IAAI,kBAAC,SAAS,EAAE,OAAO,CAAC,IAAI,IAAM,KAAK,EAAI,CAAC;AACtD,CAAC"}
|
|
@@ -1,5 +1,6 @@
|
|
|
1
1
|
import { CategoryProps } from '../Category';
|
|
2
2
|
import { VirtualScrollerItemProps } from '../../types/virtualScroller';
|
|
3
|
+
import { CacheStrategies } from '@selfcommunity/utils';
|
|
3
4
|
export interface CategoriesListProps extends VirtualScrollerItemProps {
|
|
4
5
|
/**
|
|
5
6
|
* The user id
|
|
@@ -21,6 +22,11 @@ export interface CategoriesListProps extends VirtualScrollerItemProps {
|
|
|
21
22
|
* @default empty object
|
|
22
23
|
*/
|
|
23
24
|
CategoryProps?: CategoryProps;
|
|
25
|
+
/**
|
|
26
|
+
* Caching strategies
|
|
27
|
+
* @default CacheStrategies.CACHE_FIRST
|
|
28
|
+
*/
|
|
29
|
+
cacheStrategy?: CacheStrategies;
|
|
24
30
|
/**
|
|
25
31
|
* Other props
|
|
26
32
|
*/
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"CategoriesSuggestion.d.ts","sourceRoot":"","sources":["../../../../src/components/CategoriesSuggestion/CategoriesSuggestion.tsx"],"names":[],"mappings":"AAOA,OAAiB,EAAC,aAAa,EAAC,MAAM,aAAa,CAAC;AAMpD,OAAO,EAAC,wBAAwB,EAAC,MAAM,6BAA6B,CAAC;
|
|
1
|
+
{"version":3,"file":"CategoriesSuggestion.d.ts","sourceRoot":"","sources":["../../../../src/components/CategoriesSuggestion/CategoriesSuggestion.tsx"],"names":[],"mappings":"AAOA,OAAiB,EAAC,aAAa,EAAC,MAAM,aAAa,CAAC;AAMpD,OAAO,EAAC,wBAAwB,EAAC,MAAM,6BAA6B,CAAC;AACrE,OAAO,EAAC,eAAe,EAAC,MAAM,sBAAsB,CAAC;AAoBrD,MAAM,WAAW,mBAAoB,SAAQ,wBAAwB;IACnE;;;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,aAAa,CAAC,EAAE,aAAa,CAAC;IAE9B;;;OAGG;IACH,aAAa,CAAC,EAAE,eAAe,CAAC;IAEhC;;OAEG;IACH,CAAC,CAAC,EAAE,MAAM,GAAG,GAAG,CAAC;CAClB;AAED;;;;;;;;;;;;;;;;;;;;;GAqBG;AACH,MAAM,CAAC,OAAO,UAAU,oBAAoB,CAAC,OAAO,EAAE,mBAAmB,GAAG,GAAG,CAAC,OAAO,CAmJtF"}
|
|
@@ -9,11 +9,11 @@ var __rest = (this && this.__rest) || function (s, e) {
|
|
|
9
9
|
}
|
|
10
10
|
return t;
|
|
11
11
|
};
|
|
12
|
-
import React, { useContext, useEffect, useState } from 'react';
|
|
12
|
+
import React, { useContext, useEffect, useReducer, useState } from 'react';
|
|
13
13
|
import { styled } from '@mui/material/styles';
|
|
14
|
-
import { Button,
|
|
15
|
-
import {
|
|
16
|
-
import { SCUserContext, useIsComponentMountedRef } from '@selfcommunity/react-core';
|
|
14
|
+
import { Button, CardContent, List, ListItem, Typography } from '@mui/material';
|
|
15
|
+
import { Endpoints, http } from '@selfcommunity/api-services';
|
|
16
|
+
import { SCCache, SCUserContext, useIsComponentMountedRef } from '@selfcommunity/react-core';
|
|
17
17
|
import Skeleton from './Skeleton';
|
|
18
18
|
import Category from '../Category';
|
|
19
19
|
import { FormattedMessage } from 'react-intl';
|
|
@@ -21,6 +21,8 @@ import classNames from 'classnames';
|
|
|
21
21
|
import Widget from '../Widget';
|
|
22
22
|
import { useThemeProps } from '@mui/system';
|
|
23
23
|
import HiddenPlaceholder from '../../shared/HiddenPlaceholder';
|
|
24
|
+
import { CacheStrategies } from '@selfcommunity/utils';
|
|
25
|
+
import { actionToolsTypes, dataToolsReducer, stateToolsInitializer } from '../../utils/tools';
|
|
24
26
|
const PREFIX = 'SCCategoriesSuggestion';
|
|
25
27
|
const classes = {
|
|
26
28
|
root: `${PREFIX}-root`,
|
|
@@ -65,14 +67,15 @@ export default function CategoriesSuggestion(inProps) {
|
|
|
65
67
|
props: inProps,
|
|
66
68
|
name: PREFIX
|
|
67
69
|
});
|
|
68
|
-
const { autoHide, className, CategoryProps = {}, onHeightChange, onStateChange } = props, rest = __rest(props, ["autoHide", "className", "CategoryProps", "onHeightChange", "onStateChange"]);
|
|
69
|
-
|
|
70
|
-
|
|
71
|
-
|
|
72
|
-
|
|
73
|
-
|
|
70
|
+
const { autoHide, className, CategoryProps = {}, onHeightChange, onStateChange, cacheStrategy = CacheStrategies.NETWORK_ONLY } = props, rest = __rest(props, ["autoHide", "className", "CategoryProps", "onHeightChange", "onStateChange", "cacheStrategy"]);
|
|
71
|
+
const [state, dispatch] = useReducer(dataToolsReducer, {
|
|
72
|
+
isLoadingNext: true,
|
|
73
|
+
next: Endpoints.CategoriesSuggestion.url({}),
|
|
74
|
+
cacheKey: SCCache.getToolsStateCacheKey(SCCache.CATEGORIES_SUGGESTION_TOOLS_STATE_CACHE_PREFIX_KEY),
|
|
75
|
+
cacheStrategy,
|
|
76
|
+
visibleItems: limit
|
|
77
|
+
}, stateToolsInitializer);
|
|
74
78
|
const [openCategoriesSuggestionDialog, setOpenCategoriesSuggestionDialog] = useState(false);
|
|
75
|
-
const [total, setTotal] = useState(0);
|
|
76
79
|
// CONTEXT
|
|
77
80
|
const scUserContext = useContext(SCUserContext);
|
|
78
81
|
// CONST
|
|
@@ -83,9 +86,10 @@ export default function CategoriesSuggestion(inProps) {
|
|
|
83
86
|
* Handles list change on category follow
|
|
84
87
|
*/
|
|
85
88
|
function handleOnFollowCategory(category, follow) {
|
|
86
|
-
|
|
87
|
-
|
|
88
|
-
|
|
89
|
+
dispatch({
|
|
90
|
+
type: actionToolsTypes.SET_RESULTS,
|
|
91
|
+
payload: { results: state.results.filter((c) => c.id !== category.id), count: state.count - 1 }
|
|
92
|
+
});
|
|
89
93
|
}
|
|
90
94
|
/**
|
|
91
95
|
* Fetches categories suggestion list
|
|
@@ -99,13 +103,17 @@ export default function CategoriesSuggestion(inProps) {
|
|
|
99
103
|
.then((res) => {
|
|
100
104
|
if (isMountedRef.current) {
|
|
101
105
|
const data = res.data;
|
|
102
|
-
|
|
103
|
-
|
|
104
|
-
|
|
105
|
-
|
|
106
|
+
dispatch({
|
|
107
|
+
type: actionToolsTypes.LOAD_NEXT_SUCCESS,
|
|
108
|
+
payload: {
|
|
109
|
+
results: data.results,
|
|
110
|
+
count: data.results.length
|
|
111
|
+
}
|
|
112
|
+
});
|
|
106
113
|
}
|
|
107
114
|
})
|
|
108
115
|
.catch((error) => {
|
|
116
|
+
dispatch({ type: actionToolsTypes.LOAD_NEXT_FAILURE, payload: { errorLoadNext: error } });
|
|
109
117
|
console.log(error);
|
|
110
118
|
});
|
|
111
119
|
}
|
|
@@ -113,17 +121,15 @@ export default function CategoriesSuggestion(inProps) {
|
|
|
113
121
|
* Loads more categories on "see more" button click
|
|
114
122
|
*/
|
|
115
123
|
function loadCategories(n) {
|
|
116
|
-
|
|
117
|
-
const newHasMore = newIndex < categories.length - 1;
|
|
118
|
-
setVisibleCategories(newIndex);
|
|
119
|
-
setHasMore(newHasMore);
|
|
124
|
+
dispatch({ type: actionToolsTypes.SET_VISIBLE_ITEMS, payload: { visibleItems: state.visibleItems + n } });
|
|
120
125
|
}
|
|
121
126
|
/**
|
|
122
127
|
* On mount, fetches categories suggestion list
|
|
123
128
|
*/
|
|
124
129
|
useEffect(() => {
|
|
125
|
-
if (scUserContext.user) {
|
|
130
|
+
if (scUserContext.user && cacheStrategy === CacheStrategies.NETWORK_ONLY) {
|
|
126
131
|
fetchCategoriesSuggestion();
|
|
132
|
+
onStateChange && onStateChange({ cacheStrategy: CacheStrategies.CACHE_FIRST });
|
|
127
133
|
}
|
|
128
134
|
}, [authUserId]);
|
|
129
135
|
/**
|
|
@@ -131,24 +137,24 @@ export default function CategoriesSuggestion(inProps) {
|
|
|
131
137
|
*/
|
|
132
138
|
useEffect(() => {
|
|
133
139
|
onHeightChange && onHeightChange();
|
|
134
|
-
}, [
|
|
140
|
+
}, [state.results]);
|
|
135
141
|
/**
|
|
136
142
|
* Renders categories suggestion list
|
|
137
143
|
*/
|
|
138
|
-
const c = (React.createElement(React.Fragment, null,
|
|
144
|
+
const c = (React.createElement(React.Fragment, null, state.isLoadingNext ? (React.createElement(Skeleton, { elevation: 0 })) : (React.createElement(CardContent, null,
|
|
139
145
|
React.createElement(Typography, { className: classes.title, variant: "h5" },
|
|
140
146
|
React.createElement(FormattedMessage, { id: "ui.categoriesSuggestion.title", defaultMessage: "ui.categoriesSuggestion.title" })),
|
|
141
|
-
!
|
|
147
|
+
!state.count ? (React.createElement(Typography, { className: classes.noResults, variant: "body2" },
|
|
142
148
|
React.createElement(FormattedMessage, { id: "ui.categoriesSuggestion.noResults", defaultMessage: "ui.categoriesSuggestion.noResults" }))) : (React.createElement(React.Fragment, null,
|
|
143
|
-
React.createElement(List, null,
|
|
149
|
+
React.createElement(List, null, state.results.slice(0, state.visibleItems).map((category) => (React.createElement(ListItem, { key: category.id },
|
|
144
150
|
React.createElement(Category, Object.assign({ elevation: 0, category: category, followCategoryButtonProps: { onFollow: handleOnFollowCategory } }, CategoryProps)))))),
|
|
145
|
-
|
|
151
|
+
state.visibleItems < state.results.length && (React.createElement(Button, { size: "small", className: classes.showMore, onClick: () => loadCategories(2) },
|
|
146
152
|
React.createElement(FormattedMessage, { id: "ui.categoriesSuggestion.button.showMore", defaultMessage: "ui.categoriesSuggestion.button.showMore" }))))),
|
|
147
153
|
openCategoriesSuggestionDialog && React.createElement(React.Fragment, null)))));
|
|
148
154
|
/**
|
|
149
155
|
* Renders root object (if results and if user is logged, otherwise component is hidden)
|
|
150
156
|
*/
|
|
151
|
-
if (autoHide && !
|
|
157
|
+
if (autoHide && !state.count) {
|
|
152
158
|
return React.createElement(HiddenPlaceholder, null);
|
|
153
159
|
}
|
|
154
160
|
if (scUserContext.user) {
|