@selfcommunity/react-ui 0.1.2-alpha.0 → 0.1.2-alpha.11

package/lib/cjs/components/CommentsObject/Skeleton.js

@@ -29,7 +29,7 @@ const Root = (0, _styles.styled)(_material.Box)(({
   width: '100%'
 }));
 /**
- * > API documentation for the Community-UI Comments Object Skeleton component. Learn about the available props and the CSS API.
+ * > API documentation for the Community-JS Comments Object Skeleton component. Learn about the available props and the CSS API.
 
  #### Import
 

package/lib/cjs/components/Composer/Audience/Audience.js

@@ -11,8 +11,6 @@ var _Autocomplete = _interopRequireDefault(require("@mui/material/Autocomplete")
 
 var _TextField = _interopRequireDefault(require("@mui/material/TextField"));
 
-var _CircularProgress = _interopRequireDefault(require("@mui/material/CircularProgress"));
-
 var _Checkbox = _interopRequireDefault(require("@mui/material/Checkbox"));
 
 var _parse = _interopRequireDefault(require("autosuggest-highlight/parse"));
@@ -21,13 +19,11 @@ var _match = _interopRequireDefault(require("autosuggest-highlight/match"));
 
 var _styles = require("@mui/material/styles");
 
-var _apiServices = require("@selfcommunity/api-services");
-
 var _TagChip = _interopRequireDefault(require("../../../shared/TagChip"));
 
 var _useThemeProps = _interopRequireDefault(require("@mui/material/styles/useThemeProps"));
 
-const _excluded = ["onChange", "defaultValue", "limitCountTags", "checkboxSelect", "disabled", "TextFieldProps"];
+const _excluded = ["onChange", "defaultValue", "limitCountTags", "checkboxSelect", "disabled", "TextFieldProps", "tags"];
 
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 
@@ -70,31 +66,14 @@ function _default(inProps) {
         id: "ui.composer.audience.tags.label",
         defaultMessage: "ui.composer.audience.tags.label"
       })
-    }
+    },
+    tags = []
   } = props,
         rest = _objectWithoutPropertiesLoose(props, _excluded); // State
 
 
-  const [isLoading, setIsLoading] = (0, _react.useState)(false);
   const [open, setOpen] = (0, _react.useState)(false);
-  const [tags, setTags] = (0, _react.useState)([]);
-  const [value, setValue] = (0, _react.useState)(defaultValue);
-
-  const load = () => {
-    _apiServices.http.request({
-      url: _apiServices.Endpoints.ComposerAddressingTagList.url(),
-      method: _apiServices.Endpoints.ComposerAddressingTagList.method
-    }).then(res => {
-      setTags(res.data);
-    }).then(() => setIsLoading(false));
-  }; // Component update
-
-
-  (0, _react.useEffect)(() => {
-    if (!isLoading && open && tags.length === 0) {
-      load();
-    }
-  }, [open]); // Handlers
+  const [value, setValue] = (0, _react.useState)(defaultValue); // Handlers
 
   const handleOpen = () => {
     setOpen(true);
@@ -175,10 +154,7 @@ function _default(inProps) {
         InputProps: Object.assign({}, params.InputProps, {
           autoComplete: 'addressing',
           // disable autocomplete and autofill
-          endAdornment: /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, isLoading ? /*#__PURE__*/_react.default.createElement(_CircularProgress.default, {
-            color: "inherit",
-            size: 20
-          }) : null, params.InputProps.endAdornment)
+          endAdornment: /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, params.InputProps.endAdornment)
         })
       }));
     }

package/lib/cjs/components/Composer/Composer.js

@@ -275,7 +275,7 @@ const reducer = (state, action) => {
   }
 };
 /**
- > API documentation for the Community-UI Composer component. Learn about the available props and the CSS API.
+ > API documentation for the Community-JS Composer component. Learn about the available props and the CSS API.
  > The Composer component contains the logic around the creation of [Post](https://developers.selfcommunity.com/docs/apireference/v2/post/create_a_post) and [Discussion](https://developers.selfcommunity.com/docs/apireference/v2/discussion/create_a_discussion) objects.
  *
  #### Import
@@ -340,7 +340,13 @@ function Composer(inProps) {
   const scAuthContext = (0, _react.useContext)(_reactCore.SCUserContext);
   const {
     enqueueSnackbar
-  } = (0, _notistack.useSnackbar)(); // State variables
+  } = (0, _notistack.useSnackbar)(); // HOOKS
+
+  const {
+    scAddressingTags
+  } = (0, _reactCore.useSCFetchAddressingTagList)({
+    fetch: rest.open
+  }); // State variables
 
   const [fades, setFades] = (0, _react.useState)({});
   const [isSubmitting, setIsSubmitting] = (0, _react.useState)(false);
@@ -741,10 +747,12 @@ function Composer(inProps) {
         value: (0, _apiServices.formatHttpError)(error)
       });
     }).then(() => setIsSubmitting(false));
-  };
-  /* Renderers */
+  }; // RENDER
 
 
+  const theme = (0, _styles.useTheme)();
+  const smDown = (0, _material.useMediaQuery)(theme.breakpoints.down('sm'));
+  const fullScreen = (0, _material.useMediaQuery)(theme.breakpoints.down('md'));
   const hasMediaShare = (0, _react.useMemo)(() => medias.findIndex(m => m.type === _Media.MEDIA_TYPE_SHARE) !== -1, [medias]);
 
   const renderMediaAdornment = mediaObjectType => {
@@ -786,7 +794,10 @@ function Composer(inProps) {
     })), /*#__PURE__*/_react.default.createElement(_material.Box, null, /*#__PURE__*/_react.default.createElement(_material.Avatar, {
       className: classes.avatar,
       src: scAuthContext.user.avatar
-    })), /*#__PURE__*/_react.default.createElement(_material.Box, null, /*#__PURE__*/_react.default.createElement(_material.Button, {
+    })), /*#__PURE__*/_react.default.createElement(_material.Box, null, smDown ? /*#__PURE__*/_react.default.createElement(_material.IconButton, {
+      onClick: handleChangeView(MAIN_VIEW),
+      color: "inherit"
+    }, /*#__PURE__*/_react.default.createElement(_Icon.default, null, "check")) : /*#__PURE__*/_react.default.createElement(_material.Button, {
       onClick: handleChangeView(MAIN_VIEW),
       variant: "text",
       color: "inherit"
@@ -835,7 +846,8 @@ function Composer(inProps) {
       }
     }, /*#__PURE__*/_react.default.createElement(_Audience.default, {
       onChange: handleChange('addressing'),
-      defaultValue: addressing
+      defaultValue: addressing,
+      tags: scAddressingTags
     })))));
   };
 
@@ -855,7 +867,11 @@ function Composer(inProps) {
       })), /*#__PURE__*/_react.default.createElement(_material.Box, null, /*#__PURE__*/_react.default.createElement(_material.Avatar, {
         className: classes.avatar,
         src: scAuthContext.user.avatar
-      })), /*#__PURE__*/_react.default.createElement(_material.Box, null, /*#__PURE__*/_react.default.createElement(_material.Button, {
+      })), /*#__PURE__*/_react.default.createElement(_material.Box, null, smDown ? /*#__PURE__*/_react.default.createElement(_material.IconButton, {
+        onClick: handleChangeView(MAIN_VIEW),
+        color: "inherit",
+        disabled: mediasRef.current.mediaChunks.length > 0
+      }, /*#__PURE__*/_react.default.createElement(_Icon.default, null, "check")) : /*#__PURE__*/_react.default.createElement(_material.Button, {
         onClick: handleChangeView(MAIN_VIEW),
         variant: "text",
         color: "inherit",
@@ -885,15 +901,23 @@ function Composer(inProps) {
       size: "small",
       disabled: !hasPoll()
     }, /*#__PURE__*/_react.default.createElement(_Icon.default, null, "arrow_back")), /*#__PURE__*/_react.default.createElement(_reactIntl.FormattedMessage, {
-      id: "ui.composer.poll.title",
-      defaultMessage: "ui.composer.poll.title"
+      id: "ui.composer.poll",
+      defaultMessage: "ui.composer.poll"
     })), /*#__PURE__*/_react.default.createElement(_material.Box, null, /*#__PURE__*/_react.default.createElement(_material.Avatar, {
       className: classes.avatar,
       src: scAuthContext.user.avatar
     })), /*#__PURE__*/_react.default.createElement(_material.Stack, {
       spacing: 2,
       direction: "row"
-    }, /*#__PURE__*/_react.default.createElement(_material.Button, {
+    }, smDown ? /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement(_material.IconButton, {
+      onClick: handleChangeView(MAIN_VIEW),
+      color: "inherit",
+      disabled: !hasPoll()
+    }, /*#__PURE__*/_react.default.createElement(_Icon.default, null, "check")), /*#__PURE__*/_react.default.createElement(_material.IconButton, {
+      onClick: handleChangeView(MAIN_VIEW),
+      color: "inherit",
+      disabled: !hasPoll()
+    }, /*#__PURE__*/_react.default.createElement(_Icon.default, null, "delete"))) : /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement(_material.Button, {
       onClick: handleDeletePoll,
       variant: "text",
       color: "inherit"
@@ -908,7 +932,7 @@ function Composer(inProps) {
     }, /*#__PURE__*/_react.default.createElement(_reactIntl.FormattedMessage, {
       id: "ui.composer.done",
       defaultMessage: "ui.composer.done"
-    })))), /*#__PURE__*/_react.default.createElement(_material.DialogContent, {
+    }))))), /*#__PURE__*/_react.default.createElement(_material.DialogContent, {
       className: classes.content
     }, /*#__PURE__*/_react.default.createElement(_Poll2.default, {
       onChange: handleChangePoll,
@@ -931,7 +955,10 @@ function Composer(inProps) {
     })), /*#__PURE__*/_react.default.createElement(_material.Box, null, /*#__PURE__*/_react.default.createElement(_material.Avatar, {
       className: classes.avatar,
       src: scAuthContext.user.avatar
-    })), /*#__PURE__*/_react.default.createElement(_material.Box, null, /*#__PURE__*/_react.default.createElement(_material.Button, {
+    })), /*#__PURE__*/_react.default.createElement(_material.Box, null, smDown ? /*#__PURE__*/_react.default.createElement(_material.IconButton, {
+      onClick: handleChangeView(MAIN_VIEW),
+      color: "inherit"
+    }, /*#__PURE__*/_react.default.createElement(_Icon.default, null, "check")) : /*#__PURE__*/_react.default.createElement(_material.Button, {
       onClick: handleChangeView(MAIN_VIEW),
       variant: "text",
       color: "inherit"
@@ -1055,9 +1082,7 @@ function Composer(inProps) {
       onClick: handleChangeView(POLL_VIEW)
     }, /*#__PURE__*/_react.default.createElement(_material.Badge, {
       className: classes.badgeError,
-      badgeContent: pollError ? /*#__PURE__*/_react.default.createElement(_Icon.default, {
-        fontSize: "small"
-      }, "error_outline") : null,
+      badgeContent: pollError ? ' ' : null,
       color: "error"
     }, /*#__PURE__*/_react.default.createElement(_Icon.default, null, "bar_chart")))), /*#__PURE__*/_react.default.createElement(_material.Typography, {
       align: "right"
@@ -1065,7 +1090,7 @@ function Composer(inProps) {
       disabled: isSubmitting,
       onClick: handleChangeView(LOCATION_VIEW),
       color: location !== null ? 'primary' : 'default'
-    }, /*#__PURE__*/_react.default.createElement(_Icon.default, null, "add_location_alt")), scPrefernces.features.includes(_reactCore.SCFeatures.USER_TAGGING) && /*#__PURE__*/_react.default.createElement(_material.IconButton, {
+    }, /*#__PURE__*/_react.default.createElement(_Icon.default, null, "add_location_alt")), scPrefernces.features.includes(_reactCore.SCFeatures.USER_TAGGING) && scAddressingTags.length > 0 && /*#__PURE__*/_react.default.createElement(_material.IconButton, {
       disabled: isSubmitting,
       onClick: handleChangeView(AUDIENCE_VIEW)
     }, audience === AUDIENCE_TAG ? /*#__PURE__*/_react.default.createElement(_Icon.default, null, "label") : /*#__PURE__*/_react.default.createElement(_Icon.default, null, "public")), /*#__PURE__*/_react.default.createElement(_LoadingButton.default, {
@@ -1119,9 +1144,6 @@ function Composer(inProps) {
     }));
   }
 
-  const theme = (0, _styles.useTheme)();
-  const fullScreen = (0, _material.useMediaQuery)(theme.breakpoints.down('md'));
-
   if (!scAuthContext.user) {
     return null;
   }

package/lib/cjs/components/Composer/Composer.stories.js

@@ -11,7 +11,7 @@ function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { de
 
 // More on default export: https://storybook.js.org/docs/react/writing-stories/introduction#default-export
 var _default = {
-  title: 'Design System/SC UI/Composer',
+  title: 'Design System/React UI/Composer',
   component: _index.default // More on argTypes: https://storybook.js.org/docs/react/api/argtypes
 
 }; // More on component templates: https://storybook.js.org/docs/react/writing-stories/introduction#using-args

package/lib/cjs/components/Composer/ComposerSkeleton.stories.js

@@ -10,7 +10,7 @@ var _Skeleton = _interopRequireDefault(require("./Skeleton"));
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 
 var _default = {
-  title: 'Design System/SC UI/Skeleton/Composer',
+  title: 'Design System/React UI/Skeleton/Composer',
   component: _Skeleton.default,
   argTypes: {},
   args: {}

package/lib/cjs/components/Composer/Poll/Poll.js

@@ -50,6 +50,7 @@ const localeMap = {
 const PREFIX = 'SCComposerPoll';
 const classes = {
   root: `${PREFIX}-root`,
+  generalError: `${PREFIX}-generalError`,
   title: `${PREFIX}-title`,
   choices: `${PREFIX}-choices`,
   choiceNew: `${PREFIX}-choice-new`,
@@ -63,6 +64,10 @@ const Root = (0, _styles.styled)(_material.Box, {
   theme
 }) => ({
   padding: theme.spacing(2),
+  [`& .${classes.generalError}`]: {
+    marginBottom: theme.spacing(2),
+    color: theme.palette.error.main
+  },
   [`& .${classes.title}, & .${classes.choices}, & .${classes.choiceNew}, & .${classes.metadata}`]: {
     marginBottom: theme.spacing(3)
   },
@@ -118,7 +123,8 @@ var _default = inProps => {
     onChange
   } = props;
   const {
-    titleError = null
+    titleError = null,
+    error: generalError = null
   } = Object.assign({}, error); // STATE
 
   const [title, setTitle] = (0, _react.useState)(value !== null ? value.title : DEFAULT_POLL.title);
@@ -186,7 +192,9 @@ var _default = inProps => {
   return /*#__PURE__*/_react.default.createElement(Root, {
     id: id,
     className: (0, _classnames.default)(classes.root, className)
-  }, /*#__PURE__*/_react.default.createElement(_material.Box, {
+  }, generalError && /*#__PURE__*/_react.default.createElement(_material.Typography, {
+    className: classes.generalError
+  }, generalError), /*#__PURE__*/_react.default.createElement(_material.Box, {
     className: classes.title
   }, /*#__PURE__*/_react.default.createElement(_material.TextField, {
     label: /*#__PURE__*/_react.default.createElement(_reactIntl.FormattedMessage, {

package/lib/cjs/components/Composer/Skeleton.js

@@ -74,7 +74,7 @@ const Root = (0, _styles.styled)(_material.Box, {
   }
 }));
 /**
- * > API documentation for the Community-UI Composer Skeleton component. Learn about the available props and the CSS API.
+ * > API documentation for the Community-JS Composer Skeleton component. Learn about the available props and the CSS API.
 
  #### Import
 

package/lib/cjs/components/ConnectionUserButton/ConnectionUserButton.js

@@ -42,7 +42,7 @@ const Root = (0, _styles.styled)(_material.Box, {
 }) => ({}));
 
 /**
- > API documentation for the Community-UI Connection User Button component. Learn about the available props and the CSS API.
+ > API documentation for the Community-JS Connection User Button component. Learn about the available props and the CSS API.
  *
  #### Import
  ```jsx

package/lib/cjs/components/CustomAdv/CustomAdv.js

@@ -36,7 +36,7 @@ const Root = (0, _styles.styled)(_material.Box, {
 }));
 
 /**
- > API documentation for the Community-UI CustomAdv component. Learn about the available props and the CSS API.
+ > API documentation for the Community-JS CustomAdv component. Learn about the available props and the CSS API.
  *
  #### Import
  ```jsx

package/lib/cjs/components/CustomAdv/CustomAdv.stories.js

@@ -11,7 +11,7 @@ function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { de
 
 // More on default export: https://storybook.js.org/docs/react/writing-stories/introduction#default-export
 var _default = {
-  title: 'Design System/SC UI/CustomAdv',
+  title: 'Design System/React UI/CustomAdv',
   component: _index.default // More on argTypes: https://storybook.js.org/docs/react/api/argtypes
 
 }; // More on component templates: https://storybook.js.org/docs/react/writing-stories/introduction#using-args

package/lib/cjs/components/CustomAdv/CustomAdvSkeleton.stories.js

@@ -11,7 +11,7 @@ function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { de
 
 // More on default export: https://storybook.js.org/docs/react/writing-stories/introduction#default-export
 var _default = {
-  title: 'Design System/SC UI/Skeleton/CustomAdv',
+  title: 'Design System/React UI/Skeleton/CustomAdv',
   component: _Skeleton.default // More on argTypes: https://storybook.js.org/docs/react/api/argtypes
 
 }; // More on component templates: https://storybook.js.org/docs/react/writing-stories/introduction#using-args

package/lib/cjs/components/CustomAdv/Skeleton.js

@@ -23,7 +23,7 @@ const Root = (0, _styles.styled)(_Skeleton.GenericSkeleton, {
   theme
 }) => ({}));
 /**
- * > API documentation for the Community-UI Custom Adv Skeleton component. Learn about the available props and the CSS API.
+ * > API documentation for the Community-JS Custom Adv Skeleton component. Learn about the available props and the CSS API.
 
  #### Import
 

package/lib/cjs/components/Editor/Editor.js

@@ -61,13 +61,7 @@ const Root = (0, _styles.styled)(_material.Box, {
     outline: 'none',
     minHeight: 60,
     '& > p': {
-      margin: theme.spacing(1, 0, 1, 0),
-      '&:first-child': {
-        marginTop: 0
-      },
-      '&:last-child': {
-        marginBottom: 0
-      }
+      margin: theme.spacing(1, 0, 1, 0)
     },
     '& img': {
       margin: theme.spacing(1, 0, 1, 0),
@@ -143,7 +137,7 @@ const Root = (0, _styles.styled)(_material.Box, {
 }));
 
 /**
- * > API documentation for the Community-UI Editor component. Learn about the available props and the CSS API.
+ * > API documentation for the Community-JS Editor component. Learn about the available props and the CSS API.
 
  #### Import
 

package/lib/cjs/components/Editor/Editor.stories.js

@@ -11,7 +11,7 @@ function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { de
 
 // More on default export: https://storybook.js.org/docs/react/writing-stories/introduction#default-export
 var _default = {
-  title: 'Design System/SC UI/Editor',
+  title: 'Design System/React UI/Editor',
   component: _index.default // More on argTypes: https://storybook.js.org/docs/react/api/argtypes
 
 }; // More on component templates: https://storybook.js.org/docs/react/writing-stories/introduction#using-args

package/lib/cjs/components/Editor/EditorSkeleton.stories.js

@@ -11,7 +11,7 @@ function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { de
 
 // More on default export: https://storybook.js.org/docs/react/writing-stories/introduction#default-export
 var _default = {
-  title: 'Design System/SC UI/Skeleton/Editor',
+  title: 'Design System/React UI/Skeleton/Editor',
   component: _Skeleton.default // More on argTypes: https://storybook.js.org/docs/react/api/argtypes
 
 }; // More on component templates: https://storybook.js.org/docs/react/writing-stories/introduction#using-args

package/lib/cjs/components/Editor/Skeleton.js

@@ -23,7 +23,7 @@ const Root = (0, _styles.styled)(_Skeleton.GenericSkeleton, {
   theme
 }) => ({}));
 /**
- * > API documentation for the Community-UI Editor Skeleton component. Learn about the available props and the CSS API.
+ * > API documentation for the Community-JS Editor Skeleton component. Learn about the available props and the CSS API.
 
  #### Import
 

package/lib/cjs/components/Editor/plugins/ImagePlugin.js

@@ -143,7 +143,6 @@ function ImagePlugin() {
 
         const imageNode = (0, _ImageNode.$createImageNode)(payload.src, payload.altText, '100%');
         selection.insertNodes([imageNode]);
-        console.log('image');
       }
 
       return true;

package/lib/cjs/components/Feed/Feed.js

@@ -35,6 +35,8 @@ var _pubsubJs = _interopRequireDefault(require("pubsub-js"));
 
 var _useThemeProps = _interopRequireDefault(require("@mui/material/styles/useThemeProps"));
 
+var _url = require("../../utils/url");
+
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 
 function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function (nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
@@ -75,7 +77,7 @@ const Root = (0, _styles.styled)(_material.Grid, {
 }));
 const PREFERENCES = [_reactCore.SCPreferences.ADVERTISING_CUSTOM_ADV_ENABLED, _reactCore.SCPreferences.ADVERTISING_CUSTOM_ADV_ONLY_FOR_ANONYMOUS_USERS_ENABLED];
 /**
- * > API documentation for the Community-UI Feed component. Learn about the available props and the CSS API.
+ * > API documentation for the Community-JS Feed component. Learn about the available props and the CSS API.
 
  #### Import
 
@@ -110,6 +112,9 @@ const Feed = (inProps, ref) => {
     id = 'feed',
     className,
     endpoint,
+    endpointQueryParams = [{
+      limit: 5
+    }],
     endMessage = /*#__PURE__*/_react.default.createElement(_reactIntl.FormattedMessage, {
       id: "ui.feed.noOtherFeedObject",
       defaultMessage: "ui.feed.noOtherFeedObject"
@@ -134,8 +139,8 @@ const Feed = (inProps, ref) => {
   } = props; // STATE
 
   const [feedData, setFeedData] = (0, _react.useState)([]);
-  const [loading, setLoading] = (0, _react.useState)(true);
-  const [next, setNext] = (0, _react.useState)(endpoint.url({})); // CONTEXT
+  const [loading, setLoading] = (0, _react.useState)(false);
+  const [next, setNext] = (0, _react.useState)((0, _url.appendURLSearchParams)(endpoint.url({}), endpointQueryParams)); // CONTEXT
 
   const scPreferences = (0, _reactCore.useSCPreferences)();
   const scUserContext = (0, _react.useContext)(_reactCore.SCUserContext); // CONST
@@ -190,20 +195,22 @@ const Feed = (inProps, ref) => {
 
 
   const fetch = () => {
-    setLoading(true);
-
-    _apiServices.http.request({
-      url: next,
-      method: endpoint.method
-    }).then(res => {
-      const data = res.data;
-      setFeedData([...feedData, ...data.results]);
-      setNext(data.next);
-      setLoading(false);
-      onFetchData && onFetchData(res.data);
-    }).catch(error => {
-      _reactCore.Logger.error(_Errors.SCOPE_SC_UI, error);
-    });
+    if (!loading) {
+      setLoading(true);
+
+      _apiServices.http.request({
+        url: next,
+        method: endpoint.method
+      }).then(res => {
+        const data = res.data;
+        setFeedData([...feedData, ...data.results]);
+        setNext(data.next);
+        setLoading(false);
+        onFetchData && onFetchData(res.data);
+      }).catch(error => {
+        _reactCore.Logger.error(_Errors.SCOPE_SC_UI, error);
+      });
+    }
   };
 
   const refresh = () => {
@@ -237,7 +244,7 @@ const Feed = (inProps, ref) => {
 
   const theme = (0, _styles.useTheme)();
   const oneColLayout = (0, _material.useMediaQuery)(theme.breakpoints.down('md'));
-  const getData = (0, _react.useCallback)(() => {
+  const getData = (0, _react.useMemo)(() => () => {
     const widgetSort = (w1, w2) => w1.position > w2.position ? 1 : -1;
 
     const widgetReducer = (value, w) => {
@@ -250,7 +257,7 @@ const Feed = (inProps, ref) => {
         left: _widgets.map(w => Object.assign({}, w, {
           position: w.position * (w.column === 'right' ? 5 : 1)
         })).sort(widgetSort).reduce(widgetReducer, [...feedData, ...(loading ? Array.from({
-          length: 5
+          length: 3
         }).map(() => ({
           type: 'widget',
           component: ItemSkeleton,
@@ -261,7 +268,7 @@ const Feed = (inProps, ref) => {
     } else {
       return {
         left: _widgets.filter(w => w.column === 'left').sort(widgetSort).reduce(widgetReducer, [...feedData, ...(loading ? Array.from({
-          length: 5
+          length: 3
         }).map(() => ({
           type: 'widget',
           component: ItemSkeleton,
@@ -281,14 +288,12 @@ const Feed = (inProps, ref) => {
     item: true,
     xs: 12,
     md: 7
-  }, /*#__PURE__*/_react.default.createElement(_react.default.Suspense, {
-    fallback: /*#__PURE__*/_react.default.createElement(ItemSkeleton, ItemSkeletonProps)
   }, /*#__PURE__*/_react.default.createElement(_reactInfiniteScrollComponent.default, {
     className: classes.left,
     dataLength: data.left.length,
     next: fetch,
     hasMore: Boolean(next),
-    loader: false,
+    loader: /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null),
     endMessage: /*#__PURE__*/_react.default.createElement(_Widget.default, {
       className: classes.end
     }, /*#__PURE__*/_react.default.createElement(_material.CardContent, null, endMessage)),
@@ -313,7 +318,7 @@ const Feed = (inProps, ref) => {
     sx: {
       width: '100%'
     }
-  })))))), data.right.length > 0 && /*#__PURE__*/_react.default.createElement(_material.Hidden, {
+  }))))), data.right.length > 0 && /*#__PURE__*/_react.default.createElement(_material.Hidden, {
     smDown: true
   }, /*#__PURE__*/_react.default.createElement(_material.Grid, {
     item: true,

package/lib/cjs/components/Feed/Feed.stories.js

@@ -29,7 +29,7 @@ function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { de
 
 // More on default export: https://storybook.js.org/docs/react/writing-stories/introduction#default-export
 var _default = {
-  title: 'Design System/SC UI/Feed',
+  title: 'Design System/React UI/Feed',
   component: _index.default
 }; // More on component templates: https://storybook.js.org/docs/react/writing-stories/introduction#using-args
 

package/lib/cjs/components/Feed/FeedSkeleton.stories.js

@@ -10,7 +10,7 @@ var _Skeleton = _interopRequireDefault(require("./Skeleton"));
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 
 var _default = {
-  title: 'Design System/SC UI/Skeleton/Feed',
+  title: 'Design System/React UI/Skeleton/Feed',
   component: _Skeleton.default,
   argTypes: {},
   args: {}

package/lib/cjs/components/Feed/Skeleton.js

@@ -35,7 +35,7 @@ const Root = (0, _styles.styled)(_material.Grid, {
 }));
 
 /**
- * > API documentation for the Community-UI Feed Skeleton component. Learn about the available props and the CSS API.
+ * > API documentation for the Community-JS Feed Skeleton component. Learn about the available props and the CSS API.
 
  #### Import
 

package/lib/cjs/components/FeedObject/Actions/Share/Share.js

@@ -194,6 +194,9 @@ function Share(inProps) {
 
 
   function handleComposerOnSuccess() {
+    setObj(Object.assign({}, obj, {
+      share_count: obj.share_count + 1
+    }));
     handleComposerOnClose();
   }
   /**

package/lib/cjs/components/FeedObject/Contributors/ContributorsFeedObject.stories.js

@@ -13,7 +13,7 @@ function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { de
 
 // More on default export: https://storybook.js.org/docs/react/writing-stories/introduction#default-export
 var _default = {
-  title: 'Design System/SC UI/ContributorsFeedObject',
+  title: 'Design System/React UI/ContributorsFeedObject',
   component: _index.default,
   argTypes: {
     feedObjectId: {