"use strict";
Object.defineProperty(exports, "__esModule", { value: true });
const tslib_1 = require("tslib");
const jsx_runtime_1 = require("react/jsx-runtime");
const react_1 = tslib_1.__importStar(require("react"));
const types_1 = require("@selfcommunity/types");
const react_core_1 = require("@selfcommunity/react-core");
const material_1 = require("@mui/material");
const styles_1 = require("@mui/material/styles");
const react_intl_1 = require("react-intl");
const notistack_1 = require("notistack");
const Widget_1 = tslib_1.__importDefault(require("../Widget"));
const system_1 = require("@mui/system");
const Composer_1 = tslib_1.__importDefault(require("../Composer"));
const Media_1 = require("../../shared/Media");
const constants_1 = require("./constants");
const HiddenPlaceholder_1 = tslib_1.__importDefault(require("../../shared/HiddenPlaceholder"));
const classes = {
    root: `${constants_1.PREFIX}-root`,
    content: `${constants_1.PREFIX}-content`,
    input: `${constants_1.PREFIX}-input`,
    avatar: `${constants_1.PREFIX}-avatar`
};
const Root = (0, styles_1.styled)(Widget_1.default, {
    name: constants_1.PREFIX,
    slot: 'Root'
})(() => ({}));
/**
 * > API documentation for the Community-JS Inline Composer component. Learn about the available props and the CSS API.
 *
 *
 * This component renders This component renders the section used for feed objects creation
 * Take a look at our <strong>demo</strong> component [here](/docs/sdk/community-js/react-ui/Components/InlineComposer)

 #### Import
 ```jsx
 import {InlineComposerWidget} from '@selfcommunity/react-ui';
 ```
 #### Component Name
 The name `SCInlineComposerWidget` can be used when providing style overrides in the theme.

 #### CSS

 |Rule Name|Global class|Description|
 |---|---|---|
 |root|.SCInlineComposerWidget-root|Styles applied to the root element.|
 |content|.SCInlineComposerWidget-content|Styles applied to the content element.|
 |input|.SCInlineComposerWidget-input|Styles applied to the input element.|
 |avatar|.SCInlineComposerWidget-avatar|Styles applied to the avatar element.|


 * @param inProps
 */
function InlineComposerWidget(inProps) {
    // PROPS
    const props = (0, system_1.useThemeProps)({
        props: inProps,
        name: constants_1.PREFIX
    });
    const { mediaObjectTypes = [Media_1.File, Media_1.Link], defaultValue, onSuccess = null, label, feedType = types_1.SCFeedTypologyType.HOME } = props, rest = tslib_1.__rest(props, ["mediaObjectTypes", "defaultValue", "onSuccess", "label", "feedType"]);
    // Context
    const scContext = (0, react_core_1.useSCContext)();
    const scUserContext = (0, react_core_1.useSCUser)();
    const scRoutingContext = (0, react_core_1.useSCRouting)();
    const { enqueueSnackbar } = (0, notistack_1.useSnackbar)();
    // PREFERENCES
    const preferences = (0, react_core_1.useSCPreferences)();
    const onlyStaffEnabled = (0, react_1.useMemo)(() => preferences.preferences[react_core_1.SCPreferences.CONFIGURATIONS_POST_ONLY_STAFF_ENABLED].value, [preferences.preferences]);
    // State variables
    const [open, setOpen] = (0, react_1.useState)(false);
    // Handlers
    const handleOpen = (0, react_1.useCallback)(() => {
        if (scUserContext.user) {
            if (react_core_1.UserUtils.isBlocked(scUserContext.user)) {
                enqueueSnackbar((0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.common.userBlocked", defaultMessage: "ui.common.userBlocked" }), {
                    variant: 'warning',
                    autoHideDuration: 3000
                });
            }
            else {
                setOpen(true);
            }
        }
        else {
            scContext.settings.handleAnonymousAction();
        }
    }, [scUserContext.user, scContext.settings]);
    const handleClose = (0, react_1.useCallback)(() => {
        setOpen(false);
    }, []);
    const handleSuccess = (feedObject) => {
        if (onSuccess) {
            onSuccess(feedObject);
        }
        else {
            enqueueSnackbar((0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.inlineComposerWidget.success", defaultMessage: "ui.inlineComposerWidget.success" }), {
                variant: 'success',
                autoHideDuration: 3000
            });
        }
        setOpen(false);
    };
    if (!react_core_1.UserUtils.isStaff(scUserContext.user) && onlyStaffEnabled) {
        return (0, jsx_runtime_1.jsx)(HiddenPlaceholder_1.default, {});
    }
    return ((0, jsx_runtime_1.jsxs)(react_1.default.Fragment, { children: [(0, jsx_runtime_1.jsx)(Root, Object.assign({ className: classes.root }, rest, { children: (0, jsx_runtime_1.jsxs)(material_1.CardContent, Object.assign({ className: classes.content }, { children: [(0, jsx_runtime_1.jsx)(material_1.Box, Object.assign({ className: classes.input }, { children: (0, jsx_runtime_1.jsx)(material_1.Button, Object.assign({ variant: "text", disableFocusRipple: true, disableRipple: true, disableElevation: true, onClick: handleOpen, fullWidth: true, color: "inherit" }, { children: label !== null && label !== void 0 ? label : (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.inlineComposerWidget.label", defaultMessage: "ui.inlineComposerWidget.label" }) })) })), (0, jsx_runtime_1.jsx)(material_1.Box, Object.assign({ className: classes.avatar }, { children: !scUserContext.user ? ((0, jsx_runtime_1.jsx)(material_1.Avatar, { variant: "circular" })) : ((0, jsx_runtime_1.jsx)(react_core_1.Link, Object.assign({ to: scRoutingContext.url(react_core_1.SCRoutes.USER_PROFILE_ROUTE_NAME, scUserContext.user) }, { children: (0, jsx_runtime_1.jsx)(material_1.Avatar, { alt: scUserContext.user.username, variant: "circular", src: scUserContext.user.avatar }) }))) }))] })) })), (0, jsx_runtime_1.jsx)(Composer_1.default, { open: open, mediaObjectTypes: mediaObjectTypes, defaultValue: defaultValue, fullWidth: true, onClose: handleClose, onSuccess: handleSuccess, feedType: feedType })] }));
}
exports.default = InlineComposerWidget;
