@selfcommunity/react-ui/lib/esm/components/FeedObject/Activities/RelevantActivities/RelevantActivities.js

React UI Components to integrate a Community created with SelfCommunity Platform.

import { __rest } from "tslib";
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
import { useState } from 'react';
import { styled } from '@mui/material/styles';
import { Box, Collapse, List, ListItem, ListItemButton, ListItemText, Typography } from '@mui/material';
import { FormattedMessage } from 'react-intl';
import { SCFeedUnitActivityTypologyType } from '@selfcommunity/types';
import Icon from '@mui/material/Icon';
import CommentRelevantActivity from './CommentActivity';
import VoteUpRelevantActivity from './VoteUpActivity';
import FollowRelevantActivity from './FollowActivity';
import PollVoteRelevantActivity from './PollVoteActivity';
import classNames from 'classnames';
import { PREFIX } from '../../constants';
const classes = {
    root: `${PREFIX}-relevant-activities-root`,
    activity: `${PREFIX}-relevant-activities-activity`
};
const Root = styled(Box, {
    name: PREFIX,
    slot: 'RelevantActivitiesRoot'
})(() => ({}));
export default function RelevantActivities(props) {
    //PROPS
    const { className = null, activities = [], showMaxRelevantActivities = 5 } = props, rest = __rest(props, ["className", "activities", "showMaxRelevantActivities"]);
    // STATE
    const [openOtherActivities, setOpenOtherActivities] = useState(false);
    /**
     * Renders single relevant activity
     * @param a
     * @param i
     */
    function renderActivity(a, i) {
        if (a.type === SCFeedUnitActivityTypologyType.COMMENT) {
            return _jsx(CommentRelevantActivity, { activityObject: a, elevation: 0 }, i);
        }
        else if (a.type === SCFeedUnitActivityTypologyType.FOLLOW) {
            return _jsx(FollowRelevantActivity, { activityObject: a, elevation: 0 }, i);
        }
        else if (a.type === SCFeedUnitActivityTypologyType.VOTE) {
            return _jsx(VoteUpRelevantActivity, { activityObject: a, elevation: 0 }, i);
        }
        else if (a.type === SCFeedUnitActivityTypologyType.POLLVOTE) {
            return _jsx(PollVoteRelevantActivity, { activityObject: a, elevation: 0 }, i);
        }
        return null;
    }
    /**
     * Renders root object
     */
    return (_jsx(Root, Object.assign({ className: classNames(classes.root, className) }, rest, { children: activities.length <= 0 ? (_jsx(Typography, Object.assign({ variant: "body2" }, { children: _jsx(FormattedMessage, { id: "ui.feedObject.relevantActivities.noResults", defaultMessage: "ui.feedObject.relevantActivities.noResults" }) }))) : (_jsxs(List, { children: [activities.slice(0, showMaxRelevantActivities).map((a, i) => (_jsx(ListItem, Object.assign({ className: classes.activity }, { children: renderActivity(a, i) }), i))), !openOtherActivities && activities.length > showMaxRelevantActivities && (_jsxs(ListItemButton, Object.assign({ onClick: () => setOpenOtherActivities((prev) => !prev) }, { children: [_jsx(ListItemText, { primary: _jsx(FormattedMessage, { id: 'ui.feedObject.relevantActivities.showOthers', defaultMessage: 'ui.feedObject.relevantActivities.showOthers' }) }), openOtherActivities ? _jsx(Icon, { children: "expand_less" }) : _jsx(Icon, { children: "expand_more" })] }))), _jsx(Collapse, Object.assign({ in: openOtherActivities, timeout: "auto", unmountOnExit: true }, { children: activities.slice(showMaxRelevantActivities).map((a, i) => (_jsx(ListItem, Object.assign({ className: classes.activity }, { children: renderActivity(a, i) }), i))) }))] })) })));
}