"use strict";

exports.__esModule = true;
exports.default = FeedObject;

var _react = _interopRequireWildcard(require("react"));

var _styles = require("@mui/material/styles");

var _Card = _interopRequireDefault(require("@mui/material/Card"));

var _CardContent = _interopRequireDefault(require("@mui/material/CardContent"));

var _material = require("@mui/material");

var _Skeleton = _interopRequireDefault(require("./Skeleton"));

var _DateTimeAgo = _interopRequireDefault(require("../../shared/DateTimeAgo"));

var _Bullet = _interopRequireDefault(require("../../shared/Bullet"));

var _Tags = _interopRequireDefault(require("../../shared/Tags"));

var _MediasPreview = _interopRequireDefault(require("../../shared/MediasPreview"));

var _ReportingFlagMenu = _interopRequireDefault(require("../../shared/ReportingFlagMenu"));

var _Actions = _interopRequireDefault(require("./Actions"));

var _Public = _interopRequireDefault(require("@mui/icons-material/Public"));

var _reactIntl = require("react-intl");

var _Poll = _interopRequireDefault(require("./Poll"));

var _Contributors = _interopRequireDefault(require("./Contributors"));

var _reactLazyload = _interopRequireDefault(require("react-lazyload"));

var _EditOutlined = _interopRequireDefault(require("@mui/icons-material/EditOutlined"));

var _core = require("@selfcommunity/core");

var _Composer = _interopRequireDefault(require("../Composer"));

var _CommentsObject = _interopRequireDefault(require("../CommentsObject"));

var _ActivitiesMenu = _interopRequireDefault(require("./ActivitiesMenu"));

var _comments = require("../../types/comments");

var _feedObject = require("../../types/feedObject");

var _RelevantActivities = _interopRequireDefault(require("./RelevantActivities"));

var _ReplyComment = _interopRequireDefault(require("../CommentObject/ReplyComment"));

var _lab = require("@mui/lab");

var _Errors = require("../../constants/Errors");

const _excluded = ["id", "className", "feedObjectId", "feedObject", "feedObjectType", "feedObjectActivities", "template", "hideShareAction", "hideFollowAction", "hideParticipantsPreview"];

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); }

function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }

function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }

function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }

const messages = (0, _reactIntl.defineMessages)({
  comment: {
    id: 'ui.feedObject.comment',
    defaultMessage: 'ui.feedObject.comment'
  },
  visibleToAll: {
    id: 'ui.feedObject.visibleToAll',
    defaultMessage: 'ui.feedObject.visibleToAll'
  }
});
const PREFIX = 'SCFeedObject';
const classes = {
  title: `${PREFIX}-title`,
  username: `${PREFIX}-username`,
  category: `${PREFIX}-category`,
  content: `${PREFIX}-content`,
  text: `${PREFIX}-text`,
  snippetContent: `${PREFIX}-snippet-content`,
  tag: `${PREFIX}-tag`,
  activitiesContent: `${PREFIX}-activities-content`,
  followButton: `${PREFIX}-follow-button`,
  activityAt: `${PREFIX}-activity-at`,
  sharedContentFeedObject: `${PREFIX}-shared-content-feed-object`
};
const Root = (0, _styles.styled)(_Card.default, {
  name: PREFIX,
  slot: 'Root',
  overridesResolver: (props, styles) => styles.root
})(({
  theme
}) => ({
  marginBottom: theme.spacing(2),
  [`& .${PREFIX}-share`]: {
    backgroundColor: '#f8f8f8'
  },
  [`& .${classes.title}`]: {
    fontWeight: 600,
    color: '#3e3e3e'
  },
  [`& .${classes.username}`]: {
    color: '#000',
    fontWeight: 600,
    fontSize: '15px',
    textDecoration: 'none'
  },
  [`& .${classes.category}`]: {
    textAlign: 'center',
    color: '#939598',
    borderBottom: '1px solid rgba(0, 0, 0, 0.12)',
    '& a': {
      textDecoration: 'none',
      color: '#3e3e3e'
    },
    '& a::after': {
      content: '"\\2022"',
      padding: theme.spacing()
    },
    '& a:last-child::after': {
      display: 'none'
    }
  },
  [`& .${classes.content}`]: {
    paddingTop: 0,
    paddingBottom: 0
  },
  [`& .${classes.text}`]: {
    padding: '5px 1px',
    marginBottom: 0
  },
  [`& .${classes.snippetContent}`]: {
    textDecoration: 'none',
    color: '#3e3e3e'
  },
  [`& .${classes.tag}`]: {
    display: 'inline-block',
    position: 'relative',
    top: 3
  },
  [`& .${classes.activitiesContent}`]: {
    paddingBottom: '3px'
  },
  [`& .${classes.followButton}`]: {
    backgroundColor: theme.palette.grey[100],
    color: theme.palette.grey[700],
    boxShadow: 'none',
    '&:hover': {
      backgroundColor: theme.palette.grey[300],
      boxShadow: 'none'
    }
  },
  [`& .${classes.activityAt}`]: {
    textDecoration: 'none',
    color: '#939598'
  },
  [`& .${classes.sharedContentFeedObject}`]: {
    textDecoration: 'none',
    color: theme.palette.grey[700]
  },
  '& .MuiSvgIcon-root': {
    width: '0.7em',
    marginBottom: '0.5px'
  }
}));

function FeedObject(props) {
  // PROPS
  const {
    id = `feed_object_${props.feedObjectType}_${props.feedObjectId ? props.feedObjectId : props.feedObject ? props.feedObject.id : ''}`,
    className = null,
    feedObjectId = null,
    feedObject = null,
    feedObjectType = _core.SCFeedObjectTypologyType.POST,
    feedObjectActivities = null,
    template = _feedObject.FeedObjectTemplateType.PREVIEW,
    hideShareAction = false,
    hideFollowAction = false,
    hideParticipantsPreview = false
  } = props,
        rest = _objectWithoutPropertiesLoose(props, _excluded); // CONTEXT


  const scContext = (0, _core.useSCContext)();
  const scRoutingContext = (0, _core.useSCRouting)();
  const scUserContext = (0, _core.useSCUser)(); // RETRIVE OBJECTS

  const {
    obj,
    setObj
  } = (0, _core.useSCFetchFeedObject)({
    id: feedObjectId,
    feedObject,
    feedObjectType
  }); // STATE

  const [composerOpen, setComposerOpen] = (0, _react.useState)(false);
  const [comments, setComments] = (0, _react.useState)([]);
  const [expandedActivities, setExpandedActivities] = (0, _react.useState)(getInitialExpandedActivities());
  const [selectedActivities, setSelectedActivities] = (0, _react.useState)(getInitialSelectedActivitiesType());
  const [isReplying, setIsReplying] = (0, _react.useState)(false);
  const [isFollowing, setIsFollowing] = (0, _react.useState)(false); // INTL

  const intl = (0, _reactIntl.useIntl)();
  /**
   * Set:
   * - expandedActivities
   * - selectedActivities
   * when update the current obj
   */

  (0, _react.useEffect)(() => {
    if (obj) {
      setExpandedActivities(getInitialExpandedActivities());
    }
  }, [obj]);
  /**
   * Get initial expanded activities
   */

  function getInitialExpandedActivities() {
    return obj && (feedObjectActivities && feedObjectActivities.length > 0 || obj.comment_count > 0);
  }
  /**
   * Get initial selected activities section
   */


  function getInitialSelectedActivitiesType() {
    if (feedObjectActivities && feedObjectActivities.length > 0) {
      return _feedObject.FeedObjectActivitiesType.RELEVANCE_ACTIVITIES;
    }

    return _feedObject.FeedObjectActivitiesType.RECENT_COMMENTS;
  }
  /**
   * Handle change/update poll: votes
   */


  function handleChangePoll(pollObject) {
    const newObj = obj;
    obj['poll'] = pollObject;
    setObj(newObj);
  }
  /**
   * Render header action
   * if author = authenticated user -> render edit action
   * else render ReportingMenu
   */


  function renderHeaderAction() {
    if (scUserContext.user && scUserContext.user.id === obj.author.id) {
      return /*#__PURE__*/_react.default.createElement(_material.IconButton, {
        "aria-haspopup": "true",
        onClick: handleToggleEdit,
        size: "medium"
      }, /*#__PURE__*/_react.default.createElement(_EditOutlined.default, null));
    }

    return /*#__PURE__*/_react.default.createElement(_ReportingFlagMenu.default, {
      feedObject: obj,
      feedObjectType: feedObjectType
    });
  }
  /**
   * Handle initial edit
   * Open composer
   */


  function handleToggleEdit() {
    setComposerOpen(prev => !prev);
  }
  /**
   * handle edit success
   */


  function handleEditSuccess(data) {
    setObj(data);
    setComposerOpen(false);
  }
  /**
   * Perform follow/unfollow
   * Post, Discussion, Status
   */


  const performFollow = (0, _react.useMemo)(() => () => {
    return _core.http.request({
      url: _core.Endpoints.FollowContribution.url({
        type: feedObjectType,
        id: obj.id
      }),
      method: _core.Endpoints.FollowContribution.method
    }).then(res => {
      if (res.status >= 300) {
        return Promise.reject(res);
      }

      return Promise.resolve(res.data);
    });
  }, [obj]);
  /**
   * Handle follow object
   */

  function handleFollow() {
    setIsFollowing(true);
    performFollow().then(data => {
      setObj(Object.assign({}, obj, {
        followed: !obj.followed
      }));
      setIsFollowing(false);
    }).catch(error => {
      _core.Logger.error(_Errors.SCOPE_SC_UI, error);
    });
  }
  /**
   * Handle change activities type
   * @param type
   */


  function handleSelectActivitiesType(type) {
    setComments([]);
    setSelectedActivities(type);
  }
  /**
   * Perform reply
   * Comment of first level
   */


  const performReply = (0, _react.useMemo)(() => comment => {
    return _core.http.request({
      url: _core.Endpoints.NewComment.url({}),
      method: _core.Endpoints.NewComment.method,
      data: {
        [`${feedObjectType}`]: obj.id,
        text: comment
      }
    }).then(res => {
      if (res.status >= 300) {
        return Promise.reject(res);
      }

      return Promise.resolve(res.data);
    });
  }, [obj]);
  /**
   * Handle comment
   */

  function handleReply(comment) {
    setIsReplying(true);
    performReply(comment).then(data => {
      if (selectedActivities !== _feedObject.FeedObjectActivitiesType.RECENT_COMMENTS || obj.comment_count === 0) {
        setObj(Object.assign({}, obj, {
          comment_count: obj.comment_count + 1
        }));
        setComments([]);
        setSelectedActivities(_feedObject.FeedObjectActivitiesType.RECENT_COMMENTS);
      } else {
        setComments([...[data], ...comments]);
      }

      setIsReplying(false);
    }).catch(error => {
      _core.Logger.error(_Errors.SCOPE_SC_UI, error);
    });
  }
  /**
   * Render collapsed activities of the single feedObject
   */


  function renderActivities() {
    return /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, scUserContext.user && /*#__PURE__*/_react.default.createElement(_ReplyComment.default, {
      inline: true,
      variant: 'outlined',
      onReply: handleReply,
      isLoading: isReplying,
      key: Number(isReplying)
    }), (obj.comment_count || feedObjectActivities || comments.length > 0) && /*#__PURE__*/_react.default.createElement(_ActivitiesMenu.default, {
      selectedActivities: selectedActivities,
      hideRelevantActivitiesItem: !(feedObjectActivities && feedObjectActivities.length > 0),
      onChange: handleSelectActivitiesType
    }), selectedActivities === _feedObject.FeedObjectActivitiesType.RELEVANCE_ACTIVITIES ? renderRelevantActivities() : renderComments());
  }
  /**
   * Render latest activities of feedObject
   */


  function renderRelevantActivities() {
    return /*#__PURE__*/_react.default.createElement(_RelevantActivities.default, {
      activities: feedObjectActivities
    });
  }
  /**
   * Render comments of feedObject
   */


  function renderComments() {
    const _commentsOrderBy = selectedActivities === _feedObject.FeedObjectActivitiesType.CONNECTIONS_COMMENTS ? _comments.CommentsOrderBy.CONNECTION_DESC : selectedActivities === _feedObject.FeedObjectActivitiesType.FIRST_COMMENTS ? _comments.CommentsOrderBy.ADDED_AT_ASC : _comments.CommentsOrderBy.ADDED_AT_DESC;

    return /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, (obj.comment_count > 0 || comments.length > 0) && /*#__PURE__*/_react.default.createElement(_reactLazyload.default, {
      once: true
    }, /*#__PURE__*/_react.default.createElement(_CommentsObject.default, {
      key: _commentsOrderBy,
      feedObject: obj,
      feedObjectType: feedObjectType,
      variant: 'outlined',
      infiniteScrolling: false,
      commentsPageCount: 3,
      hidePrimaryReply: true,
      commentsOrderBy: _commentsOrderBy,
      additionalHeaderComments: comments,
      hideAdvertising: true,
      CommentObjectProps: {
        variant: 'outlined'
      }
    })));
  }
  /**
   * Expand activities if the user is logged
   */


  function handleExpandActivities() {
    if (scUserContext.user) {
      setExpandedActivities(prev => !prev);
    } else {
      scContext.settings.handleAnonymousAction();
    }
  }
  /**
   * Render the obj object
   * Manage variants:
   * SNIPPET, PREVIEW, DETAIL
   */


  let objElement;

  if (template === _feedObject.FeedObjectTemplateType.PREVIEW || template === _feedObject.FeedObjectTemplateType.DETAIL) {
    objElement = /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, obj ? /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, obj.categories.length > 0 && /*#__PURE__*/_react.default.createElement("div", {
      className: classes.category
    }, obj.categories.map(c => /*#__PURE__*/_react.default.createElement(_core.Link, {
      to: scRoutingContext.url(_core.SCRoutes.CATEGORY_ROUTE_NAME, c),
      key: c.id
    }, /*#__PURE__*/_react.default.createElement(_material.Typography, {
      variant: "overline"
    }, c.name)))), /*#__PURE__*/_react.default.createElement(_material.CardHeader, {
      avatar: /*#__PURE__*/_react.default.createElement(_core.Link, {
        to: scRoutingContext.url(_core.SCRoutes.USER_PROFILE_ROUTE_NAME, obj.author)
      }, /*#__PURE__*/_react.default.createElement(_material.Avatar, {
        "aria-label": "recipe",
        src: obj.author.avatar
      }, obj.author.username)),
      title: /*#__PURE__*/_react.default.createElement(_core.Link, {
        to: scRoutingContext.url(_core.SCRoutes.USER_PROFILE_ROUTE_NAME, obj.author),
        className: classes.username
      }, obj.author.username),
      subheader: /*#__PURE__*/_react.default.createElement(_material.Grid, {
        component: "span",
        item: true,
        sm: "auto",
        container: true,
        direction: "row",
        alignItems: "center"
      }, /*#__PURE__*/_react.default.createElement(_core.Link, {
        to: scRoutingContext.url(feedObjectType, obj),
        className: classes.activityAt
      }, /*#__PURE__*/_react.default.createElement(_DateTimeAgo.default, {
        date: obj.added_at
      })), /*#__PURE__*/_react.default.createElement(_Bullet.default, null), /*#__PURE__*/_react.default.createElement("div", {
        className: classes.tag
      }, obj.addressing.length > 0 ? /*#__PURE__*/_react.default.createElement(_Tags.default, {
        tags: obj.addressing
      }) : /*#__PURE__*/_react.default.createElement(_material.Tooltip, {
        title: `${intl.formatMessage(messages.visibleToAll)}`
      }, /*#__PURE__*/_react.default.createElement(_Public.default, {
        color: "disabled",
        fontSize: "small"
      })))),
      action: renderHeaderAction()
    }), /*#__PURE__*/_react.default.createElement(_CardContent.default, {
      classes: {
        root: classes.content
      }
    }, 'title' in obj && /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, template === _feedObject.FeedObjectTemplateType.DETAIL ? /*#__PURE__*/_react.default.createElement(_material.Typography, {
      variant: "body1",
      gutterBottom: true,
      className: classes.title
    }, obj.title) : /*#__PURE__*/_react.default.createElement(_core.Link, {
      to: scRoutingContext.url(feedObjectType, obj)
    }, /*#__PURE__*/_react.default.createElement(_material.Typography, {
      variant: "body1",
      gutterBottom: true,
      className: classes.title
    }, obj.title))), /*#__PURE__*/_react.default.createElement(_MediasPreview.default, {
      medias: obj.medias
    }), /*#__PURE__*/_react.default.createElement(_material.Typography, {
      component: "div",
      gutterBottom: true,
      className: classes.text,
      dangerouslySetInnerHTML: {
        __html: template === _feedObject.FeedObjectTemplateType.PREVIEW ? obj.summary : obj.html
      }
    }), obj['poll'] && /*#__PURE__*/_react.default.createElement(_Poll.default, {
      feedObject: obj,
      pollObject: obj['poll'],
      onChange: handleChangePoll,
      elevation: 0
    }), /*#__PURE__*/_react.default.createElement(_material.Stack, {
      direction: "row",
      justifyContent: "space-between",
      alignItems: "center",
      spacing: 2
    }, !hideParticipantsPreview && /*#__PURE__*/_react.default.createElement(_reactLazyload.default, {
      once: true
    }, /*#__PURE__*/_react.default.createElement(_Contributors.default, {
      feedObject: obj,
      feedObjectType: feedObjectType,
      sx: {
        padding: '6px'
      }
    })), scUserContext.user && obj.author.id !== scUserContext.user.id && !hideFollowAction && /*#__PURE__*/_react.default.createElement(_lab.LoadingButton, {
      classes: {
        root: classes.followButton
      },
      loading: isFollowing,
      variant: "contained",
      size: "small",
      disabled: isFollowing,
      onClick: handleFollow
    }, obj.followed ? /*#__PURE__*/_react.default.createElement(_reactIntl.FormattedMessage, {
      id: "ui.feedObject.unfollow",
      defaultMessage: "ui.feedObject.unfollow"
    }) : /*#__PURE__*/_react.default.createElement(_reactIntl.FormattedMessage, {
      id: "ui.feedObject.follow",
      defaultMessage: "ui.feedObject.follow"
    })))), /*#__PURE__*/_react.default.createElement(_material.CardActions, {
      sx: {
        padding: '1px 8px'
      }
    }, /*#__PURE__*/_react.default.createElement(_Actions.default, {
      feedObject: obj,
      feedObjectType: feedObjectType,
      hideShareAction: hideShareAction,
      hideCommentAction: template === _feedObject.FeedObjectTemplateType.DETAIL,
      handleExpandActivities: handleExpandActivities
    })), template === _feedObject.FeedObjectTemplateType.PREVIEW && /*#__PURE__*/_react.default.createElement(_material.Collapse, {
      in: expandedActivities,
      timeout: "auto",
      unmountOnExit: true
    }, /*#__PURE__*/_react.default.createElement(_CardContent.default, {
      className: classes.activitiesContent,
      sx: {
        paddingTop: 0
      }
    }, renderActivities())), composerOpen && /*#__PURE__*/_react.default.createElement(_Composer.default, {
      open: composerOpen,
      feedObject: obj,
      onClose: handleToggleEdit,
      onSuccess: handleEditSuccess,
      maxWidth: "sm",
      fullWidth: true,
      scroll: "body"
    })) : /*#__PURE__*/_react.default.createElement(_Skeleton.default, {
      template: template,
      elevation: 0
    }));
  } else if (template === _feedObject.FeedObjectTemplateType.SHARE) {
    objElement = /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, obj ? /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, obj.categories && /*#__PURE__*/_react.default.createElement("div", {
      className: classes.category
    }, obj.categories.map(c => /*#__PURE__*/_react.default.createElement(_core.Link, {
      to: scRoutingContext.url(_core.SCRoutes.CATEGORY_ROUTE_NAME, c),
      key: c.id
    }, /*#__PURE__*/_react.default.createElement(_material.Typography, {
      variant: "overline"
    }, c.name)))), /*#__PURE__*/_react.default.createElement(_material.CardHeader, {
      avatar: /*#__PURE__*/_react.default.createElement(_core.Link, {
        to: scRoutingContext.url(_core.SCRoutes.USER_PROFILE_ROUTE_NAME, obj.author),
        className: classes.username
      }, /*#__PURE__*/_react.default.createElement(_material.Avatar, {
        "aria-label": "recipe",
        src: obj.author.avatar
      }, obj.author.username)),
      title: /*#__PURE__*/_react.default.createElement(_core.Link, {
        to: scRoutingContext.url(_core.SCRoutes.USER_PROFILE_ROUTE_NAME, obj.author),
        className: classes.username
      }, obj.author.username),
      subheader: /*#__PURE__*/_react.default.createElement(_material.Grid, {
        component: "span",
        item: true,
        sm: "auto",
        container: true,
        direction: "row",
        alignItems: "center"
      }, /*#__PURE__*/_react.default.createElement(_core.Link, {
        to: scRoutingContext.url(feedObjectType, obj),
        className: classes.activityAt
      }, /*#__PURE__*/_react.default.createElement(_DateTimeAgo.default, {
        date: obj.added_at
      })))
    }), /*#__PURE__*/_react.default.createElement(_CardContent.default, {
      classes: {
        root: classes.content
      }
    }, 'title' in obj && /*#__PURE__*/_react.default.createElement(_core.Link, {
      to: scRoutingContext.url(feedObjectType, obj)
    }, /*#__PURE__*/_react.default.createElement(_material.Typography, {
      variant: "body1",
      gutterBottom: true,
      className: classes.title
    }, obj.title)), /*#__PURE__*/_react.default.createElement(_MediasPreview.default, {
      medias: obj.medias
    }), /*#__PURE__*/_react.default.createElement(_core.Link, {
      to: scRoutingContext.url(feedObjectType, obj),
      className: classes.sharedContentFeedObject
    }, /*#__PURE__*/_react.default.createElement(_material.Typography, {
      component: "div",
      className: classes.text,
      variant: "body2",
      gutterBottom: true,
      dangerouslySetInnerHTML: {
        __html: obj.html
      }
    })), obj['poll'] && /*#__PURE__*/_react.default.createElement(_Poll.default, {
      feedObject: obj,
      pollObject: obj['poll'],
      onChange: handleChangePoll,
      elevation: 0
    }))) : /*#__PURE__*/_react.default.createElement(_Skeleton.default, {
      template: template,
      elevation: 0
    }));
  } else {
    objElement = /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, obj ? /*#__PURE__*/_react.default.createElement(_material.ListItem, {
      alignItems: "flex-start"
    }, /*#__PURE__*/_react.default.createElement(_material.ListItemAvatar, null, /*#__PURE__*/_react.default.createElement(_core.Link, {
      to: scRoutingContext.url(_core.SCRoutes.USER_PROFILE_ROUTE_NAME, obj.author)
    }, /*#__PURE__*/_react.default.createElement(_material.Avatar, {
      alt: obj.author.username,
      variant: "circular",
      src: obj.author.avatar
    }))), /*#__PURE__*/_react.default.createElement(_material.ListItemText, {
      primary: /*#__PURE__*/_react.default.createElement(_core.Link, {
        to: scRoutingContext.url(_core.SCRoutes.USER_PROFILE_ROUTE_NAME, obj.author),
        className: classes.username
      }, obj.author.username),
      secondary: /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement(_core.Link, {
        to: scRoutingContext.url(feedObjectType, obj),
        className: classes.snippetContent
      }, obj.summary), /*#__PURE__*/_react.default.createElement(_material.Box, {
        component: "span",
        sx: {
          display: 'flex',
          justifyContent: 'flex-start',
          p: '2px'
        }
      }, /*#__PURE__*/_react.default.createElement(_material.Grid, {
        component: "span",
        item: true,
        sm: "auto",
        container: true,
        direction: "row",
        alignItems: "center"
      }, /*#__PURE__*/_react.default.createElement(_core.Link, {
        to: scRoutingContext.url(feedObjectType, obj),
        className: classes.activityAt
      }, /*#__PURE__*/_react.default.createElement(_DateTimeAgo.default, {
        component: "span",
        date: obj.added_at
      })), /*#__PURE__*/_react.default.createElement(_Bullet.default, {
        sx: {
          paddingLeft: '4px',
          paddingTop: '1px'
        }
      }), /*#__PURE__*/_react.default.createElement(_material.Button, {
        component: _core.Link,
        to: scRoutingContext.url(feedObjectType, obj),
        variant: 'text',
        sx: {
          marginTop: '-1px'
        }
      }, intl.formatMessage(messages.comment)))))
    })) : /*#__PURE__*/_react.default.createElement(_Skeleton.default, {
      elevation: 0
    }));
  }
  /**
   * Renders root object
   */


  return /*#__PURE__*/_react.default.createElement(Root, _extends({
    id: id,
    className: className
  }, rest), /*#__PURE__*/_react.default.createElement(_material.Box, {
    className: `${PREFIX}-${template}`
  }, objElement));
}