@adaptabletools/adaptable
Version:
Powerful data-agnostic HTML5 AG Grid extension which provides advanced, cutting-edge functionality to meet all DataGrid requirements
34 lines (33 loc) • 2.12 kB
JavaScript
import * as React from 'react';
import { Box, Flex } from 'rebass';
import FormLayout, { FormRow } from '../../../components/FormLayout';
import { ColumnSelector } from '../Selectors/ColumnSelector';
import { AdaptableColumnFilter } from './AdaptableColumnFilter';
import { useAdaptable } from '../../AdaptableContext';
import { AdaptableIconComponent } from '../AdaptableIconComponent';
export const ColumnFilterWindow = (props) => {
const { api } = useAdaptable();
const { value: initialColumnId } = props?.popupProps;
const [columnId, setColumnId] = React.useState(initialColumnId);
React.useEffect(() => {
setColumnId(initialColumnId);
}, [props.popupProps.value]);
const onChange = props.popupProps.onChange;
return (React.createElement(Flex, { flex: 1, minHeight: 0, height: "100%", flexDirection: "column", p: 2, className: "ab-ColumnFilterWindow" },
React.createElement(Box, { mb: 2 },
React.createElement(FormLayout, null,
React.createElement(FormRow, { label: "Column" },
React.createElement(ColumnSelector, { renderOption: (column) => {
const columnFilter = api.filterApi.columnFilterApi.getColumnFilterForColumn(column.columnId);
let label = column.friendlyName ?? column.columnId;
if (columnFilter &&
api.filterApi.columnFilterApi.isColumnFilterActive(columnFilter)) {
return (React.createElement(Flex, null,
label,
React.createElement(Box, { flex: 1 }),
React.createElement(AdaptableIconComponent, { icon: { name: 'filter' } })));
}
return label;
}, onChange: (column) => setColumnId(column), filterColumn: (column) => column.queryable, isMulti: false, value: columnId })))),
React.createElement(AdaptableColumnFilter, { columnId: columnId, onChange: onChange })));
};