@adaptabletools/adaptable-cjs
Version:
Powerful data-agnostic HTML5 AG Grid extension which provides advanced, cutting-edge functionality to meet all DataGrid requirements
65 lines (64 loc) • 4.41 kB
JavaScript
"use strict";
Object.defineProperty(exports, "__esModule", { value: true });
exports.QuickSearchPopup = void 0;
const tslib_1 = require("tslib");
const React = tslib_1.__importStar(require("react"));
const react_1 = require("react");
const react_redux_1 = require("react-redux");
const QuickSearchRedux = tslib_1.__importStar(require("../../Redux/ActionsReducers/QuickSearchRedux"));
const PopupPanel_1 = require("../Components/Popups/AdaptablePopup/PopupPanel");
const StyleComponent_1 = require("../Components/StyleComponent");
const Flex_1 = require("../../components/Flex");
const CheckBox_1 = require("../../components/CheckBox");
const StringExtensions_1 = tslib_1.__importDefault(require("../../Utilities/Extensions/StringExtensions"));
const useQuickSearchDebounced_1 = require("./useQuickSearchDebounced");
const QuickSearchInput_1 = require("./QuickSearchInput");
const HelpBlock_1 = tslib_1.__importDefault(require("../../components/HelpBlock"));
const Card_1 = require("../../components/Card");
const QuickSearchPopupComponent = (props) => {
const [searchText, search] = (0, useQuickSearchDebounced_1.useQuickSearchDebounced)(props);
const [state, setState] = (0, react_1.useState)({
RunQueryAfterQuickSearch: props.api.optionsApi.getQuickSearchOptions().filterGridAfterQuickSearch,
EditedStyle: props.QuickSearchStyle,
});
const onUpdateStyle = (style) => {
setState({ ...state, EditedStyle: style });
props.onSetMatchingCellStyle(style);
};
const onQuickSearchBehaviourChange = (checked) => {
setState({ ...state, RunQueryAfterQuickSearch: checked });
props.api.optionsApi.getAdaptableOptions().quickSearchOptions.filterGridAfterQuickSearch =
checked;
};
return (React.createElement(PopupPanel_1.PopupPanel, { headerText: props.moduleInfo.FriendlyName, glyphicon: props.moduleInfo.Glyph, infoLink: props.moduleInfo.HelpPage, infoLinkDisabled: !props.api.internalApi.isDocumentationLinksDisplayed(), bodyClassName: "twa:gap-3 twa:flex twa:flex-col" },
React.createElement(Flex_1.Flex, { flexDirection: "column", className: "twa:h-full twa:gap-4" },
React.createElement(Card_1.Card, null,
React.createElement(Card_1.Card.Title, null, "Search Text"),
React.createElement(Card_1.Card.Body, { className: "twa:p-1 twa:w-fit" },
React.createElement(QuickSearchInput_1.QuickSearchInput, null))),
React.createElement(Card_1.Card, null,
React.createElement(Card_1.Card.Title, null, "Behaviour"),
React.createElement(Card_1.Card.Body, { className: "twa:p-1", gap: 2 },
React.createElement(HelpBlock_1.default, { className: "twa:text-2 twa:w-fit" },
"Filter Grid when searching to only show rows with matching cells; ",
React.createElement("b", null, "use with care"),
" as can cause performance issues"),
React.createElement(CheckBox_1.CheckBox, { "data-name": "filter-quick-search-results", value: "existing", checked: state.RunQueryAfterQuickSearch, disabled: StringExtensions_1.default.IsNotNullOrEmpty(searchText), onChange: onQuickSearchBehaviourChange }, "Filter using Quick Search Results"))),
React.createElement(Card_1.Card.Title, { border: false, className: "twa:pt-3" }, "Cell Matching Style"),
React.createElement(Card_1.Card, null,
React.createElement(Card_1.Card.Body, null,
React.createElement(StyleComponent_1.StyleComponent, { headless: true, className: "twa:h-full twa:flex-1 twa:rounded-none", headerText: 'Cell Matching Style', api: props.api, Style: props.QuickSearchStyle, UpdateStyle: onUpdateStyle }))))));
};
function mapStateToProps(state, ownProps) {
return {
QuickSearchText: state.QuickSearch.QuickSearchText,
QuickSearchStyle: state.QuickSearch.CellMatchStyle ?? {},
};
}
function mapDispatchToProps(dispatch) {
return {
onRunQuickSearch: (quickSearchText) => dispatch(QuickSearchRedux.QuickSearchRun(quickSearchText)),
onSetMatchingCellStyle: (style) => dispatch(QuickSearchRedux.QuickSearchSetCellMatchingStyle(style)),
};
}
exports.QuickSearchPopup = (0, react_redux_1.connect)(mapStateToProps, mapDispatchToProps)(QuickSearchPopupComponent);