@adaptabletools/adaptable
Version:
Powerful AG Grid extension which provides advanced, cutting-edge functionality to meet all DataGrid requirements
101 lines (100 loc) • 6.08 kB
JavaScript
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
import * as React from 'react';
import { connect } from 'react-redux';
import * as SmartEditRedux from '../../Redux/ActionsReducers/SmartEditRedux';
import * as InternalRedux from '../../Redux/ActionsReducers/InternalRedux';
import { MathOperation } from '../../AdaptableState/Common/Enums';
import { PanelWithImage } from '../Components/Panels/PanelWithImage';
import { AdaptablePopover } from '../AdaptablePopover';
import { EnumExtensions } from '../../Utilities/Extensions/EnumExtensions';
import { PreviewResultsPanel } from '../Components/PreviewResultsPanel';
import { PreviewHelper } from '../../Utilities/Helpers/PreviewHelper';
import { StringExtensions } from '../../Utilities/Extensions/StringExtensions';
import Input from '../../components/Input';
import { NewDropdownButton } from '../../components/DropdownButton';
import SimpleButton from '../../components/SimpleButton';
import { Flex } from '../../components/Flex';
const preventDefault = (e) => e.preventDefault();
class SmartEditPopupComponent extends React.Component {
constructor(props) {
super(props);
this.state = { isShowingError: false, errorText: '' };
}
componentDidMount() {
this.props.onSmartEditCheckSelectedCells();
}
render() {
let col;
if (this.props.PreviewInfo) {
col = this.props.PreviewInfo.column;
}
let globalValidationMessage = PreviewHelper.GetValidationMessage(this.props.PreviewInfo, `${this.props.SmartEditValue}`);
let showPanel = this.props.PreviewInfo && StringExtensions.IsNotNullOrEmpty(`${this.props.SmartEditValue}`);
let previewPanel = showPanel ? (_jsx(PreviewResultsPanel, { className: "twa:flex-[1_1_100%] twa:overflow-initial twa:h-full", previewInfo: this.props.PreviewInfo, api: this.props.api, selectedColumn: col, showPanel: showPanel, showHeader: true })) : null;
const operationMenuItems = EnumExtensions.getNames(MathOperation).map((mathOperation, index) => {
return {
label: mathOperation,
onClick: () => {
this.props.onSmartEditOperationChange(mathOperation);
},
};
});
const customOperations = this.props.api.smartEditApi.getSmartEditCustomOperations();
if (customOperations?.length) {
operationMenuItems.push(...customOperations.map((operation) => {
return {
onClick: () => this.props.onSmartEditOperationChange(operation),
label: operation.name,
};
}));
}
return (_jsxs(PanelWithImage, { className: "twa:h-full twa:flex-1 twa:p-0!", variant: "primary", bodyProps: {
className: 'twa:flex twa:flex-col',
}, bodyScroll: true, glyphicon: this.props.moduleInfo.Glyph, header: this.props.moduleInfo.FriendlyName, infoLink: this.props.moduleInfo.HelpPage, infoLinkDisabled: !this.props.api.internalApi.isDocumentationLinksDisplayed(), onKeyDown: (e) => {
if (e.key === 'Enter') {
this.submit();
}
}, children: [_jsxs(Flex, { flexDirection: "row", "data-name": "smart-edit-operation", className: "twa:p-2", children: [_jsx(NewDropdownButton, { "data-name": "smart-edit-operation-dropdown", items: operationMenuItems, onMouseDown: preventDefault, children: typeof this.props.SmartEditOperation === 'object'
? this.props.SmartEditOperation.name
: this.props.SmartEditOperation }), _jsx(Input, { "data-name": "smart-edit-value", value: this.props.SmartEditValue.toString(), className: "twa:mx-2", type: "number", placeholder: "Enter a Number", onChange: (e) => this.onSmartEditValueChange(e) }), _jsx(SimpleButton, { "data-name": "smart-edit-apply-button", className: "twa:mr-2", tone: this.getButtonStyle(), variant: "raised", disabled: StringExtensions.IsNullOrEmpty(`${this.props.SmartEditValue}`) ||
(this.props.PreviewInfo &&
this.props.PreviewInfo.previewValidationSummary.validationResult == 'All'), onClick: () => {
this.submit();
}, children: "Apply Smart Edit" }), ' ', this.props.PreviewInfo &&
this.props.PreviewInfo.previewValidationSummary.validationResult != 'None' && (_jsx(AdaptablePopover, { headerText: 'Validation Error', bodyText: [globalValidationMessage], MessageType: 'Error' }))] }), previewPanel] }));
}
submit() {
this.props.onApplySmartEdit();
}
onSmartEditValueChange(event) {
const e = event.target;
this.props.onSmartEditValueChange(Number(e.value));
}
getButtonStyle() {
if (this.props.PreviewInfo) {
if (this.props.PreviewInfo.previewValidationSummary.validationResult == 'All') {
return 'neutral';
}
if (this.props.PreviewInfo.previewValidationSummary.validationResult == 'Some') {
return 'error';
}
}
return 'success';
}
}
function mapStateToProps(state, ownProps) {
return {
SmartEditValue: state.Internal.SmartEdit.SmartEditValue,
SmartEditOperation: state.Internal.SmartEdit.SmartEditOperation,
PreviewInfo: state.Internal.SmartEdit.SmartEditPreviewInfo,
};
}
function mapDispatchToProps(dispatch) {
return {
onSmartEditValueChange: (value) => dispatch(InternalRedux.SmartEditChangeValue(value)),
onSmartEditOperationChange: (SmartEditOperation) => dispatch(InternalRedux.SmartEditChangeOperation(SmartEditOperation)),
onSmartEditCheckSelectedCells: () => dispatch(InternalRedux.SmartEditCheckCellSelection()),
onApplySmartEdit: () => dispatch(SmartEditRedux.SmartEditApply(false)),
};
}
export const SmartEditPopup = connect(mapStateToProps, mapDispatchToProps)(SmartEditPopupComponent);