@selfcommunity/react-ui 0.9.0-alpha.1 → 0.9.0-alpha.2

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.
Files changed (12) hide show
  1. package/lib/cjs/components/EventMediaWidget/EventMediaWidget.d.ts +4 -0
  2. package/lib/cjs/components/EventMediaWidget/EventMediaWidget.js +17 -9
  3. package/lib/cjs/components/EventMembersWidget/EventMembersWidget.js +27 -3
  4. package/lib/cjs/utils/widget.d.ts +1 -0
  5. package/lib/cjs/utils/widget.js +4 -0
  6. package/lib/esm/components/EventMediaWidget/EventMediaWidget.d.ts +4 -0
  7. package/lib/esm/components/EventMediaWidget/EventMediaWidget.js +18 -10
  8. package/lib/esm/components/EventMembersWidget/EventMembersWidget.js +27 -3
  9. package/lib/esm/utils/widget.d.ts +1 -0
  10. package/lib/esm/utils/widget.js +4 -0
  11. package/lib/umd/react-ui.js +1 -1
  12. package/package.json +3 -3
package/lib/cjs/components/EventMediaWidget/EventMediaWidget.d.ts CHANGED
@@ -28,6 +28,10 @@ export interface EventMediaWidgetProps extends WidgetProps {
28
28
  * @default {}
29
29
  */
30
30
  dialogProps?: BaseDialogProps;
31
+ /**
32
+ * Limit results
33
+ * @default 10
34
+ */
31
35
  limit?: number;
32
36
  /**
33
37
  * Other props
package/lib/cjs/components/EventMediaWidget/EventMediaWidget.js CHANGED
@@ -69,12 +69,17 @@ function EventMediaWidget(inProps) {
69
69
  const { event, eventId, limit = Pagination_1.DEFAULT_PAGINATION_LIMIT, endpointQueryParams = {
70
70
  limit,
71
71
  offset: Pagination_1.DEFAULT_PAGINATION_OFFSET
72
- }, cacheStrategy, dialogProps } = props, rest = tslib_1.__rest(props, ["event", "eventId", "limit", "endpointQueryParams", "cacheStrategy", "dialogProps"]);
72
+ }, cacheStrategy = utils_1.CacheStrategies.CACHE_FIRST, dialogProps } = props, rest = tslib_1.__rest(props, ["event", "eventId", "limit", "endpointQueryParams", "cacheStrategy", "dialogProps"]);
73
+ // HOOKS
74
+ const { scEvent } = (0, react_core_1.useSCFetchEvent)({ id: eventId, event });
75
+ const intl = (0, react_intl_1.useIntl)();
76
+ const theme = (0, material_1.useTheme)();
77
+ const isMobile = (0, material_1.useMediaQuery)(theme.breakpoints.down('md'));
73
78
  // STATE
74
79
  const [state, dispatch] = (0, react_1.useReducer)(widget_1.dataWidgetReducer, {
75
80
  isLoadingNext: false,
76
81
  next: null,
77
- cacheKey: react_core_1.SCCache.getWidgetStateCacheKey(react_core_1.SCCache.EVENT_MEDIA_STATE_CACHE_PREFIX_KEY),
82
+ cacheKey: react_core_1.SCCache.getWidgetStateCacheKey(react_core_1.SCCache.EVENT_MEDIA_STATE_CACHE_PREFIX_KEY, event ? event.id : eventId),
78
83
  cacheStrategy,
79
84
  visibleItems: limit
80
85
  }, widget_1.stateWidgetInitializer);
@@ -88,11 +93,6 @@ function EventMediaWidget(inProps) {
88
93
  const [showSkeleton, setShowSkeleton] = (0, react_1.useState)(null);
89
94
  // CONTEXT
90
95
  const scUserContext = (0, react_core_1.useSCUser)();
91
- // HOOKS
92
- const { scEvent } = (0, react_core_1.useSCFetchEvent)({ id: eventId, event });
93
- const intl = (0, react_intl_1.useIntl)();
94
- const theme = (0, material_1.useTheme)();
95
- const isMobile = (0, material_1.useMediaQuery)(theme.breakpoints.down('md'));
96
96
  // CONSTS
97
97
  const hasAllow = (0, react_1.useMemo)(() => { var _a; return ((_a = scUserContext.user) === null || _a === void 0 ? void 0 : _a.id) === (scEvent === null || scEvent === void 0 ? void 0 : scEvent.managed_by.id); }, [scUserContext, scEvent]);
98
98
  const countHiddenMedia = (0, react_1.useMemo)(() => mediasCount - MEDIAS_TO_SHOW, [mediasCount]);
@@ -114,7 +114,7 @@ function EventMediaWidget(inProps) {
114
114
  utils_1.Logger.error(Errors_1.SCOPE_SC_UI, error);
115
115
  });
116
116
  }
117
- }, [state.isLoadingNext, state.initialized, scEvent, dispatch, setMedias, setMediasCount]);
117
+ }, [state.isLoadingNext, scEvent, dispatch, setMedias, setMediasCount]);
118
118
  const _fetchNext = (0, react_1.useCallback)((index) => {
119
119
  if (mediasCount > medias.length && index >= 6 && !state.isLoadingNext && state.next) {
120
120
  setPreview(index);
@@ -216,9 +216,17 @@ function EventMediaWidget(inProps) {
216
216
  _t = setTimeout(_initComponent);
217
217
  return () => {
218
218
  clearTimeout(_t);
219
+ if (state.initialized) {
220
+ dispatch({
221
+ type: widget_1.actionWidgetTypes.INITIALIZE,
222
+ payload: {
223
+ cacheKey: react_core_1.SCCache.getWidgetStateCacheKey(react_core_1.SCCache.EVENT_MEDIA_STATE_CACHE_PREFIX_KEY, scEvent.id)
224
+ }
225
+ });
226
+ }
219
227
  };
220
228
  }
221
- }, [scUserContext.user, scEvent]);
229
+ }, [scUserContext.user, scEvent, state.initialized]);
222
230
  (0, react_1.useEffect)(() => {
223
231
  if (isMobile && openDialog && state.next) {
224
232
  handleNext();
package/lib/cjs/components/EventMembersWidget/EventMembersWidget.js CHANGED
@@ -99,7 +99,7 @@ function EventMembersWidget(inProps) {
99
99
  utils_1.Logger.error(Errors_1.SCOPE_SC_UI, error);
100
100
  });
101
101
  }
102
- }, [participants.isLoadingNext, participants.initialized, scEvent]);
102
+ }, [participants.isLoadingNext, participants.initialized, scEvent, dispatchParticipants, setParticipantsCount]);
103
103
  const _initInvited = (0, react_1.useCallback)(() => {
104
104
  if (!invited.initialized && !invited.isLoadingNext && hasAllow) {
105
105
  dispatchInvited({ type: widget_1.actionWidgetTypes.LOADING_NEXT });
@@ -113,7 +113,7 @@ function EventMembersWidget(inProps) {
113
113
  utils_1.Logger.error(Errors_1.SCOPE_SC_UI, error);
114
114
  });
115
115
  }
116
- }, [invited.isLoadingNext, invited.initialized, scUserContext.user, scEvent]);
116
+ }, [invited.isLoadingNext, invited.initialized, scEvent, dispatchInvited, setInvitedCount]);
117
117
  const _initRequests = (0, react_1.useCallback)(() => {
118
118
  if (!requests.initialized && !requests.isLoadingNext && hasAllow) {
119
119
  dispatchRequests({ type: widget_1.actionWidgetTypes.LOADING_NEXT });
@@ -128,7 +128,7 @@ function EventMembersWidget(inProps) {
128
128
  utils_1.Logger.error(Errors_1.SCOPE_SC_UI, error);
129
129
  });
130
130
  }
131
- }, [requests.isLoadingNext, requests.initialized, scUserContext.user, scEvent]);
131
+ }, [requests.isLoadingNext, requests.initialized, scEvent, dispatchRequests, setRequestsCount, setRequestsUsers]);
132
132
  // EFFECTS
133
133
  (0, react_1.useEffect)(() => {
134
134
  let _t;
@@ -150,6 +150,30 @@ function EventMembersWidget(inProps) {
150
150
  });
151
151
  return () => {
152
152
  clearTimeout(_t);
153
+ if (participants.initialized) {
154
+ dispatchParticipants({
155
+ type: widget_1.actionWidgetTypes.INITIALIZE,
156
+ payload: {
157
+ cacheKey: react_core_1.SCCache.getWidgetStateCacheKey(react_core_1.SCCache.USER_PARTECIPANTS_EVENTS_STATE_CACHE_PREFIX_KEY, scEvent.id)
158
+ }
159
+ });
160
+ }
161
+ if (invited.initialized) {
162
+ dispatchParticipants({
163
+ type: widget_1.actionWidgetTypes.INITIALIZE,
164
+ payload: {
165
+ cacheKey: react_core_1.SCCache.getWidgetStateCacheKey(react_core_1.SCCache.USER_INVITED_EVENTS_STATE_CACHE_PREFIX_KEY, scEvent.id)
166
+ }
167
+ });
168
+ }
169
+ if (requests.initialized) {
170
+ dispatchParticipants({
171
+ type: widget_1.actionWidgetTypes.INITIALIZE,
172
+ payload: {
173
+ cacheKey: react_core_1.SCCache.getWidgetStateCacheKey(react_core_1.SCCache.USER_REQUESTS_EVENTS_STATE_CACHE_PREFIX_KEY, scEvent.id)
174
+ }
175
+ });
176
+ }
153
177
  };
154
178
  }
155
179
  }, [scUserContext.user, scEvent, refresh]);
package/lib/cjs/utils/widget.d.ts CHANGED
@@ -14,6 +14,7 @@ export declare const actionWidgetTypes: {
14
14
  LOAD_PREVIOUS_FAILURE: string;
15
15
  SET_RESULTS: string;
16
16
  SET_VISIBLE_ITEMS: string;
17
+ INITIALIZE: string;
17
18
  RESET: string;
18
19
  };
19
20
  /**
package/lib/cjs/utils/widget.js CHANGED
@@ -18,6 +18,7 @@ exports.actionWidgetTypes = {
18
18
  LOAD_PREVIOUS_FAILURE: '_load_previous_failure',
19
19
  SET_RESULTS: '_set_results',
20
20
  SET_VISIBLE_ITEMS: '_set_visible_items',
21
+ INITIALIZE: '_initialize',
21
22
  RESET: '_reset'
22
23
  };
23
24
  /**
@@ -56,6 +57,9 @@ function dataWidgetReducer(state, action) {
56
57
  case exports.actionWidgetTypes.RESET:
57
58
  _state = { isLoadingNext: false, next: null, results: [], count: 0, errorLoadNext: null, initialized: false };
58
59
  break;
60
+ case exports.actionWidgetTypes.INITIALIZE:
61
+ _state = Object.assign({ isLoadingNext: false, next: null, results: [], count: 0, errorLoadNext: null, initialized: false }, action.payload);
62
+ break;
59
63
  }
60
64
  utils_1.LRUCache.set(_state.cacheKey, _state);
61
65
  return _state;
package/lib/esm/components/EventMediaWidget/EventMediaWidget.d.ts CHANGED
@@ -28,6 +28,10 @@ export interface EventMediaWidgetProps extends WidgetProps {
28
28
  * @default {}
29
29
  */
30
30
  dialogProps?: BaseDialogProps;
31
+ /**
32
+ * Limit results
33
+ * @default 10
34
+ */
31
35
  limit?: number;
32
36
  /**
33
37
  * Other props
package/lib/esm/components/EventMediaWidget/EventMediaWidget.js CHANGED
@@ -6,7 +6,7 @@ import { styled } from '@mui/material/styles';
6
6
  import { Box, useThemeProps } from '@mui/system';
7
7
  import { Endpoints, EventService, http } from '@selfcommunity/api-services';
8
8
  import { SCCache, useSCFetchEvent, useSCUser } from '@selfcommunity/react-core';
9
- import { Logger } from '@selfcommunity/utils';
9
+ import { CacheStrategies, Logger } from '@selfcommunity/utils';
10
10
  import { Fragment, useCallback, useEffect, useMemo, useReducer, useState } from 'react';
11
11
  import { defineMessages, FormattedMessage, useIntl } from 'react-intl';
12
12
  import { SCOPE_SC_UI } from '../../constants/Errors';
@@ -67,12 +67,17 @@ export default function EventMediaWidget(inProps) {
67
67
  const { event, eventId, limit = DEFAULT_PAGINATION_LIMIT, endpointQueryParams = {
68
68
  limit,
69
69
  offset: DEFAULT_PAGINATION_OFFSET
70
- }, cacheStrategy, dialogProps } = props, rest = __rest(props, ["event", "eventId", "limit", "endpointQueryParams", "cacheStrategy", "dialogProps"]);
70
+ }, cacheStrategy = CacheStrategies.CACHE_FIRST, dialogProps } = props, rest = __rest(props, ["event", "eventId", "limit", "endpointQueryParams", "cacheStrategy", "dialogProps"]);
71
+ // HOOKS
72
+ const { scEvent } = useSCFetchEvent({ id: eventId, event });
73
+ const intl = useIntl();
74
+ const theme = useTheme();
75
+ const isMobile = useMediaQuery(theme.breakpoints.down('md'));
71
76
  // STATE
72
77
  const [state, dispatch] = useReducer(dataWidgetReducer, {
73
78
  isLoadingNext: false,
74
79
  next: null,
75
- cacheKey: SCCache.getWidgetStateCacheKey(SCCache.EVENT_MEDIA_STATE_CACHE_PREFIX_KEY),
80
+ cacheKey: SCCache.getWidgetStateCacheKey(SCCache.EVENT_MEDIA_STATE_CACHE_PREFIX_KEY, event ? event.id : eventId),
76
81
  cacheStrategy,
77
82
  visibleItems: limit
78
83
  }, stateWidgetInitializer);
@@ -86,11 +91,6 @@ export default function EventMediaWidget(inProps) {
86
91
  const [showSkeleton, setShowSkeleton] = useState(null);
87
92
  // CONTEXT
88
93
  const scUserContext = useSCUser();
89
- // HOOKS
90
- const { scEvent } = useSCFetchEvent({ id: eventId, event });
91
- const intl = useIntl();
92
- const theme = useTheme();
93
- const isMobile = useMediaQuery(theme.breakpoints.down('md'));
94
94
  // CONSTS
95
95
  const hasAllow = useMemo(() => { var _a; return ((_a = scUserContext.user) === null || _a === void 0 ? void 0 : _a.id) === (scEvent === null || scEvent === void 0 ? void 0 : scEvent.managed_by.id); }, [scUserContext, scEvent]);
96
96
  const countHiddenMedia = useMemo(() => mediasCount - MEDIAS_TO_SHOW, [mediasCount]);
@@ -112,7 +112,7 @@ export default function EventMediaWidget(inProps) {
112
112
  Logger.error(SCOPE_SC_UI, error);
113
113
  });
114
114
  }
115
- }, [state.isLoadingNext, state.initialized, scEvent, dispatch, setMedias, setMediasCount]);
115
+ }, [state.isLoadingNext, scEvent, dispatch, setMedias, setMediasCount]);
116
116
  const _fetchNext = useCallback((index) => {
117
117
  if (mediasCount > medias.length && index >= 6 && !state.isLoadingNext && state.next) {
118
118
  setPreview(index);
@@ -214,9 +214,17 @@ export default function EventMediaWidget(inProps) {
214
214
  _t = setTimeout(_initComponent);
215
215
  return () => {
216
216
  clearTimeout(_t);
217
+ if (state.initialized) {
218
+ dispatch({
219
+ type: actionWidgetTypes.INITIALIZE,
220
+ payload: {
221
+ cacheKey: SCCache.getWidgetStateCacheKey(SCCache.EVENT_MEDIA_STATE_CACHE_PREFIX_KEY, scEvent.id)
222
+ }
223
+ });
224
+ }
217
225
  };
218
226
  }
219
- }, [scUserContext.user, scEvent]);
227
+ }, [scUserContext.user, scEvent, state.initialized]);
220
228
  useEffect(() => {
221
229
  if (isMobile && openDialog && state.next) {
222
230
  handleNext();
package/lib/esm/components/EventMembersWidget/EventMembersWidget.js CHANGED
@@ -97,7 +97,7 @@ export default function EventMembersWidget(inProps) {
97
97
  Logger.error(SCOPE_SC_UI, error);
98
98
  });
99
99
  }
100
- }, [participants.isLoadingNext, participants.initialized, scEvent]);
100
+ }, [participants.isLoadingNext, participants.initialized, scEvent, dispatchParticipants, setParticipantsCount]);
101
101
  const _initInvited = useCallback(() => {
102
102
  if (!invited.initialized && !invited.isLoadingNext && hasAllow) {
103
103
  dispatchInvited({ type: actionWidgetTypes.LOADING_NEXT });
@@ -111,7 +111,7 @@ export default function EventMembersWidget(inProps) {
111
111
  Logger.error(SCOPE_SC_UI, error);
112
112
  });
113
113
  }
114
- }, [invited.isLoadingNext, invited.initialized, scUserContext.user, scEvent]);
114
+ }, [invited.isLoadingNext, invited.initialized, scEvent, dispatchInvited, setInvitedCount]);
115
115
  const _initRequests = useCallback(() => {
116
116
  if (!requests.initialized && !requests.isLoadingNext && hasAllow) {
117
117
  dispatchRequests({ type: actionWidgetTypes.LOADING_NEXT });
@@ -126,7 +126,7 @@ export default function EventMembersWidget(inProps) {
126
126
  Logger.error(SCOPE_SC_UI, error);
127
127
  });
128
128
  }
129
- }, [requests.isLoadingNext, requests.initialized, scUserContext.user, scEvent]);
129
+ }, [requests.isLoadingNext, requests.initialized, scEvent, dispatchRequests, setRequestsCount, setRequestsUsers]);
130
130
  // EFFECTS
131
131
  useEffect(() => {
132
132
  let _t;
@@ -148,6 +148,30 @@ export default function EventMembersWidget(inProps) {
148
148
  });
149
149
  return () => {
150
150
  clearTimeout(_t);
151
+ if (participants.initialized) {
152
+ dispatchParticipants({
153
+ type: actionWidgetTypes.INITIALIZE,
154
+ payload: {
155
+ cacheKey: SCCache.getWidgetStateCacheKey(SCCache.USER_PARTECIPANTS_EVENTS_STATE_CACHE_PREFIX_KEY, scEvent.id)
156
+ }
157
+ });
158
+ }
159
+ if (invited.initialized) {
160
+ dispatchParticipants({
161
+ type: actionWidgetTypes.INITIALIZE,
162
+ payload: {
163
+ cacheKey: SCCache.getWidgetStateCacheKey(SCCache.USER_INVITED_EVENTS_STATE_CACHE_PREFIX_KEY, scEvent.id)
164
+ }
165
+ });
166
+ }
167
+ if (requests.initialized) {
168
+ dispatchParticipants({
169
+ type: actionWidgetTypes.INITIALIZE,
170
+ payload: {
171
+ cacheKey: SCCache.getWidgetStateCacheKey(SCCache.USER_REQUESTS_EVENTS_STATE_CACHE_PREFIX_KEY, scEvent.id)
172
+ }
173
+ });
174
+ }
151
175
  };
152
176
  }
153
177
  }, [scUserContext.user, scEvent, refresh]);
package/lib/esm/utils/widget.d.ts CHANGED
@@ -14,6 +14,7 @@ export declare const actionWidgetTypes: {
14
14
  LOAD_PREVIOUS_FAILURE: string;
15
15
  SET_RESULTS: string;
16
16
  SET_VISIBLE_ITEMS: string;
17
+ INITIALIZE: string;
17
18
  RESET: string;
18
19
  };
19
20
  /**
package/lib/esm/utils/widget.js CHANGED
@@ -15,6 +15,7 @@ export const actionWidgetTypes = {
15
15
  LOAD_PREVIOUS_FAILURE: '_load_previous_failure',
16
16
  SET_RESULTS: '_set_results',
17
17
  SET_VISIBLE_ITEMS: '_set_visible_items',
18
+ INITIALIZE: '_initialize',
18
19
  RESET: '_reset'
19
20
  };
20
21
  /**
@@ -53,6 +54,9 @@ export function dataWidgetReducer(state, action) {
53
54
  case actionWidgetTypes.RESET:
54
55
  _state = { isLoadingNext: false, next: null, results: [], count: 0, errorLoadNext: null, initialized: false };
55
56
  break;
57
+ case actionWidgetTypes.INITIALIZE:
58
+ _state = Object.assign({ isLoadingNext: false, next: null, results: [], count: 0, errorLoadNext: null, initialized: false }, action.payload);
59
+ break;
56
60
  }
57
61
  LRUCache.set(_state.cacheKey, _state);
58
62
  return _state;