@rh-support/troubleshoot 1.0.47-beta.33 → 1.0.47-beta.35

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

@@ -1 +1 @@
-{"version":3,"file":"OwnerSelector.d.ts","sourceRoot":"","sources":["../../../../src/components/AccountInfo/OwnerSelector.tsx"],"names":[],"mappings":"AA4BA,UAAU,MAAM;CAAG;AAEnB,iBAAS,aAAa,CAAC,KAAK,EAAE,MAAM,eA2NnC;AAED,OAAO,EAAE,aAAa,EAAE,CAAC"}
+{"version":3,"file":"OwnerSelector.d.ts","sourceRoot":"","sources":["../../../../src/components/AccountInfo/OwnerSelector.tsx"],"names":[],"mappings":"AAoCA,UAAU,MAAM;CAAG;AAEnB,iBAAS,aAAa,CAAC,KAAK,EAAE,MAAM,eAuRnC;AAED,OAAO,EAAE,aAAa,EAAE,CAAC"}

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

@@ -7,6 +7,7 @@ var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, ge
         step((generator = generator.apply(thisArg, _arguments || [])).next());
     });
 };
+import { contacts } from '@cee-eng/hydrajs';
 import { CaseContactsSelectorExternal, getHydraContactLabel, renderMenuItemChildren, ToastNotification, usePrevious, ValueChangedIcon, } from '@rh-support/components';
 import { GlobalMetadataStateContext, useCanEditCase } from '@rh-support/react-context';
 import { sortHydraContacts } from '@rh-support/utils';
@@ -20,24 +21,24 @@ import { Trans, useTranslation } from 'react-i18next';
 import { useCaseDispatch, useCaseSelector } from '../../context/CaseContext';
 import { RouteContext } from '../../context/RouteContext';
 import { useCaseUpdateErrorMessage } from '../../hooks/useCaseUpdateErrorMessage';
-import { setCaseOwner, setNotifiedUser, updateCaseDetails } from '../../reducers/CaseReducer';
+import { setCaseDetails, setCaseOwner, setCaseState, setNotifiedUser, updateCaseDetails, } from '../../reducers/CaseReducer';
 import { CaseValuesToWatch } from '../shared/Constants';
 import { getChangedValueTooltip } from '../shared/utils';
 function OwnerSelector(props) {
     const { t } = useTranslation();
     const caseUpdateError = useCaseUpdateErrorMessage();
-    const { accountNumber, caseNumber, selectedNotificationContacts, selectedOwner, selectedCaseGroupUsers } = useCaseSelector((state) => ({
+    const { accountNumber, caseNumber, selectedNotificationContacts, selectedOwner, selectedCaseGroupUsers, isCaseOwnerUpdating, } = useCaseSelector((state) => ({
         accountNumber: state.caseDetails.accountNumberRef,
         caseNumber: state.caseDetails.caseNumber,
         selectedNotificationContacts: state.selectedNotificationContacts,
         selectedOwner: state.selectedOwner,
         selectedCaseGroupUsers: state.selectedCaseGroupUsers,
+        isCaseOwnerUpdating: state.isCaseOwnerUpdating,
     }), isEqual);
     const { routeState: { showValidationErrorAlert }, } = useContext(RouteContext);
     const caseDispatch = useCaseDispatch();
-    const { globalMetadataState: { loggedInUserRights }, } = useContext(GlobalMetadataStateContext);
+    const { globalMetadataState: { loggedInUserRights, loggedInUser }, } = useContext(GlobalMetadataStateContext);
     const previousAccountNumber = usePrevious(accountNumber);
-    const [isCaseOwnerUpdating, setCaseOwnerUpdating] = useState(false);
     const [usersWithGroupAccess, setUsersWithGroupAccess] = useState([]);
     const [localOwnerChange, setLocalOwnerChange] = useState(false);
     const afterLocalChange = () => setLocalOwnerChange(false);
@@ -47,17 +48,70 @@ function OwnerSelector(props) {
         !isEmpty(pvalue.ssoUsername) &&
         value.ssoUsername !== pvalue.ssoUsername;
     const canEditCase = useCanEditCase();
+    const setContactPhoneNumber = (sso) => __awaiter(this, void 0, void 0, function* () {
+        if (sso === loggedInUser.data.ssoUsername) {
+            setCaseDetails(caseDispatch, {
+                phone: loggedInUser.data.phone,
+                suppliedPhoneNumberVerified: 'True',
+            });
+        }
+        else {
+            try {
+                const selectedContact = yield contacts.getSFDCContactBySso(sso);
+                setCaseDetails(caseDispatch, {
+                    phone: selectedContact.phone,
+                    suppliedPhoneNumberVerified: 'Deferred',
+                });
+            }
+            catch (e) {
+                setCaseDetails(caseDispatch, {
+                    phone: '',
+                    suppliedPhoneNumberVerified: 'Deferred',
+                });
+            }
+        }
+    });
+    const updateContactPhoneNumber = (sso) => __awaiter(this, void 0, void 0, function* () {
+        try {
+            if (sso === loggedInUser.data.ssoUsername) {
+                yield updateCaseDetails(caseDispatch, caseNumber, {
+                    phone: loggedInUser.data.phone,
+                    suppliedPhoneNumberVerified: 'Deferred',
+                });
+            }
+            else {
+                try {
+                    const selectedContact = yield contacts.getSFDCContactBySso(sso);
+                    yield updateCaseDetails(caseDispatch, caseNumber, {
+                        phone: selectedContact.phone,
+                        suppliedPhoneNumberVerified: 'Deferred',
+                    });
+                }
+                catch (e) {
+                    yield updateCaseDetails(caseDispatch, caseNumber, {
+                        phone: '',
+                        suppliedPhoneNumberVerified: 'Deferred',
+                    });
+                }
+            }
+            ToastNotification.addSuccessMessage(t(`Phone number has been successfully updated`));
+        }
+        catch (e) {
+            caseUpdateError.showError(e, t(`Phone number failed to update`));
+        }
+    });
     /**
      * Changing selected owner related
      */
     const previousCaseOwner = usePrevious(selectedOwner.data.ssoUsername);
     const onOwnerChange = (selectedContact, prevCaseOwner, notificationContacts, dispatch, abortSignalCaseGroup, abortSignalEntitlements) => __awaiter(this, void 0, void 0, function* () {
-        if (prevCaseOwner === selectedContact.ssoUsername)
+        if (prevCaseOwner === selectedContact.ssoUsername || isEmpty(selectedContact.ssoUsername))
             return;
         yield setCaseOwner(dispatch, selectedContact, '', abortSignalCaseGroup, abortSignalEntitlements, true);
         setLocalOwnerChange(true);
         !isEmpty(selectedContact) &&
             setNotifiedUser(dispatch, filter(notificationContacts, (c) => c.ssoUsername !== selectedContact.ssoUsername));
+        setContactPhoneNumber(selectedContact.ssoUsername);
     });
     /** Reset owner when selected account number changes */
     useEffect(() => {
@@ -90,7 +144,7 @@ function OwnerSelector(props) {
     };
     const onCaseOwnerUpdate = (newOwner) => __awaiter(this, void 0, void 0, function* () {
         const caseDetails = { contactSSOName: newOwner.ssoUsername };
-        setCaseOwnerUpdating(true);
+        setCaseState(caseDispatch, { isCaseOwnerUpdating: true });
         try {
             yield updateCaseDetails(caseDispatch, caseNumber, caseDetails);
             const abortSignal = new AbortController().signal;
@@ -102,11 +156,12 @@ function OwnerSelector(props) {
             }, '', abortSignal);
             setLocalOwnerChange(true);
             updateNotifyUsersList(newOwner);
-            setCaseOwnerUpdating(false);
+            yield updateContactPhoneNumber(newOwner.ssoUsername);
+            setCaseState(caseDispatch, { isCaseOwnerUpdating: false });
             ToastNotification.addSuccessMessage(t(`Owner has been successfully updated`));
         }
         catch (e) {
-            setCaseOwnerUpdating(false);
+            setCaseState(caseDispatch, { isCaseOwnerUpdating: false });
             caseUpdateError.showError(e, t(`Owner failed to update`));
         }
     });

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

@@ -1 +1 @@
-{"version":3,"file":"Case.d.ts","sourceRoot":"","sources":["../../../../src/components/CaseEditView/Case.tsx"],"names":[],"mappings":"AAgBA,OAAO,EAAS,mBAAmB,EAAiD,MAAM,kBAAkB,CAAC;AAmB7G,UAAU,MAAM;IACZ,UAAU,EAAE,mBAAmB,CAAC;CACnC;AAED,MAAM,CAAC,OAAO,UAAU,IAAI,CAAC,KAAK,EAAE,MAAM,eAuLzC"}
+{"version":3,"file":"Case.d.ts","sourceRoot":"","sources":["../../../../src/components/CaseEditView/Case.tsx"],"names":[],"mappings":"AAgBA,OAAO,EAAS,mBAAmB,EAAiD,MAAM,kBAAkB,CAAC;AAmB7G,UAAU,MAAM;IACZ,UAAU,EAAE,mBAAmB,CAAC;CACnC;AAED,MAAM,CAAC,OAAO,UAAU,IAAI,CAAC,KAAK,EAAE,MAAM,eA6LzC"}

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

@@ -4,7 +4,7 @@ import { AbilityContext, CaseDetailsFields, resourceActions, resources } from '@
 import { getUrlParsedParams, isValidCaseNumber } from '@rh-support/utils';
 import isEmpty from 'lodash/isEmpty';
 import isEqual from 'lodash/isEqual';
-import React, { useContext, useEffect } from 'react';
+import React, { useContext, useEffect, useRef } from 'react';
 import { useTranslation } from 'react-i18next';
 import { Route, Switch, useLocation, useParams, useRouteMatch } from 'react-router-dom';
 import { useCaseDispatch, useCaseSelector } from '../../context/CaseContext';
@@ -29,6 +29,7 @@ export default function Case(props) {
     const { caseNumber } = useParams();
     const queryParams = getUrlParsedParams(useLocation().search);
     const ability = useContext(AbilityContext);
+    const caseDetailsTabsRef = useRef(null);
     const canSeeFeedbackButtons = ability.can(resourceActions.PATCH, resources.CASE_DETAILS, CaseDetailsFields.CASE_DETAILS_FEEDBACK_BUTTONS);
     const canReadCase = ability.can(resourceActions.READ, resources.CASE_DETAILS);
     const canSeeExternalTracker = ability.can(resourceActions.PATCH, resources.CASE_DETAILS, CaseDetailsFields.CASE_DETAILS_EXTERNAL_TRACKER);
@@ -115,10 +116,10 @@ export default function Case(props) {
                             (!isFetchingCaseDetails || !isEmpty(product)) &&
                             !isFetchingCaseDetailsError && (React.createElement(React.Fragment, null,
                             React.createElement(ErrorBoundary, { errorMsgInfo: t('There was an error loading cases. Please try refreshing the page.') },
-                                React.createElement(CaseOverview, { caseNumber: caseNumber })),
+                                React.createElement(CaseOverview, { caseNumber: caseNumber, tabsRef: caseDetailsTabsRef })),
                             React.createElement(Switch, null,
                                 React.createElement(Route, { path: `${path}/:activeTab?` },
-                                    React.createElement(CaseDetailsTabs, { basePath: url, caseNumber: caseNumber, routeProps: props.routeProps }))))),
+                                    React.createElement(CaseDetailsTabs, { basePath: url, caseNumber: caseNumber, routeProps: props.routeProps, tabdRef: caseDetailsTabsRef }))))),
                         React.createElement(HostnameAwarenessModal, null))),
                 React.createElement(CaseDetailsAside, { caseNumber: caseNumber }),
                 React.createElement(CaseDetailsModals, { caseNumber: caseNumber, isSecureSupport: loggedInUsersAccount.data.secureSupport })))))));

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

@@ -1,8 +1,10 @@
+import React from 'react';
 import { RouteComponentProps } from 'react-router-dom';
 interface IProps {
     caseNumber: string;
     routeProps: RouteComponentProps;
     basePath: string;
+    tabdRef: React.MutableRefObject<HTMLDivElement>;
 }
 export declare function CaseDetailsTabs(props: IProps): JSX.Element;
 export {};

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":"AAiBA,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;CACpB;AACD,wBAAgB,eAAe,CAAC,KAAK,EAAE,MAAM,eAiL5C"}
+{"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,eAmL5C"}

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

@@ -59,7 +59,7 @@ export function CaseDetailsTabs(props) {
         key: 'case details',
         routePath: 'management',
         ref: managementTabRef,
-        component: React.createElement(CaseDetailsManagement, { caseNumber: caseNumber, routeProps: props.routeProps }),
+        component: (React.createElement(CaseDetailsManagement, { caseNumber: caseNumber, routeProps: props.routeProps, tabRef: managementTabRef })),
     });
     canSeeBugZillas &&
         tabsToRender.push({
@@ -104,7 +104,7 @@ export function CaseDetailsTabs(props) {
         return tabIndex > -1 ? tabIndex : activeTabKey;
     };
     const isTabVisibleInPdfExport = (tab) => tab.title === CaseDetailsTabsEnum.DISCUSSION && pdfOption === 'Reduced' ? false : true;
-    return (React.createElement("div", { className: "case-details-tabs" },
+    return (React.createElement("div", { className: "case-details-tabs", ref: props.tabdRef },
         React.createElement(Tabs, { className: "hide-in-pdf", activeKey: getActiveTabKey(), component: TabsComponent.nav, onSelect: handleTabClick }, 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-u-pt-xl" }, tabsToRender.map((tab, index) => (React.createElement(TabContent, { eventKey: index, key: tab.key, id: tab.key, ref: tab.ref, "aria-label": tab.title, hidden: isExportingPDF ? !isTabVisibleInPdfExport(tab) : index !== getActiveTabKey() },

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

@@ -4,7 +4,7 @@ import { CaseSecureSupportAlert } from './CaseSecureSupportAlert';
 import { CaseSubscriptionAbuseAlert } from './CaseSubscriptionAbuseAlert';
 export function CaseDetailsWarningMessage(props) {
     const subscriptionAbused = useSubscriptionAbused();
-    return (React.createElement("div", { className: "pf-u-mb-md" },
+    return (React.createElement(React.Fragment, null,
         React.createElement(CaseSecureSupportAlert, { caseNumber: props.caseNumber, selectedAccountDetails: props.selectedAccountDetails }),
         subscriptionAbused.isAccountFreezed && React.createElement(CaseSubscriptionAbuseAlert, null)));
 }

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

@@ -41,7 +41,7 @@ function CaseType(props) {
             React.createElement(Trans, null, "Support type"),
             React.createElement(ValueChangedIcon, { afterLocalChange: afterLocalChange, isLocalChange: localTypeChange, value: props.selectedType, getTooltipContent: getChangedValueTooltip(() => CaseValuesToWatch.type) }),
             React.createElement("span", { className: "form-required", "aria-hidden": true }, "*")),
-        React.createElement(Dropdown, { name: "open-support-type", placeholder: t(`Select`), title: t(`Select a category`), list: props.allTypes ? toOptions(props.allTypes) : [], selectedItem: toOption(props.selectedType), disabled: props.hasError || props.isDisabled, isLoadingList: props.isFetching, isInValid: isCaseTypeInValid, required: true, onChange: onCaseTypeChange, onOuterClick: validateCaseType, "data-tracking-id": "case-details-type-selector" })));
+        React.createElement(Dropdown, { name: "get-support-type", placeholder: t(`Select`), title: t(`Select a category`), list: toOptions(props.allTypes || []), selectedItem: toOption(props.selectedType), disabled: props.hasError || props.isDisabled, isLoadingList: props.isFetching, isInValid: isCaseTypeInValid, required: true, onChange: onCaseTypeChange, onOuterClick: validateCaseType, "data-tracking-id": "case-details-type-selector" })));
 }
 CaseType.defaultProps = defaultProps;
 export default CaseType;

package/lib/esm/components/CaseEditView/CaseOverview/index.d.ts

@@ -1,5 +1,7 @@
+import React from 'react';
 interface IProps {
     caseNumber: string;
+    tabsRef: React.MutableRefObject<HTMLDivElement>;
 }
 export default function CaseOverview(props: IProps): JSX.Element;
 export {};

package/lib/esm/components/CaseEditView/CaseOverview/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../src/components/CaseEditView/CaseOverview/index.tsx"],"names":[],"mappings":"AA6CA,UAAU,MAAM;IACZ,UAAU,EAAE,MAAM,CAAC;CACtB;AAED,MAAM,CAAC,OAAO,UAAU,YAAY,CAAC,KAAK,EAAE,MAAM,eAqejD"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../src/components/CaseEditView/CaseOverview/index.tsx"],"names":[],"mappings":"AAkBA,OAAO,KAA8D,MAAM,OAAO,CAAC;AA4BnF,UAAU,MAAM;IACZ,UAAU,EAAE,MAAM,CAAC;IACnB,OAAO,EAAE,KAAK,CAAC,gBAAgB,CAAC,cAAc,CAAC,CAAC;CACnD;AAED,MAAM,CAAC,OAAO,UAAU,YAAY,CAAC,KAAK,EAAE,MAAM,eAsejD"}

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

@@ -26,6 +26,7 @@ import { usePostComment } from '../../shared/usePostComment';
 import { ReopenCaseModal } from '../ConfirmationModals/ReopenCaseModal';
 import { PDFContext } from '../PDFContainer';
 import { CaseInformation } from '../Tabs/CaseDetails/CaseInformation';
+import { CaseContactPhoneNumberAlert } from '../Tabs/CaseDetails/CasePhoneNumberConfirmAlert';
 import CaseOwnerInfo from './CaseOwnerInfo';
 import CaseStatus from './CaseStatus';
 import CaseType from './CaseType';
@@ -226,6 +227,7 @@ export default function CaseOverview(props) {
                                 React.createElement(Trans, null, "Case inactivity warning")),
                             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("header", null,
                     React.createElement("h2", { className: "case-ID" },
                         React.createElement(Trans, null, "Case"),

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

@@ -1 +1 @@
-{"version":3,"file":"CaseSecureSupportAlert.d.ts","sourceRoot":"","sources":["../../../../src/components/CaseEditView/CaseSecureSupportAlert.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,QAAQ,EAAE,MAAM,wCAAwC,CAAC;AAOlE,UAAU,MAAM;IACZ,UAAU,EAAE,MAAM,CAAC;IACnB,sBAAsB,EAAE,QAAQ,CAAC;CACpC;AAED,wBAAgB,sBAAsB,CAAC,KAAK,EAAE,MAAM,eAyBnD"}
+{"version":3,"file":"CaseSecureSupportAlert.d.ts","sourceRoot":"","sources":["../../../../src/components/CaseEditView/CaseSecureSupportAlert.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,QAAQ,EAAE,MAAM,wCAAwC,CAAC;AAOlE,UAAU,MAAM;IACZ,UAAU,EAAE,MAAM,CAAC;IACnB,sBAAsB,EAAE,QAAQ,CAAC;CACpC;AAED,wBAAgB,sBAAsB,CAAC,KAAK,EAAE,MAAM,eA+BnD"}

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

@@ -17,6 +17,6 @@ export function CaseSecureSupportAlert(props) {
                 "to access secure support cases."));
         }
     };
-    return (React.createElement(AlertMessage, { 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/Tabs/CaseDetails/CaseContactPhoneNumber.d.ts

@@ -0,0 +1,2 @@
+export declare function CaseContactPhoneNumber(): JSX.Element;
+//# sourceMappingURL=CaseContactPhoneNumber.d.ts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"CaseContactPhoneNumber.d.ts","sourceRoot":"","sources":["../../../../../../src/components/CaseEditView/Tabs/CaseDetails/CaseContactPhoneNumber.tsx"],"names":[],"mappings":"AAsBA,wBAAgB,sBAAsB,gBA2IrC"}

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

@@ -0,0 +1,95 @@
+var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {
+    function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
+    return new (P || (P = Promise))(function (resolve, reject) {
+        function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
+        function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }
+        function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }
+        step((generator = generator.apply(thisArg, _arguments || [])).next());
+    });
+};
+import { InputGroupText, InputGroupTextVariant, Spinner, TextInput, TextInputGroup, ValidatedOptions, } from '@patternfly/react-core';
+import CheckIcon from '@patternfly/react-icons/dist/js/icons/check-icon';
+import TimesIcon from '@patternfly/react-icons/dist/js/icons/times-icon';
+import { NewInlineEdit, ToastNotification } from '@rh-support/components';
+import { GlobalMetadataStateContext, useCanEditCase } from '@rh-support/react-context';
+import isEqual from 'lodash/isEqual';
+import React, { useContext, useEffect, useState } from 'react';
+import { Trans, useTranslation } from 'react-i18next';
+import { PHONE_INSTRUCTION } from '../../../../constants/caseDetailsConstants';
+import { useCaseDispatch, useCaseSelector } from '../../../../context/CaseContext';
+import { useCaseUpdateErrorMessage } from '../../../../hooks/useCaseUpdateErrorMessage';
+import { PHONE_LIMIT } from '../../../../reducers/CaseConstNTypes';
+import { updateCaseDetails } from '../../../../reducers/CaseReducer';
+import { ContactPhoneNumberPopOver } from '../../../CaseInformation/ContactPhoneNumberPopOver';
+export function CaseContactPhoneNumber() {
+    const { phone, caseNumber, contactSSOName, suppliedPhoneNumberVerified, isCaseOwnerUpdating } = useCaseSelector((state) => ({
+        phone: state.caseDetails.phone || '',
+        caseNumber: state.caseDetails.caseNumber,
+        contactSSOName: state.caseDetails.contactSSOName,
+        suppliedPhoneNumberVerified: state.caseDetails.suppliedPhoneNumberVerified,
+        isCaseOwnerUpdating: state.isCaseOwnerUpdating,
+    }), isEqual);
+    const { globalMetadataState: { loggedInUser }, } = useContext(GlobalMetadataStateContext);
+    const canEditCase = useCanEditCase();
+    const [isCasePhoneUpdating, setCasePhoneUpdating] = useState(false);
+    const [localPhoneState, setLocalPhoneState] = useState(phone);
+    const caseDispatch = useCaseDispatch();
+    const caseUpdateError = useCaseUpdateErrorMessage();
+    const { t } = useTranslation();
+    const onPhoneChange = (phone) => __awaiter(this, void 0, void 0, function* () {
+        if (canEditCase.alert())
+            return;
+        setLocalPhoneState(phone);
+    });
+    const onSave = () => __awaiter(this, void 0, void 0, function* () {
+        setCasePhoneUpdating(true);
+        try {
+            yield updateCaseDetails(caseDispatch, caseNumber, { phone: localPhoneState.trim() });
+            setCasePhoneUpdating(false);
+            ToastNotification.addSuccessMessage(t(`Phone number has been successfully updated`));
+        }
+        catch (e) {
+            setCasePhoneUpdating(false);
+            caseUpdateError.showError(e, t(`Phone number failed to update`));
+        }
+    });
+    const onCancel = () => {
+        setLocalPhoneState(phone);
+    };
+    // Function to handle keyDown events
+    const handleKeyDown = (e) => __awaiter(this, void 0, void 0, function* () {
+        // Cancel on pressing esc
+        if (e.keyCode === 27) {
+            yield onCancel();
+        }
+        // Save on pressing enter
+        else if (!isCasePhoneUpdating && e.keyCode === 13) {
+            yield onSave();
+        }
+    });
+    useEffect(() => {
+        setLocalPhoneState(phone);
+    }, [phone]);
+    const maxLengthErrorMessage = t('Phone number cannot be more than {{limit}} characters.', {
+        limit: PHONE_LIMIT,
+    });
+    const isPhoneNeedsReview = contactSSOName === loggedInUser.data.ssoUsername && suppliedPhoneNumberVerified === 'Deferred';
+    return (React.createElement("div", { className: "form-group", style: { minWidth: '200px' } },
+        React.createElement(NewInlineEdit, { labelProps: { htmlFor: 'case-details-supplied-phone' }, labelContent: React.createElement(React.Fragment, null,
+                React.createElement(Trans, null, "Case owner's phone number"),
+                ContactPhoneNumberPopOver()), allowInlineEdit: false, hideSaveCancel: false, saveDisabled: isCasePhoneUpdating },
+            React.createElement(TextInputGroup, null,
+                React.createElement(TextInput, { value: localPhoneState || '', type: "text", className: "form-control", id: "case-details-supplied-phone", placeholder: "+1 555-555-5555", onChange: onPhoneChange, "data-tracking-id": "case-details-page-supplied-phone", isDisabled: isCasePhoneUpdating || isCaseOwnerUpdating, onKeyDown: handleKeyDown, validated: (localPhoneState === null || localPhoneState === void 0 ? void 0 : localPhoneState.length) > PHONE_LIMIT
+                        ? ValidatedOptions.error
+                        : isPhoneNeedsReview
+                            ? ValidatedOptions.warning
+                            : ValidatedOptions.default }),
+                !isCasePhoneUpdating ? (React.createElement(InputGroupText, { variant: InputGroupTextVariant.plain },
+                    React.createElement("button", { className: "btn btn-app btn-link pf-u-ml-sm", type: "button", "data-tracking-id": "case-details-page-supplied-phone-save", onClick: () => onSave(), disabled: (localPhoneState === null || localPhoneState === void 0 ? void 0 : localPhoneState.length) > PHONE_LIMIT || localPhoneState === phone },
+                        React.createElement(CheckIcon, null)),
+                    React.createElement("button", { className: "btn btn-app btn-link", type: "button", onClick: onCancel, "data-tracking-id": "case-details-page-supplied-phone-cancel" },
+                        React.createElement(TimesIcon, { color: "#6A6E73" })))) : (React.createElement(InputGroupText, { variant: InputGroupTextVariant.plain },
+                    React.createElement(Spinner, { isSVG: true, size: "lg", className: "pf-u-ml-2xl pf-u-mr-xl" })))),
+            (localPhoneState === null || localPhoneState === void 0 ? void 0 : localPhoneState.length) > PHONE_LIMIT ? (React.createElement("p", { className: "form-instructions form-invalid" }, maxLengthErrorMessage)) : (React.createElement("p", { className: "form-instructions" },
+                React.createElement(Trans, null, PHONE_INSTRUCTION))))));
+}

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

@@ -1,8 +1,10 @@
 import { IDClassNameProps } from '@rh-support/types/shared';
+import React from 'react';
 import { RouteComponentProps } from 'react-router';
 interface IProps extends IDClassNameProps {
     caseNumber: string;
     routeProps: RouteComponentProps;
+    tabRef: React.MutableRefObject<HTMLDivElement>;
 }
 export default function CaseDetailsManagement(props: IProps): JSX.Element;
 export {};

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

@@ -1 +1 @@
-{"version":3,"file":"CaseDetailsManagement.d.ts","sourceRoot":"","sources":["../../../../../../src/components/CaseEditView/Tabs/CaseDetails/CaseDetailsManagement.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,gBAAgB,EAAE,MAAM,0BAA0B,CAAC;AAI5D,OAAO,EAAE,mBAAmB,EAAE,MAAM,cAAc,CAAC;AAenD,UAAU,MAAO,SAAQ,gBAAgB;IACrC,UAAU,EAAE,MAAM,CAAC;IACnB,UAAU,EAAE,mBAAmB,CAAC;CACnC;AAED,MAAM,CAAC,OAAO,UAAU,qBAAqB,CAAC,KAAK,EAAE,MAAM,eAyD1D"}
+{"version":3,"file":"CaseDetailsManagement.d.ts","sourceRoot":"","sources":["../../../../../../src/components/CaseEditView/Tabs/CaseDetails/CaseDetailsManagement.tsx"],"names":[],"mappings":"AACA,OAAO,EAAE,gBAAgB,EAAE,MAAM,0BAA0B,CAAC;AAG5D,OAAO,KAA+B,MAAM,OAAO,CAAC;AACpD,OAAO,EAAE,mBAAmB,EAAE,MAAM,cAAc,CAAC;AAiBnD,UAAU,MAAO,SAAQ,gBAAgB;IACrC,UAAU,EAAE,MAAM,CAAC;IACnB,UAAU,EAAE,mBAAmB,CAAC;IAChC,MAAM,EAAE,KAAK,CAAC,gBAAgB,CAAC,cAAc,CAAC,CAAC;CAClD;AAED,MAAM,CAAC,OAAO,UAAU,qBAAqB,CAAC,KAAK,EAAE,MAAM,eAiE1D"}

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

@@ -1,3 +1,4 @@
+import { Flex, FlexItem } from '@patternfly/react-core';
 import { AbilityContext, CaseDetailsFields, resourceActions, resources } from '@rh-support/user-permissions';
 import isEqual from 'lodash/isEqual';
 import React, { useContext, useState } from 'react';
@@ -11,7 +12,9 @@ import CaseContactSelector from '../../../CaseManagement/SendNotifications/CaseC
 import { PartnerCaseHelper } from '../../ShareCase/PartnerCaseHelper';
 import { ShareWithPartner } from '../../ShareCase/PartnerShare';
 import CaseAlternateId from './CaseAlternateId';
+import { CaseContactPhoneNumber } from './CaseContactPhoneNumber';
 import CaseInternalStatus from './CaseInternalStatus';
+import { CaseContactPhoneNumberAlert } from './CasePhoneNumberConfirmAlert';
 import CaseSbrGroups from './CaseSbrGroups';
 export default function CaseDetailsManagement(props) {
     const [isUpdatingPartner, setIsUpdatingPartner] = useState(false);
@@ -30,7 +33,12 @@ export default function CaseDetailsManagement(props) {
         React.createElement(PartnerCaseHelper, { setIsUpdatingPartners: setIsUpdatingPartner, caseNumber: props.caseNumber, routeProps: props.routeProps }),
         React.createElement("section", { className: "card card-white" },
             React.createElement("form", { onSubmit: handleFormSubmit },
-                React.createElement(OwnerSelector, null),
+                React.createElement(Flex, { direction: { default: 'column', '2xl': 'row' } },
+                    React.createElement(FlexItem, { flex: { default: 'flex_1' } },
+                        React.createElement(OwnerSelector, null)),
+                    React.createElement(FlexItem, { flex: { default: 'flex_1' } },
+                        React.createElement(CaseContactPhoneNumber, null))),
+                React.createElement(CaseContactPhoneNumberAlert, { isConfirm: true }),
                 canSeeInternalStatus && React.createElement(CaseInternalStatus, null),
                 canSeeSBRGroups && React.createElement(CaseSbrGroups, null),
                 React.createElement(CaseGroup, null),

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

@@ -0,0 +1,9 @@
+import React from 'react';
+interface IProps {
+    isReview?: boolean;
+    isConfirm?: boolean;
+    tabRef?: React.MutableRefObject<HTMLDivElement>;
+}
+export declare function CaseContactPhoneNumberAlert(props: IProps): JSX.Element;
+export {};
+//# sourceMappingURL=CasePhoneNumberConfirmAlert.d.ts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"CasePhoneNumberConfirmAlert.d.ts","sourceRoot":"","sources":["../../../../../../src/components/CaseEditView/Tabs/CaseDetails/CasePhoneNumberConfirmAlert.tsx"],"names":[],"mappings":"AAMA,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,eA4FxD"}

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

@@ -0,0 +1,62 @@
+var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {
+    function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
+    return new (P || (P = Promise))(function (resolve, reject) {
+        function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
+        function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }
+        function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }
+        step((generator = generator.apply(thisArg, _arguments || [])).next());
+    });
+};
+import { Alert, AlertVariant, Button, ButtonVariant } from '@patternfly/react-core';
+import { ToastNotification } from '@rh-support/components';
+import { GlobalMetadataStateContext } from '@rh-support/react-context';
+import { scrollIntoView } from '@rh-support/utils';
+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';
+export function CaseContactPhoneNumberAlert(props) {
+    const { globalMetadataState: { loggedInUser }, } = useContext(GlobalMetadataStateContext);
+    const [isCaseUpdating, setCasUpdating] = useState(false);
+    const { caseNumber, suppliedPhoneNumberVerified, contactSSOName } = useCaseSelector((state) => ({
+        caseNumber: state.caseDetails.caseNumber,
+        suppliedPhoneNumberVerified: state.caseDetails.suppliedPhoneNumberVerified,
+        contactSSOName: state.caseDetails.contactSSOName,
+    }), isEqual);
+    const { t } = useTranslation();
+    const caseDispatch = useCaseDispatch();
+    const caseUpdateError = useCaseUpdateErrorMessage();
+    const onCaseDetailsChange = (caseDetails) => __awaiter(this, void 0, void 0, function* () {
+        setCasUpdating(true);
+        try {
+            yield updateCaseDetails(caseDispatch, caseNumber, caseDetails);
+            setCasUpdating(false);
+            ToastNotification.addSuccessMessage(t(`Phone number has been successfully confirmed`));
+        }
+        catch (e) {
+            setCasUpdating(false);
+            caseUpdateError.showError(e, t(`Phone number failed to be confirmed`));
+        }
+    });
+    const goToPhoneField = () => {
+        scrollIntoView(props.tabRef);
+    };
+    const isPhoneNeedsReview = contactSSOName === loggedInUser.data.ssoUsername && suppliedPhoneNumberVerified === 'Deferred';
+    if (!isPhoneNeedsReview)
+        return React.createElement(React.Fragment, null);
+    return (React.createElement(React.Fragment, null, props.isReview ? (React.createElement(Alert, { className: "pf-u-mb-md", isInline: true, variant: AlertVariant.warning, title: t('Review phone number'), actionLinks: [
+            React.createElement(Link, { replace: true, to: {
+                    pathname: `/case/${caseNumber}/management`,
+                    search: 'hello',
+                }, onClick: () => goToPhoneField(), "data-tracking-id": "case-contact-phone-number-review" },
+                React.createElement(Trans, null, "Review phone number")),
+        ] },
+        React.createElement(Trans, null, "You are the new owner for this case. Is the new phone number correct?"))) : props.isConfirm ? (React.createElement(Alert, { isInline: true, className: "pf-u-mb-md", variant: AlertVariant.warning, title: t('Review phone number'), 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")),
+        ] },
+        React.createElement(Trans, null, "You are the new owner for this case. Is the new phone number correct?"))) : (React.createElement(React.Fragment, null))));
+}

package/lib/esm/components/CaseInformation/CaseInformation.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"CaseInformation.d.ts","sourceRoot":"","sources":["../../../../src/components/CaseInformation/CaseInformation.tsx"],"names":[],"mappings":"AAaA,OAAO,EAAE,mBAAmB,EAAE,MAAM,kBAAkB,CAAC;AAYvD,UAAU,MAAM;IACZ,UAAU,EAAE,mBAAmB,CAAC;CACnC;AAED,MAAM,CAAC,OAAO,UAAU,eAAe,CAAC,KAAK,EAAE,MAAM,eA4HpD"}
+{"version":3,"file":"CaseInformation.d.ts","sourceRoot":"","sources":["../../../../src/components/CaseInformation/CaseInformation.tsx"],"names":[],"mappings":"AAaA,OAAO,EAAE,mBAAmB,EAAE,MAAM,kBAAkB,CAAC;AAWvD,UAAU,MAAM;IACZ,UAAU,EAAE,mBAAmB,CAAC;CACnC;AAED,MAAM,CAAC,OAAO,UAAU,eAAe,CAAC,KAAK,EAAE,MAAM,eA2HpD"}

package/lib/esm/components/CaseInformation/CaseInformation.js

@@ -13,7 +13,6 @@ import { Hostname } from '../ImproveCase/Hostname';
 import KtQuestions from '../ImproveCase/KtQuestions';
 import { AllProductsSelector } from '../ProductSelector/AllProductsSelector';
 import Description from './Description';
-import OpenCaseIssue from './OpenCaseIssue';
 export default function CaseInformation(props) {
     const { t } = useTranslation();
     const { appMetadataState: { nextButtonRef }, } = useContext(AppMetadataStateContext);
@@ -91,7 +90,6 @@ export default function CaseInformation(props) {
                 skippedTroubleshooting && (React.createElement(AllProductsSelector, { isDropdownSelected: true, routeProps: props.routeProps, loadTCOnChange: true, checkEntitledProduct: true })),
                 React.createElement(Hostname, null),
                 React.createElement(OpenShiftClusterId, null),
-                skippedTroubleshooting && React.createElement(OpenCaseIssue, { inlineEditable: false, required: true }),
                 React.createElement(Description, { inlineEditable: false }),
                 React.createElement(KtQuestions, null))))));
 }

package/lib/esm/components/CaseInformation/CaseType.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"CaseType.d.ts","sourceRoot":"","sources":["../../../../src/components/CaseInformation/CaseType.tsx"],"names":[],"mappings":"AAYA,UAAU,MAAM;CAAG;AAEnB,MAAM,CAAC,OAAO,UAAU,QAAQ,CAAC,KAAK,EAAE,MAAM,eAsD7C"}
+{"version":3,"file":"CaseType.d.ts","sourceRoot":"","sources":["../../../../src/components/CaseInformation/CaseType.tsx"],"names":[],"mappings":"AAkBA,UAAU,MAAM;CAAG;AAEnB,MAAM,CAAC,OAAO,UAAU,QAAQ,CAAC,KAAK,EAAE,MAAM,eA+D7C"}

package/lib/esm/components/CaseInformation/CaseType.js

@@ -1,6 +1,6 @@
 import { Dropdown } from '@rh-support/components';
 import { GlobalMetadataStateContext } from '@rh-support/react-context';
-import { toOption, toOptions } from '@rh-support/utils';
+import { toNewCaseTypeMapper, toNewCaseTypeSwitcher, toOldCaseTypeSwitcher, toOption, toOptions, } from '@rh-support/utils';
 import isEmpty from 'lodash/isEmpty';
 import React, { useContext, useMemo, useState } from 'react';
 import { Trans, useTranslation } from 'react-i18next';
@@ -20,22 +20,28 @@ export default function CaseType(props) {
             setCaseDetails(caseDispatch, caseDetails);
         };
         const onCaseTypeChange = (option) => {
-            onCaseDetailsChange({ caseType: option.value });
+            const selectedOldCaseTypeValue = toOldCaseTypeSwitcher(option.value);
+            onCaseDetailsChange({ caseType: selectedOldCaseTypeValue });
             validateCaseType(option);
         };
+        // To convert selected case type to new case type
+        const selectedNewCaseType = toNewCaseTypeSwitcher(caseType);
+        // To convert all case types to new case types
+        const mappedSupportTypes = toNewCaseTypeMapper(allCaseTypes.data);
+        const newCaseTypes = toOptions(mappedSupportTypes);
         return (React.createElement("div", { className: "form-group" },
-            React.createElement("label", { htmlFor: "open-support-type" },
+            React.createElement("label", { htmlFor: "get-support-type" },
                 React.createElement(Trans, null, "Support type"),
                 ' ',
                 React.createElement("span", { className: "form-required", "aria-hidden": true }, "*")),
-            React.createElement(Dropdown, { id: "open-support-type", name: "open-support-type", placeholder: t(`Select a category`), title: t(`Select a category`), list: allCaseTypes.data ? toOptions(allCaseTypes.data) : [], selectedItem: toOption(caseType), disabled: allCaseTypes.isError, isLoadingList: allCaseTypes.isFetching, isInValid: isCaseTypeInValid, required: true, onChange: onCaseTypeChange, onOuterClick: validateCaseType, "data-tracking-id": "open-support-type" })));
+            React.createElement(Dropdown, { id: "get-support-type", name: "get-support-type", placeholder: t(`Select a category`), title: t(`Select a category`), list: allCaseTypes.data ? newCaseTypes : [], selectedItem: toOption(selectedNewCaseType), disabled: allCaseTypes.isError, isLoadingList: allCaseTypes.isFetching, isInValid: isCaseTypeInValid, required: true, onChange: onCaseTypeChange, onOuterClick: validateCaseType, "data-tracking-id": "get-support-type" })));
     }, [
         allCaseTypes.data,
         allCaseTypes.isError,
         allCaseTypes.isFetching,
-        caseType,
         isCaseTypeInValid,
         caseDispatch,
+        caseType,
         t,
     ]);
 }

package/lib/esm/components/CaseInformation/ContactPhoneNumber.d.ts

@@ -0,0 +1,2 @@
+export declare function ContactPhoneNumber(): JSX.Element;
+//# sourceMappingURL=ContactPhoneNumber.d.ts.map

package/lib/esm/components/CaseInformation/ContactPhoneNumber.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"ContactPhoneNumber.d.ts","sourceRoot":"","sources":["../../../../src/components/CaseInformation/ContactPhoneNumber.tsx"],"names":[],"mappings":"AAYA,wBAAgB,kBAAkB,gBAiDjC"}