import { __rest } from "tslib";
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
import { Box, Button, Menu, styled } from '@mui/material';
import { Link, SCRoutes, useSCRouting } from '@selfcommunity/react-core';
import { FormattedMessage } from 'react-intl';
import { useThemeProps } from '@mui/system';
import SnippetNotifications from '../SnippetNotifications';
import { PREFIX } from './constants';
const classes = {
    root: `${PREFIX}-notifications-menu-root`,
    paper: `${PREFIX}-paper`,
    notifications: `${PREFIX}-notifications`,
    link: `${PREFIX}-link`
};
const Root = styled(Menu, {
    name: PREFIX,
    slot: 'NotificationsMenuRoot'
})(() => ({}));
export default function NotificationMenu(inProps) {
    // PROPS
    const props = useThemeProps({
        props: inProps,
        name: PREFIX
    });
    const { PaperProps = { className: classes.paper }, MenuListProps = { component: Box }, SnippetNotificationsProps = {} } = props, rest = __rest(props, ["PaperProps", "MenuListProps", "SnippetNotificationsProps"]);
    // HOOKS
    const scRoutingContext = useSCRouting();
    return (
    // eslint-disable-next-line @typescript-eslint/ban-ts-ignore
    // @ts-ignore
    _jsxs(Root, Object.assign({ className: classes.root, PaperProps: PaperProps, MenuListProps: MenuListProps }, rest, { children: [_jsx(SnippetNotifications, Object.assign({ className: classes.notifications }, SnippetNotificationsProps)), _jsx(Button, Object.assign({ className: classes.link, component: Link, to: scRoutingContext.url(SCRoutes.USER_NOTIFICATIONS_ROUTE_NAME, {}), variant: "text" }, { children: _jsx(FormattedMessage, { id: "ui.header.notifications.button.seeMore", defaultMessage: "ui.header.notifications.button.seeMore" }) }))] })));
}
