"use strict";
Object.defineProperty(exports, "__esModule", { value: true });
const tslib_1 = require("tslib");
const jsx_runtime_1 = require("react/jsx-runtime");
const React = tslib_1.__importStar(require("react"));
const react_1 = require("react");
const Box_1 = tslib_1.__importDefault(require("@mui/material/Box"));
const Menu_1 = tslib_1.__importDefault(require("@mui/material/Menu"));
const Tooltip_1 = tslib_1.__importDefault(require("@mui/material/Tooltip"));
const material_1 = require("@mui/material");
const Icon_1 = tslib_1.__importDefault(require("@mui/material/Icon"));
const styles_1 = require("@mui/material/styles");
const feedObject_1 = require("../../../../types/feedObject");
const react_intl_1 = require("react-intl");
const utils_1 = require("@selfcommunity/utils");
const react_core_1 = require("@selfcommunity/react-core");
const classnames_1 = tslib_1.__importDefault(require("classnames"));
const constants_1 = require("../../constants");
const messages = (0, react_intl_1.defineMessages)({
    relevantActivities: {
        id: 'ui.feedObject.activitiesMenu.relevantActivities',
        defaultMessage: 'ui.feedObject.activitiesMenu.relevantActivities'
    },
    recentComments: {
        id: 'ui.feedObject.activitiesMenu.recentComments',
        defaultMessage: 'ui.feedObject.activitiesMenu.recentComments'
    },
    firstComments: {
        id: 'ui.feedObject.activitiesMenu.firstComments',
        defaultMessage: 'ui.feedObject.activitiesMenu.firstComments'
    },
    followedComments: {
        id: 'ui.feedObject.activitiesMenu.followedComments',
        defaultMessage: 'ui.feedObject.activitiesMenu.followedComments'
    },
    connectionsComments: {
        id: 'ui.feedObject.activitiesMenu.connectionsComments',
        defaultMessage: 'ui.feedObject.activitiesMenu.connectionsComments'
    }
});
const classes = {
    root: `${constants_1.PREFIX}-activities-menu-root`,
    selector: `${constants_1.PREFIX}-activities-menu-selector`
};
const Root = (0, styles_1.styled)(Box_1.default, {
    name: constants_1.PREFIX,
    slot: 'ActivitiesMenuRoot'
})(() => ({}));
function ActivitiesMenu(props) {
    // PROPS
    const { className = null, selectedActivities = null, hideRelevantActivitiesItem = false, onChange = null } = props, rest = tslib_1.__rest(props, ["className", "selectedActivities", "hideRelevantActivitiesItem", "onChange"]);
    // CONTEXT
    const scPreferencesContext = (0, react_1.useContext)(react_core_1.SCPreferencesContext);
    const scUserContext = (0, react_core_1.useSCUser)();
    // STATE
    const theme = (0, material_1.useTheme)();
    const isMobile = (0, material_1.useMediaQuery)(theme.breakpoints.down('md'));
    const followEnabled = scPreferencesContext.preferences[react_core_1.SCPreferences.CONFIGURATIONS_FOLLOW_ENABLED].value;
    const [anchorEl, setAnchorEl] = React.useState(null);
    const open = Boolean(anchorEl);
    // INTL
    const intl = (0, react_intl_1.useIntl)();
    // HANDLERS
    const handleOpen = (event) => {
        setAnchorEl(event.currentTarget);
    };
    const handleClose = () => {
        setAnchorEl(null);
    };
    const handleChangeActivitiesType = (type) => {
        return () => {
            onChange && onChange(type);
        };
    };
    function renderMenuContent() {
        return ((0, jsx_runtime_1.jsxs)(Box_1.default, { children: [!hideRelevantActivitiesItem && ((0, jsx_runtime_1.jsx)(material_1.ListItemButton, Object.assign({ selected: selectedActivities === feedObject_1.SCFeedObjectActivitiesType.RELEVANCE_ACTIVITIES, onClick: handleChangeActivitiesType(feedObject_1.SCFeedObjectActivitiesType.RELEVANCE_ACTIVITIES) }, { children: (0, jsx_runtime_1.jsx)(material_1.ListItemText, { primary: (0, jsx_runtime_1.jsx)("b", { children: intl.formatMessage(messages.relevantActivities) }), secondary: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: 'ui.feedObject.activitiesMenu.relevantActivitiesDesc', defaultMessage: 'ui.feedObject.activitiesMenu.relevantActivitiesDesc' }) }) }))), (0, jsx_runtime_1.jsx)(material_1.ListItemButton, Object.assign({ selected: selectedActivities === feedObject_1.SCFeedObjectActivitiesType.RECENT_COMMENTS, onClick: handleChangeActivitiesType(feedObject_1.SCFeedObjectActivitiesType.RECENT_COMMENTS) }, { children: (0, jsx_runtime_1.jsx)(material_1.ListItemText, { primary: (0, jsx_runtime_1.jsx)("b", { children: intl.formatMessage(messages.recentComments) }), secondary: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: 'ui.feedObject.activitiesMenu.recentCommentsDesc', defaultMessage: 'ui.feedObject.activitiesMenu.recentCommentsDesc' }) }) })), (0, jsx_runtime_1.jsx)(material_1.ListItemButton, Object.assign({ selected: selectedActivities === feedObject_1.SCFeedObjectActivitiesType.FIRST_COMMENTS, onClick: handleChangeActivitiesType(feedObject_1.SCFeedObjectActivitiesType.FIRST_COMMENTS) }, { children: (0, jsx_runtime_1.jsx)(material_1.ListItemText, { primary: (0, jsx_runtime_1.jsx)("b", { children: intl.formatMessage(messages.firstComments) }), secondary: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: 'ui.feedObject.activitiesMenu.firstCommentsDesc', defaultMessage: 'ui.feedObject.activitiesMenu.firstCommentsDesc' }) }) })), scUserContext.user && ((0, jsx_runtime_1.jsx)(material_1.ListItemButton, Object.assign({ selected: selectedActivities === feedObject_1.SCFeedObjectActivitiesType.CONNECTIONS_COMMENTS, onClick: handleChangeActivitiesType(feedObject_1.SCFeedObjectActivitiesType.CONNECTIONS_COMMENTS) }, { children: (0, jsx_runtime_1.jsx)(material_1.ListItemText, { primary: (0, jsx_runtime_1.jsx)("b", { children: followEnabled ? intl.formatMessage(messages.followedComments) : intl.formatMessage(messages.connectionsComments) }), secondary: followEnabled ? ((0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: 'ui.feedObject.activitiesMenu.followedCommentsDesc', defaultMessage: 'ui.feedObject.activitiesMenu.followedCommentsDesc' })) : ((0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: 'ui.feedObject.activitiesMenu.connectionsCommentsDesc', defaultMessage: 'ui.feedObject.activitiesMenu.connectionsCommentsDesc' })) }) })))] }));
    }
    /**
     * Renders root object
     */
    return ((0, jsx_runtime_1.jsxs)(Root, Object.assign({ className: (0, classnames_1.default)(classes.root, className) }, rest, { children: [(0, jsx_runtime_1.jsx)(Box_1.default, Object.assign({ className: classes.selector }, { children: (0, jsx_runtime_1.jsx)(Tooltip_1.default, Object.assign({ title: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.feedObject.activitiesMenu.tooltipTitle", defaultMessage: "ui.feedObject.activitiesMenu.tooltipTitle" }) }, { children: (0, jsx_runtime_1.jsxs)(material_1.Button, Object.assign({ variant: "text", size: "small", onClick: handleOpen }, { children: [selectedActivities === feedObject_1.SCFeedObjectActivitiesType.CONNECTIONS_COMMENTS && followEnabled
                                ? intl.formatMessage(messages.followedComments)
                                : intl.formatMessage(messages[`${(0, utils_1.camelCase)(selectedActivities)}`]), "\u00A0 ", (0, jsx_runtime_1.jsx)(Icon_1.default, { children: "expand_more" })] })) })) })), isMobile ? ((0, jsx_runtime_1.jsx)(material_1.SwipeableDrawer, Object.assign({ open: open, onClose: handleClose, onOpen: handleOpen, anchor: "bottom", disableSwipeToOpen: true }, { children: renderMenuContent() }))) : ((0, jsx_runtime_1.jsx)(Menu_1.default, Object.assign({ anchorEl: anchorEl, open: open, onClose: handleClose, onClick: handleClose, PaperProps: {
                    elevation: 0,
                    sx: {
                        overflow: 'visible',
                        filter: 'drop-shadow(0px 2px 8px rgba(0,0,0,0.32))',
                        mt: 1.5,
                        '&:before': {
                            content: '""',
                            display: 'block',
                            position: 'absolute',
                            top: 0,
                            right: 14,
                            width: 10,
                            height: 10,
                            bgcolor: 'background.paper',
                            transform: 'translateY(-50%) rotate(45deg)',
                            zIndex: 0
                        }
                    }
                }, transformOrigin: { horizontal: 'right', vertical: 'top' }, anchorOrigin: { horizontal: 'right', vertical: 'bottom' } }, { children: renderMenuContent() })))] })));
}
exports.default = ActivitiesMenu;
