UNPKG

@adaptabletools/adaptable

Version:

Powerful AG Grid extension which provides advanced, cutting-edge functionality to meet all DataGrid requirements

108 lines (107 loc) 5.45 kB
import { jsx as _jsx } from "react/jsx-runtime"; import { useState, useCallback } from 'react'; import { OnePageAdaptableWizard, OnePageWizardSummary } from '../../Wizard/OnePageAdaptableWizard'; import { FlashingAlertSettingsWizardSection, renderFlashingAlertSettingsSummary, isSettingsValid, } from './FlashingCellSettingsWizardSection'; import { cloneObject } from '../../../Utilities/Helpers/Helper'; import { FlashingAlertRulesWizardSection, renderFlashingAlertRulesSummary, } from './FlashingCellRulesWizardSection'; import { FlashingAlertStyleWizardSection, renderFlashingAlertStyleSummary, } from './FlashingCellStyleWizardSection'; import { FlashingAlertScopeWizardSection, renderFlashingCellScopeSummary } from './FlashingCellScopeWizardSection'; import { useAdaptable } from '../../AdaptableContext'; import { isScopeValid } from '../../Components/NewScopeComponent'; import ObjectFactory from '../../../Utilities/ObjectFactory'; import { useDispatch } from 'react-redux'; import { isValidFlashingCellRules } from './isValidFlashingCellRules'; import * as FlashingCellRedux from '../../../Redux/ActionsReducers/FlashingCellRedux'; import { ObjectTagsWizardSection, renderObjectTagsSummary, } from '../../Wizard/ObjectTagsWizardSection'; import { Box } from '../../../components/Flex'; export const FlashingCellWizard = (props) => { const { api } = useAdaptable(); const [flashingCell, doSetFlashingCell] = useState(() => { let flashingCell = props.data ? cloneObject(props.data) : ObjectFactory.CreateEmptyFlashingCellDefinition(); flashingCell = api.flashingCellApi.internalApi.mergeFlashingCellDefinitionWithDefaults(flashingCell); if (!flashingCell.Rule.BooleanExpression && !flashingCell.Rule?.Predicates?.length) { flashingCell.Rule.BooleanExpression = ''; } if (props.popupParams?.column && props.popupParams?.action === 'New') { flashingCell.Scope = { ColumnIds: [props.popupParams.column.columnId], }; } return flashingCell; }); const setFlashingCell = useCallback((data) => { doSetFlashingCell(data); }, []); const updateProperty = (propName) => { return (value) => { doSetFlashingCell((flashingCell) => { flashingCell = { ...flashingCell, [propName]: value }; return flashingCell; }); }; }; const updateStyles = { DownChangeStyle: useCallback(updateProperty('DownChangeStyle'), []), UpChangeStyle: useCallback(updateProperty('UpChangeStyle'), []), NeutralChangeStyle: useCallback(updateProperty('NeutralChangeStyle'), []), }; const dispatch = useDispatch(); const handleFinish = () => { if (props.data) { dispatch(FlashingCellRedux.FlashingCellDefinitionEdit(flashingCell)); } else { dispatch(FlashingCellRedux.FlashingCellDefinitionAdd(flashingCell)); } props.onFinishWizard(flashingCell); }; return (_jsx(OnePageAdaptableWizard, { defaultCurrentSectionName: props.defaultCurrentSectionName, moduleInfo: props.moduleInfo, data: flashingCell, onHide: props.onCloseWizard, onFinish: handleFinish, sections: [ { details: 'Set Name, Duration and Target Properties', isValid: isSettingsValid, render: () => _jsx(FlashingAlertSettingsWizardSection, { onChange: setFlashingCell }), renderSummary: renderFlashingAlertSettingsSummary, title: 'Settings', }, { details: 'Specify which data changes should trigger Cell Flashing', isValid: isScopeValid, render: () => _jsx(FlashingAlertScopeWizardSection, { onChange: setFlashingCell }), renderSummary: renderFlashingCellScopeSummary, title: 'Columns', }, { details: 'Build the Rules for when Cells should Flash', isValid: isValidFlashingCellRules, render: () => _jsx(FlashingAlertRulesWizardSection, { onChange: setFlashingCell }), renderSummary: renderFlashingAlertRulesSummary, title: 'Rule', }, { details: 'Choose Flash Styles for Up, Down and Neutral Changes', render: () => (_jsx(FlashingAlertStyleWizardSection, { onStyleChange: (styleName, style) => { updateStyles[styleName](style); } })), renderSummary: renderFlashingAlertStyleSummary, title: 'Flash Styles', }, { details: 'Select Flashing Cell Tags', title: 'Tags', isVisible: (_, api) => api.internalApi.shouldDisplayTagSections(), render: () => (_jsx(Box, { className: "twa:p-2", children: _jsx(ObjectTagsWizardSection, { onChange: setFlashingCell }) })), renderSummary: renderObjectTagsSummary, }, '-', { details: 'Review the Flashing Cell Rule', render: () => { return (_jsx(Box, { className: "twa:p-2", children: _jsx(OnePageWizardSummary, {}) })); }, title: 'Summary', }, ] })); };