import * as React from 'react';
import { OnePageAdaptableWizard, OnePageWizardSummary, } from '../../../View/Wizard/OnePageAdaptableWizard';
import { renderScopeSummary, isScopeValid } from '../../Components/NewScopeComponent';
import { PlusMinusScopeWizardSection } from './PlusMinusScopeWizardSection';
import { PlusMinusSettingsWizardSection, PlusMinusSettingsSummary, isSettingsValid, } from './PlusMinusSettingsWizardSection';
import ObjectFactory from '../../../Utilities/ObjectFactory';
import { useDispatch } from 'react-redux';
import * as PlusMinusRedux from '../../../Redux/ActionsReducers/PlusMinusRedux';
import { ObjectTagsWizardSection, renderObjectTagsSummary, } from '../../Wizard/ObjectTagsWizardSection';
import { Box } from '../../../components/Flex';
export const PlusMinusWizard = (props) => {
    const [plusMinus, doSetPlusMinus] = React.useState(() => {
        const newPlusMinus = {
            ...(props.data ? props.data : ObjectFactory.CreateEmptyPlusMinusNudge()),
            Scope: props?.data?.Scope ?? { All: true },
            NudgeValue: props?.data?.NudgeValue ?? 20,
        };
        if (props?.popupParams?.column) {
            newPlusMinus.Scope = {
                ColumnIds: [props.popupParams.column.columnId],
            };
        }
        return newPlusMinus;
    });
    const setPlusMinus = React.useCallback((data) => {
        doSetPlusMinus(data);
    }, []);
    const [hasCondition, setHasCondition] = React.useState(() => {
        // true if on edit and it has a condition
        return Boolean(props?.data?.Rule);
    });
    React.useEffect(() => {
        doSetPlusMinus((prev) => {
            const preparedData = { ...prev };
            if (hasCondition) {
                preparedData.Rule = preparedData.Rule ?? { BooleanExpression: '' };
            }
            else {
                delete preparedData.Rule;
            }
            return preparedData;
        });
    }, [hasCondition]);
    const dispatch = useDispatch();
    const handleFinish = () => {
        if (props.data) {
            dispatch(PlusMinusRedux.PlusMinusNudgeEdit(plusMinus));
        }
        else {
            dispatch(PlusMinusRedux.PlusMinusNudgeAdd(plusMinus));
        }
        props.onFinishWizard(plusMinus);
    };
    return (React.createElement(OnePageAdaptableWizard, { defaultCurrentSectionName: props.defaultCurrentSectionName, moduleInfo: props.moduleInfo, data: plusMinus, onHide: props.onCloseWizard, onFinish: handleFinish, sections: [
            {
                title: 'Settings',
                isValid: isSettingsValid(hasCondition),
                renderSummary: () => React.createElement(PlusMinusSettingsSummary, { hasCondition: hasCondition }),
                render: () => (React.createElement(PlusMinusSettingsWizardSection, { hasCondition: hasCondition, onConditionChange: setHasCondition, onChange: setPlusMinus })),
            },
            {
                title: 'Target',
                isValid: isScopeValid,
                details: 'Specify where Plus/Minus should be applied',
                renderSummary: () => renderScopeSummary(plusMinus.Scope, {
                    scopeWholeRow: 'Plus/Minus is applied for matching rows',
                    scopeColumns: 'Plus/Minus is applied in cells in selected columns',
                    scopeDataTypes: 'Plus/Minus is applied for cells with selected data type',
                }),
                render: () => (React.createElement(Box, { className: "twa:p-2" },
                    React.createElement(PlusMinusScopeWizardSection, { onChange: setPlusMinus }))),
            },
            {
                details: 'Select Plus/Minus Tags',
                title: 'Tags',
                isVisible: (_, api) => api.internalApi.shouldDisplayTagSections(),
                render: () => (React.createElement(Box, { className: "twa:p-2" },
                    React.createElement(ObjectTagsWizardSection, { onChange: setPlusMinus }))),
                renderSummary: renderObjectTagsSummary,
            },
            '-',
            {
                render: () => {
                    return (React.createElement(Box, { className: "twa:p-2" },
                        React.createElement(OnePageWizardSummary, null)));
                },
                title: 'Summary',
            },
        ] }));
};
