@adaptabletools/adaptable
Version:
Powerful data-agnostic HTML5 AG Grid extension which provides advanced, cutting-edge functionality to meet all DataGrid requirements
78 lines (77 loc) • 3.82 kB
JavaScript
import * as React from 'react';
import { Flex } from 'rebass';
import { CheckBox } from '../../components/CheckBox';
import { ExpressionEditor } from '../../components/ExpressionEditor';
import Input from '../../components/Input';
import { StringExtensions } from '../../Utilities/Extensions/StringExtensions';
import { NamedQueryModuleId } from '../../Utilities/Constants/ModuleConstants';
import { useMemo } from 'react';
export class ExpressionWizard extends React.Component {
constructor(props) {
super(props);
this.handleCustomExpressionChange = (expression) => {
this.setState({
expression,
}, () => this.props.updateGoBackState());
};
this.state = {
// this is realy horrible but its only way to use the Expression Wizard for both Report (that has Query) and Format Column (that has Rule)
// once we move to the new Wizard we can remove this monstrosity
expression: this.props.callingModule && this.props.callingModule == 'Export'
? this.props.data.Query?.BooleanExpression
: this.props.data.Rule?.BooleanExpression,
saveToNamedQueries: false,
newNamedQuery: '',
};
}
render() {
const initialData = useMemo(() => this.props.api.internalApi.getQueryPreviewData(), []);
return (React.createElement(React.Fragment, null,
React.createElement(ExpressionEditor, { type: 'boolean', module: NamedQueryModuleId, value: this.state.expression, onChange: this.handleCustomExpressionChange, initialData: initialData, columns: this.props.api.columnApi.getQueryableColumns(), fields: this.props.api.expressionApi.internalApi.getAvailableFields(), namedQueries: this.props.api.namedQueryApi.getNamedQueries(), api: this.props.api }),
' ',
React.createElement(Flex, { flexDirection: "row", padding: 1, marginBottom: 2, marginLeft: 1, alignItems: "center", "data-name": "expression-wizard-save-option" },
React.createElement(CheckBox, { marginLeft: 2, disabled: !this.isValidExpression(), marginBottom: 2, checked: this.state.saveToNamedQueries, onChange: (checked) => this.setState({
saveToNamedQueries: checked,
}, () => this.props.updateGoBackState()) }, "Save as new Named Query"),
this.state.saveToNamedQueries && (React.createElement(Input, { marginLeft: 2, style: { minWidth: '20rem' }, value: this.state.newNamedQuery, onChange: (e) => this.setState({
newNamedQuery: e.target.value,
}, () => this.props.updateGoBackState()) })))));
}
isValidExpression() {
return (StringExtensions.IsNotNullOrEmpty(this.state.expression) &&
this.props.api.internalApi
.getQueryLanguageService()
.validateBoolean(this.state.expression, NamedQueryModuleId).isValid);
}
canNext() {
if (this.isValidExpression() == false) {
return false;
}
if (this.state.saveToNamedQueries && StringExtensions.IsNullOrEmpty(this.state.newNamedQuery)) {
return false;
}
return true;
}
canBack() {
return true;
}
next() {
this.props.callingModule == 'Export'
? (this.props.data.Query = {
BooleanExpression: this.state.expression,
})
: (this.props.data.Rule = {
BooleanExpression: this.state.expression,
});
if (this.state.saveToNamedQueries) {
this.props.onSetNewNamedQuery(this.state.newNamedQuery);
}
}
back() { }
getIndexStepIncrement() {
return 1;
}
getIndexStepDecrement() {
return 1;
}
}