"use strict";
Object.defineProperty(exports, "__esModule", { value: true });
const tslib_1 = require("tslib");
const jsx_runtime_1 = require("react/jsx-runtime");
const react_1 = require("react");
const material_1 = require("@mui/material");
const react_intl_1 = require("react-intl");
const styles_1 = require("@mui/material/styles");
const classnames_1 = tslib_1.__importDefault(require("classnames"));
const system_1 = require("@mui/system");
const Category_1 = tslib_1.__importDefault(require("./Steps/Category"));
const constants_1 = require("./constants");
const react_core_1 = require("@selfcommunity/react-core");
const Appearance_1 = tslib_1.__importDefault(require("./Steps/Appearance"));
const Profile_1 = tslib_1.__importDefault(require("./Steps/Profile"));
const Invite_1 = tslib_1.__importDefault(require("./Steps/Invite"));
const App_1 = tslib_1.__importDefault(require("./Steps/App"));
const HiddenPlaceholder_1 = tslib_1.__importDefault(require("../../shared/HiddenPlaceholder"));
const Widget_1 = tslib_1.__importDefault(require("../Widget"));
const Content_1 = tslib_1.__importDefault(require("./Steps/Content"));
const Errors_1 = require("../../constants/Errors");
const api_services_1 = require("@selfcommunity/api-services");
const utils_1 = require("@selfcommunity/utils");
const types_1 = require("@selfcommunity/types");
const Skeleton_1 = tslib_1.__importDefault(require("./Skeleton"));
const notistack_1 = require("notistack");
const header_1 = tslib_1.__importDefault(require("../../assets/onBoarding/header"));
const BaseDialog_1 = tslib_1.__importDefault(require("../../shared/BaseDialog"));
const pubsub_js_1 = tslib_1.__importDefault(require("pubsub-js"));
const PubSub_1 = require("../../constants/PubSub");
const ActionsButton_1 = tslib_1.__importDefault(require("./ActionsButton"));
const classes = {
    root: `${constants_1.PREFIX}-root`,
    content: `${constants_1.PREFIX}-content`,
    accordionRoot: `${constants_1.PREFIX}-accordion-root`,
    logo: `${constants_1.PREFIX}-logo`,
    intro: `${constants_1.PREFIX}-intro`,
    steps: `${constants_1.PREFIX}-steps`,
    stepsMobile: `${constants_1.PREFIX}-steps-mobile`,
    stepContent: `${constants_1.PREFIX}-step-content`,
    dialogRoot: `${constants_1.PREFIX}-dialog-root`,
    dialogContent: `${constants_1.PREFIX}-dialog-content`
};
const Root = (0, styles_1.styled)(Widget_1.default, {
    name: constants_1.PREFIX,
    slot: 'Root',
    overridesResolver: (props, styles) => styles.root
})(() => ({}));
const AccordionRoot = (0, styles_1.styled)(material_1.Accordion, {
    name: constants_1.PREFIX,
    slot: 'AccordionRoot',
    overridesResolver: (props, styles) => styles.accordionRoot
})(() => ({}));
const DialogRoot = (0, styles_1.styled)(BaseDialog_1.default, {
    name: constants_1.PREFIX,
    slot: 'Root',
    overridesResolver: (props, styles) => styles.dialogRoot
})(({ theme }) => ({}));
const OnBoardingWidget = (inProps) => {
    // PROPS
    const props = (0, system_1.useThemeProps)({
        props: inProps,
        name: constants_1.PREFIX
    });
    const { className, GenerateContentsParams = {}, onGeneratedContent = null, onHeightChange, onStateChange, forceExpanded = false, initialStep } = props, rest = tslib_1.__rest(props, ["className", "GenerateContentsParams", "onGeneratedContent", "onHeightChange", "onStateChange", "forceExpanded", "initialStep"]);
    // STATE
    const [loading, setLoading] = (0, react_1.useState)(true);
    const [initialized, setInitialized] = (0, react_1.useState)(false);
    const [steps, setSteps] = (0, react_1.useState)([]);
    const nextStep = (0, react_1.useMemo)(() => {
        const step = steps === null || steps === void 0 ? void 0 : steps.find((step) => (initialStep ? step.step === initialStep : step.status === 'in_progress' || step.status === 'not_started'));
        return step || (steps === null || steps === void 0 ? void 0 : steps[0]);
    }, [steps]);
    const allStepsDone = (0, react_1.useMemo)(() => {
        return steps === null || steps === void 0 ? void 0 : steps.every((step) => step.status === types_1.SCOnBoardingStepStatusType.COMPLETED);
    }, [steps]);
    const [expanded, setExpanded] = (0, react_1.useState)(!allStepsDone || forceExpanded);
    const [_step, setStep] = (0, react_1.useState)(nextStep);
    const currentContentsStep = steps === null || steps === void 0 ? void 0 : steps.find((s) => s.step === types_1.SCOnBoardingStepType.CONTENTS);
    const prevContentsStep = (0, react_core_1.usePreviousValue)(currentContentsStep);
    const currentCategoriesStep = steps === null || steps === void 0 ? void 0 : steps.find((s) => s.step === types_1.SCOnBoardingStepType.CATEGORIES);
    const prevCategoriesStep = (0, react_core_1.usePreviousValue)(currentCategoriesStep);
    const [showNoCategoriesModal, setShowNoCategoriesModal] = (0, react_1.useState)(false);
    const [showCategoriesWarningModal, setShowWarningCategoriesModal] = (0, react_1.useState)(false);
    const [isGenerating, setIsGenerating] = (0, react_1.useState)(false);
    // CONTEXT
    const scUserContext = (0, react_core_1.useSCUser)();
    const isAdmin = (0, react_1.useMemo)(() => react_core_1.UserUtils.isCommunityCreator(scUserContext.user), [scUserContext.user]);
    const scContext = (0, react_core_1.useSCContext)();
    const scPreferencesContext = (0, react_core_1.useSCPreferences)();
    const scThemeContext = (0, react_core_1.useSCTheme)();
    const { enqueueSnackbar } = (0, notistack_1.useSnackbar)();
    const showOnBoarding = (0, react_1.useMemo)(() => scPreferencesContext.preferences &&
        react_core_1.SCPreferences.CONFIGURATIONS_ONBOARDING_ENABLED in scPreferencesContext.preferences &&
        react_core_1.SCPreferences.CONFIGURATIONS_ONBOARDING_HIDDEN in scPreferencesContext.preferences &&
        scPreferencesContext.preferences[react_core_1.SCPreferences.CONFIGURATIONS_ONBOARDING_ENABLED].value &&
        !scPreferencesContext.preferences[react_core_1.SCPreferences.CONFIGURATIONS_ONBOARDING_HIDDEN].value, [scPreferencesContext.preferences]);
    // HOOKS
    const theme = (0, material_1.useTheme)();
    const isMobile = (0, material_1.useMediaQuery)(theme.breakpoints.down('md'));
    const { categories, isLoading } = (0, react_core_1.useSCFetchCategories)();
    // HANDLERS
    /**
     * Notify changes to Feed if the Widget is contained
     */
    const notifyLayoutChanges = (0, react_1.useMemo)(() => (state) => {
        if (onStateChange && state) {
            onStateChange(state);
        }
        onHeightChange && onHeightChange();
    }, [onStateChange, onHeightChange]);
    const completeStep = (s) => tslib_1.__awaiter(void 0, void 0, void 0, function* () {
        if (s.status !== types_1.SCOnBoardingStepStatusType.COMPLETED) {
            yield api_services_1.OnBoardingService.completeAStep(s.id)
                .then(() => {
                setSteps((prev) => prev.map((item) => {
                    if (item.id === s.id) {
                        return Object.assign(Object.assign({}, item), { status: types_1.SCOnBoardingStepStatusType.COMPLETED, completion_percentage: 100 });
                    }
                    return item;
                }));
            })
                .catch((error) => {
                utils_1.Logger.error(Errors_1.SCOPE_SC_UI, error);
            });
        }
        s.step === types_1.SCOnBoardingStepType.APPEARANCE && handlePreferencesUpdate();
    });
    /**
     * Fetches platform url
     */
    function fetchPlatform(query) {
        api_services_1.http
            .request({
            url: api_services_1.Endpoints.Platform.url(),
            method: api_services_1.Endpoints.Platform.method,
            params: {
                next: query
            }
        })
            .then((res) => {
            const platformUrl = res.data.platform_url;
            window.open(platformUrl, '_blank').focus();
        })
            .catch((error) => {
            console.log(error);
        });
    }
    const showSuccessAlert = (step) => {
        setIsGenerating(false);
        enqueueSnackbar((0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: `ui.onBoardingWidget.step.${step.step}.success`, defaultMessage: `ui.onBoardingWidget.step.${step.step}.success` }), {
            action: (snackbarId) => ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [step.step === types_1.SCOnBoardingStepType.CATEGORIES && ((0, jsx_runtime_1.jsx)(material_1.Button, Object.assign({ sx: { textTransform: 'uppercase', color: 'white' }, size: "small", variant: "text", onClick: () => fetchPlatform('/contents/interests/') }, { children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.onBoardingWidget.step.categories.success.link", defaultMessage: "ui.onBoardingWidget.step.categories.success.link" }) }))), (0, jsx_runtime_1.jsx)(material_1.IconButton, Object.assign({ sx: { color: 'white' }, onClick: () => (0, notistack_1.closeSnackbar)(snackbarId) }, { children: (0, jsx_runtime_1.jsx)(material_1.Icon, { children: "close" }) }))] })),
            variant: 'success',
            autoHideDuration: 7000
        });
    };
    const getSteps = () => tslib_1.__awaiter(void 0, void 0, void 0, function* () {
        yield api_services_1.OnBoardingService.getAllSteps()
            .then((res) => {
            const contentStep = res.results.find((step) => step.step === types_1.SCOnBoardingStepType.CONTENTS);
            setIsGenerating(res.results.some((step) => step.status === 'in_progress'));
            setSteps(res.results);
            setLoading(false);
            if (contentStep.status === types_1.SCOnBoardingStepStatusType.IN_PROGRESS && contentStep.results.length !== 0 && onGeneratedContent) {
                onGeneratedContent(contentStep.results);
            }
        })
            .catch((error) => {
            utils_1.Logger.error(Errors_1.SCOPE_SC_UI, error);
            setLoading(false);
        });
    });
    const handleChange = (newStep) => {
        setStep(newStep);
    };
    const handleExpand = () => {
        const _expanded = !expanded;
        setExpanded(_expanded);
        notifyLayoutChanges({ forceExpanded: _expanded });
    };
    const generateContent = (stepId) => tslib_1.__awaiter(void 0, void 0, void 0, function* () {
        if (!isLoading && !categories.length) {
            setShowNoCategoriesModal(true);
        }
        else if (stepId === types_1.SCOnBoardingStepIdType.CATEGORIES) {
            setShowWarningCategoriesModal(true);
        }
        else {
            yield startStep(stepId);
        }
    });
    const startStep = (stepId) => tslib_1.__awaiter(void 0, void 0, void 0, function* () {
        showCategoriesWarningModal && setShowWarningCategoriesModal(false);
        yield api_services_1.OnBoardingService.startAStep(stepId, GenerateContentsParams)
            .then(() => {
            setIsGenerating(true);
        })
            .catch((error) => {
            utils_1.Logger.error(Errors_1.SCOPE_SC_UI, error);
            enqueueSnackbar((0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.common.error.action", defaultMessage: "ui.common.error.action" }), {
                variant: 'error',
                autoHideDuration: 3000
            });
        });
    });
    const handlePreferencesUpdate = () => {
        api_services_1.PreferenceService.getAllPreferences().then((preferences) => {
            const prefs = preferences['results'].reduce((obj, p) => (Object.assign(Object.assign({}, obj), { [`${p.section}.${p.name}`]: p })), {});
            scPreferencesContext.setPreferences(prefs);
            scThemeContext.setTheme((0, react_core_1.getTheme)(scContext.settings.theme, prefs));
        });
    };
    const handleCategoriesClick = () => {
        fetchPlatform('/contents/interests/');
        setShowNoCategoriesModal(false);
    };
    /**
     * Notify when a category info changes
     * @param data
     */
    function notifyCategoryChanges(data) {
        data && pubsub_js_1.default.publish(`${PubSub_1.SCTopicType.CATEGORY}.${PubSub_1.SCCategoryEventType.EDIT}`, data);
    }
    // EFFECTS
    (0, react_1.useEffect)(() => {
        if (prevContentsStep &&
            prevContentsStep.status === types_1.SCOnBoardingStepStatusType.IN_PROGRESS &&
            (currentContentsStep === null || currentContentsStep === void 0 ? void 0 : currentContentsStep.status) === types_1.SCOnBoardingStepStatusType.COMPLETED) {
            showSuccessAlert(currentContentsStep);
        }
    }, [currentContentsStep, prevContentsStep]);
    (0, react_1.useEffect)(() => {
        if (prevCategoriesStep &&
            prevCategoriesStep.status === types_1.SCOnBoardingStepStatusType.IN_PROGRESS &&
            (currentCategoriesStep === null || currentCategoriesStep === void 0 ? void 0 : currentCategoriesStep.status) === types_1.SCOnBoardingStepStatusType.COMPLETED) {
            showSuccessAlert(currentCategoriesStep);
        }
    }, [currentCategoriesStep, prevCategoriesStep]);
    (0, react_1.useEffect)(() => {
        if (!initialized && nextStep) {
            setStep(nextStep);
            setInitialized(true);
            notifyLayoutChanges({ forceExpanded: expanded });
        }
    }, [initialized, nextStep]);
    (0, react_1.useEffect)(() => {
        const _expanded = !allStepsDone;
        setExpanded(_expanded);
        notifyLayoutChanges({ forceExpanded: _expanded });
    }, [allStepsDone]);
    (0, react_1.useEffect)(() => {
        if (isAdmin && showOnBoarding) {
            getSteps();
            // eslint-disable-next-line @typescript-eslint/no-misused-promises
            const intervalId = setInterval(getSteps, isGenerating ? 6000 : 3 * 60 * 1000);
            return () => clearInterval(intervalId);
        }
    }, [scUserContext === null || scUserContext === void 0 ? void 0 : scUserContext.user, isGenerating, isAdmin, showOnBoarding]);
    /**
     * updates categories info when generating category content
     */
    (0, react_1.useEffect)(() => {
        const categoryStep = steps.find((step) => step.step === types_1.SCOnBoardingStepType.CATEGORIES);
        if ((categoryStep === null || categoryStep === void 0 ? void 0 : categoryStep.status) === types_1.SCOnBoardingStepStatusType.IN_PROGRESS && categoryStep.results.length !== 0) {
            categoryStep.results.forEach((c) => {
                // eslint-disable-next-line @typescript-eslint/ban-ts-ignore
                // @ts-ignore
                const isAlreadyNotified = prevCategoriesStep === null || prevCategoriesStep === void 0 ? void 0 : prevCategoriesStep.results.some((result) => result.id === c.id);
                if (!isAlreadyNotified) {
                    notifyCategoryChanges(c);
                }
            });
        }
    }, [steps, prevCategoriesStep]);
    /**
     * Render _step content section
     */
    const getStepContent = () => {
        const stepObj = steps === null || steps === void 0 ? void 0 : steps.find((obj) => obj.step === (_step === null || _step === void 0 ? void 0 : _step.step));
        let content;
        switch (stepObj === null || stepObj === void 0 ? void 0 : stepObj.step) {
            case types_1.SCOnBoardingStepType.CONTENTS:
                content = (0, jsx_runtime_1.jsx)(Content_1.default, { step: stepObj, handleContentCreation: () => generateContent(stepObj.id) });
                break;
            case types_1.SCOnBoardingStepType.CATEGORIES:
                content = (0, jsx_runtime_1.jsx)(Category_1.default, { step: stepObj, handleCategoriesCreation: () => generateContent(stepObj.id) });
                break;
            case types_1.SCOnBoardingStepType.APPEARANCE:
                content = (0, jsx_runtime_1.jsx)(Appearance_1.default, { onCompleteAction: () => completeStep(stepObj) });
                break;
            case types_1.SCOnBoardingStepType.PROFILE:
                content = (0, jsx_runtime_1.jsx)(Profile_1.default, { onCompleteAction: () => completeStep(stepObj) });
                break;
            case types_1.SCOnBoardingStepType.INVITE:
                content = (0, jsx_runtime_1.jsx)(Invite_1.default, { onCompleteAction: () => completeStep(stepObj) });
                break;
            case types_1.SCOnBoardingStepType.APP:
                content = (0, jsx_runtime_1.jsx)(App_1.default, { step: stepObj, onCompleteAction: () => completeStep(stepObj) });
                break;
            default:
                break;
        }
        return content;
    };
    if (!isAdmin || !showOnBoarding) {
        return (0, jsx_runtime_1.jsx)(HiddenPlaceholder_1.default, {});
    }
    return ((0, jsx_runtime_1.jsx)(Root, Object.assign({ className: (0, classnames_1.default)(classes.root, className) }, rest, { children: (0, jsx_runtime_1.jsxs)(AccordionRoot, Object.assign({ defaultExpanded: true, className: classes.accordionRoot, expanded: expanded }, { children: [(0, jsx_runtime_1.jsx)(material_1.AccordionSummary, Object.assign({ expandIcon: (0, jsx_runtime_1.jsx)(ActionsButton_1.default, { isExpanded: expanded, onExpandChange: handleExpand, onHideOnBoarding: handlePreferencesUpdate }), "aria-controls": "accordion", id: "onBoarding-accordion" }, { children: (0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, { children: expanded ? ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [!isMobile ? ((0, jsx_runtime_1.jsx)(material_1.CardMedia, { className: classes.logo, component: "img", src: header_1.default })) : ((0, jsx_runtime_1.jsxs)(material_1.Typography, Object.assign({ variant: "h4" }, { children: [(0, jsx_runtime_1.jsx)(material_1.Icon, Object.assign({ color: "secondary", fontSize: "medium" }, { children: "ai_stars" })), (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.onBoardingWidget.accordion.expanded.title.mobile", defaultMessage: "ui.onBoardingWidget.accordion.expanded.title.mobile", values: {
                                                // eslint-disable-next-line @typescript-eslint/ban-ts-ignore
                                                // @ts-ignore
                                                b: (chunks) => (0, jsx_runtime_1.jsx)("strong", { children: chunks })
                                            } })] }))), (0, jsx_runtime_1.jsxs)(material_1.Box, Object.assign({ className: classes.intro }, { children: [!isMobile && ((0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ variant: "h4" }, { children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.onBoardingWidget.accordion.expanded.title", defaultMessage: "ui.onBoardingWidget.accordion.expanded.title" }) }))), (0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ variant: "h5" }, { children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.onBoardingWidget.accordion.expanded.subtitle", defaultMessage: "ui.onBoardingWidget.accordion.expanded.subtitle" }) })), (0, jsx_runtime_1.jsx)(material_1.Typography, { children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.onBoardingWidget.accordion.expanded.summary", defaultMessage: "ui.onBoardingWidget.accordion.expanded.summary", values: {
                                                    // eslint-disable-next-line @typescript-eslint/ban-ts-ignore
                                                    // @ts-ignore
                                                    b: (chunks) => (0, jsx_runtime_1.jsx)("strong", { children: chunks }),
                                                    // eslint-disable-next-line @typescript-eslint/ban-ts-ignore
                                                    // @ts-ignore
                                                    icon: (...chunks) => (0, jsx_runtime_1.jsx)(material_1.Icon, { children: chunks })
                                                } }) })] }))] })) : ((0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ variant: "body1" }, { children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.onBoardingWidget.accordion.collapsed", defaultMessage: "ui.onBoardingWidget.accordion.collapsed", values: {
                                    // eslint-disable-next-line @typescript-eslint/ban-ts-ignore
                                    // @ts-ignore
                                    b: (chunks) => (0, jsx_runtime_1.jsx)("strong", { children: chunks }),
                                    // eslint-disable-next-line @typescript-eslint/ban-ts-ignore
                                    // @ts-ignore
                                    // eslint-disable-next-line prettier/prettier
                                    icon: (...chunks) => (0, jsx_runtime_1.jsx)(material_1.Icon, Object.assign({ color: "secondary", fontSize: "medium" }, { children: chunks }))
                                } }) }))) }) })), (0, jsx_runtime_1.jsx)(material_1.AccordionDetails, { children: (0, jsx_runtime_1.jsx)(Widget_1.default, Object.assign({ className: classes.content, elevation: 0 }, { children: loading ? ((0, jsx_runtime_1.jsx)(Skeleton_1.default, {})) : ((0, jsx_runtime_1.jsxs)(material_1.CardContent, { children: [(0, jsx_runtime_1.jsx)(material_1.List, Object.assign({ className: isMobile ? classes.stepsMobile : classes.steps }, { children: steps === null || steps === void 0 ? void 0 : steps.map((step) => ((0, jsx_runtime_1.jsx)(material_1.ListItem, { children: isMobile ? ((0, jsx_runtime_1.jsx)(material_1.Chip, { size: "small", label: (0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: `ui.onBoardingWidget.${step.step}`, defaultMessage: `ui.onBoardingWidget.${step.step}` }), ' ', step.status === types_1.SCOnBoardingStepStatusType.COMPLETED && ((0, jsx_runtime_1.jsx)(material_1.Icon, Object.assign({ color: (step === null || step === void 0 ? void 0 : step.status) === types_1.SCOnBoardingStepStatusType.COMPLETED && (step === null || step === void 0 ? void 0 : step.step) !== (_step === null || _step === void 0 ? void 0 : _step.step) ? 'success' : 'inherit' }, { children: "check" })))] }), onClick: () => handleChange(step), variant: step.step === (_step === null || _step === void 0 ? void 0 : _step.step) ? 'filled' : 'outlined', color: step.status === types_1.SCOnBoardingStepStatusType.COMPLETED ? 'success' : 'default' })) : ((0, jsx_runtime_1.jsxs)(material_1.ListItemButton, Object.assign({ onClick: () => handleChange(step), selected: (step === null || step === void 0 ? void 0 : step.step) === (_step === null || _step === void 0 ? void 0 : _step.step) }, { children: [(0, jsx_runtime_1.jsx)(material_1.ListItemIcon, { children: (0, jsx_runtime_1.jsx)(material_1.Checkbox, { edge: "start", checked: step.status === types_1.SCOnBoardingStepStatusType.COMPLETED, tabIndex: -1, disableRipple: true, inputProps: { 'aria-labelledby': step.step }, size: 'small' }) }), (0, jsx_runtime_1.jsx)(material_1.ListItemText, { primary: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: `ui.onBoardingWidget.${step.step}`, defaultMessage: `ui.onBoardingWidget.${step.step}` }) })] }))) }, step.id))) })), (0, jsx_runtime_1.jsxs)(material_1.Box, Object.assign({ className: classes.stepContent }, { children: [(0, jsx_runtime_1.jsx)(material_1.Fade, Object.assign({ in: true, timeout: 2400 }, { children: (0, jsx_runtime_1.jsx)(material_1.Box, { children: getStepContent() }) })), showNoCategoriesModal && ((0, jsx_runtime_1.jsx)(BaseDialog_1.default, Object.assign({ title: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.onBoardingWidget.ai.no.categories", defaultMessage: "ui.onBoardingWidget.ai.no.categories" }), DialogContentProps: { dividers: false }, open: showNoCategoriesModal, onClose: () => setShowNoCategoriesModal(false), actions: (0, jsx_runtime_1.jsx)(material_1.Button, Object.assign({ color: "secondary", onClick: () => setShowNoCategoriesModal(false) }, { children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.onBoardingWidget.ai.no.categories.cancel", defaultMessage: "ui.onBoardingWidget.ai.no.categories.cancel" }) })) }, { children: (0, jsx_runtime_1.jsx)(material_1.Button, Object.assign({ color: "primary", onClick: handleCategoriesClick, startIcon: (0, jsx_runtime_1.jsx)(material_1.Icon, Object.assign({ fontSize: "small" }, { children: "edit" })) }, { children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.onBoardingWidget.ai.no.categories.link", defaultMessage: "ui.onBoardingWidget.ai.no.categories.link" }) })) }))), showCategoriesWarningModal && ((0, jsx_runtime_1.jsx)(DialogRoot, Object.assign({ className: classes.dialogRoot, title: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.onBoardingWidget.ai.categories.warning.title", defaultMessage: "ui.onBoardingWidget.ai.categories.warning.title" }), DialogContentProps: { dividers: false }, open: showCategoriesWarningModal, onClose: () => setShowWarningCategoriesModal(false), actions: (0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)(material_1.Button, Object.assign({ size: "small", variant: "outlined", color: "primary", onClick: () => setShowWarningCategoriesModal(false) }, { children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.onBoardingWidget.ai.categories.warning.button.close", defaultMessage: "ui.onBoardingWidget.ai.categories.warning.button.close" }) })), (0, jsx_runtime_1.jsx)(material_1.Button, Object.assign({ size: "small", variant: "contained", color: "secondary", onClick: () => startStep(types_1.SCOnBoardingStepIdType.CATEGORIES), endIcon: (0, jsx_runtime_1.jsx)(material_1.Icon, Object.assign({ fontSize: "small" }, { children: "magic_wand" })) }, { children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.onBoardingWidget.ai.categories.warning.button.generate", defaultMessage: "ui.onBoardingWidget.ai.categories.warning.button.generate" }) }))] }) }, { children: (0, jsx_runtime_1.jsxs)(material_1.Typography, Object.assign({ className: classes.dialogContent }, { children: [(0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.onBoardingWidget.ai.categories.warning.info", defaultMessage: "ui.onBoardingWidget.ai.categories.warning.info" }), (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.onBoardingWidget.ai.categories.warning.confirm", defaultMessage: "ui.onBoardingWidget.ai.categories.warning.confirm", values: {
                                                            // eslint-disable-next-line @typescript-eslint/ban-ts-ignore
                                                            // @ts-ignore
                                                            b: (chunks) => (0, jsx_runtime_1.jsx)("b", { children: chunks })
                                                        } })] })) })))] }))] })) })) })] })) })));
};
exports.default = OnBoardingWidget;
