@rh-support/troubleshoot 2.7.1 → 2.32.2-prodBackup

package/lib/esm/components/CaseEditView/RequestRemoteSession/RemoteSessionAgreement.js

@@ -1,9 +1,10 @@
-import { Button, List, ListItem, Popover, Tooltip } from '@patternfly/react-core';
+import { Button, Card, CardBody, CardHeader, List, ListItem, Popover, Tooltip } from '@patternfly/react-core';
 import InfoCircleIcon from '@patternfly/react-icons/dist/js/icons/info-circle-icon';
+import LockIcon from '@patternfly/react-icons/dist/js/icons/lock-icon';
 import { GlobalMetadataStateContext, useCanEditCase } from '@rh-support/react-context';
 import { TncConstants } from '@rh-support/utils';
 import React, { forwardRef, useContext, useRef, useState } from 'react';
-import { useTranslation } from 'react-i18next';
+import { Trans, useTranslation } from 'react-i18next';
 import { RemoteSessionAgreementModal } from './RemoteSessionAgreementModal';
 export const RemoteSessionAgreement = forwardRef((props, ref) => {
     const tooltipRef = useRef();
@@ -11,6 +12,8 @@ export const RemoteSessionAgreement = forwardRef((props, ref) => {
     const canEditCase = useCanEditCase();
     const { caseNumber, caseStatus, acceptedRemoteSessionTerms, readOnly, waitingOnCallback } = props;
     const { globalMetadataState: { loggedInUser, loggedInUserRights }, } = useContext(GlobalMetadataStateContext);
+    const isExternal = loggedInUserRights.data.isExternal();
+    const isInternal = loggedInUserRights.data.isInternal();
     const [openRequestRemoteSessionModal, setOpenRequestRemoteSessionModal] = useState(false);
     // To toggle RSA Modal
     const toggleRemoteSessionAgreementModal = () => {
@@ -19,20 +22,34 @@ export const RemoteSessionAgreement = forwardRef((props, ref) => {
         setOpenRequestRemoteSessionModal((openRequestRemoteSessionModal) => !openRequestRemoteSessionModal);
     };
     // RSA Aside Section Body
-    const RemoteSessionAgreementSectionBody = (React.createElement("div", { className: "card card-white card-support escalations", ref: ref },
-        React.createElement("h3", { className: "card-heading pf-v5-u-display-flex pf-v5-u-justify-content-space-between case-detail-panel-card-heading card-header-bg" },
-            t('Remote session request'),
-            React.createElement(Popover, { "aria-label": t('Remote Session Helper Info'), bodyContent: t('Before Red Hat logs into your systems to analyze your support issue during a remote session, Red Hat needs your approval and authorization for such remote access'), footerContent: React.createElement("a", { href: "/articles/3566571", target: "_blank", rel: "noopener noreferrer", "aria-label": t('Read more about remote sessions') }, t('Read more about remote sessions')) },
-                React.createElement(InfoCircleIcon, null))),
-        React.createElement("div", { className: "card-body" },
-            React.createElement("p", null,
-                React.createElement("strong", null, `${t('Red Hat may agree to remotely access your systems if:')}`)),
-            React.createElement(List, { className: "pf-v5-u-pl-lg" },
-                React.createElement(ListItem, null, t('Such access will help diagnose and have greater understanding into the issue')),
-                React.createElement(ListItem, null, t('Agreed upon by both Red Hat and you, the end user'))),
-            React.createElement("p", { className: "rrs-light-grey-text" }, t('Red Hat will add a comment to your case to schedule your remote session.')),
-            acceptedRemoteSessionTerms && (React.createElement(Tooltip, { content: t('Remote session has already been requested.'), triggerRef: tooltipRef, "aria-live": 'polite' })),
-            React.createElement(Button, { "aria-label": waitingOnCallback ? t('Remote session requested') : t('Request remote session'), variant: waitingOnCallback ? 'primary' : 'secondary', onClick: toggleRemoteSessionAgreementModal, "data-tracking-id": "accept-remote-session-agreement-trigger", isAriaDisabled: waitingOnCallback, ref: tooltipRef }, waitingOnCallback ? t('Remote session requested') : t('Request remote session')))));
+    const RemoteSessionAgreementSectionBody = (React.createElement(Card, { className: "card-support escalations", ref: ref },
+        React.createElement(CardHeader, null,
+            React.createElement("h3", { className: "card-heading pf-v6-u-display-flex pf-v6-u-justify-content-space-between case-detail-panel-card-heading" },
+                t('Remote session request'),
+                React.createElement(Popover, { "aria-label": t('Remote Session Helper Info'), bodyContent: t('Before Red Hat logs into your systems to analyze your support issue during a remote session, Red Hat needs your approval and authorization for such remote access'), footerContent: React.createElement("a", { href: "/articles/3566571", target: "_blank", rel: "noopener noreferrer", "aria-label": t('Read more about remote sessions') }, t('Read more about remote sessions')) },
+                    React.createElement(InfoCircleIcon, null)))),
+        React.createElement(CardBody, null,
+            isInternal && (React.createElement(React.Fragment, null,
+                React.createElement("p", null,
+                    React.createElement(LockIcon, null),
+                    " ",
+                    React.createElement("strong", null, `${t('Available to customers only')}`)),
+                React.createElement("p", null,
+                    React.createElement(Trans, null,
+                        "Available to customers only. If requested and agreed upon, a remote session will be scheduled and confirmed in a case comment. Refer to the",
+                        ' ',
+                        React.createElement("a", { href: "https://access.redhat.com/articles/3566571", target: "_blank", rel: "noreferrer" }, "Remote session guide"),
+                        ' ',
+                        "for details.")))),
+            isExternal && (React.createElement(React.Fragment, null,
+                React.createElement("p", null,
+                    React.createElement("strong", null, `${t('Red Hat may agree to remotely access your systems if:')}`)),
+                React.createElement(List, { className: "pf-v6-u-pl-lg" },
+                    React.createElement(ListItem, null, t('Such access will help diagnose and have greater understanding into the issue')),
+                    React.createElement(ListItem, null, t('Agreed upon by both Red Hat and you, the end user'))),
+                React.createElement("p", { className: "rrs-light-grey-text" }, t('Red Hat will add a comment to your case to schedule your remote session.')),
+                acceptedRemoteSessionTerms && (React.createElement(Tooltip, { content: t('Remote session has already been requested.'), triggerRef: tooltipRef, "aria-live": 'polite' })),
+                React.createElement(Button, { "aria-label": waitingOnCallback ? t('Remote session requested') : t('Request remote session'), variant: waitingOnCallback ? 'primary' : 'secondary', onClick: toggleRemoteSessionAgreementModal, "data-tracking-id": "accept-remote-session-agreement-trigger", isAriaDisabled: waitingOnCallback, ref: tooltipRef, className: "remote-session-button" }, waitingOnCallback ? t('Remote session requested') : t('Request remote session')))))));
     return (React.createElement(React.Fragment, null,
         RemoteSessionAgreementSectionBody,
         React.createElement(RemoteSessionAgreementModal, { caseNumber: caseNumber, caseStatus: caseStatus, show: openRequestRemoteSessionModal, onClose: toggleRemoteSessionAgreementModal, siteCode: TncConstants.REMOTE_RIDER_SITE_CODE, eventCode: TncConstants.REMOTER_RIDER_EVENT_CODE, loggedInUser: loggedInUser.data.ssoUsername === undefined ? '' : loggedInUser.data.ssoUsername, loggedInUserRights: loggedInUserRights, readOnly: readOnly })));

package/lib/esm/components/CaseEditView/RequestRemoteSession/RemoteSessionAgreementModal.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"RemoteSessionAgreementModal.d.ts","sourceRoot":"","sources":["../../../../../src/components/CaseEditView/RequestRemoteSession/RemoteSessionAgreementModal.tsx"],"names":[],"mappings":"AAOA,OAAO,EAAE,mBAAmB,EAAE,MAAM,0BAA0B,CAAC;AAC/D,OAAO,EAAE,QAAQ,EAAE,MAAM,8BAA8B,CAAC;AAExD,OAAO,KAA8B,MAAM,OAAO,CAAC;AAgBnD,UAAU,MAAM;IACZ,UAAU,EAAE,MAAM,CAAC;IACnB,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;IACrB,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,QAAQ,EAAE,MAAM,CAAC;IACjB,SAAS,EAAE,MAAM,CAAC;IAClB,YAAY,EAAE,MAAM,CAAC;IACrB,UAAU,EAAE,MAAM,CAAC;IACnB,IAAI,EAAE,OAAO,CAAC;IACd,kBAAkB,EAAE,mBAAmB,CAAC,QAAQ,CAAC,CAAC;IAClD,QAAQ,EAAE,OAAO,CAAC;CACrB;AAiBD,wBAAgB,2BAA2B,CAAC,KAAK,EAAE,MAAM,qBAsWxD"}
+{"version":3,"file":"RemoteSessionAgreementModal.d.ts","sourceRoot":"","sources":["../../../../../src/components/CaseEditView/RequestRemoteSession/RemoteSessionAgreementModal.tsx"],"names":[],"mappings":"AAiBA,OAAO,EAAE,mBAAmB,EAAE,MAAM,0BAA0B,CAAC;AAC/D,OAAO,EAAE,QAAQ,EAAE,MAAM,8BAA8B,CAAC;AAExD,OAAO,KAA8B,MAAM,OAAO,CAAC;AAgBnD,UAAU,MAAM;IACZ,UAAU,EAAE,MAAM,CAAC;IACnB,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;IACrB,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,QAAQ,EAAE,MAAM,CAAC;IACjB,SAAS,EAAE,MAAM,CAAC;IAClB,YAAY,EAAE,MAAM,CAAC;IACrB,UAAU,EAAE,MAAM,CAAC;IACnB,IAAI,EAAE,OAAO,CAAC;IACd,kBAAkB,EAAE,mBAAmB,CAAC,QAAQ,CAAC,CAAC;IAClD,QAAQ,EAAE,OAAO,CAAC;CACrB;AAiBD,wBAAgB,2BAA2B,CAAC,KAAK,EAAE,MAAM,qBA8VxD"}

package/lib/esm/components/CaseEditView/RequestRemoteSession/RemoteSessionAgreementModal.js

@@ -8,11 +8,10 @@ var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, ge
     });
 };
 import { publicApi } from '@cee-eng/hydrajs';
-import { Alert, Button, ButtonVariant, Checkbox, Modal, TextArea, TextInput } from '@patternfly/react-core';
-import { Select, SelectOption } from '@patternfly/react-core/deprecated';
+import { Alert, Button, ButtonVariant, Checkbox, Modal, ModalBody, ModalFooter, ModalHeader, TextArea, TextInput, } from '@patternfly/react-core';
 import DownloadIcon from '@patternfly/react-icons/dist/js/icons/download-icon';
 import ExternalLinkAltIcon from '@patternfly/react-icons/dist/js/icons/external-link-alt-icon';
-import { ToastNotification, useFetch } from '@rh-support/components';
+import { SingleSelectDropdown, ToastNotification, useFetch } from '@rh-support/components';
 import isEqual from 'lodash/isEqual';
 import React, { useEffect, useState } from 'react';
 import { Trans, useTranslation } from 'react-i18next';
@@ -43,7 +42,6 @@ export function RemoteSessionAgreementModal(props) {
     }), isEqual);
     const [isTermsChecked, setIsTermsChecked] = useState(false);
     const { request } = useFetch(publicApi.terms.getRequiredTerms);
-    const [isLangSelectorDropdownOpen, setisLangSelectorDropdownOpen] = useState(false);
     const caseDispatch = useCaseDispatch();
     const [selectedTranslation, setSelectedTranslation] = useState({
         id: '5001',
@@ -66,16 +64,18 @@ export function RemoteSessionAgreementModal(props) {
             try {
                 const { siteCode, eventCode, loggedInUser } = props;
                 const response = yield request(siteCode, eventCode, loggedInUser);
-                let defaultTranslation = response[0].translations[0];
-                const translationLangInfoMap = response[0].translations.reduce((allTranslationsmap, translation) => {
-                    if (translation.isDefault) {
-                        defaultTranslation = translation;
-                    }
-                    allTranslationsmap[translation['localeCode']] = translation;
-                    return allTranslationsmap;
-                }, {});
-                setSelectedTranslation(defaultTranslation);
-                setAllTranslations(translationLangInfoMap);
+                if (response) {
+                    let defaultTranslation = response[0].translations[0];
+                    const translationLangInfoMap = response[0].translations.reduce((allTranslationsmap, translation) => {
+                        if (translation.isDefault) {
+                            defaultTranslation = translation;
+                        }
+                        allTranslationsmap[translation['localeCode']] = translation;
+                        return allTranslationsmap;
+                    }, {});
+                    setSelectedTranslation(defaultTranslation);
+                    setAllTranslations(translationLangInfoMap);
+                }
             }
             catch (e) {
                 console.log(e);
@@ -95,17 +95,19 @@ export function RemoteSessionAgreementModal(props) {
     const updateSessionLink = (event, value) => setSessionLink(value);
     // To handle modal cancel and close
     const onCancel = () => {
+        if (agreeLoading || isPostingComment)
+            return;
         setIsTermsChecked(false);
         setSessionExpectations('');
         setImpact('');
         setSessionLink('');
-        setIsRemoteSessionForm(false);
+        setIsRemoteSessionForm(remoteSessionTermsAcked);
         props.onClose && props.onClose();
     };
     const toggleRemoteSessionForm = () => setIsRemoteSessionForm(true);
     // Function to ack remote session terms and post comment
     const submitRemoteSessionAgreement = (pdfId) => __awaiter(this, void 0, void 0, function* () {
-        const requestComment = t(`Submitted a remote session request with following details:\n\n**Preferred Time and Expectations for Remote Session**\n${sessionExpectations}\n\n**Describe the impact to you or the business**\n${impact}\n\n${sessionLink ? `**Remote session link**\n[${sessionLink}](${sessionLink})\n\n` : ''}This action does not initiate a remote session. A Red Hat Associate will get back to you soon.`);
+        const requestComment = t(`**[What is a Remote Support Session and how to acknowledge the Remote Access Rider? Read more.](https://access.redhat.com/articles/3566571)**\n\nSubmitted a remote session request with following details:\n\n**Preferred Time and Expectations for Remote Session**\n${sessionExpectations}\n\n**Describe the impact to you or the business**\n${impact}\n\n${sessionLink ? `**Remote session link**\n[${sessionLink}](${sessionLink})\n\n` : ''}This action does not initiate a remote session. A Red Hat Associate will get back to you soon.`);
         try {
             yield updateCaseDetails(caseDispatch, props.caseNumber, {
                 remoteSessionTermsAcked: true,
@@ -152,73 +154,76 @@ export function RemoteSessionAgreementModal(props) {
         setIsTermsChecked(value);
     };
     // Handle language change
-    const onLangChange = (event, lang) => {
-        setSelectedTranslation(allTranslations[lang]);
-        setisLangSelectorDropdownOpen(false);
+    const onLangChange = (lang) => {
+        setSelectedTranslation(allTranslations[lang.value]);
     };
-    // To handle dropdown toggle
-    const onDropdownToggle = (toggle) => setisLangSelectorDropdownOpen(toggle);
     // To check and if I agree button is loading
     const isAgreeLoading = agreeLoading || isPostingComment;
-    // RSA Modal Actions
-    const modalActions = [
-        React.createElement(Button, { "aria-label": t('I agree'), variant: ButtonVariant.primary, onClick: isRemoteSessionForm || remoteSessionTermsAcked ? onSubmit : toggleRemoteSessionForm, "data-tracking-id": isRemoteSessionForm || remoteSessionTermsAcked
-                ? 'remote-session-details-submission'
-                : 'remote-session-agreement-check', isLoading: isAgreeLoading, isDisabled: (isRemoteSessionForm || remoteSessionTermsAcked
-                ? !sessionExpectations.trim() || !impact.trim()
-                : !isTermsChecked) || isAgreeLoading }, t(isRemoteSessionForm || remoteSessionTermsAcked ? 'Submit' : 'I agree')),
-        React.createElement(Button, { key: "cancel", variant: "link", onClick: onCancel, isDisabled: isAgreeLoading }, "Cancel"),
-    ];
+    const languageOptions = Object.keys(allTranslations).map((option) => ({
+        value: option,
+        label: getLocaleNameFromLocalCode(option),
+    }));
+    // Create selected option object based on current selection
+    const selectedLanguage = {
+        value: selectedTranslation.localeCode,
+        label: selectedTranslation.localeCode
+            ? getLocaleNameFromLocalCode(selectedTranslation.localeCode)
+            : t('Select an option that best fits'),
+    };
     const renderRemoteSessionForm = (React.createElement("div", { id: "remoteSessionForm", className: "form-group" },
         React.createElement(Alert, { variant: "info", isInline: true, title: React.createElement(React.Fragment, null,
                 "What is a Remote Support Session and how to acknowledge the Remote Access Rider?",
                 ' ',
                 React.createElement("a", { href: "https://access.redhat.com/articles/3566571", target: "_blank", rel: "noopener noreferrer" }, "Read more.")) }),
         React.createElement("div", null,
-            React.createElement("label", { className: "pf-v5-u-mt-md" },
+            React.createElement("label", { className: "pf-v6-u-mt-md" },
                 React.createElement(Trans, null, "Preferred Time and Expectations for Remote Session"),
                 React.createElement("span", { className: "form-required", "aria-hidden": "true" }, "*")),
             React.createElement(TextArea, { value: sessionExpectations, onChange: updateSessionExpectation, rows: 3, placeholder: "Please share anything that will help prepare for our meeting?", isRequired: true, "aria-label": "Preferred Time and Expectations for Remote Session" })),
         React.createElement("div", null,
-            React.createElement("label", { className: "pf-v5-u-mt-md" },
+            React.createElement("label", { className: "pf-v6-u-mt-md" },
                 React.createElement(Trans, null, "Describe the impact to you or the business"),
                 React.createElement("span", { className: "form-required", "aria-hidden": "true" }, "*")),
             React.createElement(TextArea, { value: impact, onChange: updateImpact, rows: 3, placeholder: "Describe the user or financial impact.", isRequired: true, "aria-label": "Describe the impact to you or the business" })),
         React.createElement("div", null,
-            React.createElement("label", { className: "pf-v5-u-mt-md" },
+            React.createElement("label", { className: "pf-v6-u-mt-md" },
                 React.createElement(Trans, null, "Remote session link (optional)")),
             React.createElement(TextInput, { value: sessionLink, onChange: updateSessionLink, type: "text", "aria-label": "Remote session link" }),
             React.createElement("p", { className: "form-instructions" }, "If not provided, the Red Hat Support Associate will share a link with you."))));
     const renderRemoteSessionAgreement = (React.createElement("div", { id: "remoteSessionAgreement" },
-        React.createElement("p", { className: "pf-v5-u-mt-xs" },
+        React.createElement("p", { className: "pf-v6-u-mt-xs" },
             React.createElement(Trans, null,
                 "Your acceptance of this remote session agreement is required ",
                 React.createElement("strong", null, "for each case"),
                 " when you request Red Hat\u2019s support team to directly access your network or systems.")),
-        React.createElement("p", { className: "pf-v5-u-mt-md" },
+        React.createElement("p", { className: "pf-v6-u-mt-md" },
             React.createElement(Trans, null, "Remote access to your network or systems is not a standard Red Hat problem resolution process. Before Red Hat logs into your systems to analyze your support issue during a remote session, Red Hat needs your approval and authorization for such remote access.")),
-        React.createElement("p", { className: "pf-v5-u-mt-md" },
+        React.createElement("p", { className: "pf-v6-u-mt-md" },
             React.createElement(Trans, null, "Please read and accept the remote session terms below to allow Red Hat to access your network or systems.")),
-        React.createElement("div", null,
-            React.createElement(Select, { className: "pf-v5-u-mt-md", "aria-label": t('Select language'), id: "terms-language-selector", selections: selectedTranslation.localeCode, onSelect: onLangChange, isOpen: isLangSelectorDropdownOpen, menuAppendTo: document.body, placeholderText: t('Select an option that best fits'), onToggle: (_event, toggle) => onDropdownToggle(toggle), width: 350 }, Object.keys(allTranslations).map((option, index) => (React.createElement(SelectOption, { key: index, value: option }, getLocaleNameFromLocalCode(option))))),
-            React.createElement("a", { "aria-label": t('Download'), "data-tracking-id": "rsa-modal-terms-download", className: "pf-v5-u-ml-md", href: selectedTranslation.pdfDownloadUrl, rel: "noopener noreferrer", target: "_blank" },
+        React.createElement("div", { className: "pf-v6-u-display-flex pf-v6-u-align-items-center pf-v6-u-flex-wrap" },
+            React.createElement(SingleSelectDropdown, { id: "terms-language-selector", ariaLabel: t('Select language'), selected: selectedLanguage, options: languageOptions, isDisabled: false, placeholder: t('Select an option that best fits'), onSelect: (option) => onLangChange(option), toggleClassName: "pf-v6-u-w-50" }),
+            React.createElement("a", { "aria-label": t('Download'), "data-tracking-id": "rsa-modal-terms-download", className: "pf-v6-u-ml-md pf-v6-u-display-inline-flex pf-v6-u-align-items-center", href: selectedTranslation.pdfDownloadUrl, rel: "noopener noreferrer", target: "_blank" },
                 t('Download'),
                 " ",
-                React.createElement(DownloadIcon, { className: "pf-v5-u-ml-xs" }))),
+                React.createElement(DownloadIcon, { className: "pf-v6-u-ml-xs" }))),
         React.createElement("div", null,
-            React.createElement(Checkbox, { className: "pf-v5-u-mt-md rsa-checkbox", id: "terms-accept-checkbox", label: React.createElement(React.Fragment, null,
+            React.createElement(Checkbox, { className: "pf-v6-u-mt-md rsa-checkbox", id: "terms-accept-checkbox", label: React.createElement(React.Fragment, null,
                     React.createElement(Trans, null, "I have read and agree to the"),
                     ' ',
-                    React.createElement("a", { className: "pf-v5-c-button pf-m-link pf-m-inline align-link-items", rel: "noopener noreferrer", target: "_blank", href: selectedTranslation.pdfDownloadUrl, "data-tracking-id": "case-details-request-remote-session-terms" },
+                    React.createElement("a", { className: "pf-v6-c-button pf-m-link pf-m-inline align-link-items", rel: "noopener noreferrer", target: "_blank", href: selectedTranslation.pdfDownloadUrl, "data-tracking-id": "case-details-request-remote-session-terms" },
                         React.createElement(Trans, null, "terms "),
                         React.createElement(ExternalLinkAltIcon, null))), isChecked: isTermsChecked, "aria-label": t('I have read and agree to the terms'), onChange: onCheckBoxChange }))));
     // Body of RSA Modal
     const RemoteSessionAgreementModalBody = () => {
-        return isRemoteSessionForm || remoteSessionTermsAcked ? renderRemoteSessionForm : renderRemoteSessionAgreement;
+        return isRemoteSessionForm ? renderRemoteSessionForm : renderRemoteSessionAgreement;
     };
-    return (React.createElement(Modal, { id: "remote-session-agreement-modal", "aria-label": isRemoteSessionForm || remoteSessionTermsAcked
-            ? t('Request remote session')
-            : t('Remote session agreement'), title: isRemoteSessionForm || remoteSessionTermsAcked
-            ? t('Request remote session')
-            : t('Remote session agreement'), isOpen: props.show, onClose: onCancel, actions: modalActions }, RemoteSessionAgreementModalBody()));
+    return (React.createElement(Modal, { id: "remote-session-agreement-modal", "aria-label": isRemoteSessionForm ? t('Request remote session') : t('Remote session agreement'), isOpen: props.show, onClose: onCancel },
+        React.createElement(ModalHeader, null,
+            React.createElement("h2", null, isRemoteSessionForm ? t('Request remote session') : t('Remote session agreement'))),
+        React.createElement(ModalBody, null, RemoteSessionAgreementModalBody()),
+        React.createElement(ModalFooter, null,
+            React.createElement(Button, { "aria-label": t('I agree'), variant: ButtonVariant.primary, onClick: isRemoteSessionForm || remoteSessionTermsAcked ? onSubmit : toggleRemoteSessionForm, "data-tracking-id": "remote-session-agreement-check", isLoading: isAgreeLoading, isDisabled: (isRemoteSessionForm || remoteSessionTermsAcked
+                    ? !sessionExpectations.trim() || !impact.trim()
+                    : !isTermsChecked) || isAgreeLoading }, t(isRemoteSessionForm || remoteSessionTermsAcked ? 'Submit' : 'I agree')),
+            React.createElement(Button, { key: "cancel", variant: "link", onClick: onCancel, isDisabled: isAgreeLoading }, "Cancel"))));
 }

package/lib/esm/components/CaseEditView/Tabs/CaseActionPlan/CaseActionPlan.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"CaseActionPlan.d.ts","sourceRoot":"","sources":["../../../../../../src/components/CaseEditView/Tabs/CaseActionPlan/CaseActionPlan.tsx"],"names":[],"mappings":"AAYA,OAAO,KAA0C,MAAM,OAAO,CAAC;AAQ/D,UAAU,MAAM;IACZ,UAAU,EAAE,MAAM,CAAC;CACtB;AAMD,iBAAS,cAAc,CAAC,KAAK,EAAE,MAAM,qBA2HpC;kBA3HQ,cAAc;;;AA8HvB,eAAe,cAAc,CAAC"}
+{"version":3,"file":"CaseActionPlan.d.ts","sourceRoot":"","sources":["../../../../../../src/components/CaseEditView/Tabs/CaseActionPlan/CaseActionPlan.tsx"],"names":[],"mappings":"AAYA,OAAO,KAA0C,MAAM,OAAO,CAAC;AAQ/D,UAAU,MAAM;IACZ,UAAU,EAAE,MAAM,CAAC;CACtB;AAMD,iBAAS,cAAc,CAAC,KAAK,EAAE,MAAM,qBA4HpC;kBA5HQ,cAAc;;;AA+HvB,eAAe,cAAc,CAAC"}

package/lib/esm/components/CaseEditView/Tabs/CaseActionPlan/CaseActionPlan.js

@@ -71,11 +71,11 @@ function CaseActionPlan(props) {
     const isInternalWithoutSFDCUser = loggedInUserRights.data.isInternalWithoutSFDCUser();
     const isActionPlanEmpty = isEmpty(actionPlanState === null || actionPlanState === void 0 ? void 0 : actionPlanState.trim());
     return (React.createElement(React.Fragment, null,
-        React.createElement(AlertMessage, { show: isInternalWithoutSFDCUser, variant: AlertType.WARNING, isInline: true, className: "pf-v5-u-mb-lg", title: t('You need a Salesforce (SFDC) user to edit the action plan.') }),
+        React.createElement(AlertMessage, { show: isInternalWithoutSFDCUser, variant: AlertType.WARNING, isInline: true, className: "pf-v6-u-mb-lg", title: t('You need a Salesforce (SFDC) user to edit the action plan.') }),
         React.createElement("label", { htmlFor: "rha-action-plan", className: "sr-only" },
             React.createElement(Trans, null, "Action plan")),
         !canUpdateActionPlan ? (React.createElement(CodeBlock, null,
-            React.createElement(CodeBlockCode, { style: {
+            React.createElement(CodeBlockCode, { className: "pf-v6-u-text-color-regular", style: {
                     fontFamily: isExportingPDF ? 'DejaVu Sans' : undefined,
                 } }, isEmpty(actionPlan) ? t('No action plan to display.') : actionPlan))) : (React.createElement("form", null,
             React.createElement(TextAreaResizable, { id: "rha-action-plan", disabled: isUpdating || isInternalWithoutSFDCUser, maxLength: 32768, name: "actionPlan", value: actionPlanState, onChange: onChange, rowsMin: 3 }),
@@ -86,7 +86,7 @@ function CaseActionPlan(props) {
                     React.createElement(LoadingIndicator, { show: isUpdating, isInline: true })),
                 React.createElement("button", { className: "btn btn-app btn-link", onClick: discardActionPlan, disabled: isUpdating || !formIsDirty, type: "button" },
                     React.createElement(Trans, null, "Cancel")))),
-            React.createElement("p", { className: "pf-v5-u-mt-xl" },
+            React.createElement("p", { className: "pf-v6-u-mt-xl" },
                 React.createElement(Trans, null,
                     "Updates to the action plan are ",
                     React.createElement("strong", null, "customer-facing"),

package/lib/esm/components/CaseEditView/Tabs/CaseDetails/CaseContactPhoneNumber.js

@@ -260,7 +260,7 @@ export function CaseContactPhoneNumber() {
         }
         // eslint-disable-next-line react-hooks/exhaustive-deps
     }, [contactSSOName]);
-    return (React.createElement("div", { className: "form-group pf-v5-u-pb-md", style: { minWidth: '200px' } },
+    return (React.createElement("div", { className: "form-group", style: { minWidth: '200px' } },
         React.createElement("h3", { className: `subheading subheading-sm ${isExportingPDF ? 'expand-input' : ''}` },
             React.createElement(Trans, null, "Case owner's phone number"),
             React.createElement("span", { className: `form-required ${isExportingPDF ? 'hide-in-pdf' : ''}`, "aria-hidden": true }, "*"),
@@ -268,7 +268,7 @@ export function CaseContactPhoneNumber() {
         React.createElement(InputGroupText, null,
             React.createElement(PhoneInput, { phoneValue: localFullPhoneState, onPhoneValueChange: onPhoneChange, onCountryCodeChange: onCountryCodeChange, validations: isPhoneNumberValid, isDisabled: isCasePhoneUpdating || isCaseOwnerUpdating || !isEditting, isLoading: isCasePhoneUpdating || isCaseOwnerUpdating || isFetchingSSO, "data-tracking-id": "case-details-page-supplied-phone", invalid: invalid, setInvalid: setInvalid }),
             isEditting ? (React.createElement(React.Fragment, null,
-                React.createElement("button", { className: "btn btn-app btn-link pf-v5-u-ml-sm", type: "button", "data-tracking-id": "case-details-page-supplied-phone-save", onClick: () => onSave(), "aria-label": "Save", disabled: (isSaveClicked && isPhoneValueCannotBeSaved) ||
+                React.createElement("button", { className: "btn btn-app btn-link pf-v6-u-ml-sm", type: "button", "data-tracking-id": "case-details-page-supplied-phone-save", onClick: () => onSave(), "aria-label": "Save", disabled: (isSaveClicked && isPhoneValueCannotBeSaved) ||
                         (localFullPhone === null || localFullPhone === void 0 ? void 0 : localFullPhone.length) > PHONE_LIMIT ||
                         localFullPhoneState === phoneCountryCode + ' ' + phoneAreaCodePrefixLineNumber ||
                         isCaseOwnerUpdating ||

package/lib/esm/components/CaseEditView/Tabs/CaseDetails/CaseHostname.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"CaseHostname.d.ts","sourceRoot":"","sources":["../../../../../../src/components/CaseEditView/Tabs/CaseDetails/CaseHostname.tsx"],"names":[],"mappings":"AAWA,OAAO,EAAE,gBAAgB,EAAE,MAAM,0BAA0B,CAAC;AAG5D,OAAO,KAA0C,MAAM,OAAO,CAAC;AAW/D,UAAU,MAAO,SAAQ,gBAAgB;IACrC,cAAc,EAAE,OAAO,CAAC;CAC3B;AAMD,iBAAS,YAAY,CAAC,KAAK,EAAE,MAAM,qBA0KlC;kBA1KQ,YAAY;;;AA6KrB,OAAO,EAAE,YAAY,EAAE,CAAC"}
+{"version":3,"file":"CaseHostname.d.ts","sourceRoot":"","sources":["../../../../../../src/components/CaseEditView/Tabs/CaseDetails/CaseHostname.tsx"],"names":[],"mappings":"AAWA,OAAO,EAAE,gBAAgB,EAAE,MAAM,0BAA0B,CAAC;AAG5D,OAAO,KAA0C,MAAM,OAAO,CAAC;AAW/D,UAAU,MAAO,SAAQ,gBAAgB;IACrC,cAAc,EAAE,OAAO,CAAC;CAC3B;AAMD,iBAAS,YAAY,CAAC,KAAK,EAAE,MAAM,qBA6KlC;kBA7KQ,YAAY;;;AAgLrB,OAAO,EAAE,YAAY,EAAE,CAAC"}

package/lib/esm/components/CaseEditView/Tabs/CaseDetails/CaseHostname.js

@@ -8,7 +8,7 @@ var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, ge
     });
 };
 import { accounts } from '@cee-eng/hydrajs';
-import { Popover, PopoverPosition, Spinner, Switch } from '@patternfly/react-core';
+import { Popover, PopoverPosition, Spinner, Switch, TextInput } from '@patternfly/react-core';
 import QuestionCircleIcon from '@patternfly/react-icons/dist/js/icons/question-circle-icon';
 import { InlineEdit, LoadingIndicator, ToastNotification, useFetch, ValueChangedIcon } from '@rh-support/components';
 import { fetchLoggedInUsersAccount, GlobalMetadataDispatchContext, GlobalMetadataStateContext, useCanEditCase, } from '@rh-support/react-context';
@@ -50,10 +50,10 @@ function CaseHostname(props) {
     const [localHostnameChange, setLocalHostnameChange] = useState(false);
     const afterLocalChange = () => setLocalHostnameChange(false);
     const canEditCase = useCanEditCase();
-    const onHostnameChange = (e) => {
+    const onHostnameChange = (hostname) => {
         if (canEditCase.alert())
             return;
-        setHostnameState(e.target.value);
+        setHostnameState(hostname);
     };
     const onHostnameUpdate = (caseDetails) => __awaiter(this, void 0, void 0, function* () {
         setIsHostnameUpdating(true);
@@ -102,17 +102,17 @@ function CaseHostname(props) {
     const hostNameVisibilityContent = (React.createElement("div", null,
         React.createElement("p", null, "You can share this information at any time to improve your support experience."),
         React.createElement(Switch, { label: shareHostnameLabel, isChecked: isShareHostNamesChecked, onChange: onShareHostnameCheck }),
-        isHostnamesLoading && (React.createElement(Spinner, { size: "lg", className: "pf-v5-u-ml-sm hostnameSpinner", "aria-label": "Hostname loading" }))));
+        isHostnamesLoading && (React.createElement(Spinner, { size: "lg", className: "pf-v6-u-ml-sm hostnameSpinner", "aria-label": "Hostname loading" }))));
     if (!canUseHostName) {
         return React.createElement(React.Fragment, null);
     }
     const lengthError = (hostnameState === null || hostnameState === void 0 ? void 0 : hostnameState.length) > HOSTNAME_LENGTH_LIMIT;
     return (React.createElement(React.Fragment, null,
         React.createElement(InlineEdit, { labelProps: { htmlFor: 'case-details-hostname' }, formClassName: props.className || '', labelContent: React.createElement(React.Fragment, null,
-                React.createElement(Trans, null, "Hostname"),
+                React.createElement(Trans, { className: "pf-v6-u-mr-xs" }, "Hostname"),
                 React.createElement(ValueChangedIcon, { afterLocalChange: afterLocalChange, isLocalChange: localHostnameChange, value: hostname, getTooltipContent: getChangedValueTooltip(() => CaseValuesToWatch.hostname) })), helperContent: !isExportingPDF ? (React.createElement(Popover, { "aria-label": "Hostname Info", position: PopoverPosition.auto, bodyContent: hostNameVisibilityContent, closeBtnAriaLabel: "Close", headerContent: 'Share hostname?', onShow: () => userOriginalHostnameValue() },
-                React.createElement(QuestionCircleIcon, { className: "pf-v5-u-ml-xs icon-size", "aria-label": "Hostname Info" }))) : undefined, allowInlineEdit: props.inlineEditable, content: hostname, saveDisabled: hostnameState === hostname || isHostnameUpdating || lengthError, onSave: onSave, onCancel: onCancel, initialIsEditing: false, loadingIndicator: isHostnameUpdating ? React.createElement(LoadingIndicator, { show: isHostnameUpdating, isInline: true }) : undefined, isExportingPDF: isExportingPDF },
-            React.createElement("input", { type: "text", id: "case-details-hostname", className: `form-control${lengthError ? ' form-invalid' : ''}`, name: "case-details-hostname", value: hostnameState, onChange: onHostnameChange, disabled: isHostnameUpdating, "data-tracking-id": "case-details-hostname", "aria-invalid": lengthError })),
+                React.createElement(QuestionCircleIcon, { className: "pf-v6-u-ml-sm F icon-size pf-v6-u-text-color-status-custom cursor-pointer", "aria-label": "Hostname Info" }))) : undefined, allowInlineEdit: props.inlineEditable, content: hostname, saveDisabled: hostnameState === hostname || isHostnameUpdating || lengthError, onSave: onSave, onCancel: onCancel, initialIsEditing: false, loadingIndicator: isHostnameUpdating ? React.createElement(LoadingIndicator, { show: isHostnameUpdating, isInline: true }) : undefined, isExportingPDF: isExportingPDF },
+            React.createElement(TextInput, { type: "text", id: "case-details-hostname", className: `${lengthError ? ' form-invalid' : ''}`, name: "case-details-hostname", value: hostnameState, onChange: (e, phone) => onHostnameChange(phone), isDisabled: isHostnameUpdating, "data-tracking-id": "case-details-hostname", "aria-invalid": lengthError })),
         lengthError && (React.createElement("div", { className: "pull-top" },
             React.createElement("p", { className: "form-instructions form-invalid" },
                 React.createElement(Trans, null,

package/lib/esm/components/CaseEditView/Tabs/CaseDetails/CaseOpenshiftClusterId/CaseOpenShiftPopover.js

@@ -4,5 +4,5 @@ import React from 'react';
 import { Trans } from 'react-i18next';
 export default function CaseOpenShiftPopover() {
     return (React.createElement(Popover, { "aria-label": "Cluster Id Info", position: PopoverPosition.auto, bodyContent: React.createElement(Trans, null, "Cluster IDs give us the ability to use connected customer tools and services to debug your cluster in conjunction with this support case."), closeBtnAriaLabel: "Close" },
-        React.createElement(QuestionCircleIcon, { className: "pf-v5-u-ml-xs" })));
+        React.createElement(QuestionCircleIcon, { className: "pf-v6-u-ml-xs" })));
 }

package/lib/esm/components/CaseEditView/Tabs/CaseDetails/CaseOpenshiftClusterId/CaseOpenShiftV3Popover.js

@@ -4,5 +4,5 @@ import React from 'react';
 import { Trans } from 'react-i18next';
 export default function CaseOpenShiftV3Popover() {
     return (React.createElement(Popover, { "aria-label": "Cluster Id Info", position: PopoverPosition.auto, bodyContent: React.createElement(Trans, null, "Providing a cluster name allows us to link issues more effectively within managed settings through connected customer tools"), closeBtnAriaLabel: "Close" },
-        React.createElement(QuestionCircleIcon, { className: "pf-v5-u-ml-xs" })));
+        React.createElement(QuestionCircleIcon, { className: "pf-v6-u-ml-xs" })));
 }

package/lib/esm/components/CaseEditView/Tabs/CaseDetails/CaseOpenshiftClusterId/CaseOpenshiftClusterId.js

@@ -238,7 +238,7 @@ export function CaseOpenshiftClusterId() {
         return null;
     }
     else if (isOpenShiftV3) {
-        return React.createElement("div", { className: "pull-top pf-v5-u-pb-xl" }, v3Message());
+        return React.createElement("div", { className: "pull-top pf-v6-u-pb-xl" }, v3Message());
     }
     else {
         return (React.createElement(React.Fragment, null,

package/lib/esm/components/CaseEditView/Tabs/CaseDetails/CasePhoneNumberConfirmAlert.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"CasePhoneNumberConfirmAlert.d.ts","sourceRoot":"","sources":["../../../../../../src/components/CaseEditView/Tabs/CaseDetails/CasePhoneNumberConfirmAlert.tsx"],"names":[],"mappings":"AAOA,OAAO,KAA+B,MAAM,OAAO,CAAC;AASpD,UAAU,MAAM;IACZ,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,MAAM,CAAC,EAAE,KAAK,CAAC,gBAAgB,CAAC,cAAc,CAAC,CAAC;CACnD;AAED,wBAAgB,2BAA2B,CAAC,KAAK,EAAE,MAAM,qBAsIxD"}
+{"version":3,"file":"CasePhoneNumberConfirmAlert.d.ts","sourceRoot":"","sources":["../../../../../../src/components/CaseEditView/Tabs/CaseDetails/CasePhoneNumberConfirmAlert.tsx"],"names":[],"mappings":"AAOA,OAAO,KAA+B,MAAM,OAAO,CAAC;AAQpD,UAAU,MAAM;IACZ,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,MAAM,CAAC,EAAE,KAAK,CAAC,gBAAgB,CAAC,cAAc,CAAC,CAAC;CACnD;AAED,wBAAgB,2BAA2B,CAAC,KAAK,EAAE,MAAM,qBAyIxD"}

package/lib/esm/components/CaseEditView/Tabs/CaseDetails/CasePhoneNumberConfirmAlert.js

@@ -15,7 +15,6 @@ import isEmpty from 'lodash/isEmpty';
 import isEqual from 'lodash/isEqual';
 import React, { useContext, useState } from 'react';
 import { Trans, useTranslation } from 'react-i18next';
-import { Link } from 'react-router-dom';
 import { useCaseDispatch, useCaseSelector } from '../../../../context/CaseContext';
 import { useCaseUpdateErrorMessage } from '../../../../hooks/useCaseUpdateErrorMessage';
 import { updateCaseDetails } from '../../../../reducers/CaseReducer';
@@ -59,17 +58,15 @@ export function CaseContactPhoneNumberAlert(props) {
     const confirmationMessage = `${t('Is this phone number correct,')} ${phone} ?`;
     if (!isPhoneNeedsReview)
         return React.createElement(React.Fragment, null);
-    return (React.createElement(React.Fragment, null, props.isReview && !closeConfirmAlert && !isExportingPDF ? (React.createElement(Alert, { className: "pf-v5-u-mb-md phone-review-banner", isInline: true, variant: AlertVariant.warning, title: t('Review phone number'), component: "p", actionLinks: [
-            React.createElement(Button, { key: "case-contact-phone-number-review-confirm", variant: ButtonVariant.link, isInline: true, onClick: () => onCaseDetailsChange({ suppliedPhoneNumberVerified: 'True' }), "data-tracking-id": "case-contact-phone-number-review-confirm", isLoading: isCaseUpdating, isDisabled: isCaseUpdating },
+    return (React.createElement(React.Fragment, null, props.isReview && !closeConfirmAlert && !isExportingPDF ? (React.createElement(Alert, { className: "pf-v6-u-mb-md phone-review-banner", isInline: true, variant: AlertVariant.warning, title: t('Review phone number'), component: "p", actionLinks: [
+            React.createElement(Button, { className: "pf-v6-u-mr-md", key: "case-contact-phone-number-review-confirm", variant: ButtonVariant.link, isInline: true, onClick: () => onCaseDetailsChange({ suppliedPhoneNumberVerified: 'True' }), "data-tracking-id": "case-contact-phone-number-review-confirm", isLoading: isCaseUpdating, isDisabled: isCaseUpdating },
                 React.createElement(Trans, null, "Yes, confirm phone number")),
-            React.createElement(Link, { key: "case-contact-phone-number-review", replace: true, to: {
-                    pathname: `/case/${caseNumber}/management`,
-                }, onClick: () => goToPhoneField(), "data-tracking-id": "case-contact-phone-number-review" },
+            React.createElement(Button, { isInline: true, className: "pf-v6-u-mr-md", variant: ButtonVariant.link, key: "case-contact-phone-number-review", component: "a", href: `#/case/${caseNumber}/management`, onClick: () => goToPhoneField(), "data-tracking-id": "case-contact-phone-number-review" },
                 React.createElement(Trans, null, "No, update phone number")),
-            React.createElement(Button, { key: "case-contact-phone-number-alert-close", variant: ButtonVariant.link, onClick: () => setCloseConfirmAlert(!closeConfirmAlert), "data-tracking-id": "case-contact-phone-number-alert-close", isDisabled: isCaseUpdating },
+            React.createElement(Button, { isInline: true, key: "case-contact-phone-number-alert-close", className: "pf-v6-c-button pf-m-link pf-m-inline", onClick: () => setCloseConfirmAlert(!closeConfirmAlert), "data-tracking-id": "case-contact-phone-number-alert-close", isDisabled: isCaseUpdating },
                 React.createElement(Trans, null, "Close")),
         ] },
-        React.createElement(Trans, null, confirmationMessage))) : props.isConfirm && !isExportingPDF ? (React.createElement(Alert, { isInline: true, className: "pf-v5-u-mb-md phone-review-banner", variant: AlertVariant.warning, title: t('Review phone number'), component: "p", actionLinks: [
+        React.createElement(Trans, null, confirmationMessage))) : props.isConfirm && !isExportingPDF ? (React.createElement(Alert, { isInline: true, className: "pf-v6-u-p-sm pf-v6-u-mb-md phone-review-banner", variant: AlertVariant.warning, title: t('Review phone number'), component: "p", actionLinks: [
             React.createElement(Button, { variant: ButtonVariant.link, isInline: true, onClick: () => onCaseDetailsChange({ suppliedPhoneNumberVerified: 'True' }), "data-tracking-id": "case-contact-phone-number-confirm", isLoading: isCaseUpdating, isDisabled: isCaseUpdating },
                 React.createElement(Trans, null, "Confirm phone number")),
         ] },

package/lib/esm/components/CaseEditView/Tabs/CaseDetails/CaseReferenceNumber.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"CaseReferenceNumber.d.ts","sourceRoot":"","sources":["../../../../../../src/components/CaseEditView/Tabs/CaseDetails/CaseReferenceNumber.tsx"],"names":[],"mappings":"AAgBA,OAAO,KAA0C,MAAM,OAAO,CAAC;AAW/D,UAAU,MAAM;IACZ,cAAc,CAAC,EAAE,OAAO,CAAC;IACzB,cAAc,CAAC,EAAE,OAAO,CAAC;CAC5B;AAED,MAAM,CAAC,OAAO,UAAU,mBAAmB,CAAC,KAAK,EAAE,MAAM,qBA4LxD"}
+{"version":3,"file":"CaseReferenceNumber.d.ts","sourceRoot":"","sources":["../../../../../../src/components/CaseEditView/Tabs/CaseDetails/CaseReferenceNumber.tsx"],"names":[],"mappings":"AAgBA,OAAO,KAA0C,MAAM,OAAO,CAAC;AAW/D,UAAU,MAAM;IACZ,cAAc,CAAC,EAAE,OAAO,CAAC;IACzB,cAAc,CAAC,EAAE,OAAO,CAAC;CAC5B;AAED,MAAM,CAAC,OAAO,UAAU,mBAAmB,CAAC,KAAK,EAAE,MAAM,qBA+LxD"}

package/lib/esm/components/CaseEditView/Tabs/CaseDetails/CaseReferenceNumber.js

@@ -106,17 +106,17 @@ export default function CaseReferenceNumber(props) {
                 React.createElement(ValueChangedIcon, { afterLocalChange: afterLocalChange, isLocalChange: localRefNumberChange, value: referenceNumber, getTooltipContent: getChangedValueTooltip(() => CaseValuesToWatch.altID) }),
                 ' ',
                 !isExportingPDF ? (React.createElement(Tooltip, { trigger: 'mouseenter focus', position: TooltipPosition.top, content: React.createElement(Trans, null, "Add your internal tracking ID to better identify and organize support issues.") },
-                    React.createElement(InfoIcon, { className: "pf-v5-u-ml-sm", "aria-label": "Case Alternate ID" }))) : ('')), allowInlineEdit: inlineEditable, content: referenceNumber || t('No personal reference number to display.'), hideSaveCancel: hideSaveCancel, saveDisabled: saveDisabled, charCount: (referenceNumberState === null || referenceNumberState === void 0 ? void 0 : referenceNumberState.length) || 0, charTotal: CASE_REFERENCE_NUMBER_LIMIT, cancelToggleState: isCancelClicked, saveToggleState: isSaveClicked, isExportingPDF: isExportingPDF },
+                    React.createElement(InfoIcon, { className: "pf-v6-u-ml-sm cursor-pointer pf-v6-u-text-color-status-custom", "aria-label": "Case Alternate ID" }))) : ('')), allowInlineEdit: inlineEditable, content: referenceNumber || t('No personal reference number to display.'), hideSaveCancel: hideSaveCancel, saveDisabled: saveDisabled, charCount: (referenceNumberState === null || referenceNumberState === void 0 ? void 0 : referenceNumberState.length) || 0, charTotal: CASE_REFERENCE_NUMBER_LIMIT, cancelToggleState: isCancelClicked, saveToggleState: isSaveClicked, isExportingPDF: isExportingPDF },
             React.createElement(TextInputGroup, null,
                 React.createElement(TextInput, { value: referenceNumberState, type: "text", id: "case-details-reference-number", placeholder: t(`Enter the reference number used personally or within your company`), onChange: (_event, value) => onReferenceNumberChange(value), "data-tracking-id": "case-details-reference-number", isDisabled: isUpdating, onKeyDown: handleKeyDown, validated: (referenceNumberState === null || referenceNumberState === void 0 ? void 0 : referenceNumberState.length) > CASE_REFERENCE_NUMBER_LIMIT
                         ? ValidatedOptions.error
                         : ValidatedOptions.default }),
                 !isUpdating ? (React.createElement(InputGroupText, null,
-                    React.createElement("button", { className: "btn btn-app btn-link pf-v5-u-ml-sm", type: "button", disabled: saveDisabled, onClick: onSave },
+                    React.createElement("button", { className: "btn btn-app btn-link pf-v6-u-ml-sm", type: "button", disabled: saveDisabled, onClick: onSave },
                         React.createElement(CheckIcon, null)),
                     React.createElement("button", { className: "btn btn-app btn-link", type: "button", onClick: onCancel },
                         React.createElement(TimesIcon, { color: "#6A6E73" })))) : (React.createElement(InputGroupText, null,
-                    React.createElement(Spinner, { size: "lg", className: "pf-v5-u-ml-2xl pf-v5-u-mr-xl" }))))),
+                    React.createElement(Spinner, { size: "lg", className: "pf-v6-u-ml-2xl pf-v6-u-mr-xl" }))))),
         isReferenceNumberValid ? (React.createElement("div", { className: "pull-top" },
             React.createElement("p", { className: "form-instructions form-invalid" },
                 React.createElement(Trans, null, maxLengthErrorMessage)))) : (React.createElement("p", { className: "form-instructions" },

package/lib/esm/components/CaseEditView/Tabs/CaseDetails/ProductVersion.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"ProductVersion.d.ts","sourceRoot":"","sources":["../../../../../../src/components/CaseEditView/Tabs/CaseDetails/ProductVersion.tsx"],"names":[],"mappings":"AAyCA,OAAO,KAAkD,MAAM,OAAO,CAAC;AASvE,UAAU,MAAM;IACZ,yBAAyB,CAAC,EAAE,OAAO,CAAC;CACvC;AAED,iBAAS,eAAe,CAAC,KAAK,EAAE,MAAM,qBA2VrC;AAED,eAAe,eAAe,CAAC"}
+{"version":3,"file":"ProductVersion.d.ts","sourceRoot":"","sources":["../../../../../../src/components/CaseEditView/Tabs/CaseDetails/ProductVersion.tsx"],"names":[],"mappings":"AAyCA,OAAO,KAAkD,MAAM,OAAO,CAAC;AASvE,UAAU,MAAM;IACZ,yBAAyB,CAAC,EAAE,OAAO,CAAC;CACvC;AAED,iBAAS,eAAe,CAAC,KAAK,EAAE,MAAM,qBA8VrC;AAED,eAAe,eAAe,CAAC"}

package/lib/esm/components/CaseEditView/Tabs/CaseDetails/ProductVersion.js

@@ -209,7 +209,7 @@ function ProductNVersion(props) {
             React.createElement(TextInputGroupMain, { value: inputValue, onClick: onToggleClick, onChange: onTextInputChange, onKeyDown: onInputKeyDown, autoComplete: "off", innerRef: textInputRef, placeholder: t('Select a product'), role: "combobox", isExpanded: isOpen, "aria-controls": "case-details-product-selector-listbox" }),
             isProductUpdating ? (React.createElement(TextInputGroupUtilities, null,
                 React.createElement(Spinner, { size: "md" }))) : (React.createElement(TextInputGroupUtilities, Object.assign({}, (!inputValue ? { style: { display: 'none' } } : {})),
-                React.createElement(Button, { variant: "plain", onClick: onProductClear, "aria-label": "Clear input value" }, !isExportingPDF ? React.createElement(TimesIcon, { "aria-hidden": true }) : ''))))));
+                React.createElement(Button, { icon: !isExportingPDF ? React.createElement(TimesIcon, { "aria-hidden": true }) : '', variant: "plain", onClick: onProductClear, "aria-label": "Clear input value" }))))));
     const getVersionDropdownOptions = map(versions, (option) => ({
         label: option,
         value: option,
@@ -226,7 +226,7 @@ function ProductNVersion(props) {
     }, [allProducts, dispatchToGlobalMetadataReducer, contactSSOName]);
     return (React.createElement(React.Fragment, null,
         React.createElement(AlertMessage, { show: !allProducts.isFetching && allProducts.isError, title: t('There was an error loading products.'), variant: AlertType.DANGER }),
-        isEmpty(selectedVersionLocal) && (selectedVersionLocal === null || selectedVersionLocal === void 0 ? void 0 : selectedVersionLocal.length) < 2 && (React.createElement(Alert, { isInline: true, className: "pf-v5-u-mb-md", variant: AlertVariant.danger, title: React.createElement(Trans, null, "Please clear the errors to change the product on your case") })),
+        isEmpty(selectedVersionLocal) && (selectedVersionLocal === null || selectedVersionLocal === void 0 ? void 0 : selectedVersionLocal.length) < 2 && (React.createElement(Alert, { isInline: true, className: "pf-v6-u-mb-md", variant: AlertVariant.danger, title: React.createElement(Trans, null, "Please clear the errors to change the product on your case") })),
         React.createElement(React.Fragment, null,
             React.createElement("div", { className: "form-group all-product-selector-dropdown" },
                 React.createElement("div", { className: "product-selector-wrapper" },

package/lib/esm/components/CaseEditView/Tabs/CaseDetails/SFDCUrl.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"SFDCUrl.d.ts","sourceRoot":"","sources":["../../../../../../src/components/CaseEditView/Tabs/CaseDetails/SFDCUrl.tsx"],"names":[],"mappings":"AAKA,OAAO,KAAqB,MAAM,OAAO,CAAC;AAK1C,MAAM,CAAC,OAAO,UAAU,OAAO,sBAmD9B"}
+{"version":3,"file":"SFDCUrl.d.ts","sourceRoot":"","sources":["../../../../../../src/components/CaseEditView/Tabs/CaseDetails/SFDCUrl.tsx"],"names":[],"mappings":"AAKA,OAAO,KAAqB,MAAM,OAAO,CAAC;AAK1C,MAAM,CAAC,OAAO,UAAU,OAAO,sBAuD9B"}

package/lib/esm/components/CaseEditView/Tabs/CaseDetails/SFDCUrl.js

@@ -27,11 +27,10 @@ export default function SFDCUrl() {
     const handleSFDCUrlClick = () => {
         window.open(getSFDCCaseUrl(), '_blank');
     };
-    return (React.createElement("div", { className: "pf-v5-u-mb-md" },
-        React.createElement("label", { htmlFor: "sfdc-case-url", className: "pf-v5-u-mb-sm" },
+    return (React.createElement("div", { className: "pf-v6-u-mb-md" },
+        React.createElement("label", { htmlFor: "sfdc-case-url", className: "pf-v6-u-mb-sm" },
             React.createElement(Trans, null, "SFDC Case URL")),
         React.createElement(Flex, { className: "sfdc-case-url-clipboard" },
-            React.createElement(Button, { variant: "control", "aria-label": "Copy SFDC Url", onClick: handleSFDCUrlClick },
-                React.createElement(ExternalLinkAltIcon, null)),
+            React.createElement(Button, { className: "pf-v6-u-mr-xs", icon: React.createElement(ExternalLinkAltIcon, null), variant: "control", "aria-label": "Copy SFDC Url", onClick: handleSFDCUrlClick }),
             React.createElement(ClipboardCopy, { isReadOnly: true, hoverTip: "Copy URL", clickTip: "URL copied", id: "sfdc-case-url", "data-tracking-id": "sfdc-case-url" }, getSFDCCaseUrl()))));
 }

package/lib/esm/components/CaseEditView/Tabs/CaseDetails/Summary.js

@@ -132,11 +132,11 @@ function Summary(props) {
                         ? ValidatedOptions.error
                         : ValidatedOptions.default }),
                 !isSummaryUpdating ? (React.createElement(InputGroupText, null,
-                    React.createElement("button", { className: "btn btn-app btn-link pf-v5-u-ml-sm", type: "button", disabled: saveDisabled, onClick: onSave },
+                    React.createElement("button", { className: "btn btn-app btn-link pf-v6-u-ml-sm", type: "button", disabled: saveDisabled, onClick: onSave },
                         React.createElement(CheckIcon, null)),
                     React.createElement("button", { className: "btn btn-app btn-link", type: "button", onClick: onCancel },
                         React.createElement(TimesIcon, { color: "#6A6E73" })))) : (React.createElement(InputGroupText, null,
-                    React.createElement(Spinner, { size: "lg", className: "pf-v5-u-ml-2xl pf-v5-u-mr-xl" }))))),
+                    React.createElement(Spinner, { size: "lg", className: "pf-v6-u-ml-2xl pf-v6-u-mr-xl" }))))),
         isSummaryEmpty && (React.createElement("p", { className: "form-instructions form-invalid" },
             React.createElement(Trans, null, fieldEmptyErrorMessage)))));
 }

package/lib/esm/components/CaseEditView/Tabs/CaseDetails/useCustomEmails.d.ts

@@ -1,4 +1,4 @@
-import { isEmailValid, isEmailValidForCaseContactSelector } from '@rh-support/utils';
+import { isEmailValid } from '@rh-support/utils';
 interface IProps {
     caseNumber: string;
     accountNumber: string;
@@ -9,7 +9,6 @@ export declare function useCustomEmails(props: IProps): {
     canAddCustomEmail: boolean;
     hideCustomEmails: boolean;
     isEmailValid: typeof isEmailValid;
-    isEmailValidForCaseContactSelector: typeof isEmailValidForCaseContactSelector;
     isUpdatingCustomEmails: boolean;
     showAddEmailToAccountModal: (emailString: string) => Promise<boolean>;
 };

package/lib/esm/components/CaseEditView/Tabs/CaseDetails/useCustomEmails.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"useCustomEmails.d.ts","sourceRoot":"","sources":["../../../../../../src/components/CaseEditView/Tabs/CaseDetails/useCustomEmails.tsx"],"names":[],"mappings":"AAQA,OAAO,EAAwB,YAAY,EAAE,kCAAkC,EAAE,MAAM,mBAAmB,CAAC;AAY3G,UAAU,MAAM;IACZ,UAAU,EAAE,MAAM,CAAC;IACnB,aAAa,EAAE,MAAM,CAAC;CACzB;AAED,wBAAgB,eAAe,CAAC,KAAK,EAAE,MAAM;+BAyED,MAAM;+BAnCN,MAAM,UAAU,MAAM,IAAI;;;;;;8CAbX,MAAM;EAkGhE"}
+{"version":3,"file":"useCustomEmails.d.ts","sourceRoot":"","sources":["../../../../../../src/components/CaseEditView/Tabs/CaseDetails/useCustomEmails.tsx"],"names":[],"mappings":"AAQA,OAAO,EAAwB,YAAY,EAAE,MAAM,mBAAmB,CAAC;AAYvE,UAAU,MAAM;IACZ,UAAU,EAAE,MAAM,CAAC;IACnB,aAAa,EAAE,MAAM,CAAC;CACzB;AAED,wBAAgB,eAAe,CAAC,KAAK,EAAE,MAAM;+BAyED,MAAM;+BAnCN,MAAM,UAAU,MAAM,IAAI;;;;;8CAbX,MAAM;EAiGhE"}