@rh-support/cases 1.0.41-beta.49 → 1.0.41-beta.58

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

@@ -1 +1 @@
-{"version":3,"file":"AccountsBookmarkedGroupFilter.d.ts","sourceRoot":"","sources":["../../../../../src/components/case-list/case-list-filters/AccountsBookmarkedGroupFilter.tsx"],"names":[],"mappings":"AAmBA,eAAO,MAAM,YAAY,eAAgB,MAAM,gBAS9C,CAAC;AAEF,UAAU,MAAM;IACZ,uBAAuB,EAAE,OAAO,CAAC;IACjC,wBAAwB,EAAE,OAAO,CAAC;IAClC,yBAAyB,EAAE,OAAO,CAAC;CACtC;AAED,eAAO,MAAM,QAAQ,cAAe,MAAM,eAAe,MAAM,WACiB,CAAC;AAEjF,wBAAgB,6BAA6B,CAAC,KAAK,EAAE,MAAM,eAkH1D"}
+{"version":3,"file":"AccountsBookmarkedGroupFilter.d.ts","sourceRoot":"","sources":["../../../../../src/components/case-list/case-list-filters/AccountsBookmarkedGroupFilter.tsx"],"names":[],"mappings":"AAcA,eAAO,MAAM,YAAY,eAAgB,MAAM,gBAS9C,CAAC;AAEF,UAAU,MAAM;IACZ,uBAAuB,EAAE,OAAO,CAAC;IACjC,wBAAwB,EAAE,OAAO,CAAC;IAClC,yBAAyB,EAAE,OAAO,CAAC;CACtC;AAOD,eAAO,MAAM,QAAQ,cAAe,MAAM,eAAe,MAAM,WACiB,CAAC;AAEjF,wBAAgB,6BAA6B,CAAC,KAAK,EAAE,MAAM,eAgJ1D"}

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

@@ -1,15 +1,11 @@
-import { Label, Tooltip } from '@patternfly/react-core';
+import { Label, Select, SelectOption, SelectVariant, Tooltip } from '@patternfly/react-core';
 import InfoCircleIcon from '@patternfly/react-icons/dist/js/icons/info-circle-icon';
-import { MultiSelectDropDownList } from '@rh-support/components';
 import { GlobalMetadataStateContext } from '@rh-support/react-context';
-import { getDropdownBtnPlaceholder, toOptions } from '@rh-support/utils';
-import groupBy from 'lodash/groupBy';
-import isEmpty from 'lodash/isEmpty';
-import sortBy from 'lodash/sortBy';
-import React, { useContext } from 'react';
+import { getDropdownBtnPlaceholder } from '@rh-support/utils';
+import { groupBy, isEmpty, isEqual, some, sortBy } from 'lodash';
+import React, { useContext, useMemo, useState } from 'react';
 import { Trans, useTranslation } from 'react-i18next';
 import { Link } from 'react-router-dom';
-import { FILTER_SEARCHABLE_MODE_LIMIT } from '../../../enums/caseSearch';
 import { SolrKeys } from '../../../enums/filters';
 import { filterNamesMap } from '../../../utils/constants';
 import { CaseListFilterDispatchContext, CaseListFilterStateContext } from '../CaseListFilterContext';
@@ -27,27 +23,22 @@ export function AccountsBookmarkedGroupFilter(props) {
     const { globalMetadataState: { managedAccounts, bookmarkedGroupAccounts }, } = useContext(GlobalMetadataStateContext);
     const { filterInfo } = useContext(CaseListFilterStateContext);
     const dispatch = useContext(CaseListFilterDispatchContext);
-    const onAccountsFilterChange = (selectedAccounts) => {
-        updateFilter(dispatch, {
-            filterKey: SolrKeys.accountNumber,
-            values: selectedAccounts.map((i) => ({ value: i.value.value, key: i.value.key })),
-        });
-    };
-    const managedAccountsList = !isEmpty(managedAccounts.data) ? managedAccounts.data : [];
-    const getBookmarkDropdownOptions = (accounts) => {
-        return accounts.map((account) => ({
-            children: React.createElement(React.Fragment, null,
-                " ",
-                getLabel(account.accountNumber || account.accountNum, account.name)),
-            value: getLabel(account.accountNumber || account.accountNum, account.name),
-            key: account.accountNumber || account.accountNum,
-            isNotSearchable: false,
-            isNonActionable: false,
-            isNotSelectable: false,
-        }));
-    };
-    const filterValues = canAccessManagedAccounts ? getBookmarkDropdownOptions(managedAccountsList) : [];
-    const groupedBookmarks = groupBy(bookmarkedGroupAccounts.data.filter((item) => item.isBookmarkedAndHasGroup), 'bookmarkGroupName');
+    const [isOpen, setIsOpen] = useState(false);
+    const managedAccountsList = !isEmpty(managedAccounts.data)
+        ? managedAccounts.data.map((account) => ({
+            value: getLabel(account.accountNum, account.name),
+            key: account.accountNum,
+        }))
+        : [];
+    const groupedBookmarks = useMemo(() => groupBy(bookmarkedGroupAccounts.data.filter((item) => item.isBookmarkedAndHasGroup), 'bookmarkGroupName'), [bookmarkedGroupAccounts.data]);
+    const groupedBookmarksOptions = Object.keys(groupedBookmarks).map((groupName) => ({
+        value: groupName,
+        key: groupedBookmarks[groupName].map((item) => item.accountNumber),
+    }));
+    const groupedBookmarksOptionsSorted = sortBy(groupedBookmarksOptions, (g) => g.value);
+    const dropdownOptions = [...groupedBookmarksOptionsSorted, ...managedAccountsList];
+    const selectedBookmarks = filterInfo[SolrKeys.accountNumber].filter((item) => Array.isArray(item.key));
+    const selectedAccounts = filterInfo[SolrKeys.accountNumber].filter((item) => !Array.isArray(item.key));
     const getInfoToolTip = (groupName) => {
         const list = groupedBookmarks[groupName];
         return (React.createElement("ul", { className: "no-list-style pf-u-pl-0" }, list.map((b) => {
@@ -58,39 +49,50 @@ export function AccountsBookmarkedGroupFilter(props) {
                 ")"));
         })));
     };
-    const groupAccountsArrObj = Object.keys(groupedBookmarks).map((groupName) => ({
-        children: React.createElement(React.Fragment, null, groupName),
-        actionItem: (React.createElement(Tooltip, { content: getInfoToolTip(groupName) },
-            React.createElement(Label, { color: "cyan", className: "pf-u-ml-auto pf-u-mr-sm", icon: React.createElement(InfoCircleIcon, null) }, groupedBookmarks[groupName].length))),
-        value: groupName,
-        key: groupedBookmarks[groupName].map((item) => item.accountNumber),
-        isNotSearchable: false,
-        isNonActionable: false,
-        isNotSelectable: false,
-    }));
-    const groupAccountsArrObjSorted = sortBy(groupAccountsArrObj, (g) => g.value);
-    const list = [
-        ...groupAccountsArrObjSorted,
-        ...filterValues,
-        {
-            children: canManageBookmarkAccounts ? appendToMenu((bookmarkedGroupAccounts.data || []).length) : React.createElement(React.Fragment, null),
-            isNotSearchable: true,
-            isNonActionable: true,
-            isNotSelectable: true,
-        },
-    ];
+    const getBookmarksOptions = (options) => {
+        return [
+            ...options.map((b, id) => (React.createElement(SelectOption, { key: id, value: b, className: "pf-c-select__menu-wrapper", role: "presentation" },
+                React.createElement("div", { className: "pf-c-select__menu-item-main" },
+                    React.createElement("input", { className: "pf-c-check__input pf-u-mr-sm", type: "checkbox", checked: some(filterInfo[SolrKeys.accountNumber], b) }),
+                    React.createElement("span", null, b.value)),
+                Array.isArray(b.key) && (React.createElement(Tooltip, { content: getInfoToolTip(b.value), "aria-label": t('Bookmarked Accounts List') },
+                    React.createElement(Label, { color: "cyan", className: "pf-u-ml-auto pf-u-mr-sm", icon: React.createElement(InfoCircleIcon, null), "aria-label": t('Bookmarked Accounts') }, b.key.length)))))),
+            ...(canManageBookmarkAccounts ? [appendToMenu((bookmarkedGroupAccounts.data || []).length)] : []),
+        ];
+    };
+    const onBookmarksToggle = (open) => {
+        setIsOpen(open);
+    };
+    const onBookmarksSelect = (e, selection) => {
+        let selected = filterInfo[SolrKeys.accountNumber];
+        if (some(selected, selection)) {
+            selected = selected.filter((b) => !isEqual(b, selection));
+        }
+        else {
+            selected = [...selected, selection];
+        }
+        updateFilter(dispatch, {
+            filterKey: SolrKeys.accountNumber,
+            values: selected.map((i) => ({ value: i.value, key: i.key })),
+        });
+    };
+    const onBookmarksClear = () => {
+        updateFilter(dispatch, {
+            filterKey: SolrKeys.accountNumber,
+            values: [],
+        });
+    };
+    const onBookmarksFilter = (_, value) => {
+        if (!value)
+            return getBookmarksOptions(dropdownOptions);
+        const input = new RegExp(value, 'i');
+        const newOptions = dropdownOptions.filter((b) => input.test(b.value));
+        return getBookmarksOptions(newOptions);
+    };
     if (!canReadBookmarkAccounts && !canAccessManagedAccounts) {
         return null;
     }
-    const listLength = groupAccountsArrObj.length + filterValues.length;
-    const selectedBookmarks = filterInfo[SolrKeys.accountNumber].filter((item) => Array.isArray(item.key));
-    const selectedAccounts = filterInfo[SolrKeys.accountNumber].filter((item) => !Array.isArray(item.key));
-    return (React.createElement(MultiSelectDropDownList, { searchable: listLength > FILTER_SEARCHABLE_MODE_LIMIT, selectedItems: toOptions(filterInfo[SolrKeys.accountNumber], { labelKey: 'value' }), placeholder: getDropdownBtnPlaceholder(t(canAccessManagedAccounts ? 'Search for an account' : 'Search for a bookmark'), canAccessManagedAccounts ? selectedAccounts : selectedBookmarks, '', listLength, canAccessManagedAccounts ? t('All accounts') : t('All bookmarks')), "data-tracking-id": "accounts-filter", id: "case-list-group-filter", title: canAccessManagedAccounts ? t('Accounts') : t(filterNamesMap[SolrKeys.accountNumber]), label: canAccessManagedAccounts ? t('Accounts') : t(filterNamesMap[SolrKeys.accountNumber]), onChange: onAccountsFilterChange, list: toOptions(list, {
-            labelKey: 'value',
-            childrenKey: 'children',
-            actionItemKey: 'actionItem',
-            nonSearchableItemKey: 'isNotSearchable',
-            nonActionableItemKey: 'isNonActionable',
-            nonSelectableItemKey: 'isNotSelectable',
-        }) }));
+    return (React.createElement("div", { className: "pf-c-select" },
+        React.createElement("label", { htmlFor: "case-list-group-filter" }, canAccessManagedAccounts ? t('Accounts') : t(filterNamesMap[SolrKeys.accountNumber])),
+        React.createElement(Select, { variant: SelectVariant.typeaheadMulti, onToggle: onBookmarksToggle, onSelect: onBookmarksSelect, onClear: onBookmarksClear, isOpen: isOpen, onFilter: onBookmarksFilter, placeholderText: getDropdownBtnPlaceholder(t(canAccessManagedAccounts ? 'Search for an account' : 'Search for a bookmark'), canAccessManagedAccounts ? selectedAccounts : selectedBookmarks, '', dropdownOptions.length, canAccessManagedAccounts ? t('All accounts') : t('All bookmarks')), "data-tracking-id": "accounts-filter", id: "case-list-group-filter" }, getBookmarksOptions(dropdownOptions))));
 }

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;AAUvE,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,eA0E3C"}
+{"version":3,"file":"ProductsFilter.d.ts","sourceRoot":"","sources":["../../../../../src/components/case-list/case-list-filters/ProductsFilter.tsx"],"names":[],"mappings":"AACA,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"}

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

@@ -1,6 +1,6 @@
-import { Select, SelectOption, SelectVariant } from '@patternfly/react-core';
-import { MultiSelectDropDownList } from '@rh-support/components';
-import { getDropdownBtnPlaceholder, toOptions } from '@rh-support/utils';
+import { Checkbox, Select, SelectOption, SelectVariant } from '@patternfly/react-core';
+import { getDropdownBtnPlaceholder } from '@rh-support/utils';
+import { isUndefined } from 'lodash';
 import React, { useContext, useState } from 'react';
 import { useTranslation } from 'react-i18next';
 import { SolrKeys, SolrPivotKeys } from '../../../enums/filters';
@@ -11,16 +11,17 @@ export function ProductsFilter(props) {
     const { t } = useTranslation();
     const dispatch = useContext(CaseListFilterDispatchContext);
     const { filterInfo } = useContext(CaseListFilterStateContext);
+    const { allProducts, filterValues, isSolrSearchDown } = props;
     const [isOpen, setIsOpen] = useState(false);
     const toggleIsOpen = (isExpanded) => setIsOpen(isExpanded);
-    const onFilterChangeMultipleSelect = (selectedProducts) => {
-        selectedProducts = selectedProducts.map((selectedProduct) => ({
-            field: SolrKeys.product,
-            value: selectedProduct.label,
-            [SolrKeys.version]: [],
-        }));
-        updateFilter(dispatch, { filterKey: SolrPivotKeys.product_version, values: selectedProducts });
-    };
+    const selectedProducts = !isUndefined(filterInfo) && !isUndefined(filterInfo[SolrPivotKeys.product_version])
+        ? filterInfo[SolrPivotKeys.product_version]
+        : [];
+    const productOptions = filterValues.map((product) => ({
+        field: SolrKeys.product,
+        value: product.value,
+        [SolrKeys.version]: [],
+    }));
     const onFilterChangeSingleSelect = (event, selectedProduct) => {
         updateFilter(dispatch, {
             filterKey: SolrPivotKeys.product_version,
@@ -33,12 +34,36 @@ export function ProductsFilter(props) {
     // we get filter values from hydra metadata api
     const singleSelectSolrIsDown = () => {
         var _a, _b;
-        return (React.createElement(Select, { variant: SelectVariant.single, "aria-label": "Select Input", onToggle: toggleIsOpen, onSelect: onFilterChangeSingleSelect, selections: (_b = (_a = filterInfo[SolrPivotKeys.product_version]) === null || _a === void 0 ? void 0 : _a[0]) === null || _b === void 0 ? void 0 : _b.value, isOpen: isOpen, "aria-labelledby": titleId, placeholderText: t('Select a product'), "data-tracking-id": "products-filter" }, props.allProducts.map((product) => (React.createElement(SelectOption, { key: product, value: product })))));
+        return (React.createElement(Select, { variant: SelectVariant.single, "aria-label": t('Select Input'), onToggle: toggleIsOpen, onSelect: onFilterChangeSingleSelect, selections: (_b = (_a = filterInfo[SolrPivotKeys.product_version]) === null || _a === void 0 ? void 0 : _a[0]) === null || _b === void 0 ? void 0 : _b.value, isOpen: isOpen, "aria-labelledby": titleId, placeholderText: t('Select a product'), "data-tracking-id": "products-filter", id: "products-filter" }, allProducts.map((product) => (React.createElement(SelectOption, { key: product, value: product })))));
+    };
+    const onSelect = (e, selection) => {
+        let newSelectedProducts = [];
+        if (selectedProducts === null || selectedProducts === void 0 ? void 0 : selectedProducts.some((product) => selection.value === product.value)) {
+            newSelectedProducts = selectedProducts.filter((product) => selection.value !== product.value);
+        }
+        else {
+            newSelectedProducts = [
+                ...selectedProducts,
+                { field: SolrKeys.product, value: selection.value, [SolrKeys.version]: [] },
+            ];
+        }
+        updateFilter(dispatch, { filterKey: SolrPivotKeys.product_version, values: newSelectedProducts });
+    };
+    const getProductSelectOptions = (options) => {
+        return options.map((p, id) => (React.createElement(SelectOption, { key: id, value: p },
+            React.createElement("span", null,
+                React.createElement(Checkbox, { id: "product-option-check", checked: selectedProducts === null || selectedProducts === void 0 ? void 0 : selectedProducts.some((product) => p.value === product.value) })),
+            React.createElement("span", null, p.value))));
+    };
+    const onFilter = (_, value) => {
+        if (!value)
+            return getProductSelectOptions(productOptions);
+        const input = new RegExp(value, 'i');
+        const newOptions = productOptions.filter((product) => input.test(product.value));
+        return getProductSelectOptions(newOptions);
     };
-    const multiSelect = () => (React.createElement(MultiSelectDropDownList, { placeholder: getDropdownBtnPlaceholder(t('Select a product'), filterInfo[SolrPivotKeys.product_version].map((i) => i.value), '', props.filterValues.length, t('All selected')), "data-tracking-id": "products-filter", id: "case-list-products-filter", title: t(filterNamesMap[SolrKeys.product]), onChange: onFilterChangeMultipleSelect, selectedItems: toOptions(filterInfo[SolrPivotKeys.product_version], { labelKey: 'value' }), list: toOptions(props.filterValues, {
-            labelKey: 'value',
-        }), searchable: true }));
+    const multiSelectNew = () => (React.createElement(Select, { "aria-label": t('Select Input'), id: titleId, variant: SelectVariant.typeaheadMulti, onToggle: toggleIsOpen, onSelect: onSelect, isOpen: isOpen, placeholderText: getDropdownBtnPlaceholder(t('Select a product'), filterInfo[SolrPivotKeys.product_version].map((i) => i.value), '', props.filterValues.length, t('All selected')), onFilter: onFilter }, getProductSelectOptions(productOptions)));
     return (React.createElement("div", { className: "pf-c-select" },
-        React.createElement("label", { id: titleId }, t(filterNamesMap[SolrKeys.product])),
-        props.isSolrSearchDown ? singleSelectSolrIsDown() : multiSelect()));
+        React.createElement("label", { htmlFor: titleId }, t(filterNamesMap[SolrKeys.product])),
+        isSolrSearchDown ? singleSelectSolrIsDown() : multiSelectNew()));
 }

package/lib/esm/components/case-list/case-list-table/ExportCaseListCSV.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"ExportCaseListCSV.d.ts","sourceRoot":"","sources":["../../../../../src/components/case-list/case-list-table/ExportCaseListCSV.tsx"],"names":[],"mappings":"AAIA,OAAO,EAAE,aAAa,EAAE,MAAM,0BAA0B,CAAC;AAMzD,OAAO,EAAE,iBAAiB,EAAE,MAAM,0BAA0B,CAAC;AAgD7D,UAAU,MAAM;IACZ,uBAAuB,EAAE,aAAa,CAAC,iBAAiB,CAAC,CAAC;IAC1D,mBAAmB,CAAC,EAAE,OAAO,CAAC;CACjC;AAID,wBAAgB,iBAAiB,CAAC,KAAK,EAAE,MAAM,eAkG9C"}
+{"version":3,"file":"ExportCaseListCSV.d.ts","sourceRoot":"","sources":["../../../../../src/components/case-list/case-list-table/ExportCaseListCSV.tsx"],"names":[],"mappings":"AAIA,OAAO,EAAE,aAAa,EAAE,MAAM,0BAA0B,CAAC;AAMzD,OAAO,EAAE,iBAAiB,EAAE,MAAM,0BAA0B,CAAC;AAgD7D,UAAU,MAAM;IACZ,uBAAuB,EAAE,aAAa,CAAC,iBAAiB,CAAC,CAAC;IAC1D,mBAAmB,CAAC,EAAE,OAAO,CAAC;CACjC;AAID,wBAAgB,iBAAiB,CAAC,KAAK,EAAE,MAAM,eAoG9C"}

package/lib/esm/components/case-list/case-list-table/ExportCaseListCSV.js

@@ -73,6 +73,7 @@ export function ExportCaseListCSV(props) {
     const filterState = useContext(CaseListFilterStateContext);
     const { globalMetadataState: { loggedInUserRights, loggedInUsersAccount }, } = useContext(GlobalMetadataStateContext);
     const isOrgAdmin = loggedInUserRights.data.isOrgAdmin();
+    // CSV For Secure Support Users
     const onExportCSVClickSecureSupport = () => __awaiter(this, void 0, void 0, function* () {
         try {
             const sfdcFilter = createQueryForCSVDownload(filterState, loggedInUserRights.data, loggedInUsersAccount.data);
@@ -90,6 +91,7 @@ export function ExportCaseListCSV(props) {
         }
     });
     const partnerSearch = loggedInUserRights.data.hasManagedAccounts();
+    // CSV For Normal Users
     const onExportCSVClick = () => __awaiter(this, void 0, void 0, function* () {
         try {
             const res = yield request(createQueryForCSVDownload(filterState, loggedInUserRights.data, loggedInUsersAccount.data), partnerSearch, null, loggedInUsersAccount.data.secureSupport);

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "@rh-support/cases",
-    "version": "1.0.41-beta.49",
+    "version": "1.0.41-beta.58",
     "publishConfig": {
         "access": "public",
         "registry": "https://registry.npmjs.org"
@@ -51,11 +51,11 @@
         "@patternfly/pfe-collapse": "1.12.3",
         "@patternfly/react-core": "4.264.0",
         "@patternfly/react-table": "4.111.33",
-        "@rh-support/components": "1.2.22-beta.49",
-        "@rh-support/react-context": "1.0.30-beta.49",
-        "@rh-support/types": "0.2.1-beta.33",
-        "@rh-support/user-permissions": "1.0.12-beta.49",
-        "@rh-support/utils": "1.0.10-beta.39",
+        "@rh-support/components": "1.2.22-beta.58",
+        "@rh-support/react-context": "1.0.30-beta.58",
+        "@rh-support/types": "0.2.1-beta.58",
+        "@rh-support/user-permissions": "1.0.12-beta.58",
+        "@rh-support/utils": "1.0.10-beta.58",
         "i18next": "^19.0.1",
         "localforage": "^1.7.3",
         "lodash": "^4.17.21",
@@ -99,5 +99,5 @@
         "not ie <= 11",
         "not op_mini all"
     ],
-    "gitHead": "0fa0968e831c199572669184c466e9fecd781d12"
+    "gitHead": "52af82c690605efacf567d6657ee7c5707fb3fdc"
 }