@adaptabletools/adaptable-cjs
Version:
Powerful data-agnostic HTML5 AG Grid extension which provides advanced, cutting-edge functionality to meet all DataGrid requirements
88 lines (87 loc) • 4.15 kB
JavaScript
"use strict";
Object.defineProperty(exports, "__esModule", { value: true });
exports.EntityRulePredicateEditor = void 0;
const tslib_1 = require("tslib");
const React = tslib_1.__importStar(require("react"));
const rebass_1 = require("rebass");
const DropdownButton_1 = tslib_1.__importDefault(require("../../../../components/DropdownButton"));
const FormLayout_1 = tslib_1.__importStar(require("../../../../components/FormLayout"));
const SimpleButton_1 = tslib_1.__importDefault(require("../../../../components/SimpleButton"));
const AdaptableContext_1 = require("../../../AdaptableContext");
const PredicateEditor_1 = require("../../PredicateEditor/PredicateEditor");
const EntityRulePredicateEditor = (props) => {
const { api } = (0, AdaptableContext_1.useAdaptable)();
const { predicate } = props;
const allColumns = React.useMemo(() => {
return api.columnApi.getColumns().map((column) => ({
label: column.friendlyName,
value: column.columnId,
}));
}, []);
const handleClear = () => {
const newPredicates = props.data.Rule?.Predicates?.filter((prevPredicate) => prevPredicate !== predicate);
props.onChange({
...props.data,
Rule: {
Predicates: newPredicates,
},
});
};
const handlePredicateChange = (newPredicateDef) => {
let newPredicates = [];
if (predicate) {
newPredicates = props.data.Rule?.Predicates?.map((prevPredicate) => {
if (prevPredicate === predicate) {
return newPredicateDef;
}
return prevPredicate;
});
}
else {
// no previous predicate, e.g. it was cleared
newPredicates = [newPredicateDef];
}
props.onChange({
...props.data,
Rule: {
Predicates: newPredicates,
},
});
};
const predicateDefs = React.useMemo(() => {
let preparedPredicates = [];
if (props.getPredicateDefsForColId && props?.predicate?.ColumnId) {
preparedPredicates = props.getPredicateDefsForColId(props.predicate.ColumnId);
}
else {
preparedPredicates = props.predicateDefs;
}
return preparedPredicates;
}, [props.predicate]);
const columnIdPredicateScopeEnabled = Boolean(props.columnPredicateEnabled);
const columnFriendlyName = allColumns.find((col) => col.value === predicate?.ColumnId)?.label;
const columnOptions = allColumns.map((col) => ({
label: col.label,
onClick: () => {
handlePredicateChange({ PredicateId: null, ColumnId: col.value, Inputs: [] });
},
}));
// use global scope or custom scope
let predicateColumnId = null;
if (predicate?.ColumnId && predicate.ColumnId !== '') {
predicateColumnId = predicate.ColumnId;
}
else if ('ColumnIds' in props.data.Scope && props.data.Scope?.ColumnIds?.[0]) {
predicateColumnId = props.data.Scope?.ColumnIds?.[0];
}
return (React.createElement(rebass_1.Flex, { className: "ab-EntityRulePredicateEditor", p: 3, mb: 3 },
React.createElement(rebass_1.Box, { flex: 1 },
React.createElement(FormLayout_1.default, null,
columnIdPredicateScopeEnabled && (React.createElement(FormLayout_1.FormRow, { label: "Column" },
React.createElement(DropdownButton_1.default, { width: "100%", columns: ['label'], items: columnOptions }, columnFriendlyName ?? 'Select Column'))),
React.createElement(FormLayout_1.FormRow, { label: "Predicate" },
React.createElement(PredicateEditor_1.PredicateEditor, { columnId: predicateColumnId, predicateDefs: predicateDefs, predicate: predicate, onChange: handlePredicateChange, onClear: handleClear })))),
React.createElement(rebass_1.Box, null,
React.createElement(SimpleButton_1.default, { disabled: !predicate, ml: 2, onClick: handleClear, icon: "delete" }))));
};
exports.EntityRulePredicateEditor = EntityRulePredicateEditor;