@rh-support/cases 2.4.10-beta.6 → 2.5.1

package/lib/esm/components/case-list/case-search/AdvanceSearch.js

@@ -1,4 +1,5 @@
-import { Button } from '@patternfly/react-core';
+import { Button, Flex, FlexItem, Icon, TextInputGroup, TextInputGroupMain, TextInputGroupUtilities, } from '@patternfly/react-core';
+import CheckCircleIcon from '@patternfly/react-icons/dist/js/icons/check-circle-icon';
 import InfoIcon from '@patternfly/react-icons/dist/js/icons/info-circle-icon';
 import TimesCircleIcon from '@patternfly/react-icons/dist/js/icons/times-circle-icon';
 import isEmpty from 'lodash/isEmpty';
@@ -83,8 +84,8 @@ export function AdvanceSearch(props) {
             document.removeEventListener('mousedown', handleClickOutside);
         };
     }, [isAutoCompleteListVisible]);
-    const onQueryStringChange = (ev) => {
-        const query = ev.target.value;
+    const onQueryStringChange = (value) => {
+        const query = value;
         setInputString(query);
     };
     const autoCompleteSetup = (expectedArray = null, phrase = '') => {
@@ -211,18 +212,22 @@ export function AdvanceSearch(props) {
     };
     const isQueryInValid = inputString && !isParsingSuccessful;
     return (React.createElement(React.Fragment, null,
-        React.createElement("div", { className: "pf-c-select pf-m-expanded", ref: dropdownWrapperRef },
-            React.createElement("div", { className: "pf-c-select__toggle pf-m-typeahead" },
-                React.createElement("div", { className: "pf-c-select__toggle-wrapper" },
-                    React.createElement("input", { value: inputString, onChange: onQueryStringChange, onFocus: onInputFocus, ref: searchInputRef, onKeyDown: onKeyDown, placeholder: t('i18nEnterSolrQuery', 'Enter SOLR query, for example:  severity:"1 (Urgent)" and status:"Waiting on Customer"'), className: `pf-c-form-control pf-c-select__toggle-typeahead ${inputString && isParsingSuccessful ? 'pf-m-success' : ''}`, type: "text", "aria-invalid": isQueryInValid ? true : false, autoComplete: "off", id: "advance-search-typeahead", "aria-label": t('Enter search query'), "aria-describedby": "advance-query-error-helper" })),
-                inputString && (React.createElement(Button, { onClick: onClear, className: "pf-c-button pf-m-plain pf-c-select__toggle-clear", variant: "plain", "data-tracking-id": "clear-search", "aria-label": t('Clear this search') },
-                    React.createElement(TimesCircleIcon, null)))),
-            isAutoCompleteListVisible && (React.createElement("ul", { className: "pf-c-select__menu", "aria-labelledby": "advance-search-typeahead-label", role: "listbox" }, autoCompleteList.map((item, index) => (React.createElement("li", { key: index, role: "presentation", className: `pf-c-select__menu-wrapper ${selectedItemIndex === index ? 'pf-m-focus' : ''}` },
-                React.createElement("button", { type: "button", onClick: (e) => onItemClick(item.value), className: "pf-c-select__menu-item", "aria-selected": selectedItemIndex === index ? true : false, role: "option" }, item.display))))))),
-        React.createElement(Button, { type: "button", variant: "primary", "data-tracking-id": "case-list-adv-search-button", className: "pf-u-ml-sm", onClick: onSearchSubmit, isDisabled: isAdvancedSearchButtonDisabled },
+        React.createElement("div", { className: "pf-v5-c-select pf-m-expanded", ref: dropdownWrapperRef },
+            React.createElement(TextInputGroup, null,
+                React.createElement(TextInputGroupMain, { value: inputString, onChange: (event, value) => onQueryStringChange(value), onFocus: onInputFocus, ref: searchInputRef, onKeyDown: onKeyDown, placeholder: t('i18nEnterSolrQuery', 'Enter SOLR query, for example: severity:"1 (Urgent)" and status:"Waiting on Customer"'), className: "pf-v5-u-pr-2xl", type: "text", "aria-invalid": isQueryInValid ? true : false, autoComplete: "off", id: "advance-search-typeahead", "aria-label": t('Enter search query'), "aria-describedby": "advance-query-error-helper" }),
+                inputString && (React.createElement(TextInputGroupUtilities, null,
+                    React.createElement(Button, { onClick: onClear, variant: "plain", "data-tracking-id": "clear-search", "aria-label": t('Clear this search') }, inputString && isParsingSuccessful ? (React.createElement(Flex, { justifyContent: { default: 'justifyContentSpaceBetween' } },
+                        React.createElement(FlexItem, null,
+                            React.createElement(Icon, { size: "md" },
+                                React.createElement(CheckCircleIcon, { color: "#3E8635" }))),
+                        React.createElement(FlexItem, null,
+                            React.createElement(TimesCircleIcon, null)))) : (React.createElement(TimesCircleIcon, null)))))),
+            isAutoCompleteListVisible && (React.createElement("ul", { className: "pf-v5-c-select__menu", "aria-labelledby": "advance-search-typeahead-label", role: "listbox" }, autoCompleteList.map((item, index) => (React.createElement("li", { key: index, role: "presentation", className: `pf-v5-c-select__menu-wrapper ${selectedItemIndex === index ? 'pf-m-focus' : ''}` },
+                React.createElement("button", { type: "button", onClick: (e) => onItemClick(item.value), className: "pf-v5-c-select__menu-item", "aria-selected": selectedItemIndex === index ? true : false, role: "option" }, item.display))))))),
+        React.createElement(Button, { type: "button", variant: "primary", "data-tracking-id": "case-list-adv-search-button", className: "pf-v5-u-ml-sm", onClick: onSearchSubmit, isDisabled: isAdvancedSearchButtonDisabled },
             React.createElement(Trans, null, "Search")),
         React.createElement(Button, { variant: "link", onClick: onBasicClick, "data-tracking-id": "case-list-basic-toggle-button" },
             React.createElement(Trans, null, "Basic")),
-        React.createElement(Button, { variant: "link", className: "pf-u-px-0", component: "a", rel: "noopener noreferrer", target: "_blank", href: "https://source.redhat.com/communitiesatredhat/applications/integration-community-of-practice/all/testallin/all_in_blog/advanced_search_in_the_customer_support_tool", "data-tracking-id": "advance-search-guide" },
+        React.createElement(Button, { variant: "link", className: "pf-v5-u-px-0", component: "a", rel: "noopener noreferrer", target: "_blank", "aria-label": "Advanced search guide", href: "https://source.redhat.com/communitiesatredhat/applications/integration-community-of-practice/all/testallin/all_in_blog/advanced_search_in_the_customer_support_tool", "data-tracking-id": "advance-search-guide" },
             React.createElement(InfoIcon, null))));
 }

package/lib/esm/components/case-list/case-search/BookmarkedSearchesSelector.d.ts

@@ -1,3 +1,4 @@
+import React from 'react';
 import { CaseSearchQueryType } from '../../../enums/caseSearch';
 interface IProps {
     currentCaseSearchString: string;
@@ -5,6 +6,6 @@ interface IProps {
     isAdvancedSearchValid: boolean;
     defaultSavedSearchName: string;
 }
-export declare function BookmarkedSearchesSelector(props: IProps): JSX.Element;
+export declare function BookmarkedSearchesSelector(props: IProps): React.JSX.Element;
 export {};
 //# sourceMappingURL=BookmarkedSearchesSelector.d.ts.map

package/lib/esm/components/case-list/case-search/BookmarkedSearchesSelector.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"BookmarkedSearchesSelector.d.ts","sourceRoot":"","sources":["../../../../../src/components/case-list/case-search/BookmarkedSearchesSelector.tsx"],"names":[],"mappings":"AAwBA,OAAO,EAAE,mBAAmB,EAAE,MAAM,2BAA2B,CAAC;AAahE,UAAU,MAAM;IACZ,uBAAuB,EAAE,MAAM,CAAC;IAChC,iBAAiB,EAAE,mBAAmB,CAAC;IACvC,qBAAqB,EAAE,OAAO,CAAC;IAC/B,sBAAsB,EAAE,MAAM,CAAC;CAClC;AAED,wBAAgB,0BAA0B,CAAC,KAAK,EAAE,MAAM,eAgTvD"}
+{"version":3,"file":"BookmarkedSearchesSelector.d.ts","sourceRoot":"","sources":["../../../../../src/components/case-list/case-search/BookmarkedSearchesSelector.tsx"],"names":[],"mappings":"AAkBA,OAAO,KAAkD,MAAM,OAAO,CAAC;AAGvE,OAAO,EAAE,mBAAmB,EAAE,MAAM,2BAA2B,CAAC;AAahE,UAAU,MAAM;IACZ,uBAAuB,EAAE,MAAM,CAAC;IAChC,iBAAiB,EAAE,mBAAmB,CAAC;IACvC,qBAAqB,EAAE,OAAO,CAAC;IAC/B,sBAAsB,EAAE,MAAM,CAAC;CAClC;AAED,wBAAgB,0BAA0B,CAAC,KAAK,EAAE,MAAM,qBAgTvD"}

package/lib/esm/components/case-list/case-search/BookmarkedSearchesSelector.js

@@ -7,7 +7,8 @@ var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, ge
         step((generator = generator.apply(thisArg, _arguments || [])).next());
     });
 };
-import { Button, ButtonVariant, Dropdown, DropdownItem, DropdownSeparator, DropdownToggle, DropdownToggleAction, Split, SplitItem, } from '@patternfly/react-core';
+import { Button, ButtonVariant, Split, SplitItem } from '@patternfly/react-core';
+import { Dropdown, DropdownItem, DropdownSeparator, DropdownToggle, DropdownToggleAction, } from '@patternfly/react-core/deprecated';
 import PencilAltIcon from '@patternfly/react-icons/dist/js/icons/pencil-alt-icon';
 import StarIcon from '@patternfly/react-icons/dist/js/icons/star-icon';
 import { ConfirmationServiceProvider } from '@rh-support/components';
@@ -166,16 +167,16 @@ export function BookmarkedSearchesSelector(props) {
         .sort()
         .map((bookmarkedSearch) => {
         var _a;
-        return (React.createElement("li", { className: "pf-c-dropdown__menu-item pf-u-p-xs", key: bookmarkedSearch },
+        return (React.createElement("li", { className: "pf-v5-c-dropdown__menu-item pf-v5-u-p-xs", key: bookmarkedSearch },
             React.createElement(Split, { key: `split-parent-${bookmarkedSearch}` },
                 React.createElement(SplitItem, { isFilled: true, key: `split-left-${bookmarkedSearch}` },
-                    React.createElement(Button, { variant: ButtonVariant.plain, isBlock: true, className: "pf-u-text-align-left", onClick: onBookmarkSelectorChange(bookmarkedSearch, bookmarkedSearches[bookmarkedSearch], true) },
-                        ((_a = bookmarkedSearches[bookmarkedSearch]) === null || _a === void 0 ? void 0 : _a.defaultChecked) && (React.createElement(StarIcon, { title: "{t('Default search')}", color: "#F0AB00", className: "pf-u-mr-sm", "aria-label": t('Default search') })),
+                    React.createElement(Button, { variant: ButtonVariant.plain, isBlock: true, className: "pf-v5-u-text-align-left", onClick: onBookmarkSelectorChange(bookmarkedSearch, bookmarkedSearches[bookmarkedSearch], true) },
+                        ((_a = bookmarkedSearches[bookmarkedSearch]) === null || _a === void 0 ? void 0 : _a.defaultChecked) && (React.createElement(StarIcon, { title: "{t('Default search')}", color: "#F0AB00", className: "pf-v5-u-mr-sm", "aria-label": t('Default search') })),
                         ' ',
                         bookmarkedSearch)),
                 React.createElement(SplitItem, { key: `split-right-${bookmarkedSearch}` },
                     ' ',
-                    React.createElement(Button, { "aria-label": t('Edit or delete saved search'), className: "pf-u-pr-sm", onClick: onEditSavedSearchClick(bookmarkedSearch), variant: ButtonVariant.link, icon: React.createElement(PencilAltIcon, null) })))));
+                    React.createElement(Button, { "aria-label": t('Edit or delete saved search'), className: "pf-v5-u-pr-sm", onClick: onEditSavedSearchClick(bookmarkedSearch), variant: ButtonVariant.link, icon: React.createElement(PencilAltIcon, null) })))));
     });
     const renderMostRecentSearch = [
         React.createElement(DropdownItem, { key: "most-recent-search", component: "button", onClick: onBookmarkSelectorChange('', mostRecentSearch, true) },
@@ -193,7 +194,7 @@ export function BookmarkedSearchesSelector(props) {
     const advancedSearchPhraseIsNotValid = filterState.filterQueryInfo.type === CaseSearchQueryType.ADVANCED && !props.isAdvancedSearchValid;
     const noFilterOrSearchQueryApplied = !props.currentCaseSearchString && (isOnlyDefaultFilterApplied(filterState) || isNoFilterApplied(filterState));
     return (React.createElement(React.Fragment, null,
-        React.createElement("div", { className: "bookmark-search-dropdown-wrapper" },
+        React.createElement("div", { className: "bookmark-search-dropdown-wrapper", "data-tracking-id": "bookmark-search-id" },
             React.createElement(Dropdown, { className: "bookmark-search-dropdown", isOpen: isMenuOpen, dropdownItems: renderListItems, toggle: React.createElement(DropdownToggle, { splitButtonItems: [
                         React.createElement(DropdownToggleAction, { onClick: onSaveForLaterClick, key: "action", isDisabled: !!selectedSearch ||
                                 noFilterOrSearchQueryApplied ||

package/lib/esm/components/case-list/case-search/CaseSearch.d.ts

@@ -1,6 +1,7 @@
+import React from 'react';
 interface IProps {
     defaultSavedSearchName?: string;
 }
-export declare function CaseSearch(props: IProps): JSX.Element;
+export declare function CaseSearch(props: IProps): React.JSX.Element;
 export {};
 //# sourceMappingURL=CaseSearch.d.ts.map

package/lib/esm/components/case-list/case-search/CaseSearch.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"CaseSearch.d.ts","sourceRoot":"","sources":["../../../../../src/components/case-list/case-search/CaseSearch.tsx"],"names":[],"mappings":"AAsBA,UAAU,MAAM;IACZ,sBAAsB,CAAC,EAAE,MAAM,CAAC;CACnC;AAED,wBAAgB,UAAU,CAAC,KAAK,EAAE,MAAM,eA0LvC"}
+{"version":3,"file":"CaseSearch.d.ts","sourceRoot":"","sources":["../../../../../src/components/case-list/case-search/CaseSearch.tsx"],"names":[],"mappings":"AAIA,OAAO,KAAuD,MAAM,OAAO,CAAC;AAkB5E,UAAU,MAAM;IACZ,sBAAsB,CAAC,EAAE,MAAM,CAAC;CACnC;AAED,wBAAgB,UAAU,CAAC,KAAK,EAAE,MAAM,qBA0LvC"}

package/lib/esm/components/case-list/case-search/CaseSearch.js

@@ -94,7 +94,7 @@ export function CaseSearch(props) {
     const renderBasicSearch = () => {
         return (React.createElement(React.Fragment, null,
             React.createElement("div", { className: "case-search-input-container" },
-                React.createElement(SearchInput, { className: "pf-u-w-100", placeholder: t('Search by keyword or case ID'), value: searchVal === null || searchVal === void 0 ? void 0 : searchVal.trim(), "data-tracking-id": "search-cases-text-input", id: "case-search-basic", "aria-label": t('Search by keyword or case ID'), onChange: onSearchValChange, onClear: clearSearchVal }),
+                React.createElement(SearchInput, { className: "pf-v5-u-w-100", placeholder: t('Search by keyword or case ID'), value: searchVal === null || searchVal === void 0 ? void 0 : searchVal.trim(), "data-tracking-id": "search-cases-text-input", id: "case-search-basic", "aria-label": t('Search by keyword or case ID'), onChange: (_event, val) => onSearchValChange(val), onClear: clearSearchVal }),
                 React.createElement(Button, { variant: "primary", type: "submit", className: "search-btn", "data-tracking-id": "case-list-search-button", isDisabled: isSearchButtonDisabled },
                     React.createElement(Trans, null, "Search")),
                 canUseAdvancedSearch && (React.createElement(Button, { variant: "link", onClick: () => onSearchTypeChange(CaseSearchQueryType.ADVANCED), isDisabled: isFetching, "data-tracking-id": "case-list-adv-toggle-button" },
@@ -102,7 +102,7 @@ export function CaseSearch(props) {
     };
     const renderAdvanceSearch = () => {
         return canUseAdvancedSearch ? (React.createElement(React.Fragment, null,
-            React.createElement(AdvanceSearch, { isSearchDisabled: isSearchButtonDisabled, onSearchValChange: onSearchValChange, onSearchClear: clearAdvancedSearchVal, onSearchSubmit: onCaseSearchAdvanced, onSearchTypeChange: onSearchTypeChange, onAdvancedSearchValidation: (isValid) => setIsAdvancedSearchValid(isValid) }))) : (React.createElement(React.Fragment, null));
+            React.createElement(AdvanceSearch, { isSearchDisabled: isSearchButtonDisabled, onSearchValChange: onSearchValChange, onSearchClear: clearAdvancedSearchVal, onSearchSubmit: onCaseSearchAdvanced, onSearchTypeChange: onSearchTypeChange, onAdvancedSearchValidation: (isValid) => setIsAdvancedSearchValid(isValid) }))) : (renderBasicSearch());
     };
     return (React.createElement(React.Fragment, null,
         React.createElement("form", { onSubmit: handleSubmit, onKeyDown: handleSearchInputKeyDown },

package/lib/esm/components/case-list/case-search/SaveCaseSearchModal.d.ts

@@ -1,3 +1,4 @@
+import React from 'react';
 interface IProps {
     isModalOpen: boolean;
     modalToggle: () => void;
@@ -7,6 +8,6 @@ interface IProps {
     currentSearchType: string;
     clearSearchName: () => void;
 }
-export declare function SaveCaseSearchModal({ isModalOpen, modalToggle, isAdding, selectedSearchNameToEdit, currentCaseSearchString, currentSearchType, clearSearchName, }: IProps): JSX.Element;
+export declare function SaveCaseSearchModal({ isModalOpen, modalToggle, isAdding, selectedSearchNameToEdit, currentCaseSearchString, currentSearchType, clearSearchName, }: IProps): React.JSX.Element;
 export {};
 //# sourceMappingURL=SaveCaseSearchModal.d.ts.map

package/lib/esm/components/case-list/case-search/SaveCaseSearchModal.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"SaveCaseSearchModal.d.ts","sourceRoot":"","sources":["../../../../../src/components/case-list/case-search/SaveCaseSearchModal.tsx"],"names":[],"mappings":"AA6BA,UAAU,MAAM;IACZ,WAAW,EAAE,OAAO,CAAC;IACrB,WAAW,EAAE,MAAM,IAAI,CAAC;IACxB,QAAQ,EAAE,OAAO,CAAC;IAClB,wBAAwB,EAAE,MAAM,CAAC;IACjC,uBAAuB,EAAE,MAAM,CAAC;IAChC,iBAAiB,EAAE,MAAM,CAAC;IAC1B,eAAe,EAAE,MAAM,IAAI,CAAC;CAC/B;AAOD,wBAAgB,mBAAmB,CAAC,EAChC,WAAW,EACX,WAAW,EACX,QAAQ,EACR,wBAAwB,EACxB,uBAAuB,EACvB,iBAAiB,EACjB,eAAe,GAClB,EAAE,MAAM,eAiSR"}
+{"version":3,"file":"SaveCaseSearchModal.d.ts","sourceRoot":"","sources":["../../../../../src/components/case-list/case-search/SaveCaseSearchModal.tsx"],"names":[],"mappings":"AAyBA,OAAO,KAA0C,MAAM,OAAO,CAAC;AAO/D,UAAU,MAAM;IACZ,WAAW,EAAE,OAAO,CAAC;IACrB,WAAW,EAAE,MAAM,IAAI,CAAC;IACxB,QAAQ,EAAE,OAAO,CAAC;IAClB,wBAAwB,EAAE,MAAM,CAAC;IACjC,uBAAuB,EAAE,MAAM,CAAC;IAChC,iBAAiB,EAAE,MAAM,CAAC;IAC1B,eAAe,EAAE,MAAM,IAAI,CAAC;CAC/B;AAOD,wBAAgB,mBAAmB,CAAC,EAChC,WAAW,EACX,WAAW,EACX,QAAQ,EACR,wBAAwB,EACxB,uBAAuB,EACvB,iBAAiB,EACjB,eAAe,GAClB,EAAE,MAAM,qBA4SR"}

package/lib/esm/components/case-list/case-search/SaveCaseSearchModal.js

@@ -7,7 +7,7 @@ var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, ge
         step((generator = generator.apply(thisArg, _arguments || [])).next());
     });
 };
-import { Button, ButtonVariant, Checkbox, Form, FormGroup, Modal, ModalVariant, TextArea, TextInput, } from '@patternfly/react-core';
+import { Button, ButtonVariant, Checkbox, Form, FormGroup, FormHelperText, HelperText, HelperTextItem, Modal, ModalVariant, TextArea, TextInput, } from '@patternfly/react-core';
 import { ToastNotification, useConfirmation } from '@rh-support/components';
 import { GlobalMetadataDispatchContext, GlobalMetadataStateContext, updateUserPreferences, UserPreferencesKeys, } from '@rh-support/react-context';
 import find from 'lodash/find';
@@ -31,6 +31,7 @@ export function SaveCaseSearchModal({ isModalOpen, modalToggle, isAdding, select
     const [isUpdating, setIsUpdating] = useState(false);
     const [isDuplicateNameError, setIsDuplicateNameError] = useState(false);
     const [saveButtonIsClicked, setSaveButtonIsClicked] = useState(false);
+    const [queryStr, setQueryStr] = useState('');
     const filterState = useContext(CaseListFilterStateContext);
     const { filterQueryInfo, filterInfo, sortInfo } = filterState;
     const { globalMetadataState } = useContext(GlobalMetadataStateContext);
@@ -137,39 +138,45 @@ export function SaveCaseSearchModal({ isModalOpen, modalToggle, isAdding, select
         let queryStr = '';
         let sort = '';
         let dir = '';
-        if (isAdding) {
-            // new saved search
-            queryStr =
-                currentSearchType === CaseSearchQueryType.BASIC
-                    ? createUserFriendlyQueryFromFilterState(filterInfo, currentCaseSearchString)
-                    : currentCaseSearchString;
-            const sortInfo = filterState.sortInfo;
-            const sortField = sortInfo === null || sortInfo === void 0 ? void 0 : sortInfo.column;
-            sort = (caseTableColumSortNamesMap === null || caseTableColumSortNamesMap === void 0 ? void 0 : caseTableColumSortNamesMap[sortField]) || sortField || '';
-            dir = directionMap[sortInfo === null || sortInfo === void 0 ? void 0 : sortInfo.direction] || '';
-        }
-        else if (selectedSearchNameToEdit && previousBookmarkedSearchesObj[selectedSearchNameToEdit]) {
-            // already saved seach
-            queryStr =
-                currentSearchType === CaseSearchQueryType.BASIC
-                    ? createUserFriendlyQueryFromFilterState(previousBookmarkedSearchesObj[selectedSearchNameToEdit].filterState, previousBookmarkedSearchesObj[selectedSearchNameToEdit].queryString)
-                    : previousBookmarkedSearchesObj[selectedSearchNameToEdit].queryString;
-            const sortInfo = (_a = previousBookmarkedSearchesObj[selectedSearchNameToEdit]) === null || _a === void 0 ? void 0 : _a.sortState;
-            const sortField = sortInfo === null || sortInfo === void 0 ? void 0 : sortInfo.column;
-            sort = (caseTableColumSortNamesMap === null || caseTableColumSortNamesMap === void 0 ? void 0 : caseTableColumSortNamesMap[sortField]) || sortField || '';
-            dir = directionMap[sortInfo === null || sortInfo === void 0 ? void 0 : sortInfo.direction] || '';
-        }
-        else {
-            // while saving search name is in progress and modal is open,
-            // localSavedSearchName in previousBookmarkedSearchesObj is used to populate query inputbox
-            queryStr = previousBookmarkedSearchesObj[localSavedSearchName] || '';
-            const sortInfo = (_b = previousBookmarkedSearchesObj[localSavedSearchName]) === null || _b === void 0 ? void 0 : _b.sortState;
-            const sortField = sortInfo === null || sortInfo === void 0 ? void 0 : sortInfo.column;
-            sort = (caseTableColumSortNamesMap === null || caseTableColumSortNamesMap === void 0 ? void 0 : caseTableColumSortNamesMap[sortField]) || sortField || '';
-            dir = directionMap[sortInfo === null || sortInfo === void 0 ? void 0 : sortInfo.direction] || '';
+        if (!hydraUserPreferences.isFetching) {
+            if (isAdding) {
+                // new saved search
+                queryStr =
+                    currentSearchType === CaseSearchQueryType.BASIC
+                        ? createUserFriendlyQueryFromFilterState(filterInfo, currentCaseSearchString)
+                        : currentCaseSearchString;
+                const sortInfo = filterState.sortInfo;
+                const sortField = sortInfo === null || sortInfo === void 0 ? void 0 : sortInfo.column;
+                sort = (caseTableColumSortNamesMap === null || caseTableColumSortNamesMap === void 0 ? void 0 : caseTableColumSortNamesMap[sortField]) || sortField || '';
+                dir = directionMap[sortInfo === null || sortInfo === void 0 ? void 0 : sortInfo.direction] || '';
+            }
+            else if (selectedSearchNameToEdit && previousBookmarkedSearchesObj[selectedSearchNameToEdit]) {
+                // already saved seach
+                queryStr =
+                    currentSearchType === CaseSearchQueryType.BASIC
+                        ? createUserFriendlyQueryFromFilterState(previousBookmarkedSearchesObj[selectedSearchNameToEdit].filterState, previousBookmarkedSearchesObj[selectedSearchNameToEdit].queryString)
+                        : previousBookmarkedSearchesObj[selectedSearchNameToEdit].queryString;
+                const sortInfo = (_a = previousBookmarkedSearchesObj[selectedSearchNameToEdit]) === null || _a === void 0 ? void 0 : _a.sortState;
+                const sortField = sortInfo === null || sortInfo === void 0 ? void 0 : sortInfo.column;
+                sort = (caseTableColumSortNamesMap === null || caseTableColumSortNamesMap === void 0 ? void 0 : caseTableColumSortNamesMap[sortField]) || sortField || '';
+                dir = directionMap[sortInfo === null || sortInfo === void 0 ? void 0 : sortInfo.direction] || '';
+            }
+            else {
+                // while saving search name is in progress and modal is open,
+                // localSavedSearchName in previousBookmarkedSearchesObj is used to populate query inputbox
+                queryStr = previousBookmarkedSearchesObj[localSavedSearchName] || '';
+                const sortInfo = (_b = previousBookmarkedSearchesObj[localSavedSearchName]) === null || _b === void 0 ? void 0 : _b.sortState;
+                const sortField = sortInfo === null || sortInfo === void 0 ? void 0 : sortInfo.column;
+                sort = (caseTableColumSortNamesMap === null || caseTableColumSortNamesMap === void 0 ? void 0 : caseTableColumSortNamesMap[sortField]) || sortField || '';
+                dir = directionMap[sortInfo === null || sortInfo === void 0 ? void 0 : sortInfo.direction] || '';
+            }
+            setQueryStr(queryStr ? `${queryStr} Sort by: ${sort}, ${dir}` : '');
         }
-        return queryStr ? `${queryStr} Sort by: ${sort}, ${dir}` : '';
     };
+    useEffect(() => {
+        getQueryStr();
+        // eslint-disable-next-line react-hooks/exhaustive-deps
+    }, [hydraUserPreferences]);
     useEffect(() => {
         var _a;
         setLocalSavedSearchName(selectedSearchNameToEdit);
@@ -183,22 +190,23 @@ export function SaveCaseSearchModal({ isModalOpen, modalToggle, isAdding, select
             React.createElement(Button, { key: "cancel", variant: ButtonVariant.secondary, "data-tracking-id": "case-list-bookmark-search-canceled", onClick: closeModal },
                 React.createElement(Trans, null, "Cancel")),
             React.createElement(React.Fragment, null,
-                React.createElement(Checkbox, { className: "pf-u-ml-md save-search-set-default", key: "set-as-default", "aria-label": t('Set as default'), id: "case-list-bookmark-search-set-as-default", "data-tracking-id": "case-list-bookmark-search-set-as-default", isChecked: localDefaultChecked, onChange: (checkbox, e) => {
+                React.createElement(Checkbox, { className: "pf-v5-u-ml-md save-search-set-default", key: "set-as-default", "aria-label": t('Set as default'), id: "case-list-bookmark-search-set-as-default", "data-tracking-id": "case-list-bookmark-search-set-as-default", isChecked: localDefaultChecked, onChange: (e, checkbox) => {
                         e.stopPropagation();
                         setLocalDefaultChecked(!localDefaultChecked);
                     } }),
-                ' ',
                 "Set as default"),
             React.createElement(React.Fragment, null, !isAdding && (React.createElement(Button, { key: "delete", variant: ButtonVariant.link, isDanger: true, "data-tracking-id": "case-list-bookmark-search-deleted", onClick: deleteSavedSearch, style: { marginLeft: 'auto' } },
                 React.createElement(Trans, null, "Remove")))),
         ] },
         React.createElement(Form, { className: "save-search-form" },
-            React.createElement(FormGroup, { label: React.createElement("span", { className: "save-for-later-label-name" }, t('Name')), isRequired: true, fieldId: "save-search-name", validated: saveButtonIsClicked && isDuplicateNameError ? 'error' : 'default', helperTextInvalid: t('Filter with same name already exists. Please enter a unique name.'), className: "form-group pull-bottom-narrow save-for-later-name" },
-                React.createElement(TextInput, { isRequired: true, type: "text", placeholder: t('Enter a unique name to reference in the future'), id: "save-search-name", name: "save-search-name", "aria-describedby": "save-search-name-helper", value: localSavedSearchName, onChange: handleSaveSearchNameChange, className: `form-control${saveButtonIsClicked && (isDuplicateNameError || isEmpty(localSavedSearchName.trim()))
-                        ? ' form-invalid'
-                        : ''}`, validated: saveButtonIsClicked && (isDuplicateNameError || isEmpty(localSavedSearchName.trim()))
+            React.createElement(FormGroup, { label: React.createElement("span", { className: "save-for-later-label-name" }, t('Name')), isRequired: true, fieldId: "save-search-name", className: "form-group pull-bottom-narrow save-for-later-name" },
+                saveButtonIsClicked && isDuplicateNameError && (React.createElement(FormHelperText, null,
+                    React.createElement(HelperText, null,
+                        React.createElement(HelperTextItem, null,
+                            React.createElement(Trans, null, "Filter with same name already exists. Please enter a unique name."))))),
+                React.createElement(TextInput, { isRequired: true, type: "text", placeholder: t('Enter a unique name to reference in the future'), id: "save-search-name", name: "save-search-name", "aria-describedby": "save-search-name-helper", value: localSavedSearchName, onChange: (_event, value) => handleSaveSearchNameChange(value), validated: saveButtonIsClicked && (isDuplicateNameError || isEmpty(localSavedSearchName.trim()))
                         ? 'error'
                         : 'default' })),
-            React.createElement(FormGroup, { label: React.createElement("span", { className: "save-for-later-label-query" }, t('Search and filter query')), isRequired: true, fieldId: "filter-query", className: "form-group pf-u-mt-lg save-for-later-query", validated: saveButtonIsClicked ? 'error' : 'default' },
-                React.createElement(TextArea, { isRequired: true, type: "text", id: "filter-query", name: "filter-query", "aria-describedby": "filter-query-helper", value: getQueryStr(), className: "form-control", isDisabled: true })))));
+            React.createElement(FormGroup, { label: React.createElement("span", { className: "save-for-later-label-query" }, t('Search and filter query')), isRequired: true, fieldId: "filter-query", className: "form-group pf-v5-u-mt-lg save-for-later-query" },
+                React.createElement(TextArea, { isRequired: true, type: "text", id: "filter-query", name: "filter-query", "aria-describedby": "filter-query-helper", value: queryStr, isDisabled: true, resizeOrientation: "vertical" })))));
 }

package/lib/esm/components/case-list/case-search/useAdvanceSearchParser.js

@@ -101,7 +101,7 @@ export default function useAdvanceSearchParser({ onInit }) {
     / "createdDate" {return "${SolrKeys.createdDate}";}
     / "closedDate" {return "${SolrKeys.caseClosedDate}";}
     / "description" {return "${SolrKeys.description}";}
-    / "summary" {return "${SolrKeys.caseSummary}";}
+    / "title" {return "${SolrKeys.caseSummary}";}
     / "lastModifiedDate" {return "${SolrKeys.modifiedDate}";}
     / "lastModifiedByName" {return "${SolrKeys.modifiedBy}";}
     / "ownerName" {return "${SolrKeys.contactName}";}

package/lib/esm/components/escalations/EscalationForm.d.ts

@@ -23,6 +23,6 @@ interface IProps {
     type: escalationType;
     onSuccessMessage?: string;
 }
-export declare function EscalationForm(props: IProps): JSX.Element;
+export declare function EscalationForm(props: IProps): React.JSX.Element;
 export {};
 //# sourceMappingURL=EscalationForm.d.ts.map

package/lib/esm/components/escalations/EscalationForm.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"EscalationForm.d.ts","sourceRoot":"","sources":["../../../../src/components/escalations/EscalationForm.tsx"],"names":[],"mappings":"AAAA,OAAO,0BAA0B,CAAC;AAiBlC,OAAO,EAAE,gBAAgB,EAAE,WAAW,EAAE,MAAM,0BAA0B,CAAC;AAIzE,OAAO,KAA2B,MAAM,OAAO,CAAC;AAGhD,OAAO,EAAE,cAAc,EAAE,MAAM,wBAAwB,CAAC;AAKxD,MAAM,WAAW,UAAW,SAAQ,gBAAgB;IAChD,KAAK,EAAE,MAAM,CAAC;IACd,UAAU,EAAE,KAAK,CAAC,SAAS,CAAC;IAC5B,SAAS,EAAE,OAAO,GAAG,UAAU,GAAG,QAAQ,GAAG,UAAU,CAAC;IACxD,IAAI,CAAC,EACC,MAAM,GACN,MAAM,GACN,gBAAgB,GAChB,OAAO,GACP,OAAO,GACP,QAAQ,GACR,UAAU,GACV,QAAQ,GACR,KAAK,GACL,MAAM,GACN,KAAK,CAAC;IACZ,OAAO,CAAC,EAAE,WAAW,EAAE,GAAG,MAAM,EAAE,CAAC;IACnC,UAAU,EAAE,OAAO,CAAC;IACpB,UAAU,CAAC,EAAE,GAAG,EAAE,CAAC;IACnB,iBAAiB,CAAC,EAAE,MAAM,CAAC;IAC3B,0BAA0B,CAAC,EAAE,OAAO,CAAC;CACxC;AAED,MAAM,WAAW,YAAY;IACzB,WAAW,EAAE,MAAM,CAAC;IACpB,aAAa,EAAE,UAAU,EAAE,CAAC;CAC/B;AAED,UAAU,MAAM;IACZ,YAAY,EAAE,YAAY,EAAE,CAAC;IAC7B,gBAAgB,EAAE,GAAG,CAAC;IACtB,IAAI,EAAE,cAAc,CAAC;IACrB,gBAAgB,CAAC,EAAE,MAAM,CAAC;CAC7B;AAKD,wBAAgB,cAAc,CAAC,KAAK,EAAE,MAAM,eA8O3C"}
+{"version":3,"file":"EscalationForm.d.ts","sourceRoot":"","sources":["../../../../src/components/escalations/EscalationForm.tsx"],"names":[],"mappings":"AAAA,OAAO,0BAA0B,CAAC;AAoBlC,OAAO,EAAE,gBAAgB,EAAE,WAAW,EAAE,MAAM,0BAA0B,CAAC;AAIzE,OAAO,KAA2B,MAAM,OAAO,CAAC;AAGhD,OAAO,EAAE,cAAc,EAAE,MAAM,wBAAwB,CAAC;AAKxD,MAAM,WAAW,UAAW,SAAQ,gBAAgB;IAChD,KAAK,EAAE,MAAM,CAAC;IACd,UAAU,EAAE,KAAK,CAAC,SAAS,CAAC;IAC5B,SAAS,EAAE,OAAO,GAAG,UAAU,GAAG,QAAQ,GAAG,UAAU,CAAC;IACxD,IAAI,CAAC,EACC,MAAM,GACN,MAAM,GACN,gBAAgB,GAChB,OAAO,GACP,OAAO,GACP,QAAQ,GACR,UAAU,GACV,QAAQ,GACR,KAAK,GACL,MAAM,GACN,KAAK,CAAC;IACZ,OAAO,CAAC,EAAE,WAAW,EAAE,GAAG,MAAM,EAAE,CAAC;IACnC,UAAU,EAAE,OAAO,CAAC;IACpB,UAAU,CAAC,EAAE,GAAG,EAAE,CAAC;IACnB,iBAAiB,CAAC,EAAE,MAAM,CAAC;IAC3B,0BAA0B,CAAC,EAAE,OAAO,CAAC;CACxC;AAED,MAAM,WAAW,YAAY;IACzB,WAAW,EAAE,MAAM,CAAC;IACpB,aAAa,EAAE,UAAU,EAAE,CAAC;CAC/B;AAED,UAAU,MAAM;IACZ,YAAY,EAAE,YAAY,EAAE,CAAC;IAC7B,gBAAgB,EAAE,GAAG,CAAC;IACtB,IAAI,EAAE,cAAc,CAAC;IACrB,gBAAgB,CAAC,EAAE,MAAM,CAAC;CAC7B;AAKD,wBAAgB,cAAc,CAAC,KAAK,EAAE,MAAM,qBAwP3C"}

package/lib/esm/components/escalations/EscalationForm.js

@@ -20,7 +20,7 @@ var __rest = (this && this.__rest) || function (s, e) {
 };
 import '../../css/escalation.css';
 import { escalations } from '@cee-eng/hydrajs';
-import { ActionGroup, Button, Checkbox, Form, FormGroup, FormSelect, FormSelectOption, TextArea, TextInput, } from '@patternfly/react-core';
+import { ActionGroup, Button, Checkbox, Form, FormGroup, FormHelperText, FormSelect, FormSelectOption, HelperText, HelperTextItem, TextArea, TextInput, } from '@patternfly/react-core';
 import { AlertMessage, AlertType, useFetch } from '@rh-support/components';
 import { useGlobalStateContext } from '@rh-support/react-context';
 import { scrollIntoView } from '@rh-support/utils';
@@ -70,17 +70,17 @@ export function EscalationForm(props) {
             ? mapToValueLabel(field.options)
             : field.options;
         return (React.createElement(React.Fragment, null,
-            React.createElement(FormSelect, { isRequired: field.isRequired || false, id: field.id, onChange: onFormValueChange, value: formState[field.id], name: field.id }, options.map((option, index) => (React.createElement(FormSelectOption, { key: index, value: option.value, label: option.label })))),
-            field.showTextAreaForOtherOption && formState[field.id] === 'Other' && (React.createElement(TextArea, { id: `${field.id}Text`, value: formState[`${field.id}Text`], onChange: onFormValueChange, "aria-describedby": `${field.id}-helper`, name: `${field.id}Text` }))));
+            React.createElement(FormSelect, { isRequired: field.isRequired || false, id: field.id, onChange: (ev, value) => onFormValueChange(value, ev), value: formState[field.id], name: field.id }, options.map((option, index) => (React.createElement(FormSelectOption, { key: index, value: option.value, label: option.label })))),
+            field.showTextAreaForOtherOption && formState[field.id] === 'Other' && (React.createElement(TextArea, { id: `${field.id}Text`, value: formState[`${field.id}Text`], onChange: (ev, value) => onFormValueChange(value, ev), "aria-describedby": `${field.id}-helper`, name: `${field.id}Text`, resizeOrientation: "vertical" }))));
     };
     const renderTextInput = (field) => {
-        return (React.createElement(TextInput, { validated: checkIfValid(field) ? 'default' : 'error', isRequired: field.isRequired || false, id: field.id, type: field.type || 'text', value: formState[field.id], onChange: onFormValueChange, "aria-describedby": `${field.id}-helper`, name: field.id }));
+        return (React.createElement(TextInput, { validated: checkIfValid(field) ? 'default' : 'error', isRequired: field.isRequired || false, id: field.id, type: field.type || 'text', value: formState[field.id], onChange: (ev, value) => onFormValueChange(value, ev), "aria-describedby": `${field.id}-helper`, name: field.id }));
     };
     const renderTextArea = (field) => {
-        return (React.createElement(TextArea, { isRequired: field.isRequired || false, id: field.id, value: formState[field.id], onChange: onFormValueChange, "aria-describedby": `${field.id}-helper`, name: field.id }));
+        return (React.createElement(TextArea, { isRequired: field.isRequired || false, id: field.id, value: formState[field.id], onChange: (ev, value) => onFormValueChange(value, ev), "aria-describedby": `${field.id}-helper`, name: field.id, resizeOrientation: "vertical" }));
     };
     const renderCheckbox = (field) => {
-        return (React.createElement(Checkbox, { id: field.id, isChecked: formState[field.id], onChange: onFormValueChange, "aria-describedby": `${field.id}-helper`, name: field.id }));
+        return (React.createElement(Checkbox, { id: field.id, isChecked: formState[field.id], onChange: (ev, value) => onFormValueChange(value, ev), "aria-describedby": `${field.id}-helper`, name: field.id }));
     };
     const onFormValueChange = (value, ev) => {
         const newValue = { [ev.target.name]: value };
@@ -127,6 +127,13 @@ export function EscalationForm(props) {
     const isSendBtnDisabled = () => {
         return (requiredFields.some((item) => isFieldValueEmpty(formState[item])) || invalidfields.length > 0 || isFetching);
     };
+    const getHelperText = (field) => {
+        return checkIfValid(field)
+            ? typeof field.helperText === 'string'
+                ? t(field.helperText)
+                : ''
+            : t(field.helperTextInvalid || '');
+    };
     return (React.createElement(React.Fragment, null,
         React.createElement("div", { className: "escalation-alert-messages", ref: alertMessageSectionRef },
             React.createElement(AlertMessage, { show: isFetching, variant: AlertType.INFO, title: t('Creating your escalation request') }),
@@ -142,9 +149,11 @@ export function EscalationForm(props) {
                             React.createElement("span", { className: "cp-step-icon-custom" }, index + 1)),
                         React.createElement("div", { className: "cp-step-content" }, section.sectionName)),
                     React.createElement("div", { className: "escalation-form-fields" }, section.sectionFields.map((field) => {
-                        return (React.createElement(FormGroup, { key: field.id, label: t(field.label), isRequired: field.isRequired || false, fieldId: field.id, validated: checkIfValid(field) ? 'default' : 'error', helperText: typeof field.helperText === 'string'
-                                ? t(field.helperText || '')
-                                : field.helperText, helperTextInvalid: t(field.helperTextInvalid || '') }, renderFormField(field)));
+                        return (React.createElement(FormGroup, { key: field.id, label: t(field.label), isRequired: field.isRequired || false, fieldId: field.id },
+                            React.createElement(FormHelperText, null,
+                                React.createElement(HelperText, null,
+                                    React.createElement(HelperTextItem, { variant: checkIfValid(field) ? 'default' : 'error' }, getHelperText(field)))),
+                            renderFormField(field)));
                     }))));
             }),
             React.createElement(ActionGroup, null,

package/lib/esm/components/escalations/PartnerEscalation.d.ts

@@ -1,2 +1,3 @@
-export declare function PartnerEscalation(): JSX.Element;
+import React from 'react';
+export declare function PartnerEscalation(): React.JSX.Element;
 //# sourceMappingURL=PartnerEscalation.d.ts.map

package/lib/esm/components/escalations/PartnerEscalation.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"PartnerEscalation.d.ts","sourceRoot":"","sources":["../../../../src/components/escalations/PartnerEscalation.tsx"],"names":[],"mappings":"AA+CA,wBAAgB,iBAAiB,gBA0KhC"}
+{"version":3,"file":"PartnerEscalation.d.ts","sourceRoot":"","sources":["../../../../src/components/escalations/PartnerEscalation.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,MAAM,OAAO,CAAC;AA6C1B,wBAAgB,iBAAiB,sBA0KhC"}

package/lib/esm/components/index.d.ts

@@ -1,4 +1,4 @@
-import { IPfeCollapse } from '@rh-support/types/pfe/pfe-collapse';
+import React from 'react';
 import { RouteComponentProps } from 'react-router-dom';
 export interface ICasesRouteURLParams {
 }
@@ -10,23 +10,17 @@ declare global {
     interface Window {
         sessionjs: any;
         MSInputMethodContext: any;
-        chrometwo_require: (component: string[], callback: (...params: any[]) => any) => any;
         portal: any;
         Raven: any;
-        chrometwo_ready: any;
         seVersionInfo: {
             packageVersion: string;
             hydrajs: string;
         };
     }
-    namespace JSX {
-        interface IntrinsicElements extends IPfeCollapse {
-        }
-    }
     interface Document {
         documentMode: any;
     }
 }
-export declare function Cases(props: IProps): JSX.Element;
+export declare function Cases(props: IProps): React.JSX.Element;
 export {};
 //# sourceMappingURL=index.d.ts.map

package/lib/esm/components/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/index.tsx"],"names":[],"mappings":"AACA,OAAO,EAAE,YAAY,EAAE,MAAM,oCAAoC,CAAC;AAGlE,OAAO,EAAmB,mBAAmB,EAAU,MAAM,kBAAkB,CAAC;AAMhF,MAAM,WAAW,oBAAoB;CAAG;AACxC,UAAU,MAAM;IACZ,UAAU,EAAE,mBAAmB,CAAC,oBAAoB,CAAC,CAAC;IACtD,QAAQ,EAAE,MAAM,CAAC;CACpB;AAQD,OAAO,CAAC,MAAM,CAAC;IACX,UAAU,MAAM;QACZ,SAAS,EAAE,GAAG,CAAC;QACf,oBAAoB,EAAE,GAAG,CAAC;QAC1B,iBAAiB,EAAE,CAAC,SAAS,EAAE,MAAM,EAAE,EAAE,QAAQ,EAAE,CAAC,GAAG,MAAM,OAAA,KAAK,GAAG,KAAK,GAAG,CAAC;QAC9E,MAAM,EAAE,GAAG,CAAC;QACZ,KAAK,EAAE,GAAG,CAAC;QACX,eAAe,EAAE,GAAG,CAAC;QACrB,aAAa,EAAE;YACX,cAAc,EAAE,MAAM,CAAC;YACvB,OAAO,EAAE,MAAM,CAAC;SACnB,CAAC;KACL;IAED,UAAU,GAAG,CAAC;QACV,UAAU,iBAAkB,SAAQ,YAAY;SAAG;KACtD;IAED,UAAU,QAAQ;QACd,YAAY,EAAE,GAAG,CAAC;KACrB;CACJ;AAED,wBAAgB,KAAK,CAAC,KAAK,EAAE,MAAM,eAiBlC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/index.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAoB,MAAM,OAAO,CAAC;AACzC,OAAO,EAAmB,mBAAmB,EAAU,MAAM,kBAAkB,CAAC;AAQhF,MAAM,WAAW,oBAAoB;CAAG;AACxC,UAAU,MAAM;IACZ,UAAU,EAAE,mBAAmB,CAAC,oBAAoB,CAAC,CAAC;IACtD,QAAQ,EAAE,MAAM,CAAC;CACpB;AAED,OAAO,CAAC,MAAM,CAAC;IACX,UAAU,MAAM;QACZ,SAAS,EAAE,GAAG,CAAC;QACf,oBAAoB,EAAE,GAAG,CAAC;QAC1B,MAAM,EAAE,GAAG,CAAC;QACZ,KAAK,EAAE,GAAG,CAAC;QACX,aAAa,EAAE;YACX,cAAc,EAAE,MAAM,CAAC;YACvB,OAAO,EAAE,MAAM,CAAC;SACnB,CAAC;KACL;IAED,UAAU,QAAQ;QACd,YAAY,EAAE,GAAG,CAAC;KACrB;CACJ;AAED,wBAAgB,KAAK,CAAC,KAAK,EAAE,MAAM,qBAqBlC"}

package/lib/esm/components/index.js

@@ -1,22 +1,19 @@
-import { CustomElements, requireCustomElement } from '@rh-support/utils';
 import React, { useEffect } from 'react';
 import { Redirect, Route, Switch } from 'react-router-dom';
 import RouteUtils from '../utils/routeUtils';
 import { CaseList } from './case-list/CaseList';
+import { CaseListProvider } from './case-list/CaseListContext';
+import { CaseListFilterProvider } from './case-list/CaseListFilterContext';
 import { PartnerEscalation } from './escalations/PartnerEscalation';
-requireCustomElement([
-    {
-        element: CustomElements.pfeCollapse,
-        requireCb: () => require('@patternfly/pfe-collapse'),
-    },
-]);
 export function Cases(props) {
     RouteUtils.casesBasePath = props.basePath || '';
     // Loading app metadata
     useEffect(() => { }, []);
     return (React.createElement(Switch, null,
         React.createElement(Route, { path: `${RouteUtils.casesBasePath}/list`, exact: true },
-            React.createElement(CaseList, { routeProps: props.routeProps })),
+            React.createElement(CaseListProvider, null,
+                React.createElement(CaseListFilterProvider, null,
+                    React.createElement(CaseList, { routeProps: props.routeProps })))),
         React.createElement(Route, { path: `/partnerEscalationRequest`, exact: true },
             React.createElement(PartnerEscalation, null)),
         React.createElement(Redirect, { to: `${RouteUtils.casesBasePath}/list` })));