"use strict";
Object.defineProperty(exports, "__esModule", { value: true });
exports.ShortcutSettingsWizard = exports.ShortcutSettingsSummary = exports.isSettingsValid = void 0;
const tslib_1 = require("tslib");
const React = tslib_1.__importStar(require("react"));
const rebass_1 = require("rebass");
const Input_1 = tslib_1.__importDefault(require("../../../components/Input"));
const shortcutOperations_1 = require("../shortcutOperations");
const FormLayout_1 = tslib_1.__importStar(require("../../../components/FormLayout"));
const OnePageAdaptableWizard_1 = require("../../Wizard/OnePageAdaptableWizard");
const Tabs_1 = require("../../../components/Tabs");
const OnePageAdaptableWizard_2 = require("../../../View/Wizard/OnePageAdaptableWizard");
const Tag_1 = require("../../../components/Tag");
const HelpBlock_1 = tslib_1.__importDefault(require("../../../components/HelpBlock"));
const Select_1 = require("../../../components/Select");
const isSettingsValid = (data) => {
    const shortcutKey = data.ShortcutKey && typeof data.ShortcutKey === 'string' ? '' : 'Shortcut key is not selected';
    const shortcutValue = typeof data.ShortcutValue === 'number' ? '' : 'Shortcut value is not specified';
    const shortcutOperation = data.ShortcutOperation && typeof data.ShortcutOperation === 'string'
        ? ''
        : 'Shortcut operation is not selected';
    const result = [shortcutKey, shortcutValue, shortcutOperation].filter(Boolean);
    return result.length ? result.join(', ') : true;
};
exports.isSettingsValid = isSettingsValid;
const ShortcutSettingsSummary = () => {
    const { data: shortcut } = (0, OnePageAdaptableWizard_1.useOnePageAdaptableWizardContext)();
    return (React.createElement(React.Fragment, null,
        React.createElement(OnePageAdaptableWizard_2.SummaryText, null,
            "Shortcut Key ",
            React.createElement(Tag_1.Tag, null, shortcut.ShortcutKey || 'Not selected')),
        React.createElement(OnePageAdaptableWizard_2.SummaryText, null,
            "Value ",
            React.createElement(Tag_1.Tag, null, shortcut.ShortcutValue ?? 'Not specified')),
        React.createElement(OnePageAdaptableWizard_2.SummaryText, null,
            "Operation ",
            React.createElement(Tag_1.Tag, null, shortcut.ShortcutOperation ?? 'Not Specified'))));
};
exports.ShortcutSettingsSummary = ShortcutSettingsSummary;
const ShortcutSettingsWizard = (props) => {
    const { data: shortcut } = (0, OnePageAdaptableWizard_1.useOnePageAdaptableWizardContext)();
    const handleKeyChange = React.useCallback((ShortcutKey) => {
        props.onChange({
            ...shortcut,
            ShortcutKey,
        });
    }, [shortcut]);
    const handleOperationChange = React.useCallback((ShortcutOperation) => props.onChange({
        ...shortcut,
        ShortcutOperation,
    }), [shortcut]);
    const handleOperationValueChange = React.useCallback((event) => {
        props.onChange({
            ...shortcut,
            ShortcutValue: event.target.value ? parseFloat(event.target.value) : event.target.value,
        });
    }, [shortcut]);
    const optionActions = shortcutOperations_1.shortcutOperationList.map((operation) => ({
        value: operation,
        label: operation,
        // onClick: () => handleOperationChange(operation),
    }));
    const optionKeys = props.availableKeys.map((key) => ({
        value: key,
        label: key,
    }));
    return (React.createElement(rebass_1.Box, { "data-name": "shortcut-column-settings" },
        React.createElement(Tabs_1.Tabs, { autoFocus: false },
            React.createElement(Tabs_1.Tabs.Tab, null, "Shortcut Settings"),
            React.createElement(Tabs_1.Tabs.Content, null,
                React.createElement(FormLayout_1.default, null,
                    React.createElement(FormLayout_1.FormRow, null,
                        ' ',
                        React.createElement(HelpBlock_1.default, { fontSize: 2, mb: 0 }, "Keyboard key that, when pressed, triggers the Shortcut")),
                    React.createElement(FormLayout_1.FormRow, { label: "Key" },
                        React.createElement(rebass_1.Flex, { flexDirection: "row" },
                            React.createElement(Select_1.Select, { "data-name": "shortcut-key", placeholder: "Select Key", options: optionKeys, onChange: (key) => handleKeyChange(key), value: shortcut.ShortcutKey || 'Select Key' }))),
                    React.createElement(FormLayout_1.FormRow, null,
                        ' ',
                        React.createElement(HelpBlock_1.default, { fontSize: 2, mb: 0 }, "Mathematical operation performed on Cell's current value (using the Shortcut's 'value') - used to calculate the Cell's new total")),
                    React.createElement(FormLayout_1.FormRow, { label: "Operation" },
                        React.createElement(rebass_1.Flex, { flexDirection: "row" },
                            React.createElement(Select_1.Select, { "data-name": "shortcut-operation", placeholder: "Select Operation", options: optionActions, onChange: (operation) => handleOperationChange(operation), value: shortcut.ShortcutOperation }))),
                    React.createElement(FormLayout_1.FormRow, null,
                        ' ',
                        React.createElement(HelpBlock_1.default, { fontSize: 2, mb: 0 }, "Number that is used - together with the 'Operation' and the current cell value - to calculate the new total for the cell")),
                    React.createElement(FormLayout_1.FormRow, { label: "Value" },
                        React.createElement(rebass_1.Flex, { flexDirection: "row" },
                            React.createElement(Input_1.default, { "data-name": "shortcut-value", style: { maxWidth: 100 }, flex: 1, marginRight: 3, onChange: handleOperationValueChange, placeholder: "Enter Number", type: "number", value: shortcut.ShortcutValue ?? '' }))))))));
};
exports.ShortcutSettingsWizard = ShortcutSettingsWizard;
