@rh-support/cases 2.1.29 → 2.1.31

package/lib/esm/components/case-list/case-list-filters/AccountsFilter.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"AccountsFilter.d.ts","sourceRoot":"","sources":["../../../../../src/components/case-list/case-list-filters/AccountsFilter.tsx"],"names":[],"mappings":"AACA,OAAO,EAAE,QAAQ,EAAE,sBAAsB,EAAE,MAAM,wCAAwC,CAAC;AAe1F,UAAU,MAAM;IACZ,uBAAuB,EAAE,OAAO,CAAC;CACpC;AAED,eAAO,MAAM,gCAAgC,YAAa,QAAQ,WAMjE,CAAC;AACF,eAAO,MAAM,+BAA+B,YAAa,QAAQ,sBAAsB,CAAC,WAEvF,CAAC;AAEF,eAAO,MAAM,QAAQ,0CACyD,CAAC;AAE/E,wBAAgB,cAAc,CAAC,KAAK,EAAE,MAAM,eA0F3C"}
+{"version":3,"file":"AccountsFilter.d.ts","sourceRoot":"","sources":["../../../../../src/components/case-list/case-list-filters/AccountsFilter.tsx"],"names":[],"mappings":"AACA,OAAO,EAAE,QAAQ,EAAE,sBAAsB,EAAE,MAAM,wCAAwC,CAAC;AAe1F,UAAU,MAAM;IACZ,uBAAuB,EAAE,OAAO,CAAC;CACpC;AAED,eAAO,MAAM,gCAAgC,YAAa,QAAQ,WAMjE,CAAC;AACF,eAAO,MAAM,+BAA+B,YAAa,QAAQ,sBAAsB,CAAC,WAEvF,CAAC;AAEF,eAAO,MAAM,QAAQ,0CACyD,CAAC;AAE/E,wBAAgB,cAAc,CAAC,KAAK,EAAE,MAAM,eA+F3C"}

package/lib/esm/components/case-list/case-list-filters/AccountsFilter.js

@@ -14,7 +14,7 @@ import differenceBy from 'lodash/differenceBy';
 import filter from 'lodash/filter';
 import remove from 'lodash/remove';
 import uniqBy from 'lodash/uniqBy';
-import React, { useContext, useEffect } from 'react';
+import React, { useContext, useEffect, useMemo } from 'react';
 import { Trans, useTranslation } from 'react-i18next';
 import { SolrKeys } from '../../../enums/filters';
 import { CaseListFilterDispatchContext, CaseListFilterStateContext } from '../CaseListFilterContext';
@@ -35,12 +35,14 @@ export function AccountsFilter(props) {
     const { canReadBookmarkAccounts } = props;
     const { filterInfo } = useContext(CaseListFilterStateContext);
     const dispatch = useContext(CaseListFilterDispatchContext);
-    const selectedAccounts = filterInfo[SolrKeys.accountNumber]
+    const selectedAccounts = useMemo(() => filterInfo[SolrKeys.accountNumber]
         .filter((item) => !Array.isArray(item.key))
         .map((item) => ({
         name: item.value,
         accountNumber: item.key,
-    }));
+    })), 
+    // eslint-disable-next-line react-hooks/exhaustive-deps
+    [filterInfo, filterInfo[SolrKeys.accountNumber]]);
     const onAccountsFilterChange = (selected) => {
         const toAdd = differenceBy(selected, selectedAccounts, 'accountNumber');
         const toRemove = differenceBy(selectedAccounts, selected, 'accountNumber');

package/lib/esm/components/case-list/case-list-filters/CreatorSsoNameFilter.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"CreatorSsoNameFilter.d.ts","sourceRoot":"","sources":["../../../../../src/components/case-list/case-list-filters/CreatorSsoNameFilter.tsx"],"names":[],"mappings":"AA+BA,eAAO,MAAM,WAAW,0BAIvB,CAAC;AAYF,eAAO,MAAM,eAAe;;;;;;;GAA6E,CAAC;AAE1G,eAAO,MAAM,kBAAkB,iEAyC9B,CAAC;AAEF,wBAAgB,oBAAoB,gBAgOnC"}
+{"version":3,"file":"CreatorSsoNameFilter.d.ts","sourceRoot":"","sources":["../../../../../src/components/case-list/case-list-filters/CreatorSsoNameFilter.tsx"],"names":[],"mappings":"AAiCA,eAAO,MAAM,WAAW,0BAIvB,CAAC;AAYF,eAAO,MAAM,eAAe;;;;;;;GAA6E,CAAC;AAE1G,eAAO,MAAM,kBAAkB,iEAyC9B,CAAC;AAEF,wBAAgB,oBAAoB,gBA0OnC"}

package/lib/esm/components/case-list/case-list-filters/CreatorSsoNameFilter.js

@@ -8,12 +8,13 @@ var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, ge
     });
 };
 import { accounts } from '@cee-eng/hydrajs';
-import { Button, MenuToggle, Select, SelectGroup, SelectOption, TextInputGroup, TextInputGroupMain, TextInputGroupUtilities, } from '@patternfly/react-core';
+import { Button, MenuToggle, Select, SelectGroup, SelectList, SelectOption, TextInputGroup, TextInputGroupMain, TextInputGroupUtilities, } from '@patternfly/react-core';
 import TimesCircleIcon from '@patternfly/react-icons/dist/js/icons/times-circle-icon';
 import { LoadingIndicator, useFetch, useSelectKeyboardNavigator } from '@rh-support/components';
 import { GlobalMetadataStateContext } from '@rh-support/react-context';
 import { getDropdownBtnPlaceholder } from '@rh-support/utils';
-import { isEmpty } from 'lodash';
+import { isEmpty, isNull } from 'lodash';
+import isUndefined from 'lodash/isUndefined';
 import uniqBy from 'lodash/uniqBy';
 import React, { useContext, useEffect, useMemo, useRef, useState } from 'react';
 import { Trans, useTranslation } from 'react-i18next';
@@ -92,8 +93,11 @@ export function CreatorSsoNameFilter() {
     const externalInputRef = useRef();
     const [externalContactList, setExternalContactList] = useState([]);
     const [isExternalOpen, setIsExternalOpen] = useState(false);
+    const [noResults, setNoResults] = useState(false);
     const [externalQuery, setExternalQuery] = useState('');
     const onSelectExternal = (contact) => {
+        if (isNull(contact) || isUndefined(contact))
+            return;
         let list = [];
         if (selectedExternalContacts.some((item) => item.value === contact.value)) {
             list = selectedExternalContacts.filter((item) => item.value !== contact.value);
@@ -118,6 +122,7 @@ export function CreatorSsoNameFilter() {
         const filteredValues = getFilterValues(externalContactList, own);
         const input = new RegExp(externalQuery, 'i');
         const newOptions = filteredValues.filter((v) => input.test(v.value || ''));
+        setNoResults(isEmpty(newOptions));
         return newOptions;
     }, [externalContactList, own, externalQuery]);
     const { onInputKeyDown, focusedItemIndex } = useSelectKeyboardNavigator({
@@ -173,19 +178,25 @@ export function CreatorSsoNameFilter() {
     }, [dispatch, isExternalNonOrgAdmin, loggedInUserRights.data]);
     const filteredExternalList = useMemo(() => {
         return [
+            ...(noResults
+                ? [
+                    React.createElement("div", { key: "no-results", className: "pf-v5-u-p-sm" },
+                        React.createElement(Trans, null, "No results found")),
+                ]
+                : []),
             ...dropdownHeader.map((contact, index) => (React.createElement(SelectOption, { key: contact.value, isFocused: focusedItemIndex === index, value: contact, hasCheckbox: true, isSelected: selectedExternalContacts.some((c) => c.value === contact.value) }, contact.label))),
             ...(!isEmpty(filteredOptions)
                 ? [
                     React.createElement("div", { className: "pf-v5-c-divider", role: "separator", key: "separator" }),
                     React.createElement(SelectGroup, { key: "created-or-owned-by-accounts-group" },
-                        React.createElement("h3", { className: "subheading subheading-sm pf-v5-u-pl-md" },
+                        React.createElement("h6", { className: "pf-v5-u-pl-md" },
                             React.createElement(Trans, null, "Created or owned by")),
                         filteredOptions.map((contact, index) => (React.createElement(SelectOption, { key: contact.value, isFocused: focusedItemIndex === index + dropdownHeader.length, value: contact, hasCheckbox: true, isSelected: selectedExternalContacts.some((c) => c.value === contact.value) }, contact.label)))),
                 ]
                 : []),
         ];
         // eslint-disable-next-line react-hooks/exhaustive-deps
-    }, [filteredOptions, selectedExternalContacts, focusedItemIndex]);
+    }, [filteredOptions, selectedExternalContacts, focusedItemIndex, noResults]);
     const onExternalQueryChange = (_v, query) => {
         setExternalQuery(query);
     };
@@ -199,5 +210,6 @@ export function CreatorSsoNameFilter() {
     return (React.createElement("div", null,
         React.createElement("label", { htmlFor: "case-list-username-filter" },
             React.createElement(Trans, null, filterNamesMap['usernameFilterTitle'])),
-        !loggedInUserRights.data.isInternal() ? (React.createElement(Select, { id: "external-ssousername-filter", "data-tracking-id": "external-ssousername-filter", isOpen: isExternalOpen, onOpenChange: () => setIsExternalOpen(false), toggle: externalToggle, popperProps: { direction: 'down', enableFlip: false }, isScrollable: true, onSelect: (_e, v) => onSelectExternal(v) }, filteredExternalList)) : (React.createElement(InternalSsoNameFilter, null))));
+        !loggedInUserRights.data.isInternal() ? (React.createElement(Select, { id: "external-ssousername-filter", "data-tracking-id": "external-ssousername-filter", isOpen: isExternalOpen, onOpenChange: () => setIsExternalOpen(false), toggle: externalToggle, popperProps: { direction: 'down', enableFlip: false }, isScrollable: true, onSelect: (_e, v) => onSelectExternal(v) },
+            React.createElement(SelectList, null, filteredExternalList))) : (React.createElement(InternalSsoNameFilter, null))));
 }

package/lib/esm/components/case-list/case-list-filters/InternalSsoNameFilter.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"InternalSsoNameFilter.d.ts","sourceRoot":"","sources":["../../../../../src/components/case-list/case-list-filters/InternalSsoNameFilter.tsx"],"names":[],"mappings":"AAgCA,MAAM,CAAC,OAAO,UAAU,qBAAqB,gBAsQ5C"}
+{"version":3,"file":"InternalSsoNameFilter.d.ts","sourceRoot":"","sources":["../../../../../src/components/case-list/case-list-filters/InternalSsoNameFilter.tsx"],"names":[],"mappings":"AAkCA,MAAM,CAAC,OAAO,UAAU,qBAAqB,gBA6R5C"}

package/lib/esm/components/case-list/case-list-filters/InternalSsoNameFilter.js

@@ -8,13 +8,14 @@ var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, ge
     });
 };
 import { contacts } from '@cee-eng/hydrajs';
-import { Button, Flex, FlexItem, MenuToggle, Select, SelectGroup, SelectOption, TextInputGroup, TextInputGroupMain, TextInputGroupUtilities, } from '@patternfly/react-core';
+import { Button, Flex, FlexItem, MenuToggle, Select, SelectGroup, SelectList, SelectOption, TextInputGroup, TextInputGroupMain, TextInputGroupUtilities, } from '@patternfly/react-core';
 import TimesCircleIcon from '@patternfly/react-icons/dist/js/icons/times-circle-icon';
 import { LoadingIndicator, useFetch, useSelectKeyboardNavigator } from '@rh-support/components';
 import { GlobalMetadataStateContext } from '@rh-support/react-context';
 import { getDropdownBtnPlaceholder } from '@rh-support/utils';
-import { isUndefined } from 'lodash';
 import isEmpty from 'lodash/isEmpty';
+import isNull from 'lodash/isNull';
+import isUndefined from 'lodash/isUndefined';
 import React, { useContext, useEffect, useMemo, useRef, useState } from 'react';
 import { Trans, useTranslation } from 'react-i18next';
 import { SolrKeys } from '../../../enums/filters';
@@ -39,6 +40,7 @@ export default function InternalSsoNameFilter() {
     const [internalContactList, setInternalContactList] = useState([]);
     const [renderedList, setRenderedList] = useState([]);
     const [isInternalOpen, setIsInternalOpen] = useState(false);
+    const [noResults, setNoResults] = useState(false);
     const [internalQuery, setInternalQuery] = useState('');
     const filteredOptions = getFilterValues(renderedList, own);
     const dropdownHeader = [
@@ -55,7 +57,7 @@ export default function InternalSsoNameFilter() {
         setRenderedList(internalContactList.slice(0, PER_PAGE));
     }, [internalContactList]);
     const onSelectInternal = (contact) => {
-        if (isUndefined(contact) || contact === 'show-more')
+        if (isNull(contact) || isUndefined(contact) || contact === 'show-more')
             return;
         let list = [];
         if (selectedInternalContacts.some((item) => item.value === contact.value)) {
@@ -137,6 +139,7 @@ export default function InternalSsoNameFilter() {
         const contacts = response && response.items && response.items.length !== 0
             ? response.items.filter((c) => !isEmpty(c.ssoUsername))
             : [];
+        setNoResults(isEmpty(contacts));
         setInternalContactList(contacts);
     });
     const onDisplayMoreClick = () => {
@@ -145,12 +148,24 @@ export default function InternalSsoNameFilter() {
     };
     const filteredInternalList = useMemo(() => {
         return [
+            ...(isFetchingInternalContacts
+                ? [
+                    React.createElement("div", { key: "searching", className: "pf-v5-u-p-sm" },
+                        React.createElement(Trans, null, "Searching...")),
+                ]
+                : []),
+            ...(noResults && !isFetchingInternalContacts
+                ? [
+                    React.createElement("div", { key: "no-results", className: "pf-v5-u-p-sm" },
+                        React.createElement(Trans, null, "No results found")),
+                ]
+                : []),
             ...dropdownHeader.map((contact, index) => (React.createElement(SelectOption, { key: contact.value, isFocused: focusedItemIndex === index, value: contact, hasCheckbox: true, isSelected: selectedInternalContacts.some((c) => c.value === contact.value) }, contact.label))),
             ...(!isEmpty(filteredOptions)
                 ? [
                     React.createElement("div", { className: "pf-v5-c-divider", role: "separator" }),
                     React.createElement(SelectGroup, null,
-                        React.createElement("h3", { className: "subheading subheading-sm pf-v5-u-pl-md" },
+                        React.createElement("h6", { className: "pf-v5-u-pl-md" },
                             React.createElement(Trans, null, "Created or owned by")),
                         filteredOptions.map((contact, index) => (React.createElement(SelectOption, { key: contact.value, isFocused: focusedItemIndex === index + dropdownHeader.length, value: contact, hasCheckbox: true, isSelected: selectedInternalContacts.some((c) => c.value === contact.value) }, contact.label)))),
                 ]
@@ -167,7 +182,15 @@ export default function InternalSsoNameFilter() {
                 : []),
         ];
         // eslint-disable-next-line react-hooks/exhaustive-deps
-    }, [internalContactList, own, selectedInternalContacts, renderedList, focusedItemIndex]);
+    }, [
+        internalContactList,
+        own,
+        selectedInternalContacts,
+        renderedList,
+        focusedItemIndex,
+        isFetchingInternalContacts,
+        noResults,
+    ]);
     const onInternalQueryChange = (_v, query) => {
         setInternalQuery(query);
         onSearchAsync(query);
@@ -179,5 +202,6 @@ export default function InternalSsoNameFilter() {
         React.createElement(TextInputGroup, { isPlain: true },
             React.createElement(TextInputGroupMain, { value: internalQuery, onClick: onInternalToggle, onKeyDown: onInputKeyDown, placeholder: getDropdownBtnPlaceholder(t('Search for a name'), selectedInternalContacts.map((i) => i.label), ' ', filteredInternalList.length, t('All contacts')), onChange: onInternalQueryChange, isExpanded: isInternalOpen, innerRef: internalInputRef }),
             React.createElement(TextInputGroupUtilities, null, !isEmpty(internalQuery) && (React.createElement(Button, { variant: "plain", onClick: () => setInternalQuery(''), isDisabled: isFetchingInternalContacts, "aria-label": t('Clear') }, isFetchingInternalContacts ? (React.createElement(LoadingIndicator, { show: true, size: "sm" })) : (React.createElement(TimesCircleIcon, { "aria-hidden": true }))))))));
-    return (React.createElement(Select, { id: "internal-ssousername-filter", "data-tracking-id": "internal-ssousername-filter", isOpen: isInternalOpen, onOpenChange: () => setIsInternalOpen(false), toggle: internalToggle, popperProps: { direction: 'down', enableFlip: false }, isScrollable: true, onSelect: (_e, v) => onSelectInternal(v) }, filteredInternalList));
+    return (React.createElement(Select, { id: "internal-ssousername-filter", "data-tracking-id": "internal-ssousername-filter", isOpen: isInternalOpen, onOpenChange: () => setIsInternalOpen(false), toggle: internalToggle, popperProps: { direction: 'down', enableFlip: false }, isScrollable: true, onSelect: (_e, v) => onSelectInternal(v) },
+        React.createElement(SelectList, null, filteredInternalList)));
 }

package/lib/esm/components/case-list/case-list-filters/ProductsFilter.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"ProductsFilter.d.ts","sourceRoot":"","sources":["../../../../../src/components/case-list/case-list-filters/ProductsFilter.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAE,cAAc,EAAE,MAAM,0BAA0B,CAAC;AAW1D,UAAU,MAAM;IACZ,YAAY,EAAE,cAAc,EAAE,CAAC;IAC/B,gBAAgB,EAAE,OAAO,CAAC;IAC1B,WAAW,EAAE,MAAM,EAAE,CAAC;CACzB;AAED,wBAAgB,cAAc,CAAC,KAAK,EAAE,MAAM,eA8G3C"}
+{"version":3,"file":"ProductsFilter.d.ts","sourceRoot":"","sources":["../../../../../src/components/case-list/case-list-filters/ProductsFilter.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAE,cAAc,EAAE,MAAM,0BAA0B,CAAC;AAW1D,UAAU,MAAM;IACZ,YAAY,EAAE,cAAc,EAAE,CAAC;IAC/B,gBAAgB,EAAE,OAAO,CAAC;IAC1B,WAAW,EAAE,MAAM,EAAE,CAAC;CACzB;AAED,wBAAgB,cAAc,CAAC,KAAK,EAAE,MAAM,eAgH3C"}

package/lib/esm/components/case-list/case-list-filters/ProductsFilter.js

@@ -59,7 +59,8 @@ export function ProductsFilter(props) {
     const onFilter = (_, value) => {
         if (!value)
             return getProductSelectOptions(productOptions);
-        const input = new RegExp(value, 'i');
+        const formattedValue = value === null || value === void 0 ? void 0 : value.replace(/\\/g, ''); // Removes '\' from search query as it creates SyntaxError for RegEx
+        const input = new RegExp(formattedValue, 'i');
         const newOptions = productOptions.filter((product) => input.test(product.value));
         return getProductSelectOptions(newOptions);
     };

package/lib/esm/css/caseList.css

@@ -552,7 +552,7 @@
 
 @media (min-width: 1800px) {
     /*  Issue Summary */
-    th.pf-c-table__sort[data-label='Issue summary'],
+    th.pf-v5-c-table__sort[data-label='Issue summary'],
     .case-list-table tbody > tr > :nth-child(3) {
         min-width: 450px;
     }

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "@rh-support/cases",
-    "version": "2.1.29",
+    "version": "2.1.31",
     "publishConfig": {
         "access": "public",
         "registry": "https://registry.npmjs.org"
@@ -46,8 +46,8 @@
         "@patternfly/pfe-collapse": "1.12.3",
         "@patternfly/react-core": "5.1.1",
         "@patternfly/react-table": "5.1.1",
-        "@rh-support/components": "2.1.26",
-        "@rh-support/react-context": "2.1.28",
+        "@rh-support/components": "2.1.27",
+        "@rh-support/react-context": "2.1.30",
         "@rh-support/types": "2.0.2",
         "@rh-support/user-permissions": "2.1.19",
         "@rh-support/utils": "2.1.12",
@@ -93,5 +93,5 @@
         "defaults and supports es6-module",
         "maintained node versions"
     ],
-    "gitHead": "672a8f5024aded7ed6ce4edb5c0991bc3f5570bb"
+    "gitHead": "c70ed8ffa9b5dbe8abdd50e1549e92b8af2a6f27"
 }