@rh-support/troubleshoot 2.2.50 → 2.4.10-beta.6

package/README.md

@@ -1,6 +1,6 @@
 # `troubleshoot`
 
-Pluggable troubleshoot module.
+Pluggable troubleshoot module
 
 ## Usage
 

package/lib/esm/components/AccountInfo/AccountSelector.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"AccountSelector.d.ts","sourceRoot":"","sources":["../../../../src/components/AccountInfo/AccountSelector.tsx"],"names":[],"mappings":"AAAA,OAAO,2BAA2B,CAAC;AAOnC,OAAO,EAAE,gBAAgB,EAAW,MAAM,0BAA0B,CAAC;AAcrE,UAAU,MAAO,SAAQ,gBAAgB;CAAG;AAE5C,eAAO,MAAM,YAAY,EAAE,MAG1B,CAAC;AAEF,iBAAS,eAAe,CAAC,KAAK,EAAE,MAAM,eA4KrC;kBA5KQ,eAAe;;;AAgLxB,OAAO,EAAE,eAAe,EAAE,CAAC"}
+{"version":3,"file":"AccountSelector.d.ts","sourceRoot":"","sources":["../../../../src/components/AccountInfo/AccountSelector.tsx"],"names":[],"mappings":"AAAA,OAAO,2BAA2B,CAAC;AAOnC,OAAO,EAAE,gBAAgB,EAAW,MAAM,0BAA0B,CAAC;AAcrE,UAAU,MAAO,SAAQ,gBAAgB;CAAG;AAE5C,eAAO,MAAM,YAAY,EAAE,MAG1B,CAAC;AAEF,iBAAS,eAAe,CAAC,KAAK,EAAE,MAAM,eA2KrC;kBA3KQ,eAAe;;;AA+KxB,OAAO,EAAE,eAAe,EAAE,CAAC"}

package/lib/esm/components/AccountInfo/AccountSelector.js

@@ -109,17 +109,17 @@ function AccountSelector(props) {
     if (isEmpty(loggedInUserRights.data))
         return React.createElement(React.Fragment, null);
     return (React.createElement("div", { id: props.id, className: `form-group ${props.className}` },
-        React.createElement(AlertMessage, { show: showNotEntitledMessage, variant: AlertType.DANGER, isInline: true, title: t("The selected account doesn't have entitlement"), className: "pf-v5-u-mb-lg" }),
-        React.createElement("div", { className: "account-selector-label-wrapper pf-v5-u-display-flex" },
+        React.createElement(AlertMessage, { show: showNotEntitledMessage, variant: AlertType.DANGER, isInline: true, title: t("The selected account doesn't have entitlement"), className: "pf-u-mb-lg" }),
+        React.createElement("div", { className: "account-selector-label-wrapper pf-u-display-flex" },
             React.createElement("label", { htmlFor: "account-selector" },
                 React.createElement(Trans, null, "Account"),
                 ' ',
                 React.createElement("span", { className: "form-required", "aria-hidden": true }, "*")),
-            canUseFindMyAccount && (React.createElement("button", { role: "link", className: "btn btn-link btn-app find-my-account pf-v5-u-ml-auto", onClick: onFindMyAccountClick, disabled: selectedAccountDetails.isFetching, "data-tracking-id": "get-support-find-my-account" },
+            canUseFindMyAccount && (React.createElement("button", { role: "link", className: "btn btn-link btn-app find-my-account pf-u-ml-auto", onClick: onFindMyAccountClick, disabled: selectedAccountDetails.isFetching, "data-tracking-id": "get-support-find-my-account" },
                 React.createElement(Trans, null, "Find my account")))),
         React.createElement("div", { className: "account-selector-wrapper" },
             React.createElement(AccountSelectorInternal, { selectedAccounts: [selectedAccount], canBookmarkAccount: canBookmarkAccounts, bookmarkedAccounts: bookmarkedGroupAccounts.data, id: "account-or-bookmark-selector", className: "account-selector", name: "account-or-bookmark-selector", placeholder: t(`Search for an account ${loggedInUserRights.data.isExternal() ? 'or select a bookmark' : ''} `), onSelect: onInternalAccountSelect, disabled: loggedInUserRights.data.isExternal() || selectedAccountDetails.isFetching, isInValid: isSelectedAccountSubscriptionAbused, restrictedOnSubscriptionAbuse: true })),
-        canAccessManagedAccounts && !isEmpty(managedAccounts.data) && (React.createElement(ManagedAccountsDropdown, { className: "managed-account-selector pf-v5-u-mt-xl", onManagedAccountChange: onManagedAccountChange, managedAccounts: managedAccounts, selectedAccountNumber: accountNumber, disabled: selectedAccountDetails.isFetching })),
+        canAccessManagedAccounts && (React.createElement(ManagedAccountsDropdown, { className: "managed-account-selector pf-u-mt-xl", onManagedAccountChange: onManagedAccountChange, managedAccounts: managedAccounts, selectedAccountNumber: accountNumber, disabled: selectedAccountDetails.isFetching })),
         isSelectedAccountSubscriptionAbused && (React.createElement("p", { className: "form-instructions form-invalid" },
             React.createElement(InfoCircleIcon, null),
             ' ',

package/lib/esm/components/AccountInfo/ManagedAccountsDropdown.js

@@ -26,7 +26,7 @@ function ManagedAccountsDropdown(props) {
     }, [props.managedAccounts.data, props.selectedAccountNumber]);
     // Only accounts that have granted access permission to partner should be listed
     const managedAccountsWithPermission = () => props.managedAccounts.data.filter((account) => account.partnerCaseAccess === 'All') || [];
-    const managedAccountsOptions = managedAccountsWithPermission().map((account) => (Object.assign({ actionItem: (React.createElement(React.Fragment, null, account.subscriptionAbuse && (React.createElement("span", { className: "form-instructions form-invalid pf-v5-u-text-nowrap pf-v5-u-pr-sm" },
+    const managedAccountsOptions = managedAccountsWithPermission().map((account) => (Object.assign({ actionItem: (React.createElement(React.Fragment, null, account.subscriptionAbuse && (React.createElement("span", { className: "form-instructions form-invalid pf-u-text-nowrap pf-u-pr-sm" },
             ' ',
             React.createElement(InfoCircleIcon, null),
             " ",

package/lib/esm/components/CaseEditView/ActiveCustomerEscalation/ActiveCustomerEscalation.js

@@ -28,7 +28,7 @@ export const ActiveCustomerEscalation = forwardRef((props, ref) => {
                 React.createElement("li", null, t('The customer thinks the case is not moving appropriately')),
                 React.createElement("li", null, t('The customer wants a new resource')),
                 React.createElement("li", null, t('The issue is more severe than originally thought'))),
-            React.createElement("a", { href: `/watchlist/internal/aces/new?caseNumber=${props.caseNumber}`, className: "pf-v5-c-button pf-m-tertiary", target: "_blank", rel: "noopener noreferrer", "data-tracking-id": "request-ace-trigger", "aria-label": t('Request an escalation') }, t('Request an escalation')))));
+            React.createElement("a", { href: `/watchlist/internal/aces/new?caseNumber=${props.caseNumber}`, className: "pf-c-button pf-m-tertiary", target: "_blank", rel: "noopener noreferrer", "data-tracking-id": "request-ace-trigger", "aria-label": t('Request an escalation') }, t('Request an escalation')))));
     const [openRequestEscalationModal, setOpenRequestEscalationModal] = useState(false);
     const toggleModal = () => {
         if (canEditCase.alert())
@@ -51,7 +51,7 @@ export const ActiveCustomerEscalation = forwardRef((props, ref) => {
                 React.createElement("li", null, t('Needs a senior resource.')),
                 React.createElement("li", null, t('Is more severe or should be a higher priority.'))),
             commonElements,
-            React.createElement(Button, { className: "pf-v5-c-button pf-m-tertiary", onClick: toggleModal, "data-tracking-id": "request-rme-trigger", "aria-label": t('Request an escalation') }, t('Request an escalation')))));
+            React.createElement(Button, { className: "pf-c-button pf-m-tertiary", onClick: toggleModal, "data-tracking-id": "request-rme-trigger", "aria-label": t('Request an escalation') }, t('Request an escalation')))));
     return (React.createElement(React.Fragment, null,
         React.createElement(RequestEscalationModal, { caseNumber: props.caseNumber, severity: props.caseSeverity, caseStatus: props.caseStatus, show: openRequestEscalationModal, onClose: toggleModal }),
         React.createElement(Can, { do: resourceActions.CREATE, on: resources.ICE_ESCALATION, passThrough: true }, (canCreateICE) => canCreateICE ? isInternalElements : isCreateRMEVisible ? isNotInternalElements : React.createElement(React.Fragment, null))));

package/lib/esm/components/CaseEditView/ActiveCustomerEscalation/RequestEscalationModal.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"RequestEscalationModal.d.ts","sourceRoot":"","sources":["../../../../../src/components/CaseEditView/ActiveCustomerEscalation/RequestEscalationModal.tsx"],"names":[],"mappings":"AAyCA,UAAU,MAAM;IACZ,UAAU,EAAE,MAAM,CAAC;IACnB,QAAQ,EAAE,MAAM,CAAC;IACjB,IAAI,EAAE,OAAO,CAAC;IACd,UAAU,EAAE,MAAM,CAAC;IACnB,OAAO,EAAE,MAAM,IAAI,CAAC;CACvB;AAID,wBAAgB,sBAAsB,CAAC,KAAK,EAAE,MAAM,eA6WnD"}
+{"version":3,"file":"RequestEscalationModal.d.ts","sourceRoot":"","sources":["../../../../../src/components/CaseEditView/ActiveCustomerEscalation/RequestEscalationModal.tsx"],"names":[],"mappings":"AAwCA,UAAU,MAAM;IACZ,UAAU,EAAE,MAAM,CAAC;IACnB,QAAQ,EAAE,MAAM,CAAC;IACjB,IAAI,EAAE,OAAO,CAAC;IACd,UAAU,EAAE,MAAM,CAAC;IACnB,OAAO,EAAE,MAAM,IAAI,CAAC;CACvB;AAID,wBAAgB,sBAAsB,CAAC,KAAK,EAAE,MAAM,eA0WnD"}

package/lib/esm/components/CaseEditView/ActiveCustomerEscalation/RequestEscalationModal.js

@@ -8,8 +8,8 @@ var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, ge
     });
 };
 import { escalations, publicApi } from '@cee-eng/hydrajs';
-import { Button, Form, FormGroup, FormHelperText, Grid, GridItem, HelperText, HelperTextItem, Modal, Popover, TextArea, TextInput, Title, ValidatedOptions, } from '@patternfly/react-core';
-import { Select, SelectOption } from '@patternfly/react-core/deprecated';
+import { Button, Form, FormGroup, Grid, GridItem, Modal, Popover, Select, SelectOption, TextArea, TextInput, Title, ValidatedOptions, } from '@patternfly/react-core';
+import ExclamationCircleIcon from '@patternfly/react-icons/dist/js/icons/exclamation-circle-icon';
 import InfoCircleIcon from '@patternfly/react-icons/dist/js/icons/info-circle-icon';
 import { AlertMessage, AlertType, LoadingIndicator, ToastNotification, useFetch } from '@rh-support/components';
 import { useGlobalStateContext } from '@rh-support/react-context';
@@ -46,7 +46,7 @@ export function RequestEscalationModal(props) {
     const [submitButtonIsClicked, setSubmitSaveButtonIsClicked] = useState(false);
     // checks if all the fields have values.
     const hasRequiredInfo = () => Object.keys(formState).reduce((accumulator, currentValue) => { var _a; return !accumulator ? accumulator : formState[currentValue].length > 0 && ((_a = formState[currentValue]) === null || _a === void 0 ? void 0 : _a.trim()); }, true);
-    const setFormStateValue = (key, value) => setFormState((pre) => (Object.assign(Object.assign({}, pre), { [key]: value })));
+    const setFormStateValue = (key) => (value) => setFormState(Object.assign(Object.assign({}, formState), { [key]: value }));
     const createEscalationFetch = useFetch(escalations.createIceEscalation, { propgateErrors: true });
     const { request: postCommentRequest, isFetching: isPostingComment } = useFetch(publicApi.kase.postComment, {
         propgateErrors: true,
@@ -126,11 +126,11 @@ export function RequestEscalationModal(props) {
             t('Submit')),
         React.createElement(Button, { key: "cancel", variant: "link", onClick: onCancel, "data-tracking-id": "request-rme-cancel", isDisabled: createEscalationFetch.isFetching || isPostingComment || isUpdatingCase, "aria-label": t('Cancel') }, t('Cancel')),
     ];
-    const header = (React.createElement(Title, { className: "pf-v5-u-mb-0", id: "custom-header-label", headingLevel: "h1" },
+    const header = (React.createElement(Title, { className: "pf-u-mb-0", id: "custom-header-label", headingLevel: "h1" },
         React.createElement(Trans, null, "Request an escalation"),
         React.createElement(Popover, { showClose: false, position: 'top', hasAutoWidth: true, bodyContent: () => (React.createElement("a", { href: "/support/escalation", target: "_blank", "aria-label": t('Learn more about escalation cases.') },
                 React.createElement(Trans, null, "Learn more about escalation cases."))) },
-            React.createElement(InfoCircleIcon, { className: "pf-v5-u-ml-sm" }))));
+            React.createElement(InfoCircleIcon, { className: "pf-u-ml-sm" }))));
     // load rme categories as soon as user opens the modal
     useEffect(() => {
         if (!props.show || categories.length !== 0)
@@ -148,40 +148,37 @@ export function RequestEscalationModal(props) {
         // eslint-disable-next-line react-hooks/exhaustive-deps
     }, [props.show]);
     return (React.createElement(Modal, { id: "request-mgmt-escalation-modal", className: "request-escalation-modal", isOpen: props.show, onClose: onCancel, actions: modalActions, header: header, "aria-label": t('Request an escalation') },
-        React.createElement("p", { className: "pf-v5-u-mb-md" },
+        React.createElement("p", { className: "pf-u-mb-md" },
             React.createElement(Trans, { i18nKey: "i18RequestEscalationDescription" }, "Submit an escalation if an issue has become more severe or you feel the case needs a higher priority. A support manager will review your escalation request.")),
-        React.createElement(AlertMessage, { variant: AlertType.DANGER, title: t('Could not create case escalation'), show: creationError, onClose: onErrorClose, isInline: true, className: "pf-v5-u-mb-md", "aria-label": t('Could not create case escalation') }),
+        React.createElement(AlertMessage, { variant: AlertType.DANGER, title: t('Could not create case escalation'), show: creationError, onClose: onErrorClose, isInline: true, className: "pf-u-mb-md", "aria-label": t('Could not create case escalation') }),
         React.createElement(Form, { "aria-label": t('form'), className: "request-escalation-form" },
             React.createElement(Grid, { hasGutter: true, md: 12 },
                 React.createElement(GridItem, { span: 6 },
                     React.createElement(FormGroup, { isRequired: true, label: t('Category'), fieldId: "escalation-category" },
                         React.createElement(Select, Object.assign({ "aria-label": t('Category'), id: "customer-category-select", selections: formState.rmeCategory, validated: submitButtonIsClicked && isEmpty(formState.rmeCategory)
                                 ? ValidatedOptions.error
-                                : ValidatedOptions.default, "aria-invalid": submitButtonIsClicked && isEmpty(formState.rmeCategory), onSelect: setCategoryState, isOpen: showCategoryDropdown, placeholderText: t('Select an option that best fits'), onToggle: (_event, toggle) => onCategoryDropdownToggle(toggle) }, (isCategoriesFetching && { loadingVariant: 'spinner' })), categories.map((value, index) => (React.createElement(SelectOption, { key: index, value: value }, value)))))),
+                                : ValidatedOptions.default, "aria-invalid": submitButtonIsClicked && isEmpty(formState.rmeCategory), onSelect: setCategoryState, isOpen: showCategoryDropdown, placeholderText: t('Select an option that best fits'), onToggle: onCategoryDropdownToggle }, (isCategoriesFetching && { loadingVariant: 'spinner' })), categories.map((value, index) => (React.createElement(SelectOption, { key: index, value: value }, value)))))),
                 React.createElement(GridItem, { span: 6 },
                     React.createElement(FormGroup, { isRequired: true, label: t('My region'), fieldId: "escalation-region" },
                         React.createElement(Select, { "aria-label": t('My region'), id: "customer-geo-select", selections: formState.geo, onSelect: setGeoState, isOpen: showGeoDropdown, validated: submitButtonIsClicked && isEmpty(formState.geo)
                                 ? ValidatedOptions.error
-                                : ValidatedOptions.default, placeholderText: t('Select a location'), onToggle: (_event, toggle) => onGeoDropdownToggle(toggle), "aria-invalid": submitButtonIsClicked && isEmpty(formState.geo) }, customerGEOKeys.map((key, index) => (React.createElement(SelectOption, { key: index, value: CustomerGEOs[key].value }, t(CustomerGEOs[key].label))))))),
-                React.createElement(FormGroup, { isRequired: true, label: t('Subject'), fieldId: "escalation-subject" },
-                    submitButtonIsClicked && hasLargeSubject && (React.createElement(FormHelperText, null,
-                        React.createElement(HelperText, null,
-                            React.createElement(HelperTextItem, { variant: ValidatedOptions.error, hasIcon: true }, t('Subject cannot be more than {{limit}} characters', {
-                                limit: ESCALATION_SUBJECT_LENGTH_LIMIT,
-                            }))))),
+                                : ValidatedOptions.default, placeholderText: t('Select a location'), onToggle: onGeoDropdownToggle, "aria-invalid": submitButtonIsClicked && isEmpty(formState.geo) }, customerGEOKeys.map((key, index) => (React.createElement(SelectOption, { key: index, value: CustomerGEOs[key].value }, t(CustomerGEOs[key].label))))))),
+                React.createElement(FormGroup, { isRequired: true, validated: submitButtonIsClicked && hasLargeSubject ? ValidatedOptions.error : ValidatedOptions.default, helperTextInvalid: t('Subject cannot be more than {{limit}} characters', {
+                        limit: ESCALATION_SUBJECT_LENGTH_LIMIT,
+                    }), helperTextInvalidIcon: React.createElement(ExclamationCircleIcon, null), label: t('Subject'), fieldId: "escalation-subject" },
                     React.createElement(TextInput, { isRequired: true, validated: (submitButtonIsClicked && isEmpty(formState.subject)) || hasLargeSubject
                             ? ValidatedOptions.error
-                            : ValidatedOptions.default, type: "text", placeholder: t('Enter a subject for your request'), id: "subject-input", name: "subject-input", value: formState.subject, onChange: (_event, subject) => onSubjectChange(subject), "aria-label": t('Subject') })),
+                            : ValidatedOptions.default, type: "text", placeholder: t('Enter a subject for your request'), id: "subject-input", name: "subject-input", value: formState.subject, onChange: onSubjectChange, "aria-label": t('Subject') })),
                 React.createElement(FormGroup, { isRequired: true, label: t('Description'), fieldId: "escalation-description" },
-                    React.createElement(TextArea, { value: formState.description, onChange: (e, value) => setFormStateValue('description', value), isRequired: true, validated: submitButtonIsClicked && isEmpty(formState.description)
+                    React.createElement(TextArea, { value: formState.description, onChange: setFormStateValue('description'), isRequired: true, validated: submitButtonIsClicked && isEmpty(formState.description)
                             ? ValidatedOptions.error
-                            : ValidatedOptions.default, "aria-label": t('Description'), id: "description-textarea", placeholder: t('Provide a detailed comment for us to best assist you'), resizeOrientation: "vertical" })),
+                            : ValidatedOptions.default, "aria-label": t('Description'), id: "description-textarea", placeholder: t('Provide a detailed comment for us to best assist you') })),
                 React.createElement(FormGroup, { isRequired: true, label: t('Expectations'), fieldId: "escalation-expectations" },
-                    React.createElement(TextArea, { onChange: (e, value) => setFormStateValue('expectations', value), isRequired: true, validated: submitButtonIsClicked && isEmpty(formState.expectations)
+                    React.createElement(TextArea, { onChange: setFormStateValue('expectations'), isRequired: true, validated: submitButtonIsClicked && isEmpty(formState.expectations)
                             ? ValidatedOptions.error
-                            : ValidatedOptions.default, placeholder: t('What do you expect to happen with this escalation?'), id: "expectations-input", value: formState.expectations, "aria-label": t('Expectations'), resizeOrientation: "vertical" })),
+                            : ValidatedOptions.default, placeholder: t('What do you expect to happen with this escalation?'), id: "expectations-input", value: formState.expectations, "aria-label": t('Expectations') })),
                 React.createElement(FormGroup, { isRequired: true, label: t('Business impact'), fieldId: "escalation-business-impact" },
-                    React.createElement(TextArea, { onChange: (e, value) => setFormStateValue('businessImpactDescription', value), isRequired: true, validated: submitButtonIsClicked && isEmpty(formState.businessImpactDescription)
+                    React.createElement(TextArea, { onChange: setFormStateValue('businessImpactDescription'), isRequired: true, validated: submitButtonIsClicked && isEmpty(formState.businessImpactDescription)
                             ? ValidatedOptions.error
-                            : ValidatedOptions.default, placeholder: t('Does your business impact change with this escalation? Please describe how it changed.'), id: "business-impact-input", value: formState.businessImpactDescription, "aria-label": t('Business impact'), resizeOrientation: "vertical" }))))));
+                            : ValidatedOptions.default, placeholder: t('Does your business impact change with this escalation? Please describe how it changed.'), id: "business-impact-input", value: formState.businessImpactDescription, "aria-label": t('Business impact') }))))));
 }

package/lib/esm/components/CaseEditView/CaseDetailsAside.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"CaseDetailsAside.d.ts","sourceRoot":"","sources":["../../../../src/components/CaseEditView/CaseDetailsAside.tsx"],"names":[],"mappings":"AA8BA,UAAU,MAAM;IACZ,UAAU,EAAE,MAAM,CAAC;CACtB;AAMD,wBAAgB,gBAAgB,CAAC,KAAK,EAAE,MAAM,eA2W7C"}
+{"version":3,"file":"CaseDetailsAside.d.ts","sourceRoot":"","sources":["../../../../src/components/CaseEditView/CaseDetailsAside.tsx"],"names":[],"mappings":"AA8BA,UAAU,MAAM;IACZ,UAAU,EAAE,MAAM,CAAC;CACtB;AAMD,wBAAgB,gBAAgB,CAAC,KAAK,EAAE,MAAM,eAiW7C"}

package/lib/esm/components/CaseEditView/CaseDetailsAside.js

@@ -7,7 +7,7 @@ var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, ge
         step((generator = generator.apply(thisArg, _arguments || [])).next());
     });
 };
-import { Button, Checkbox, Icon, Popover, PopoverPosition, Switch, Tooltip } from '@patternfly/react-core';
+import { Button, Checkbox, Popover, PopoverPosition, Switch, Tooltip } from '@patternfly/react-core';
 import AngleDoubleLeftIcon from '@patternfly/react-icons/dist/js/icons/angle-double-left-icon';
 import AngleDoubleRightIcon from '@patternfly/react-icons/dist/js/icons/angle-double-right-icon';
 import InfoCircleIcon from '@patternfly/react-icons/dist/js/icons/info-circle-icon';
@@ -173,38 +173,33 @@ export function CaseDetailsAside(props) {
             React.createElement(Button, { variant: "link", isInline: true, title: t('Collapse sidebar') },
                 React.createElement("span", null,
                     React.createElement(Trans, null, "Collapse")),
-                React.createElement(Icon, { className: "pf-v5-u-ml-auto", size: "md" },
-                    React.createElement(AngleDoubleRightIcon, null))))) : (React.createElement("div", { className: "pf-v5-u-display-flex pf-v5-u-flex-direction-column sidebar-section-collapsed" },
+                React.createElement(AngleDoubleRightIcon, { className: "pf-u-ml-auto", size: "md" })))) : (React.createElement("div", { className: "pf-u-display-flex pf-u-flex-direction-column sidebar-section-collapsed" },
             React.createElement(Tooltip, { content: t('Expand sidebar'), position: "left" },
                 React.createElement(Button, { variant: "link" },
-                    React.createElement(Icon, { size: "md" },
-                        React.createElement(AngleDoubleLeftIcon, null)))),
+                    React.createElement(AngleDoubleLeftIcon, { size: "md" }))),
             canSeeToggleCustomerView && (React.createElement(Tooltip, { content: viewAsCustomer ? t('External view') : t('Internal view'), position: "left" },
                 React.createElement(Button, { variant: "link", onClick: () => setSectionToScollRef(toggleCustomerViewRef), className: "sidebar-section-toggle-btn" },
-                    React.createElement(Icon, { size: "md", className: viewAsCustomer ? 'blueLock' : 'greyLock' },
-                        React.createElement(LockIcon, null))))),
+                    React.createElement(LockIcon, { size: "md", className: viewAsCustomer ? 'blueLock' : 'greyLock' })))),
             !isLoadingRecommendations && allDocs.length > 0 && (React.createElement(Tooltip, { content: t('Top recommendations'), position: "left" },
                 React.createElement(Button, { variant: "link", onClick: () => setSectionToScollRef(topSolutionsRef), className: "sidebar-section-toggle-btn" },
-                    React.createElement(Icon, { size: "md" },
-                        React.createElement(ListIcon, null))))),
+                    React.createElement(ListIcon, { size: "md" })))),
             !caseEscalations.isFetching && (canCreateICE || (canCreateRME && isCreateRMEVisible)) && (React.createElement(Tooltip, { content: t('Request an escalation'), position: "left" },
                 React.createElement(Button, { variant: "link", className: "sidebar-section-toggle-btn", onClick: () => setSectionToScollRef(createEscalationRef) },
-                    React.createElement(Icon, { size: "md" },
-                        React.createElement(TrendUpIcon, null)))))))),
+                    React.createElement(TrendUpIcon, { size: "md" }))))))),
         React.createElement("pfe-collapse-panel", { className: "sidebar-content", "pfe-animation": "false", id: "case-details-aside-content", ref: caseDetailsAsidePanelRef },
             React.createElement("div", { className: "grid-aside-content" },
                 React.createElement("div", null,
-                    canSeeToggleCustomerView && (React.createElement("div", { className: "pf-v5-u-display-flex customer-view-toggle", ref: toggleCustomerViewRef },
+                    canSeeToggleCustomerView && (React.createElement("div", { className: "pf-u-display-flex customer-view-toggle", ref: toggleCustomerViewRef },
                         React.createElement("span", { className: "customer-view-switch-label" },
                             preferredOrDefaultCaseView() ? t('Customer view') : t('Internal view'),
                             React.createElement(Popover, { "aria-label": "Preferred-default-case-view-popover", position: PopoverPosition.top, bodyContent: React.createElement("p", { className: 'pref-case-popover-text' },
                                     React.createElement(Trans, null, renderCasePrefPopoverText())), showClose: false },
-                                React.createElement(InfoCircleIcon, { "aria-label": "Preferred-case-view-info-icon", className: "pf-v5-u-ml-sm" }))),
+                                React.createElement(InfoCircleIcon, { "aria-label": "Preferred-case-view-info-icon", className: "pf-u-ml-sm" }))),
                         React.createElement(Switch, { title: preferredOrDefaultCaseView() ? t('Customer view') : t('Internal view'), "data-tracking-id": preferredOrDefaultCaseView()
                                 ? 'disable-view-as-customer'
                                 : 'enable-view-as-customer', "aria-label": preferredOrDefaultCaseView()
                                 ? 'disable view as customer'
-                                : 'enable view as customer', id: "customer-view-switch", className: "pf-v5-u-ml-auto", isChecked: preferredOrDefaultCaseView(), onChange: onCaseSwitchChange }))),
+                                : 'enable view as customer', id: "customer-view-switch", className: "pf-u-ml-auto", isChecked: preferredOrDefaultCaseView(), onChange: onCaseSwitchChange }))),
                     canSeeToggleCustomerView && (React.createElement("div", null,
                         React.createElement(Checkbox, { label: t('Set to default'), isChecked: isDefaultBoxChecked, onChange: onDefaultCheckboxChange, id: "set-default-view-checkbox", name: "default-view-checkbox", isDisabled: isDefaultBoxChecked, className: 'defaultViewCheckbox' })))),
                 React.createElement(ErrorBoundary, { errorMsgInfo: { message: t('There was an error loading top solutions') } },

package/lib/esm/components/CaseEditView/CaseDetailsErrorMessage.js

@@ -46,7 +46,7 @@ export function CaseDetailsErrorMessage(props) {
             '404': { message: errorMessage404 },
         });
     };
-    return (React.createElement(AlertMessage, { variant: AlertType.DANGER, className: "pf-v5-u-mb-lg", show: true, 
+    return (React.createElement(AlertMessage, { variant: AlertType.DANGER, className: "pf-u-mb-lg", show: true, 
         // Here customizing title of alert based on case group error.
         title: errorMessageTitle(errorDetails, Object.assign({}, (isCaseGroupError && {
             '403': { title: invalidCaseGroupErrorTitle },

package/lib/esm/components/CaseEditView/CaseDetailsTabs.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"CaseDetailsTabs.d.ts","sourceRoot":"","sources":["../../../../src/components/CaseEditView/CaseDetailsTabs.tsx"],"names":[],"mappings":"AAeA,OAAO,KAAiD,MAAM,OAAO,CAAC;AAEtE,OAAO,EAAE,mBAAmB,EAAa,MAAM,kBAAkB,CAAC;AAwBlE,UAAU,MAAM;IACZ,UAAU,EAAE,MAAM,CAAC;IACnB,UAAU,EAAE,mBAAmB,CAAC;IAChC,QAAQ,EAAE,MAAM,CAAC;IACjB,OAAO,EAAE,KAAK,CAAC,gBAAgB,CAAC,cAAc,CAAC,CAAC;CACnD;AACD,wBAAgB,eAAe,CAAC,KAAK,EAAE,MAAM,eAgN5C"}
+{"version":3,"file":"CaseDetailsTabs.d.ts","sourceRoot":"","sources":["../../../../src/components/CaseEditView/CaseDetailsTabs.tsx"],"names":[],"mappings":"AAeA,OAAO,KAAiD,MAAM,OAAO,CAAC;AAEtE,OAAO,EAAE,mBAAmB,EAAa,MAAM,kBAAkB,CAAC;AAwBlE,UAAU,MAAM;IACZ,UAAU,EAAE,MAAM,CAAC;IACnB,UAAU,EAAE,mBAAmB,CAAC;IAChC,QAAQ,EAAE,MAAM,CAAC;IACjB,OAAO,EAAE,KAAK,CAAC,gBAAgB,CAAC,cAAc,CAAC,CAAC;CACnD;AACD,wBAAgB,eAAe,CAAC,KAAK,EAAE,MAAM,eA+M5C"}

package/lib/esm/components/CaseEditView/CaseDetailsTabs.js

@@ -11,7 +11,7 @@ import { useCaseSelector } from '../../context/CaseContext';
 import { useCaseDetailsPageStateContext } from '../../context/CaseDetailsPageContext';
 import { PDFContext } from './PDFContainer';
 import CaseDetailsManagement from './Tabs/CaseDetails/CaseDetailsManagement';
-const RelatedTickets = React.lazy(() => import(/* webpackChunkName: 'CaseBugzilla' */ './Tabs/RelatedTickets/RelatedTickets'));
+const CaseBugzilla = React.lazy(() => import(/* webpackChunkName: 'CaseBugzilla' */ './Tabs/CaseBugzilla/CaseBugzilla'));
 const CaseActionPlan = React.lazy(() => import(/* webpackChunkName: 'CaseActionPlan' */ './Tabs/CaseActionPlan/CaseActionPlan'));
 const CasePrivateNotes = React.lazy(() => import(/* webpackChunkName: 'CasePrivateNotes' */ './Tabs/CasePrivateNotes/CasePrivateNotes'));
 const CaseDiscussion = React.lazy(() => import(/* webpackChunkName: 'CaseDiscussion' */ './Tabs/CaseDiscussion/CaseDiscussion'));
@@ -30,21 +30,16 @@ export function CaseDetailsTabs(props) {
     const [activeTabKey, setActiveTabKey] = useState(0);
     const { caseDetailsPageState: { caseEscalations }, } = useCaseDetailsPageStateContext();
     const canSeePrivateNotes = ability.can(resourceActions.PATCH, resources.CASE_DETAILS, CaseDetailsFields.CASE_DETAILS_PRIVATE_NOTES_EDIT);
-    // const canSeeBugZillas = ability.can(
-    //     resourceActions.PATCH,
-    //     resources.CASE_DETAILS,
-    //     CaseDetailsFields.CASE_DETAILS_BUGZILLAS
-    // );
+    const canSeeBugZillas = ability.can(resourceActions.PATCH, resources.CASE_DETAILS, CaseDetailsFields.CASE_DETAILS_BUGZILLAS);
     const { isExportingPDF, pdfOption } = useContext(PDFContext);
     const canSeeRMEs = ability.can(resourceActions.PATCH, resources.CASE_DETAILS, CaseDetailsFields.CASE_DETAILS_RMES);
     const [selectedTab, setSelectedTab] = useState(CaseDetailsTabsEnum.DISCUSSION);
     const discussionTabRef = useRef(null);
-    // const bugZillaTabRef: React.MutableRefObject<HTMLDivElement> = useRef(null);
+    const bugZillaTabRef = useRef(null);
     const managementTabRef = useRef(null);
     const privateNotesTabRef = useRef(null);
     const actionPlanTabRef = useRef(null);
     const escalationTabRef = useRef(null);
-    const relatedTicketsRef = useRef(null);
     const tabsToRender = [];
     const handleTabClick = (event, tabIndex) => {
         setActiveTabKey(tabIndex);
@@ -66,14 +61,14 @@ export function CaseDetailsTabs(props) {
         ref: managementTabRef,
         component: (React.createElement(CaseDetailsManagement, { caseNumber: caseNumber, routeProps: props.routeProps, tabRef: managementTabRef })),
     });
-    loggedInUserRights.data.isInternal() &&
+    canSeeBugZillas &&
         tabsToRender.push({
-            'data-tracking-id': 'case-details-related-ticket-tab',
-            key: 'relatedTickets',
-            ref: relatedTicketsRef,
-            routePath: 'related-tickets',
-            title: CaseDetailsTabsEnum.RELATED_TICKETS,
-            component: React.createElement(RelatedTickets, null),
+            'data-tracking-id': 'case-details-bugzilla-tab',
+            key: 'bugzillas',
+            ref: bugZillaTabRef,
+            routePath: 'bugzilla',
+            title: CaseDetailsTabsEnum.BUGZILLA,
+            component: React.createElement(CaseBugzilla, null),
         });
     tabsToRender.push({
         'data-tracking-id': 'case-details-actionplan-tab',
@@ -112,20 +107,20 @@ export function CaseDetailsTabs(props) {
     return (React.createElement("div", { className: "case-details-tabs", ref: props.tabdRef },
         React.createElement(Tabs, { className: isExportingPDF ? 'hide-in-pdf' : '', activeKey: getActiveTabKey(), component: TabsComponent.nav, onSelect: handleTabClick, role: "region", "aria-label": t('Case details tabs') }, tabsToRender.map((tab, index) => (React.createElement(Tab, { eventKey: index, tabContentRef: tab.ref, tabContentId: tab.key, key: tab.title, href: `#${props.basePath}/${tab.routePath}`, "data-tracking-id": tab['data-tracking-id'], title: React.createElement(TabTitleText, null,
                 React.createElement(Trans, null, tab.title)) })))),
-        React.createElement("div", { className: "case-details-tabs-content pf-v5-u-pt-xl" }, tabsToRender.map((tab, index) => {
+        React.createElement("div", { className: "case-details-tabs-content pf-u-pt-xl" }, tabsToRender.map((tab, index) => {
             return index === getActiveTabKey() && !isExportingPDF ? (React.createElement(TabContent, { eventKey: index, key: tab.key, id: tab.key, ref: tab.ref, "aria-label": tab.title, hidden: isExportingPDF ? !isTabVisibleInPdfExport(tab) : index !== getActiveTabKey() },
                 React.createElement(ErrorBoundary, { errorMsgInfo: {
                         message: t(`There was an error loading case ${tab.key}`),
                     } },
                     React.createElement(Suspense, { fallback: React.createElement(LoadingIndicator, { size: "sm" }) },
-                        React.createElement(TextContent, { className: "show-in-pdf pf-v5-u-mt-md" },
+                        React.createElement(TextContent, { className: "show-in-pdf pf-u-mt-md" },
                             React.createElement(Text, { component: TextVariants.h2 }, tab.title)),
                         tab.component)))) : isExportingPDF ? (React.createElement(TabContent, { eventKey: index, key: tab.key, id: tab.key, ref: tab.ref, "aria-label": tab.title, hidden: isExportingPDF ? !isTabVisibleInPdfExport(tab) : index !== getActiveTabKey() },
                 React.createElement(ErrorBoundary, { errorMsgInfo: {
                         message: t(`There was an error loading case ${tab.key}`),
                     } },
                     React.createElement(Suspense, { fallback: React.createElement(LoadingIndicator, { size: "sm" }) },
-                        React.createElement(TextContent, { className: "show-in-pdf pf-v5-u-mt-md" },
+                        React.createElement(TextContent, { className: "show-in-pdf pf-u-mt-md" },
                             React.createElement(Text, { component: TextVariants.h2 }, tab.title)),
                         tab.component)))) : (React.createElement(React.Fragment, null));
         }))));

package/lib/esm/components/CaseEditView/CaseOverview/CaseOwnerInfo.js

@@ -46,5 +46,5 @@ export default function CaseOwnerInfo(props) {
                             React.createElement(Trans, null, "Office location")),
                         ": ",
                         props.caseDetailsHydra.data.caseOwner.officeLocation)) },
-                React.createElement(QuestionCircleIcon, { className: "pf-v5-u-ml-xs icon-size", "aria-label": "Support Level Info" })))))));
+                React.createElement(QuestionCircleIcon, { className: "pf-u-ml-xs icon-size", "aria-label": "Support Level Info" })))))));
 }

package/lib/esm/components/CaseEditView/CaseOverview/DateTime.js

@@ -19,5 +19,5 @@ export default function DateTime({ showToolTip = true, toolTipTimeFormat = defau
     return (React.createElement(React.Fragment, null,
         React.createElement("time", { dateTime: dateTimeString }, formatDateTime(dateTimeString, locale, dateTimeFormat)),
         showToolTip && (React.createElement(Tooltip, { content: React.createElement("time", { dateTime: dateTimeString }, formatDateTime(dateTimeString, locale, toolTipTimeFormat)) },
-            React.createElement(InfoIcon, { className: `pf-v5-u-ml-sm ${isExportingPDF ? 'hide-in-pdf' : ''}` })))));
+            React.createElement(InfoIcon, { className: `pf-u-ml-sm ${isExportingPDF ? 'hide-in-pdf' : ''}` })))));
 }

package/lib/esm/components/CaseEditView/CaseOverview/index.js

@@ -221,15 +221,15 @@ export default function CaseOverview(props) {
             React.createElement("div", { className: "case-overview-header" },
                 canSeeInactivityWarning && isCaseInOpenState && (React.createElement(React.Fragment, null,
                     ' ',
-                    firstCaseInactivityWarningSentAt && !secondCaseInactivityWarningSentAt && (React.createElement(Alert, { className: "pf-v5-u-mb-md", isInline: true, title: React.createElement(React.Fragment, null,
-                            React.createElement("h3", { className: "pf-v5-u-mb-sm pf-v5-c-alert__title" },
+                    firstCaseInactivityWarningSentAt && !secondCaseInactivityWarningSentAt && (React.createElement(Alert, { className: "pf-u-mb-md", isInline: true, title: React.createElement(React.Fragment, null,
+                            React.createElement("h3", { className: "pf-u-mb-sm pf-c-alert__title" },
                                 React.createElement(Trans, null, "Case inactivity notification")),
-                            React.createElement("p", { className: "pf-v5-u-mb-sm" },
+                            React.createElement("p", { className: "pf-u-mb-sm" },
                                 React.createElement(Trans, null, "The customer has received one warning regarding inactivity."))) })),
-                    firstCaseInactivityWarningSentAt && secondCaseInactivityWarningSentAt && (React.createElement(Alert, { className: "pf-v5-u-mb-md", isInline: true, variant: AlertVariant.warning, title: React.createElement(React.Fragment, null,
-                            React.createElement("h3", { className: "pf-v5-u-mb-sm pf-v5-c-alert__title" },
+                    firstCaseInactivityWarningSentAt && secondCaseInactivityWarningSentAt && (React.createElement(Alert, { className: "pf-u-mb-md", isInline: true, variant: AlertVariant.warning, title: React.createElement(React.Fragment, null,
+                            React.createElement("h3", { className: "pf-u-mb-sm pf-c-alert__title" },
                                 React.createElement(Trans, null, "Case inactivity warning")),
-                            React.createElement("p", { className: "pf-v5-u-mb-sm" },
+                            React.createElement("p", { className: "pf-u-mb-sm" },
                                 React.createElement(Trans, null, "The customer has received two warnings regarding inactivity. This case will be closed soon if we don't receive any input."))) })))),
                 React.createElement(CaseContactPhoneNumberAlert, { isReview: true, tabRef: props.tabsRef }),
                 React.createElement(CasePhoneNumberSev1ConfirmAlert, { isReview: true, tabRef: props.tabsRef }),
@@ -240,7 +240,7 @@ export default function CaseOverview(props) {
                         props.caseNumber),
                     React.createElement("div", null,
                         exportPDFButton(props.caseNumber),
-                        React.createElement(Button, Object.assign({ className: `pf-v5-u-ml-md ${isExportingPDF ? 'hide-in-pdf' : ''}`, isDisabled: !canManageCase || (caseOverviewState.caseStatusUpdating && isCaseUpdating) }, (caseOverviewState.caseStatusUpdating &&
+                        React.createElement(Button, Object.assign({ className: `pf-u-ml-md ${isExportingPDF ? 'hide-in-pdf' : ''}`, isDisabled: !canManageCase || (caseOverviewState.caseStatusUpdating && isCaseUpdating) }, (caseOverviewState.caseStatusUpdating &&
                             isCaseUpdating && {
                             isLoading: true,
                         }), { onClick: () => (isCaseInOpenState ? onCaseClose() : onCaseReopen()), variant: isCaseInOpenState ? ButtonVariant.secondary : ButtonVariant.tertiary, "data-tracking-id": isCaseInOpenState
@@ -280,7 +280,7 @@ export default function CaseOverview(props) {
                     React.createElement("div", null, createdDate ? React.createElement(DateTime, { dateTimeString: createdDate }) : null)),
                 canSeeCaseOwnerInfo && (React.createElement(CaseOwnerInfo, { owner: ownerId, caseDetailsHydra: caseOverviewState.caseDetailsHydra }))),
             React.createElement("div", { className: "case-overview-secondary card card-md card-light push-bottom" },
-                React.createElement("div", { className: "pf-v5-l-grid pf-m-gutter pf-m-all-4-col-on-lg" },
+                React.createElement("div", { className: "pf-l-grid pf-m-gutter pf-m-all-4-col-on-lg" },
                     React.createElement("div", { className: "form-wrapper" },
                         React.createElement(CaseStatus, { selectedStatus: status, onStatusChange: onStatusChange, isDisabled: !canManageCase || caseOverviewState.allCaseStatuses.isFetching, allStatuses: caseOverviewState.allCaseStatuses.data, isFetching: caseOverviewState.caseStatusUpdating && isCaseUpdating, hasError: caseOverviewState.allCaseStatuses.isError })),
                     React.createElement("div", { className: "form-wrapper" },

package/lib/esm/components/CaseEditView/CaseSecureSupportAlert.js

@@ -17,6 +17,6 @@ export function CaseSecureSupportAlert(props) {
                 "to access secure support cases."));
         }
     };
-    return (React.createElement(AlertMessage, { className: "pf-v5-u-mb-md", variant: AlertType.WARNING, show: isSecureSupportTechViewingSecureCase, isInline: true },
+    return (React.createElement(AlertMessage, { className: "pf-u-mb-md", variant: AlertType.WARNING, show: isSecureSupportTechViewingSecureCase, isInline: true },
         React.createElement(Trans, null, getWarningMsg())));
 }

package/lib/esm/components/CaseEditView/CaseSolutions/CaseSolutions.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"CaseSolutions.d.ts","sourceRoot":"","sources":["../../../../../src/components/CaseEditView/CaseSolutions/CaseSolutions.tsx"],"names":[],"mappings":"AAkBA,OAAO,KAAsD,MAAM,OAAO,CAAC;AAiE3E,UAAU,MAAM;IACZ,UAAU,EAAE,MAAM,CAAC;IACnB,sBAAsB,EAAE,OAAO,CAAC;CACnC;AAUD,eAAO,MAAM,aAAa,+EAgdxB,CAAC"}
+{"version":3,"file":"CaseSolutions.d.ts","sourceRoot":"","sources":["../../../../../src/components/CaseEditView/CaseSolutions/CaseSolutions.tsx"],"names":[],"mappings":"AAUA,OAAO,KAAsD,MAAM,OAAO,CAAC;AA+D3E,UAAU,MAAM;IACZ,UAAU,EAAE,MAAM,CAAC;IACnB,sBAAsB,EAAE,OAAO,CAAC;CACnC;AAUD,eAAO,MAAM,aAAa,+EA2YxB,CAAC"}