@rh-support/manage 2.5.235 → 2.5.238

package/lib/esm/ManageTabs.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"ManageTabs.d.ts","sourceRoot":"","sources":["../../src/ManageTabs.tsx"],"names":[],"mappings":"AAKA,OAAO,KAAmB,MAAM,OAAO,CAAC;AAExC,OAAO,EAAE,mBAAmB,EAAa,MAAM,kBAAkB,CAAC;AAelE,UAAU,MAAM;IACZ,UAAU,EAAE,mBAAmB,CAAC,EAAE,CAAC,CAAC;IACpC,QAAQ,EAAE,MAAM,CAAC;CACpB;AAED,wBAAgB,UAAU,CAAC,KAAK,EAAE,MAAM,qBA6MvC"}
+{"version":3,"file":"ManageTabs.d.ts","sourceRoot":"","sources":["../../src/ManageTabs.tsx"],"names":[],"mappings":"AAKA,OAAO,KAAmB,MAAM,OAAO,CAAC;AAExC,OAAO,EAAE,mBAAmB,EAAa,MAAM,kBAAkB,CAAC;AAiBlE,UAAU,MAAM;IACZ,UAAU,EAAE,mBAAmB,CAAC,EAAE,CAAC,CAAC;IACpC,QAAQ,EAAE,MAAM,CAAC;CACpB;AAED,wBAAgB,UAAU,CAAC,KAAK,EAAE,MAAM,qBAgOvC"}

package/lib/esm/ManageTabs.js

@@ -1,5 +1,5 @@
 import { Tab, TabContent, Tabs, TabsComponent, TabTitleText } from '@patternfly/react-core';
-import { ErrorBoundary, useDocumentTitle } from '@rh-support/components';
+import { ErrorBoundary, LoadingIndicator, useDocumentTitle } from '@rh-support/components';
 import { ability, resourceActions, resources } from '@rh-support/user-permissions';
 import map from 'lodash/map';
 import React, { useState } from 'react';
@@ -8,6 +8,7 @@ import { useParams } from 'react-router-dom';
 import { ConfigsTable } from './components/Configs/ConfigsTable';
 import { ManageGroupUsers } from './components/Groups/ManageGroupUsers';
 import { ManageGroupedBookmarkedAccountsTab } from './components/ManageBookmarkedAccountsTab';
+import { ManageCaseLabelsTab } from './components/ManageCaseLabels';
 import { ExpiredContentManagement } from './components/ManageExpiredContents/ExpiredContentManagement';
 // TODO: Uncomment when partnerships tab is re-implemented
 // import { ManagePartnerships } from './components/ManagePartnerships/index';
@@ -16,13 +17,15 @@ import { TagsManagement } from './components/ManageTags';
 // import { NotificationEmails } from './components/NotificationEmails/index';
 import { TopContentManagement } from './components/TopContentManagement';
 import { PageTitle } from './constants/pageTitle';
+import { useCurrentUserContact } from './hooks/useCurrentUserContact';
 import { Routes } from './Routes';
 export function ManageTabs(props) {
     var _a, _b;
     const [activeTabKey, setActiveTabKey] = useState(0);
     const { activeTab } = useParams();
     const { t } = useTranslation();
-    const { groupsRoute, bookmarkedAccountsRoute, topContentRoute, 
+    const { loading: contactLoading } = useCurrentUserContact();
+    const { groupsRoute, bookmarkedAccountsRoute, caseLabelsRoute, topContentRoute, 
     // notificationEmailsRoute,
     preferencesRoute, configsRoute, 
     // partnershipsRoute, // TODO: Uncomment when partnerships tab is re-implemented
@@ -41,6 +44,10 @@ export function ManageTabs(props) {
     //     CaseDetailsFields.CASE_DETAILS_SEND_NOTIFICATIONS
     // );
     const canViewConfigsTab = ability.can(resourceActions.READ, resources.APP_INTERNAL_CONFIGS);
+    if (contactLoading) {
+        return (React.createElement("div", { className: "grid-main manage" },
+            React.createElement(LoadingIndicator, { show: true, size: "sm" })));
+    }
     const tabsToRender = [];
     canManageBookmarkAccounts &&
         tabsToRender.push({
@@ -60,6 +67,14 @@ export function ManageTabs(props) {
             component: React.createElement(ManageGroupUsers, null),
             id: 'manage-groups',
         });
+    tabsToRender.push({
+        title: 'Case labels',
+        key: 'case-labels-tab',
+        'data-tracking-id': 'manage-case-labels-tab',
+        routePath: caseLabelsRoute,
+        component: React.createElement(ManageCaseLabelsTab, null),
+        id: 'manage-case-labels',
+    });
     /* TODO: Re-enable notification emails tab when ready
     canViewEmailNotificationTab &&
         canAddCustomNotification &&

package/lib/esm/Routes.d.ts

@@ -11,6 +11,7 @@ interface ManageRoutes {
     };
     getPathsArray: () => string[];
     groups: Route;
+    caseLabels: Route;
     savedSearches: Route;
     topContent: Route;
     expiredContent: Route;

package/lib/esm/Routes.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Routes.d.ts","sourceRoot":"","sources":["../../src/Routes.ts"],"names":[],"mappings":"AAAA,UAAU,KAAK;IACX,QAAQ,CAAC,OAAO,EAAE,MAAM,MAAM,CAAC;IAC/B,QAAQ,CAAC,IAAI,EAAE,MAAM,CAAC;CACzB;AAED,UAAU,YAAY;IAClB,QAAQ,EAAE,MAAM,CAAC;IACjB,kBAAkB,EAAE,KAAK,CAAC;IAC1B,eAAe,EAAE,KAAK,CAAC;IACvB,QAAQ,EAAE,MAAM;QAAE,CAAC,GAAG,EAAE,MAAM,GAAG,MAAM,CAAA;KAAE,CAAC;IAC1C,aAAa,EAAE,MAAM,MAAM,EAAE,CAAC;IAC9B,MAAM,EAAE,KAAK,CAAC;IACd,aAAa,EAAE,KAAK,CAAC;IACrB,UAAU,EAAE,KAAK,CAAC;IAClB,cAAc,EAAE,KAAK,CAAC;IACtB,WAAW,EAAE,KAAK,CAAC;IACnB,WAAW,EAAE,KAAK,CAAC;IACnB,kBAAkB,EAAE,KAAK,CAAC;IAC1B,OAAO,EAAE,KAAK,CAAC;IACf,YAAY,EAAE,KAAK,CAAC;CACvB;AAED,eAAO,MAAM,MAAM,EAAE,YAqFpB,CAAC"}
+{"version":3,"file":"Routes.d.ts","sourceRoot":"","sources":["../../src/Routes.ts"],"names":[],"mappings":"AAAA,UAAU,KAAK;IACX,QAAQ,CAAC,OAAO,EAAE,MAAM,MAAM,CAAC;IAC/B,QAAQ,CAAC,IAAI,EAAE,MAAM,CAAC;CACzB;AAED,UAAU,YAAY;IAClB,QAAQ,EAAE,MAAM,CAAC;IACjB,kBAAkB,EAAE,KAAK,CAAC;IAC1B,eAAe,EAAE,KAAK,CAAC;IACvB,QAAQ,EAAE,MAAM;QAAE,CAAC,GAAG,EAAE,MAAM,GAAG,MAAM,CAAA;KAAE,CAAC;IAC1C,aAAa,EAAE,MAAM,MAAM,EAAE,CAAC;IAC9B,MAAM,EAAE,KAAK,CAAC;IACd,UAAU,EAAE,KAAK,CAAC;IAClB,aAAa,EAAE,KAAK,CAAC;IACrB,UAAU,EAAE,KAAK,CAAC;IAClB,cAAc,EAAE,KAAK,CAAC;IACtB,WAAW,EAAE,KAAK,CAAC;IACnB,WAAW,EAAE,KAAK,CAAC;IACnB,kBAAkB,EAAE,KAAK,CAAC;IAC1B,OAAO,EAAE,KAAK,CAAC;IACf,YAAY,EAAE,KAAK,CAAC;CACvB;AAED,eAAO,MAAM,MAAM,EAAE,YA2FpB,CAAC"}

package/lib/esm/Routes.js

@@ -12,6 +12,12 @@ export const Routes = {
             return getPath(this);
         },
     },
+    caseLabels: {
+        path: 'case-labels',
+        getPath() {
+            return getPath(this);
+        },
+    },
     fileDiagnostics: {
         path: 'file-diagnostics',
         getPath() {

package/lib/esm/components/Groups/AddMembersModal/AddMembersModal.d.ts

@@ -0,0 +1,12 @@
+import { ICaseGroup } from '@cee-eng/hydrajs/@types/api/public/caseGroups';
+import React from 'react';
+import type { IGroupUserWithContactId } from '../../../utils/caseGroupMapper';
+interface IProps {
+    readonly group: ICaseGroup;
+    readonly existingMembers: IGroupUserWithContactId[];
+    readonly onSuccess: () => void;
+    readonly onClose: () => void;
+}
+export declare function AddMembersModal({ group, existingMembers, onSuccess, onClose }: IProps): React.JSX.Element;
+export {};
+//# sourceMappingURL=AddMembersModal.d.ts.map

package/lib/esm/components/Groups/AddMembersModal/AddMembersModal.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"AddMembersModal.d.ts","sourceRoot":"","sources":["../../../../../src/components/Groups/AddMembersModal/AddMembersModal.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,UAAU,EAAE,MAAM,+CAA+C,CAAC;AAM3E,OAAO,KAAgC,MAAM,OAAO,CAAC;AAIrD,OAAO,KAAK,EAAE,uBAAuB,EAAE,MAAM,gCAAgC,CAAC;AAE9E,UAAU,MAAM;IACZ,QAAQ,CAAC,KAAK,EAAE,UAAU,CAAC;IAC3B,QAAQ,CAAC,eAAe,EAAE,uBAAuB,EAAE,CAAC;IACpD,QAAQ,CAAC,SAAS,EAAE,MAAM,IAAI,CAAC;IAC/B,QAAQ,CAAC,OAAO,EAAE,MAAM,IAAI,CAAC;CAChC;AAED,wBAAgB,eAAe,CAAC,EAAE,KAAK,EAAE,eAAe,EAAE,SAAS,EAAE,OAAO,EAAE,EAAE,MAAM,qBAyGrF"}

package/lib/esm/components/Groups/AddMembersModal/AddMembersModal.js

@@ -0,0 +1,81 @@
+var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {
+    function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
+    return new (P || (P = Promise))(function (resolve, reject) {
+        function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
+        function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }
+        function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }
+        step((generator = generator.apply(thisArg, _arguments || [])).next());
+    });
+};
+import { Button, Modal, ModalBody, ModalFooter, ModalHeader, ModalVariant } from '@patternfly/react-core';
+import { CaseContactsSelectorExternal, ToastNotification } from '@rh-support/components';
+import { useGlobalStateContext } from '@rh-support/react-context';
+import React, { useCallback, useState } from 'react';
+import { useTranslation } from 'react-i18next';
+import { useCreateCaseGroupMember } from '../../../hooks/useCaseGroupGraphQL';
+export function AddMembersModal({ group, existingMembers, onSuccess, onClose }) {
+    var _a, _b;
+    const { t } = useTranslation();
+    const { globalMetadataState: { loggedInUserRights, loggedInUsersAccount }, } = useGlobalStateContext();
+    const { createMember, loading: createLoading } = useCreateCaseGroupMember();
+    const [selectedContacts, setSelectedContacts] = useState([]);
+    const [isSubmitting, setIsSubmitting] = useState(false);
+    const accountNumber = (_b = (_a = loggedInUsersAccount === null || loggedInUsersAccount === void 0 ? void 0 : loggedInUsersAccount.data) === null || _a === void 0 ? void 0 : _a.accountNumber) !== null && _b !== void 0 ? _b : '';
+    const contactSsoUsername = '';
+    const contactsToExclude = existingMembers.map((m) => ({
+        ssoUsername: m.ssoUsername,
+        firstName: m.firstName,
+        lastName: m.lastName,
+    }));
+    const contactFilter = useCallback((contact) => !contact.isOrgAdmin, []);
+    const onChange = useCallback((contacts) => {
+        if (!(contacts === null || contacts === void 0 ? void 0 : contacts.length))
+            return;
+        const contact = contacts[0];
+        if (!('ssoUsername' in contact))
+            return;
+        setSelectedContacts((prev) => {
+            const exists = prev.some((c) => c.ssoUsername === contact.ssoUsername);
+            return exists ? prev.filter((c) => c.ssoUsername !== contact.ssoUsername) : [...prev, contact];
+        });
+    }, []);
+    const onSubmit = () => __awaiter(this, void 0, void 0, function* () {
+        const validContacts = selectedContacts.filter((contact) => contact.id);
+        if (validContacts.length === 0)
+            return;
+        setIsSubmitting(true);
+        try {
+            const results = yield Promise.allSettled(validContacts.map((contact) => createMember(contact.id, group.groupNum)));
+            const succeeded = results.filter((r) => r.status === 'fulfilled');
+            const failed = results.filter((r) => r.status === 'rejected');
+            if (succeeded.length > 0) {
+                ToastNotification.addSuccessMessage(t('{{count}} people have been successfully added.', { count: succeeded.length }));
+                onSuccess();
+            }
+            if (failed.length > 0) {
+                const firstError = failed[0].reason;
+                const message = String((firstError === null || firstError === void 0 ? void 0 : firstError.message) || '');
+                if (message.includes('Organization Administrator')) {
+                    ToastNotification.addDangerMessage(t('Organization Administrators cannot be added as case group members'));
+                }
+                else if (message.includes('insufficient access rights')) {
+                    ToastNotification.addDangerMessage(t('You do not have permission to add members to this group'));
+                }
+                else {
+                    ToastNotification.addDangerMessage(t('There was an error adding members to this group'));
+                }
+            }
+            onClose();
+        }
+        finally {
+            setIsSubmitting(false);
+        }
+    });
+    return (React.createElement(Modal, { variant: ModalVariant.medium, isOpen: true, onClose: onClose, "aria-label": t('Add members to group') },
+        React.createElement(ModalHeader, { title: t('Add members to {{groupName}}', { groupName: group.name }) }),
+        React.createElement(ModalBody, null,
+            React.createElement(CaseContactsSelectorExternal, { id: "add-members-contact-select", selectedAccountNumber: accountNumber, loggedInUserRights: loggedInUserRights.data, contactSsoUsername: contactSsoUsername, contactsToExclude: [...contactsToExclude, ...selectedContacts], contactFilter: contactFilter, selected: selectedContacts, onChange: onChange, onContactEnriched: () => { }, multiple: true, clearButton: true, isDisabled: isSubmitting, placeholder: t('Search by name or SSO username') })),
+        React.createElement(ModalFooter, null,
+            React.createElement(Button, { key: "confirm", variant: "primary", onClick: onSubmit, isDisabled: selectedContacts.length === 0 || isSubmitting || createLoading, isLoading: isSubmitting, spinnerAriaValueText: isSubmitting ? t('Adding members') : undefined }, t('Add')),
+            React.createElement(Button, { key: "cancel", variant: "link", onClick: onClose, isDisabled: isSubmitting }, t('Cancel')))));
+}

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

@@ -0,0 +1,2 @@
+export * from './AddMembersModal';
+//# sourceMappingURL=index.d.ts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../src/components/Groups/AddMembersModal/index.ts"],"names":[],"mappings":"AAAA,cAAc,mBAAmB,CAAC"}

package/lib/esm/components/Groups/AddMembersModal/index.js

@@ -0,0 +1 @@
+export * from './AddMembersModal';

package/lib/esm/components/Groups/GroupSelect/GroupSelect.d.ts

@@ -3,6 +3,7 @@ import React from 'react';
 interface IProps {
     isDisabled?: boolean;
     onSelect: (group: ICaseGroup | null) => void;
+    onAddMembers?: () => void;
 }
 export declare const GroupSelect: (props: IProps) => React.JSX.Element;
 export {};

package/lib/esm/components/Groups/GroupSelect/GroupSelect.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"GroupSelect.d.ts","sourceRoot":"","sources":["../../../../../src/components/Groups/GroupSelect/GroupSelect.tsx"],"names":[],"mappings":"AACA,OAAO,EAAE,UAAU,EAAE,MAAM,+CAA+C,CAAC;AAsC3E,OAAO,KAAmD,MAAM,OAAO,CAAC;AAMxE,UAAU,MAAM;IACZ,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,QAAQ,EAAE,CAAC,KAAK,EAAE,UAAU,GAAG,IAAI,KAAK,IAAI,CAAC;CAChD;AAKD,eAAO,MAAM,WAAW,GAAI,OAAO,MAAM,sBA4kBxC,CAAC"}
+{"version":3,"file":"GroupSelect.d.ts","sourceRoot":"","sources":["../../../../../src/components/Groups/GroupSelect/GroupSelect.tsx"],"names":[],"mappings":"AACA,OAAO,EAAE,UAAU,EAAE,MAAM,+CAA+C,CAAC;AAsC3E,OAAO,KAAmD,MAAM,OAAO,CAAC;AAMxE,UAAU,MAAM;IACZ,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,QAAQ,EAAE,CAAC,KAAK,EAAE,UAAU,GAAG,IAAI,KAAK,IAAI,CAAC;IAC7C,YAAY,CAAC,EAAE,MAAM,IAAI,CAAC;CAC7B;AAKD,eAAO,MAAM,WAAW,GAAI,OAAO,MAAM,sBA2lBxC,CAAC"}

package/lib/esm/components/Groups/GroupSelect/GroupSelect.js

@@ -94,6 +94,7 @@ export const GroupSelect = (props) => {
     // Group actions dropdown state
     const hasGroupPermissions = ability.can(resourceActions.CREATE, resources.CASE_GROUPS);
     const [showDropdown, setShowDropdown] = useState(hasGroupPermissions);
+    useEffect(() => setShowDropdown(hasGroupPermissions), [hasGroupPermissions]);
     const [showInput, setShowInput] = useState(false);
     const [isDropdownOpen, setIsDropdownOpen] = useState(false);
     const toggleIsDropdownOpen = () => setIsDropdownOpen(!isDropdownOpen);
@@ -310,11 +311,17 @@ export const GroupSelect = (props) => {
         setAction('');
         setInput(selectedGroup);
     };
+    const handleAddMembers = () => {
+        var _a;
+        closeDropdown();
+        (_a = props.onAddMembers) === null || _a === void 0 ? void 0 : _a.call(props);
+    };
     const dropdownItems = [
         React.createElement(MenuItem, { className: "create-group-action", isDisabled: !ability.can(resourceActions.CREATE, resources.CASE_GROUPS), key: "create", onClick: onActionFocus(actions.create), "data-tracking-id": "manage-group-create" }, t('Create')),
         React.createElement(Divider, { component: "li" }),
         React.createElement(MenuItem, { className: "create-group-action", isDisabled: !selectedGroup || !ability.can(resourceActions.UPDATE, resources.CASE_GROUPS), key: "rename", onClick: onActionFocus(actions.rename), "data-tracking-id": "manage-group-rename" }, t('Rename')),
         React.createElement(MenuItem, { className: "create-group-action", isDisabled: !selectedGroup || !ability.can(resourceActions.CREATE, resources.CASE_GROUPS), key: "duplicate", onClick: onActionFocus(actions.duplicate), "data-tracking-id": "manage-group-duplicate" }, t('Duplicate')),
+        React.createElement(MenuItem, { className: "create-group-action", isDisabled: !selectedGroup || !ability.can(resourceActions.CREATE, resources.CASE_GROUPS), key: "add-members", onClick: handleAddMembers, "data-tracking-id": "manage-group-add-members" }, t('Add members')),
         React.createElement(MenuItem, { isDanger: true, className: "create-group-action del-btn", isDisabled: !selectedGroup || !ability.can(resourceActions.DELETE, resources.CASE_GROUPS), key: "delete", onClick: onActionFocus(actions.delete), "data-tracking-id": "manage-group-delete" }, t('Delete')),
     ];
     const dropdownToggle = (toggleRef) => (React.createElement(MenuToggle, { isFullHeight: true, className: "pf-v6-u-ml-sm manage-group-actions-toggle-options pf-v6-u-p-md", ref: toggleRef, isDisabled: props.isDisabled || disableOnFetch, onClick: toggleIsDropdownOpen, isExpanded: isDropdownOpen, "data-tracking-id": "manage-group-toggle-options", "aria-label": "Group actions dropdown toggle", icon: React.createElement(CogIcon, null) }));

package/lib/esm/components/Groups/ManageGroupUsers/ManageGroupUsers.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"ManageGroupUsers.d.ts","sourceRoot":"","sources":["../../../../../src/components/Groups/ManageGroupUsers/ManageGroupUsers.tsx"],"names":[],"mappings":"AAKA,OAAO,KAA8B,MAAM,OAAO,CAAC;AAYnD,eAAO,MAAM,gBAAgB,yBAyL5B,CAAC"}
+{"version":3,"file":"ManageGroupUsers.d.ts","sourceRoot":"","sources":["../../../../../src/components/Groups/ManageGroupUsers/ManageGroupUsers.tsx"],"names":[],"mappings":"AAMA,OAAO,KAA8B,MAAM,OAAO,CAAC;AAanD,eAAO,MAAM,gBAAgB,yBAgN5B,CAAC"}

package/lib/esm/components/Groups/ManageGroupUsers/ManageGroupUsers.js

@@ -10,12 +10,14 @@ var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, ge
 import { SearchInput } from '@patternfly/react-core';
 import { ErrorBoundary, usePrevious } from '@rh-support/components';
 import { useGlobalStateContext } from '@rh-support/react-context';
+import { ability, resourceActions, resources } from '@rh-support/user-permissions';
 import isEmpty from 'lodash/isEmpty';
 import React, { useEffect, useState } from 'react';
 import { Trans, useTranslation } from 'react-i18next';
 import { useLocation } from 'react-router-dom';
 import { useCaseGroupMembers } from '../../../hooks/useCaseGroupGraphQL';
 import { ManageTable } from '../../ManageTable/ManageTable';
+import { AddMembersModal } from '../AddMembersModal';
 import { DefaultGroupSwitch } from '../DefualtGroupSwitch';
 import { GroupSelect } from '../GroupSelect';
 // TODO: Uncomment when updateUsers is migrated to GraphQL
@@ -26,7 +28,9 @@ export const ManageGroupUsers = () => {
     const { globalMetadataState: { loggedInUsersAccount }, } = useGlobalStateContext();
     const disableGroupSelect = !loggedInUsersAccount || !loggedInUsersAccount.data || !loggedInUsersAccount.data.accountNumber;
     const [selectedGroup, setSelectedGroup] = useState();
-    const { data: groupUsers, loading: isFetching, fetchMembers } = useCaseGroupMembers();
+    const { data: groupUsers, loading: isFetching, fetchMembers, refetch } = useCaseGroupMembers();
+    const canManageCaseGroups = ability.can(resourceActions.CREATE, resources.CASE_GROUPS);
+    const [isAddMembersModalOpen, setIsAddMembersModalOpen] = useState(false);
     // TODO: Uncomment when updateUsers is migrated to GraphQL
     // function onPermissionError(error: Error, user: IGroupUser) {
     //     setData([...data]);
@@ -111,11 +115,15 @@ export const ManageGroupUsers = () => {
         //             />
         //         ),
         // },
-        {
-            id: 'default',
-            title: t('Default group'),
-            cell: (user, index) => (React.createElement(DefaultGroupSwitch, { id: `${index}`, onToggle: onDefaultToggle, group: selectedGroup, user: user })),
-        },
+        ...(canManageCaseGroups
+            ? [
+                {
+                    id: 'default',
+                    title: t('Default group'),
+                    cell: (user, index) => (React.createElement(DefaultGroupSwitch, { id: `${index}`, onToggle: onDefaultToggle, group: selectedGroup, user: user })),
+                },
+            ]
+            : []),
     ];
     // filter out search query.
     const [userSearch, setUserSearch] = useState('');
@@ -148,11 +156,12 @@ export const ManageGroupUsers = () => {
             React.createElement("h2", { className: "pf-v6-u-pb-sm" }, t('Groups')),
             React.createElement("p", null, t('To filter cases while searching, add or edit groups.'))),
         React.createElement("div", { className: "toolbar pf-v6-u-justify-content-space-between" },
-            React.createElement(GroupSelect, { isDisabled: isFetching || disableGroupSelect, onSelect: onGroupSelect }),
+            React.createElement(GroupSelect, { isDisabled: isFetching || disableGroupSelect, onSelect: onGroupSelect, onAddMembers: () => setIsAddMembersModalOpen(true) }),
             React.createElement("span", { className: "toolbar-right" },
                 React.createElement("label", { htmlFor: "account-group-filter" },
                     React.createElement(Trans, null, "Filter by")),
                 React.createElement(SearchInput, { className: "pf-v6-u-flex-grow-1 pf-v6-c-search-input pf-v6-u-background-color-100", id: "account-group-filter", value: userSearch, isDisabled: isFetching || !selectedGroup, onChange: (_, value) => setUserSearch(value), placeholder: t('Search for people in this group'), "aria-label": "Group search input", onClear: () => setUserSearch('') }))),
         React.createElement(ErrorBoundary, { errorMsgInfo: { message: t('There was an error loading group users list') } },
-            React.createElement(ManageTable, { ariaLabel: t('Table to manage groups'), columns: columns, data: data, sortInfo: { column: 'first-name', direction: 'asc' }, isFetching: isFetching, isError: false, pagination: false }))));
+            React.createElement(ManageTable, { ariaLabel: t('Table to manage groups'), columns: columns, data: data, sortInfo: { column: 'first-name', direction: 'asc' }, isFetching: isFetching, isError: false, pagination: false })),
+        canManageCaseGroups && isAddMembersModalOpen && selectedGroup && (React.createElement(AddMembersModal, { group: selectedGroup, existingMembers: initialData, onSuccess: refetch, onClose: () => setIsAddMembersModalOpen(false) }))));
 };

package/lib/esm/components/ManageCaseLabels/AddEditCaseLabelModal.d.ts

@@ -0,0 +1,19 @@
+import React from 'react';
+import { ICaseLabel } from './types';
+export type SaveCaseLabelResult = {
+    success: boolean;
+    fieldError?: string;
+};
+interface IProps {
+    isOpen: boolean;
+    addMode: boolean;
+    label?: ICaseLabel | null;
+    isSaving?: boolean;
+    onClose: () => void;
+    onSave: (name: string, options?: {
+        keepOpen?: boolean;
+    }) => Promise<SaveCaseLabelResult> | SaveCaseLabelResult;
+}
+export declare function AddEditCaseLabelModal({ isOpen, addMode, label, isSaving, onClose, onSave }: IProps): React.JSX.Element;
+export {};
+//# sourceMappingURL=AddEditCaseLabelModal.d.ts.map

package/lib/esm/components/ManageCaseLabels/AddEditCaseLabelModal.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"AddEditCaseLabelModal.d.ts","sourceRoot":"","sources":["../../../../src/components/ManageCaseLabels/AddEditCaseLabelModal.tsx"],"names":[],"mappings":"AAeA,OAAO,KAA8B,MAAM,OAAO,CAAC;AAGnD,OAAO,EAAE,UAAU,EAAE,MAAM,SAAS,CAAC;AACrC,MAAM,MAAM,mBAAmB,GAAG;IAC9B,OAAO,EAAE,OAAO,CAAC;IACjB,UAAU,CAAC,EAAE,MAAM,CAAC;CACvB,CAAC;AAEF,UAAU,MAAM;IACZ,MAAM,EAAE,OAAO,CAAC;IAChB,OAAO,EAAE,OAAO,CAAC;IACjB,KAAK,CAAC,EAAE,UAAU,GAAG,IAAI,CAAC;IAC1B,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,OAAO,EAAE,MAAM,IAAI,CAAC;IACpB,MAAM,EAAE,CAAC,IAAI,EAAE,MAAM,EAAE,OAAO,CAAC,EAAE;QAAE,QAAQ,CAAC,EAAE,OAAO,CAAA;KAAE,KAAK,OAAO,CAAC,mBAAmB,CAAC,GAAG,mBAAmB,CAAC;CAClH;AAED,wBAAgB,qBAAqB,CAAC,EAAE,MAAM,EAAE,OAAO,EAAE,KAAK,EAAE,QAAgB,EAAE,OAAO,EAAE,MAAM,EAAE,EAAE,MAAM,qBA4G1G"}

package/lib/esm/components/ManageCaseLabels/AddEditCaseLabelModal.js

@@ -0,0 +1,72 @@
+var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {
+    function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
+    return new (P || (P = Promise))(function (resolve, reject) {
+        function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
+        function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }
+        function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }
+        step((generator = generator.apply(thisArg, _arguments || [])).next());
+    });
+};
+import { Button, ButtonVariant, FormGroup, FormHelperText, HelperText, HelperTextItem, Modal, ModalBody, ModalFooter, ModalHeader, ModalVariant, TextInput, } from '@patternfly/react-core';
+import isEmpty from 'lodash/isEmpty';
+import React, { useEffect, useState } from 'react';
+import { Trans, useTranslation } from 'react-i18next';
+export function AddEditCaseLabelModal({ isOpen, addMode, label, isSaving = false, onClose, onSave }) {
+    const { t } = useTranslation();
+    const [name, setName] = useState('');
+    const [error, setError] = useState('');
+    useEffect(() => {
+        if (isOpen) {
+            setName(addMode ? '' : (label === null || label === void 0 ? void 0 : label.name) || '');
+            setError('');
+        }
+    }, [isOpen, addMode, label]);
+    const validate = (value) => {
+        if (isEmpty(value.trim())) {
+            return t('Case label name cannot be empty.');
+        }
+        return '';
+    };
+    const handleSave = (...args_1) => __awaiter(this, [...args_1], void 0, function* (keepOpen = false) {
+        const validationError = validate(name);
+        if (!isEmpty(validationError)) {
+            setError(validationError);
+            return;
+        }
+        const result = yield onSave(name.trim(), { keepOpen });
+        if (result.success) {
+            if (keepOpen) {
+                setName('');
+                setError('');
+            }
+            return;
+        }
+        if (result.fieldError) {
+            setError(result.fieldError);
+        }
+    });
+    const handleClose = () => {
+        setName('');
+        setError('');
+        onClose();
+    };
+    return (React.createElement(Modal, { id: "add-edit-case-label-modal", "aria-describedby": "add-edit-case-label-modal", isOpen: isOpen, onClose: handleClose, variant: ModalVariant.small },
+        React.createElement(ModalHeader, null,
+            React.createElement("h2", null, addMode ? t('Create new case label') : t('Rename case label'))),
+        React.createElement(ModalBody, null,
+            React.createElement(FormGroup, { label: t('Case label name'), isRequired: true },
+                React.createElement(TextInput, { isRequired: true, type: "text", id: "case-label-name-input", value: name, onChange: (_, value) => {
+                        setName(value);
+                        setError('');
+                    }, placeholder: t('Enter a unique case label name'), validated: isEmpty(error) ? 'default' : 'error', isDisabled: isSaving }),
+                !isEmpty(error) && (React.createElement(FormHelperText, null,
+                    React.createElement(HelperText, null,
+                        React.createElement(HelperTextItem, { variant: "error" }, error)))))),
+        React.createElement(ModalFooter, null,
+            React.createElement(Button, { key: "save", variant: ButtonVariant.primary, onClick: () => handleSave(false), isDisabled: isEmpty(name.trim()) || !isEmpty(error) || isSaving, isLoading: isSaving },
+                React.createElement(Trans, null, "Save")),
+            addMode && (React.createElement(Button, { key: "save-and-new", variant: ButtonVariant.secondary, onClick: () => handleSave(true), isDisabled: isEmpty(name.trim()) || !isEmpty(error) || isSaving, isLoading: isSaving },
+                React.createElement(Trans, null, "Save & New"))),
+            React.createElement(Button, { key: "cancel", variant: ButtonVariant.link, onClick: handleClose, isDisabled: isSaving },
+                React.createElement(Trans, null, "Cancel")))));
+}

package/lib/esm/components/ManageCaseLabels/ManageCaseLabelsTab.d.ts

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

package/lib/esm/components/ManageCaseLabels/ManageCaseLabelsTab.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"ManageCaseLabelsTab.d.ts","sourceRoot":"","sources":["../../../../src/components/ManageCaseLabels/ManageCaseLabelsTab.tsx"],"names":[],"mappings":"AAcA,OAAO,KAAuC,MAAM,OAAO,CAAC;AAmC5D,wBAAgB,mBAAmB,sBAoQlC"}

package/lib/esm/components/ManageCaseLabels/ManageCaseLabelsTab.js

@@ -0,0 +1,199 @@
+var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {
+    function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
+    return new (P || (P = Promise))(function (resolve, reject) {
+        function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
+        function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }
+        function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }
+        step((generator = generator.apply(thisArg, _arguments || [])).next());
+    });
+};
+import { ActionList, ActionListItem, AlertVariant, Button, ButtonVariant, ModalVariant, SearchInput, } from '@patternfly/react-core';
+import PencilAltIcon from '@patternfly/react-icons/dist/js/icons/pencil-alt-icon';
+import TrashIcon from '@patternfly/react-icons/dist/js/icons/trash-icon';
+import { ErrorBoundary, ToastNotification, useConfirmation } from '@rh-support/components';
+import { useGlobalStateContext } from '@rh-support/react-context';
+import isEmpty from 'lodash/isEmpty';
+import React, { useEffect, useMemo, useState } from 'react';
+import { Trans, useTranslation } from 'react-i18next';
+import { useCaseLabels, useCreateCaseLabel, useDeleteCaseLabel, useUpdateCaseLabel, } from '../../hooks/useCaseLabelGraphQL';
+import { ManageTable } from '../ManageTable';
+import { AddEditCaseLabelModal } from './AddEditCaseLabelModal';
+const isDuplicateCaseLabelGraphQLError = (error) => {
+    var _a, _b, _c, _d;
+    if (!error || typeof error !== 'object') {
+        return false;
+    }
+    const apolloError = error;
+    const messages = [
+        ...((_b = (_a = apolloError.graphQLErrors) === null || _a === void 0 ? void 0 : _a.map((graphQLError) => graphQLError.message || '')) !== null && _b !== void 0 ? _b : []),
+        ...((_d = (_c = apolloError.errors) === null || _c === void 0 ? void 0 : _c.map((graphQLError) => graphQLError.message || '')) !== null && _d !== void 0 ? _d : []),
+        apolloError.message || '',
+    ]
+        .join(' ')
+        .toLowerCase();
+    return messages.includes('duplicate value found');
+};
+export function ManageCaseLabelsTab() {
+    var _a;
+    const { t } = useTranslation();
+    const confirmation = useConfirmation();
+    const { globalMetadataState: { loggedInUsersAccount }, } = useGlobalStateContext();
+    const accountId = (_a = loggedInUsersAccount === null || loggedInUsersAccount === void 0 ? void 0 : loggedInUsersAccount.data) === null || _a === void 0 ? void 0 : _a.salesforceAccountId;
+    const { labels: fetchedLabels, loading: isFetchingLabels, error: labelsError, refetch } = useCaseLabels(accountId);
+    const { createCaseLabel, loading: isCreatingLabel } = useCreateCaseLabel();
+    const { updateCaseLabel, loading: isUpdatingLabel } = useUpdateCaseLabel();
+    const { deleteCaseLabel } = useDeleteCaseLabel();
+    const [labels, setLabels] = useState([]);
+    const [searchString, setSearchString] = useState('');
+    const [isModalOpen, setIsModalOpen] = useState(false);
+    const [isInAddMode, setIsInAddMode] = useState(true);
+    const [selectedLabel, setSelectedLabel] = useState(null);
+    useEffect(() => {
+        setLabels(fetchedLabels);
+    }, [fetchedLabels]);
+    const filteredLabels = useMemo(() => {
+        if (isEmpty(searchString)) {
+            return labels;
+        }
+        return labels.filter((label) => label.name.toLowerCase().includes(searchString.toLowerCase()));
+    }, [labels, searchString]);
+    const onOpenAddModal = () => {
+        setIsInAddMode(true);
+        setSelectedLabel(null);
+        setIsModalOpen(true);
+    };
+    const onOpenEditModal = (label) => {
+        setIsInAddMode(false);
+        setSelectedLabel(label);
+        setIsModalOpen(true);
+    };
+    const closeModal = () => {
+        setIsModalOpen(false);
+        setSelectedLabel(null);
+        setIsInAddMode(true);
+    };
+    const onSaveLabel = (name, options) => __awaiter(this, void 0, void 0, function* () {
+        if (isInAddMode) {
+            if (!accountId) {
+                ToastNotification.addDangerMessage(t('Unable to create case label. Account information is missing.'));
+                return { success: false };
+            }
+            try {
+                yield createCaseLabel(name, accountId);
+                yield refetch();
+                ToastNotification.addSuccessMessage(t('Case label has been successfully created.'));
+                if (!(options === null || options === void 0 ? void 0 : options.keepOpen)) {
+                    closeModal();
+                }
+                return { success: true };
+            }
+            catch (error) {
+                if (isDuplicateCaseLabelGraphQLError(error)) {
+                    return {
+                        success: false,
+                        fieldError: t('Label name already in use. Try a different name.'),
+                    };
+                }
+                ToastNotification.addDangerMessage(t('Case label failed to create.'));
+                return { success: false };
+            }
+        }
+        if (selectedLabel) {
+            try {
+                yield updateCaseLabel(selectedLabel.id, name);
+                yield refetch();
+                ToastNotification.addSuccessMessage(t('Case label has been successfully updated.'));
+                closeModal();
+                return { success: true };
+            }
+            catch (error) {
+                if (isDuplicateCaseLabelGraphQLError(error)) {
+                    return {
+                        success: false,
+                        fieldError: t('Label name already in use. Try a different name.'),
+                    };
+                }
+                ToastNotification.addDangerMessage(t('Case label failed to update.'));
+                return { success: false };
+            }
+        }
+        return { success: false };
+    });
+    const onDeleteLabel = (label) => __awaiter(this, void 0, void 0, function* () {
+        try {
+            yield confirmation({
+                catchOnCancel: true,
+                confirmText: t('Delete label'),
+                confirmButtonVariant: ButtonVariant.danger,
+                cancelText: t('Cancel'),
+                modalVariant: ModalVariant.large,
+                title: t('Delete case label'),
+                description: (React.createElement("div", { className: "case-label-delete-description", style: { display: 'flex', flexDirection: 'column', gap: '1.5rem' } },
+                    React.createElement("div", null, t('Are you sure you want to delete "{{name}}" case label?', { name: label.name })),
+                    React.createElement("div", { style: { whiteSpace: 'nowrap' } },
+                        t('This label is currently assigned to'),
+                        ' ',
+                        React.createElement("strong", null, t('{{count}} cases', { count: label.assignedCaseCount })),
+                        '. ',
+                        t('Deleting it will remove the label from all associated cases.')))),
+            });
+        }
+        catch (_a) {
+            // user cancelled
+            return;
+        }
+        try {
+            yield deleteCaseLabel(label.id);
+            yield refetch();
+            ToastNotification.addSuccessMessage(t('Case label has been successfully removed.'));
+        }
+        catch (_b) {
+            ToastNotification.addDangerMessage(t('Case label failed to remove.'));
+        }
+    });
+    const onViewAssignedCases = (label) => {
+        // Placeholder until case-list filter by label is wired
+        ToastNotification.addInfoMessage(t(`View cases assigned to "${label.name}" (coming soon)`));
+    };
+    const columns = [
+        {
+            accessor: (label) => label.name,
+            sortable: false,
+            id: 'case-label-row',
+            title: '',
+            cellWidth: 100,
+            cell: (label) => (React.createElement("div", { className: "case-label-row" },
+                React.createElement("div", { className: "case-label-row__info" },
+                    React.createElement("div", { className: "pf-v6-u-font-weight-bold" }, label.name),
+                    React.createElement("div", { className: "pf-v6-u-color-200 pf-v6-u-font-size-sm" }, t('{{count}} cases assigned', { count: label.assignedCaseCount }))),
+                React.createElement("div", { className: "case-label-row__actions" },
+                    label.assignedCaseCount > 0 && (React.createElement(Button, { variant: ButtonVariant.link, isInline: true, onClick: () => onViewAssignedCases(label), "data-tracking-id": "case-label-view-assigned-cases" },
+                        React.createElement(Trans, null, "View assigned cases"))),
+                    React.createElement(ActionList, { isIconList: true },
+                        React.createElement(ActionListItem, null,
+                            React.createElement(Button, { icon: React.createElement(PencilAltIcon, null), "aria-label": t('Edit case label {{name}}', { name: label.name }), variant: "plain", onClick: () => onOpenEditModal(label), "data-tracking-id": "case-label-edit" })),
+                        React.createElement(ActionListItem, null,
+                            React.createElement(Button, { icon: React.createElement(TrashIcon, null), "aria-label": t('Delete case label {{name}}', { name: label.name }), variant: "plain", onClick: () => onDeleteLabel(label), "data-tracking-id": "case-label-delete" })))))),
+        },
+    ];
+    return (React.createElement(React.Fragment, null,
+        React.createElement("header", null,
+            React.createElement("h2", null, t('Case labels')),
+            React.createElement("p", null,
+                React.createElement(Trans, null, "Case labels help you organize and categorize cases with custom tags, making them easier to find, filter, and manage."))),
+        React.createElement("div", { className: "toolbar case-labels-toolbar" },
+            React.createElement("div", { className: "toolbar-left" },
+                React.createElement("label", { htmlFor: "search-case-label-input" },
+                    React.createElement(Trans, null, "Case labels")),
+                React.createElement(SearchInput, { className: "pf-v6-u-flex-grow-1 pf-v6-c-search-input pf-v6-u-background-color-100", value: searchString, id: "search-case-label-input", placeholder: t('Search case label by name.'), "aria-label": t('Search case label by name'), onChange: (_, val) => setSearchString(val), onClear: () => setSearchString('') }),
+                React.createElement("span", { className: "pf-v6-u-ml-sm" },
+                    React.createElement(Button, { variant: ButtonVariant.primary, isInline: true, onClick: onOpenAddModal, "data-tracking-id": "case-label-add-button" },
+                        React.createElement(Trans, null, "Add")))),
+            React.createElement("div", { className: "toolbar-right case-labels-toolbar__loaded pf-v6-u-color-200" }, t('{{loaded}} of {{total}} loaded.', {
+                loaded: filteredLabels.length,
+                total: filteredLabels.length,
+            }))),
+        React.createElement(AddEditCaseLabelModal, { isOpen: isModalOpen, addMode: isInAddMode, label: selectedLabel, isSaving: isCreatingLabel || isUpdatingLabel, onClose: closeModal, onSave: onSaveLabel }),
+        React.createElement(ErrorBoundary, { errorMsgInfo: { message: t('There was an error loading case labels list') } },
+            React.createElement(ManageTable, { ariaLabel: t('Table to manage case labels'), columns: columns, data: filteredLabels, errorVariant: AlertVariant.warning, isFetching: isFetchingLabels, isError: !!labelsError, errorTitle: t('Case labels error'), errorComponent: React.createElement(Trans, null, "Could not get case labels"), pagination: false, noResultText: t('There are no results to display. Try adding a case label or refining your search') }))));
+}

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

@@ -0,0 +1,2 @@
+export * from './ManageCaseLabelsTab';
+//# sourceMappingURL=index.d.ts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/components/ManageCaseLabels/index.ts"],"names":[],"mappings":"AAAA,cAAc,uBAAuB,CAAC"}