@rh-support/troubleshoot 2.6.295 → 2.6.299

package/lib/esm/components/CaseEditView/Tabs/CaseHistory/Timeline.js

@@ -1,23 +1,16 @@
-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 './Timeline.css';
-import { caseHistory } from '@cee-eng/hydrajs';
 import { Avatar, Button, DatePicker, EmptyState, EmptyStateBody, EmptyStateVariant, MenuToggle, Pagination, SearchInput, Select, SelectOption, Spinner, } from '@patternfly/react-core';
 import ExclamationCircleIcon from '@patternfly/react-icons/dist/js/icons/exclamation-circle-icon';
 import SearchIcon from '@patternfly/react-icons/dist/js/icons/search-icon';
 import { haltEvent } from '@rh-support/utils';
-import { format, fromUnixTime, isSameDay, parse } from 'date-fns';
+import { format, isSameDay, parse, parseISO } from 'date-fns';
 import debounce from 'lodash/debounce';
 import isEmpty from 'lodash/isEmpty';
 import React, { useEffect, useRef, useState } from 'react';
 import { Trans, useTranslation } from 'react-i18next';
+import { useCaseHistory } from '../../../../hooks/useCaseHistory';
+import { getFieldDisplayName } from '../../../../utils/caseHistoryUtils';
+import { applyPostProcessing, handleFieldChange } from '../../../../utils/TimelineUtils';
 const CustomHighlighter = ({ search, children, highlightDate, }) => {
     const createHighlight = (text) => React.createElement("mark", { className: "timeline-highlight" }, text);
     if (highlightDate) {
@@ -25,7 +18,7 @@ const CustomHighlighter = ({ search, children, highlightDate, }) => {
     }
     if (search) {
         const escapedSearch = search.replace(/[.*+?^${}()|[\]\\]/g, '\\$&');
-        const regex = new RegExp(`(${escapedSearch})`, 'gi');
+        const regex = new RegExp(`(${escapedSearch})`, 'i');
         const parts = children.split(regex);
         return React.createElement(React.Fragment, null, parts.map((part, index) => (regex.test(part) ? createHighlight(part) : part)));
     }
@@ -52,193 +45,58 @@ const TimelineEvent = ({ date, text, side, user, useAvatar, searchValue, highlig
             text && (React.createElement("p", { className: `content-time-${side}-history` },
                 React.createElement(CustomHighlighter, { search: searchValue || '' }, text))))));
 };
-const TimelineNode = React.forwardRef(({ leftEvent, rightEvent, user, useAvatar, searchValue, highlightDate }, ref) => {
+const DEFAULT_AVATAR_SRC = 'https://www.patternfly.org/images/668560cd.svg';
+const TimelineNode = React.forwardRef(({ leftEvent, rightEvent, user, useAvatar, photoUrl, searchValue, highlightDate }, ref) => {
+    const [imgSrc, setImgSrc] = useState(photoUrl || DEFAULT_AVATAR_SRC);
     return (React.createElement("div", { className: "timeline-node", role: "region", "aria-label": "Timeline node" },
         leftEvent && (React.createElement(TimelineEvent, Object.assign({}, leftEvent, { side: "left", useAvatar: useAvatar, searchValue: searchValue, highlightDate: highlightDate }))),
-        React.createElement("div", { ref: ref, "aria-label": `${useAvatar ? 'User profile picture' : 'Timeline marker'}`, tabIndex: -1 }, useAvatar ? (React.createElement(Avatar, { src: 'https://www.patternfly.org/images/668560cd.svg', className: `timeline-avatar timeline-avatar-${user}`, alt: `${user}'s avatar` })) : (React.createElement("div", { className: `timeline-marker timeline-${user}` }))),
+        React.createElement("div", { ref: ref, "aria-label": `${useAvatar ? 'User profile picture' : 'Timeline marker'}`, tabIndex: -1 }, useAvatar ? (React.createElement(Avatar, { src: imgSrc, className: `timeline-avatar timeline-avatar-${user}`, alt: `${user}'s avatar`, onError: () => setImgSrc(DEFAULT_AVATAR_SRC) })) : (React.createElement("div", { className: `timeline-marker timeline-${user}` }))),
         rightEvent && React.createElement(TimelineEvent, Object.assign({}, rightEvent, { side: "right", searchValue: searchValue }))));
 });
 /**
- *
- * @param {Object} item - The item object to process.
- * @returns {string} The formatted text string.
+ * Builds the display text for a "Change" history item by resolving values and
+ * delegating to field-specific formatters.
  */
-const applyReplacements = (item) => {
+export const applyReplacements = (item) => {
+    var _a, _b;
     if (!item || typeof item !== 'object')
         return '';
-    //  API field names to easy to read display names
-    const fieldNameMapping = {
-        ContactId: 'Contact',
-        RH_Product__c: 'Product',
-        RH_Version__c: 'Version',
-        EntitlementId: 'Entitlement',
-        AccountId: 'Account',
-        OwnerId: 'Owner',
-        BusinessHoursId: 'Business Hours',
-        FolderId__c: 'Case Group',
-        Status: 'Status',
-        Customer_Escalation__c: 'Customer Escalation',
-        SlaStartDate: 'SLA Start Date',
-        Case_Language__c: 'Case Language',
-        Alternate_Id__c: 'Personal reference number',
-        SBR_Group__c: 'SBR Group',
-    };
-    // https://help.salesforce.com/s/articleView?id=000384484&type=1
-    // adding in option for multiselect fields provided by salesforce.
-    // in future for more multiselect fields just add to below array.
-    const multiSelectFields = ['SBR_Group__c'];
-    // language codes to language names
-    const languageCodeMapping = {
-        de: 'German',
-        en: 'English',
-        es: 'Spanish',
-        fr: 'French',
-        it: 'Italian',
-        pt: 'Portuguese',
-        ko: 'Korean',
-        ja: 'Japanese',
-        zh: 'Chinese',
-        zh_CN: 'Chinese',
-        zh_HK: 'Chinese (Hong Kong)',
-        zh_TW: 'Chinese (Taiwan)',
-        ru: 'Russian',
-    };
-    // field display names to prefix keys used in item properties
-    const keyMap = {
-        Product: 'product',
-        Version: 'version',
-        Account: 'account',
-        Contact: 'contact',
-        Entitlement: 'entitlement',
-        'Business Hours': 'businessHours',
-        Owner: 'queueNameOwner',
-        'Customer Escalation': 'customerEscalation',
-        'Case Group': 'caseGroup',
-        'SLA Start Date': 'slaStartDate',
-        'Case Language': 'caseLanguage',
-        'Personal reference number': 'alternateId',
-    };
-    // get the mapped display name for a field
-    const getMappedFieldName = (fieldName) => fieldNameMapping[fieldName] || item.fieldLabel || fieldName || '';
-    // get the new or old value using the  prefix
-    const getNameValue = (prefix) => item[`${keyMap[getMappedFieldName(item.fieldName)]}${prefix}Name`] ||
-        item[`${prefix}Value`] ||
-        item[`${prefix.toLowerCase()}Value`] ||
-        '';
-    // formatting functions
-    const formatLanguageChange = (fieldName, oldLanguage, newLanguage) => `changed ${fieldName} from ${oldLanguage} to ${newLanguage}`;
-    const formatSimpleChange = (fieldName, value) => `set ${fieldName} to ${value}`;
-    const formatBooleanChange = (fieldName, value) => `set ${fieldName} to ${value}`;
-    // get  field name and values
-    const fieldName = getMappedFieldName(item.fieldName);
-    const newValue = getNameValue('New');
-    const oldValue = getNameValue('Old');
-    let newText = '';
-    // special field handling below, useful for future exposed case history fields etc / api changes
-    switch (item.fieldName) {
-        case 'Case_Language__c': {
-            const newLanguage = languageCodeMapping[item.newValue] || item.newValue;
-            const oldLanguage = languageCodeMapping[item.oldValue] || item.oldValue;
-            newText =
-                item.oldValue && item.newValue
-                    ? formatLanguageChange(fieldName, oldLanguage, newLanguage)
-                    : formatSimpleChange(fieldName, newLanguage || 'empty');
-            break;
-        }
-        case 'OwnerId':
-            if (item.createdByUserName)
-                newText = formatSimpleChange(fieldName, item.createdByUserName);
-            break;
-        case 'Status':
-            newText =
-                item.oldValue && item.newValue
-                    ? `changed ${fieldName} from ${item.oldValue} to ${item.newValue}`
-                    : formatSimpleChange(fieldName, item.newValue || 'empty');
-            break;
-        case 'Customer_Escalation__c':
-            if (item.createdByUserName)
-                newText = 'started Escalation for this ticket';
-            break;
-        case 'SlaStartDate':
-            if (item.newValue)
-                newText = formatSimpleChange(fieldName, item.newValue);
-            break;
-        case 'RemoteSessionTermsAckedBy__c':
-            newText = 'Acked Remote Rider terms';
-            break;
-        default:
-            if (oldValue && newValue) {
-                if (multiSelectFields.includes(item.fieldName)) {
-                    // in salesforce multi-select picklist values are stored as a single string, with each value separated by a semicolon
-                    const oldValues = oldValue.split(';').map((s) => s.trim());
-                    const newValues = newValue.split(';').map((s) => s.trim());
-                    const added = newValues.filter((nv) => !oldValues.includes(nv));
-                    const removed = oldValues.filter((ov) => !newValues.includes(ov));
-                    if (added.length > 0 && removed.length === 0) {
-                        newText = `added ${added.join(', ')} to ${fieldName}`;
-                    }
-                    else if (removed.length > 0 && added.length === 0) {
-                        newText = `removed ${removed.join(', ')} from ${fieldName}`;
-                    }
-                    else if (added.length > 0 && removed.length > 0) {
-                        newText = `changed ${fieldName}, added ${added.join(', ')} and removed ${removed.join(', ')}`;
-                    }
-                    else {
-                        newText = `changed ${fieldName} from ${oldValue} to ${newValue}`;
-                    }
-                }
-                else {
-                    newText = `changed ${fieldName} from ${oldValue} to ${newValue}`;
-                }
-            }
-            else if (newValue) {
-                newText = formatSimpleChange(fieldName, newValue);
-            }
-            else if (oldValue && (newValue === undefined || newValue === '')) {
-                newText = `removed ${fieldName}, was ${oldValue}`;
-            }
-            else if (item.newValue !== undefined) {
-                newText = formatSimpleChange(fieldName, item.newValue);
-            }
-            break;
-    }
-    if (typeof item.newValue === 'boolean')
-        newText = formatBooleanChange(fieldName, item.newValue);
-    if (typeof newText === 'string')
-        newText = newText.replace(/Problem Statement/g, 'Title');
-    if (typeof newText === 'string')
-        newText = newText.replace(/Case Type/g, 'Support Type');
-    return newText;
+    const fieldName = item.displayName || getFieldDisplayName(item.fieldName) || item.fieldName;
+    const newValue = String((_a = item.newValue) !== null && _a !== void 0 ? _a : '');
+    const oldValue = String((_b = item.oldValue) !== null && _b !== void 0 ? _b : '');
+    const text = handleFieldChange(item, fieldName, oldValue, newValue);
+    return applyPostProcessing(text, item);
 };
-// function to change the apiResponse
-const transformApiResponseToTimelineData = (apiResponse) => {
+/**
+ * Converts normalized history items into timeline node data for rendering.
+ *
+ * Applies a secondary filter (excludes `FolderId__c` and `OwnerId` whose resolved
+ * display names are unavailable), then maps each item to a left (date/time) and
+ * right (user action text) event pair. Avatar/date-header boundaries are computed
+ * sequentially: a new boundary is set on the first item, user change, or date change.
+ */
+export const transformApiResponseToTimelineData = (apiResponse) => {
     let previousUser = null;
     let previousDate = null;
     const timelineEvents = apiResponse.historyItems
-        // Filter out 'Case Group' and 'OwnerId' changes because we don't have decode of value
+        // Second-layer field-name filter on top of filterSfdcIdEntries (which is pattern-based).
+        // FolderId__c (Case Group) and OwnerId are excluded because their resolved display
+        // names (queue name, owner name) are not available in the history payload.
         .filter((item) => item.fieldName !== 'FolderId__c' && item.fieldName !== 'OwnerId')
         .map((item, index) => {
         const currentUser = item.createdByUserName;
-        let eventDate;
-        if (typeof item.createdDate === 'string' && item.createdDate.includes('T')) {
-            eventDate = parse(item.createdDate, "yyyy-MM-dd'T'HH:mm:ss'Z'", new Date());
-        }
-        else {
-            eventDate = fromUnixTime(item.createdDate / 1000);
-        }
+        const eventDate = parseISO(item.createdDate);
         const currentDate = format(eventDate, 'MMMM d, yyyy');
+        // Show avatar + date header when: (1) first item, (2) user changed from
+        // previous event, or (3) calendar date changed. After any list mutation
+        // (filter, sort, paginate) applyAvatarLogic must be re-run so boundaries
+        // remain correct.
         const useAvatar = index === 0 ||
-            (!!previousUser && currentUser !== previousUser) ||
-            (!!previousDate && currentDate !== previousDate);
+            (previousUser !== null && currentUser !== previousUser) ||
+            (previousDate !== null && currentDate !== previousDate);
         previousUser = currentUser;
         previousDate = currentDate;
-        const user = item.createdByCustomer !== undefined
-            ? item.createdByCustomer
-                ? 'customer'
-                : 'internal'
-            : currentUser === 'Case Diagnostics' || currentUser === 'GSS Tools'
-                ? 'internal'
-                : 'customer';
+        const user = item.createdByCustomer ? 'customer' : 'internal';
         const leftEvent = {
             date: currentDate,
             text: format(eventDate, 'h:mm a zzz'),
@@ -247,11 +105,8 @@ const transformApiResponseToTimelineData = (apiResponse) => {
         if (item.type === 'Change') {
             outputText = applyReplacements(item);
         }
-        else {
-            outputText = stripHTML(outputText);
-        }
         const rightEvent = {
-            date: `${item.createdByUserName} ${outputText}`,
+            date: item.createdByUserName ? `${item.createdByUserName} ${outputText}` : outputText,
             text: '',
             user: user,
             useAvatar: useAvatar,
@@ -259,27 +114,24 @@ const transformApiResponseToTimelineData = (apiResponse) => {
         return {
             left: leftEvent,
             right: rightEvent,
+            photoUrl: item.photoUrl,
+            userName: currentUser,
         };
     });
     return timelineEvents;
 };
-function stripHTML(htmlString) {
-    const anchorTagRegex = /<a[^>]*>(.*?)<\/a>/g;
-    // We are trying to return the text without having the info in the anchor.
-    return htmlString.replace(anchorTagRegex, '');
-}
-const Timeline = ({ caseNumber }) => {
+const Timeline = ({ caseNumber, sfdcCaseId }) => {
     const { t } = useTranslation();
     const [timelineEvents, setTimelineEvents] = useState([]);
     const [originalTimelineEvents, setOriginalTimelineEvents] = useState([]);
-    const [isFetchingData, setIsFetchingData] = useState();
     const lastNodeRef = useRef(null);
+    const { historyItems, loading: isFetchingData, error } = useCaseHistory(sfdcCaseId);
+    const fetchError = error ? t('Unable to connect') : null;
     const [dateValue, setDateValue] = useState('');
     const [searchValue, setSearchValue] = useState('');
     const [filteredEvents, setFilteredEvents] = useState([]);
     const [isSelectOpen, setIsSelectOpen] = useState(false);
     const [selectedOrder, setSelectedOrder] = useState('Newest to Oldest');
-    const [fetchError, setFetchError] = useState(null);
     const [page, setPage] = useState(1);
     const [perPage, setPerPage] = useState(20);
     const onSetPage = (_, newPage) => {
@@ -307,52 +159,34 @@ const Timeline = ({ caseNumber }) => {
         }
         setIsSelectOpen(false);
     };
+    // "Newest to Oldest" is the native API order (SF returns history newest-first).
+    // "Oldest to Newest" reverses it. Avatar logic must be reapplied after reorder.
     const reorderTimelineEvents = (order) => {
         const events = order === 'Newest to Oldest' ? [...originalTimelineEvents] : [...originalTimelineEvents].reverse();
         setTimelineEvents(applyAvatarLogic(events));
     };
+    // Re-derives avatar/date-header boundaries after list mutations (filter, sort, paginate).
     const applyAvatarLogic = (events) => {
         let previousUser = null;
         let previousDate = null;
         return events.map((event, index) => {
-            const currentUser = event.right.date.split(' ')[0];
+            const currentUser = event.userName || '';
             const currentDate = event.left.date;
             const useAvatar = index === 0 ||
-                (!!previousUser && currentUser !== previousUser) ||
-                (!!previousDate && currentDate !== previousDate);
+                (previousUser !== null && currentUser !== previousUser) ||
+                (previousDate !== null && currentDate !== previousDate);
             previousUser = currentUser;
             previousDate = currentDate;
             return Object.assign(Object.assign({}, event), { right: Object.assign(Object.assign({}, event.right), { useAvatar: useAvatar }) });
         });
     };
     useEffect(() => {
-        function fetchHistory() {
-            return __awaiter(this, void 0, void 0, function* () {
-                setIsFetchingData(true);
-                setFetchError(null);
-                const options = {
-                    sortField: 'createdDate',
-                    sortOrder: 'DESC',
-                    showVerbose: true,
-                };
-                try {
-                    const response = yield caseHistory.getHistoryv1(caseNumber, options);
-                    const transformedData = transformApiResponseToTimelineData(response);
-                    setTimelineEvents(transformedData);
-                    setOriginalTimelineEvents(transformedData);
-                }
-                catch (error) {
-                    console.error('Failed to fetch history:', error);
-                    setFetchError(t('Unable to connect'));
-                }
-                finally {
-                    setIsFetchingData(false);
-                }
-            });
+        if (historyItems.length > 0) {
+            const transformedData = transformApiResponseToTimelineData({ historyItems });
+            setTimelineEvents(transformedData);
+            setOriginalTimelineEvents(transformedData);
         }
-        fetchHistory();
-        // eslint-disable-next-line react-hooks/exhaustive-deps
-    }, [caseNumber]);
+    }, [historyItems]);
     const futureDateValidator = (date) => {
         const today = new Date();
         today.setHours(0, 0, 0, 0); // Normalize to midnight
@@ -361,6 +195,9 @@ const Timeline = ({ caseNumber }) => {
         }
         return '';
     };
+    // Measures the DOM to shorten the vertical timeline connector line so it does not
+    // extend past the last node. Sets the --timeline-bottom CSS variable, recomputed
+    // on resize and list changes via requestAnimationFrame.
     const updateLineStyle = () => {
         const timelineElement = document.querySelector('.timeline');
         if (timelineElement) {
@@ -395,7 +232,10 @@ const Timeline = ({ caseNumber }) => {
                 timelineElement.style.setProperty('--timeline-bottom', '0px');
             }
         }
-        return () => window.removeEventListener('resize', debouncedUpdateLineStyle);
+        return () => {
+            debouncedUpdateLineStyle.cancel();
+            window.removeEventListener('resize', debouncedUpdateLineStyle);
+        };
     }, [isFetchingData, filteredEvents, page, perPage]);
     const handleSearchChange = (_, value) => {
         setSearchValue(value.trim());
@@ -434,7 +274,6 @@ const Timeline = ({ caseNumber }) => {
     }, [searchValue, dateValue, timelineEvents]);
     const handleReload = (e) => {
         e.preventDefault();
-        window.location.href = window.location.href;
         window.location.reload();
     };
     const renderTimelineContent = () => {
@@ -452,7 +291,7 @@ const Timeline = ({ caseNumber }) => {
                     React.createElement(Trans, null, "Try modifying your search query or changing the date range and try again."))));
         }
         const paginatedEvents = filteredEvents.slice((page - 1) * perPage, page * perPage);
-        return (React.createElement(React.Fragment, null, paginatedEvents.map((node, index) => (React.createElement(TimelineNode, { key: index, leftEvent: node.left, rightEvent: node.right, user: node.right.user, useAvatar: node.right.useAvatar, searchValue: searchValue, highlightDate: !!dateValue, ref: index === paginatedEvents.length - 1 ? lastNodeRef : null })))));
+        return (React.createElement(React.Fragment, null, paginatedEvents.map((node, index) => (React.createElement(TimelineNode, { key: index, leftEvent: node.left, rightEvent: node.right, user: node.right.user, useAvatar: node.right.useAvatar, photoUrl: node.photoUrl, searchValue: searchValue, highlightDate: !!dateValue, ref: index === paginatedEvents.length - 1 ? lastNodeRef : null })))));
     };
     return (React.createElement(React.Fragment, null,
         React.createElement("div", { className: "timelineMenu" },

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

@@ -1 +1 @@
-{"version":3,"file":"CaseSummary.d.ts","sourceRoot":"","sources":["../../../../../../src/components/CaseEditView/Tabs/CaseSummary/CaseSummary.tsx"],"names":[],"mappings":"AAAA,OAAO,mBAAmB,CAAC;AAuB3B,OAAO,KAA0C,MAAM,OAAO,CAAC;AAO/D,UAAU,MAAM;IACZ,UAAU,EAAE,MAAM,CAAC;CACtB;AAED,eAAO,MAAM,WAAW,GAAI,OAAO,MAAM,sBA0LxC,CAAC"}
+{"version":3,"file":"CaseSummary.d.ts","sourceRoot":"","sources":["../../../../../../src/components/CaseEditView/Tabs/CaseSummary/CaseSummary.tsx"],"names":[],"mappings":"AAAA,OAAO,mBAAmB,CAAC;AAuB3B,OAAO,KAA0C,MAAM,OAAO,CAAC;AAQ/D,UAAU,MAAM;IACZ,UAAU,EAAE,MAAM,CAAC;CACtB;AAED,eAAO,MAAM,WAAW,GAAI,OAAO,MAAM,sBA8LxC,CAAC"}

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

@@ -22,6 +22,7 @@ import React, { useContext, useEffect, useState } from 'react';
 import { Trans } from 'react-i18next';
 import { CaseSummaryStates } from '../../../../constants/caseDetailsConstants';
 import { useCaseSelector } from '../../../../context/CaseContext';
+import { useCaseComments } from '../../../../hooks/useCaseComments';
 import { CaseSummaryErrorMessage } from './CaseSummaryErrorMessage';
 export const CaseSummary = (props) => {
     var _a, _b, _c, _d, _e, _f;
@@ -29,10 +30,14 @@ export const CaseSummary = (props) => {
     const [caseSummaryData, setCaseSummaryData] = useState(getApiResourceObject(null, true));
     const [caseSummaryState, setCaseSummaryState] = useState();
     const [errorMessage, setErrorMessage] = useState('');
-    const { caseComments, caseLanguage } = useCaseSelector((state) => ({
-        caseComments: state.caseDetails.comments,
+    const { caseLanguage, caseSalesforceId } = useCaseSelector((state) => ({
         caseLanguage: state.caseDetails.caseLanguage,
+        caseSalesforceId: state.caseDetails.id,
     }), isEqual);
+    const { comments: caseComments } = useCaseComments({
+        caseId: caseSalesforceId,
+        skip: !caseSalesforceId,
+    });
     const { globalMetadataState: { loggedInUserRights }, } = useContext(GlobalMetadataStateContext);
     const isInternal = (_b = (_a = loggedInUserRights === null || loggedInUserRights === void 0 ? void 0 : loggedInUserRights.data) === null || _a === void 0 ? void 0 : _a.isInternal) === null || _b === void 0 ? void 0 : _b.call(_a);
     const onCloseFeedbackModal = () => {

package/lib/esm/components/CaseEditView/Tabs/RMEEscalations/RMEEscalationList.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"RMEEscalationList.d.ts","sourceRoot":"","sources":["../../../../../../src/components/CaseEditView/Tabs/RMEEscalations/RMEEscalationList.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAE,eAAe,EAAqB,MAAM,2CAA2C,CAAC;AAe/F,OAAO,KAAsC,MAAM,OAAO,CAAC;AAiB3D,UAAU,MAAM;IACZ,WAAW,EAAE,eAAe,EAAE,CAAC;IAC/B,UAAU,EAAE,MAAM,CAAC;IACnB,aAAa,EAAE,MAAM,CAAC;IACtB,UAAU,EAAE,OAAO,CAAC;IACpB,UAAU,EAAE,MAAM,CAAC;CACtB;AAOD,MAAM,CAAC,OAAO,UAAU,iBAAiB,CAAC,KAAK,EAAE,MAAM,qBA8MtD"}
+{"version":3,"file":"RMEEscalationList.d.ts","sourceRoot":"","sources":["../../../../../../src/components/CaseEditView/Tabs/RMEEscalations/RMEEscalationList.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAE,eAAe,EAAqB,MAAM,2CAA2C,CAAC;AAe/F,OAAO,KAAsC,MAAM,OAAO,CAAC;AAU3D,UAAU,MAAM;IACZ,WAAW,EAAE,eAAe,EAAE,CAAC;IAC/B,UAAU,EAAE,MAAM,CAAC;IACnB,aAAa,EAAE,MAAM,CAAC;IACtB,UAAU,EAAE,OAAO,CAAC;IACpB,UAAU,EAAE,MAAM,CAAC;CACtB;AAOD,MAAM,CAAC,OAAO,UAAU,iBAAiB,CAAC,KAAK,EAAE,MAAM,qBAkMtD"}

package/lib/esm/components/CaseEditView/Tabs/RMEEscalations/RMEEscalationList.js

@@ -19,11 +19,10 @@ import isEqual from 'lodash/isEqual';
 import React, { useEffect, useRef, useState } from 'react';
 import { Trans, useTranslation } from 'react-i18next';
 import { useCaseDispatch, useCaseSelector } from '../../../../context/CaseContext';
-import { useCaseDetailsPageDispatchContext, useCaseDetailsPageStateContext, } from '../../../../context/CaseDetailsPageContext';
-import { useCaseDiscussionTabDispatchContext, useCaseDiscussionTabStateContext, } from '../../../../context/CaseDiscussionTabContext';
+import { useCaseDetailsPageDispatchContext } from '../../../../context/CaseDetailsPageContext';
+import { GET_CASE_COMMENTS } from '../../../../hooks/useCaseComments';
 import { escalationStatus } from '../../../../models/escalation';
 import { fetchCaseEscalations } from '../../../../reducers/CaseDetailsPageReducer';
-import { updateDiscussionStateComments } from '../../../../reducers/CaseDiscussionTabReducer';
 import { checkForCaseStatusToggleOnAttachOrComment } from '../../../../reducers/CaseReducer';
 const ESCALATION_MSG = 'Request Management Escalation:';
 const UPDATE_ESCALATION_MSG = 'Escalation update requested. You will receive an update from a manager shortly.';
@@ -39,9 +38,7 @@ export default function RMEEscalationList(props) {
     const { request: updateCaseRequest, isFetching: isUpdatingCase } = useFetch(publicApi.kase.updateCase, {
         propgateErrors: true,
     });
-    const { sort, allDiscussions, discussionFiltersListState } = useCaseDiscussionTabStateContext();
-    const dispatchDiscussion = useCaseDiscussionTabDispatchContext();
-    const { caseDetailsPageState: { caseFeedbacksHydra }, } = useCaseDetailsPageStateContext();
+    const client = useApolloClient();
     const caseDetailsPageDispatch = useCaseDetailsPageDispatchContext();
     const escalationUpdateInProgessIds = useRef([]);
     const caseDispatch = useCaseDispatch();
@@ -69,7 +66,7 @@ export default function RMEEscalationList(props) {
                 commentBody: comment,
                 contentType: 'plaintext',
             });
-            updateDiscussionStateComments(dispatchDiscussion, caseDispatch, props.caseNumber, allDiscussions, sort, caseFeedbacksHydra.data, discussionFiltersListState);
+            client.refetchQueries({ include: [GET_CASE_COMMENTS] });
             yield updateCaseRequest(props.caseNumber, { customerEscalation: true });
             checkForCaseStatusToggleOnAttachOrComment(caseDispatch, props.isInternal, props.caseStatus);
             escalationNum && ToastNotification.addSuccessMessage(message);

package/lib/esm/components/CaseManagement/Cep.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Cep.d.ts","sourceRoot":"","sources":["../../../../src/components/CaseManagement/Cep.tsx"],"names":[],"mappings":"AA0BA,OAAO,KAA0C,MAAM,OAAO,CAAC;AAoB/D,UAAU,MAAM;CAAG;AAEnB,wBAAgB,GAAG,CAAC,KAAK,EAAE,MAAM,qBA8ThC"}
+{"version":3,"file":"Cep.d.ts","sourceRoot":"","sources":["../../../../src/components/CaseManagement/Cep.tsx"],"names":[],"mappings":"AA2BA,OAAO,KAA0C,MAAM,OAAO,CAAC;AAe/D,UAAU,MAAM;CAAG;AAEnB,wBAAgB,GAAG,CAAC,KAAK,EAAE,MAAM,qBAkThC"}

package/lib/esm/components/CaseManagement/Cep.js

@@ -7,6 +7,7 @@ var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, ge
         step((generator = generator.apply(thisArg, _arguments || [])).next());
     });
 };
+import { useApolloClient } from '@apollo/client/react';
 import { Button, Checkbox, Form, FormGroup, FormHelperText, HelperText, HelperTextItem, Modal, ModalBody, ModalFooter, ModalHeader, ModalVariant, Popover, PopoverPosition, TextArea, TextInput, ValidatedOptions, } from '@patternfly/react-core';
 import QuestionCircleIcon from '@patternfly/react-icons/dist/js/icons/question-circle-icon';
 import { LoadingIndicator, ToastNotification, useConfirmation } from '@rh-support/components';
@@ -17,10 +18,8 @@ import isEqual from 'lodash/isEqual';
 import React, { useContext, useEffect, useState } from 'react';
 import { Trans, useTranslation } from 'react-i18next';
 import { useCaseDispatch, useCaseSelector } from '../../context/CaseContext';
-import { useCaseDetailsPageStateContext } from '../../context/CaseDetailsPageContext';
-import { useCaseDiscussionTabDispatchContext, useCaseDiscussionTabStateContext, } from '../../context/CaseDiscussionTabContext';
+import { GET_CASE_COMMENTS } from '../../hooks/useCaseComments';
 import { useCaseUpdateErrorMessage } from '../../hooks/useCaseUpdateErrorMessage';
-import { updateDiscussionStateComments } from '../../reducers/CaseDiscussionTabReducer';
 import { checkForCaseStatusToggleOnAttachOrComment, postCepDetails, setCaseDetails, setCaseState, updateCaseDetails, } from '../../reducers/CaseReducer';
 import { PDFContext } from '../CaseEditView/PDFContainer';
 export function Cep(props) {
@@ -42,9 +41,7 @@ export function Cep(props) {
     const ability = useContext(AbilityContext);
     const canUseCep = ability.can(resourceActions.PATCH, resources.CASE_CREATE, CaseListFields.CEP);
     const confirm = useConfirmation();
-    const dispatchDiscussion = useCaseDiscussionTabDispatchContext();
-    const { sort, allDiscussions, discussionFiltersListState } = useCaseDiscussionTabStateContext();
-    const { caseDetailsPageState: { caseFeedbacksHydra }, } = useCaseDetailsPageStateContext();
+    const client = useApolloClient();
     const canEditCase = useCanEditCase();
     const [saveButtonIsClicked, setSaveButtonIsClicked] = useState(false);
     const { isExportingPDF } = useContext(PDFContext);
@@ -92,7 +89,7 @@ export function Cep(props) {
             checkForCaseStatusToggleOnAttachOrComment(caseDispatch, loggedInUserRights.data.isInternal(), status);
             if (caseDetails.cep) {
                 yield postCepDetails(caseDispatch, caseNumber, cepDetailsLocal);
-                updateDiscussionStateComments(dispatchDiscussion, caseDispatch, caseNumber, allDiscussions, sort, caseFeedbacksHydra.data, discussionFiltersListState);
+                client.refetchQueries({ include: [GET_CASE_COMMENTS] });
             }
             ToastNotification.addSuccessMessage(t(`Consultant Engagement in Progress has been updated successfully`));
         }

package/lib/esm/components/ProductSelector/NewProductVersionSelector.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"NewProductVersionSelector.d.ts","sourceRoot":"","sources":["../../../../src/components/ProductSelector/NewProductVersionSelector.tsx"],"names":[],"mappings":"AAKA,OAAO,KAA0C,MAAM,OAAO,CAAC;AAO/D,UAAU,MAAM;IACZ,eAAe,EAAE,CAAC,MAAM,EAAE,MAAM,KAAK,IAAI,CAAC;IAC1C,qCAAqC,EAAE,OAAO,CAAC;CAClD;AAED,eAAO,MAAM,yBAAyB,GAAI,OAAO,MAAM,sBAoFtD,CAAC"}
+{"version":3,"file":"NewProductVersionSelector.d.ts","sourceRoot":"","sources":["../../../../src/components/ProductSelector/NewProductVersionSelector.tsx"],"names":[],"mappings":"AAMA,OAAO,KAAmD,MAAM,OAAO,CAAC;AAOxE,UAAU,MAAM;IACZ,eAAe,EAAE,CAAC,MAAM,EAAE,MAAM,KAAK,IAAI,CAAC;IAC1C,qCAAqC,EAAE,OAAO,CAAC;CAClD;AAED,eAAO,MAAM,yBAAyB,GAAI,OAAO,MAAM,sBAgGtD,CAAC"}

package/lib/esm/components/ProductSelector/NewProductVersionSelector.js

@@ -1,9 +1,10 @@
 import { useApolloClient } from '@apollo/client/react';
 import { SingleSelectDropdown } from '@rh-support/components';
 import { GlobalMetadataStateContext } from '@rh-support/react-context';
+import { getUniqueSortedVersions } from '@rh-support/utils';
 import isEmpty from 'lodash/isEmpty';
 import isEqual from 'lodash/isEqual';
-import React, { useContext, useEffect, useState } from 'react';
+import React, { useContext, useEffect, useMemo, useState } from 'react';
 import { useTranslation } from 'react-i18next';
 import { useCaseDispatch, useCaseSelector } from '../../context/CaseContext';
 import { getVersionsDetails, setCaseState } from '../../reducers/CaseReducer';
@@ -42,6 +43,19 @@ export const NewProductVersionSelector = (props) => {
         }
         // eslint-disable-next-line react-hooks/exhaustive-deps
     }, [versionsDetails.data]);
+    const sortedVersionNames = useMemo(() => {
+        var _a;
+        if (!((_a = versionsDetails.data) === null || _a === void 0 ? void 0 : _a.length))
+            return [];
+        const versionNames = versionsDetails.data.map((v) => v.name);
+        const productObj = getProductObj(allProducts.data.productsResult, product);
+        if (productObj === null || productObj === void 0 ? void 0 : productObj.hasComponentsInsteadOfVersions) {
+            return [...versionNames].sort();
+        }
+        const numeric = versionNames.filter((v) => /^\d/.test(v));
+        const alpha = versionNames.filter((v) => !/^\d/.test(v));
+        return [...getUniqueSortedVersions(numeric), ...alpha.sort()];
+    }, [versionsDetails.data, allProducts.data.productsResult, product]);
     const onSelect = (selectedOption) => {
         const selection = selectedOption.value;
         if (isEqual(selection, version)) {
@@ -57,9 +71,9 @@ export const NewProductVersionSelector = (props) => {
         label: version || '',
         value: version || '',
     });
-    const getDropdownOptions = () => versionsDetails.data.map((v) => ({
-        label: v.name,
-        value: v.name,
+    const getDropdownOptions = () => sortedVersionNames.map((versionOption) => ({
+        label: versionOption,
+        value: versionOption,
     }));
     return (React.createElement(SingleSelectDropdown, { onSelect: onSelect, selected: getSelectedOption(), options: getDropdownOptions(), placeholder: t('Select a version'), ariaLabel: t('Select a version'), isInvalid: isEmpty(version) && showValidationLocal, isDisabled: isEmpty(product) || allProducts.isFetching, dataTrackingId: "get-support-version-dropdown-selector", isLoading: versionsDetails.isFetching }));
 };

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

@@ -1 +1 @@
-{"version":3,"file":"UpdateSeverityModal.d.ts","sourceRoot":"","sources":["../../../../src/components/UpdateSeverityModal/UpdateSeverityModal.tsx"],"names":[],"mappings":"AAmCA,OAAO,KAAmE,MAAM,OAAO,CAAC;AAgBxF,UAAU,MAAM;IACZ,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,IAAI,EAAE,OAAO,CAAC;IACd,OAAO,EAAE,MAAM,IAAI,CAAC;CACvB;AAED,MAAM,CAAC,OAAO,UAAU,mBAAmB,CAAC,KAAK,EAAE,MAAM,qBAqlBxD"}
+{"version":3,"file":"UpdateSeverityModal.d.ts","sourceRoot":"","sources":["../../../../src/components/UpdateSeverityModal/UpdateSeverityModal.tsx"],"names":[],"mappings":"AAmCA,OAAO,KAAmE,MAAM,OAAO,CAAC;AAWxF,UAAU,MAAM;IACZ,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,IAAI,EAAE,OAAO,CAAC;IACd,OAAO,EAAE,MAAM,IAAI,CAAC;CACvB;AAED,MAAM,CAAC,OAAO,UAAU,mBAAmB,CAAC,KAAK,EAAE,MAAM,qBAykBxD"}

package/lib/esm/components/UpdateSeverityModal/UpdateSeverityModal.js

@@ -7,6 +7,7 @@ var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, ge
         step((generator = generator.apply(thisArg, _arguments || [])).next());
     });
 };
+import { useApolloClient } from '@apollo/client/react';
 import { publicApi } from '@cee-eng/hydrajs';
 import { Button, Dropdown, DropdownItem, DropdownList, Flex, FlexItem, MenuToggle, Modal, ModalBody, ModalFooter, ModalHeader, Spinner, TextArea, } from '@patternfly/react-core';
 import { ToastNotification, useFetch } from '@rh-support/components';
@@ -21,10 +22,8 @@ import map from 'lodash/map';
 import React, { useContext, useEffect, useReducer, useRef, useState } from 'react';
 import { Trans, useTranslation } from 'react-i18next';
 import { useCaseDispatch, useCaseSelector } from '../../context/CaseContext';
-import { useCaseDetailsPageStateContext } from '../../context/CaseDetailsPageContext';
-import { useCaseDiscussionTabDispatchContext, useCaseDiscussionTabStateContext, } from '../../context/CaseDiscussionTabContext';
+import { GET_CASE_COMMENTS } from '../../hooks/useCaseComments';
 import { useCaseUpdateErrorMessage } from '../../hooks/useCaseUpdateErrorMessage';
-import { updateDiscussionStateComments } from '../../reducers/CaseDiscussionTabReducer';
 import { getNewSeverityStringDef, getSeverityDescription } from '../../reducers/CaseHelpers';
 import { caseOverviewReducer, initialCaseViewState, setSeverityUpdating } from '../../reducers/CaseOverviewReducer';
 import { checkForCaseStatusToggleOnAttachOrComment, setCaseState, updateCaseDetails } from '../../reducers/CaseReducer';
@@ -40,12 +39,10 @@ export default function UpdateSeverityModal(props) {
     const [isUpdateClickedToShowError, setIsUpdateClickedToShowError] = useState(false);
     const [isSeverityInValid, setIsSeverityInValid] = useState(false);
     const [seviritiesOptions, setSeveritiesOptions] = useState([]);
+    const client = useApolloClient();
     const { request: postCommentRequest, isFetching: isPostingComment } = useFetch(publicApi.kase.postComment, {
         propgateErrors: true,
     });
-    const { caseDetailsPageState: { caseFeedbacksHydra }, } = useCaseDetailsPageStateContext();
-    const dispatchDiscussion = useCaseDiscussionTabDispatchContext();
-    const { sort, allDiscussions, discussionFiltersListState } = useCaseDiscussionTabStateContext();
     const { globalMetadataState: { allCaseSeverities, allProducts, loggedInUserRights }, } = useContext(GlobalMetadataStateContext);
     const caseState = useCaseSelector((state) => ({
         caseDetails: {
@@ -247,7 +244,7 @@ export default function UpdateSeverityModal(props) {
             setDescriptionValue(descriptionValue === null || descriptionValue === void 0 ? void 0 : descriptionValue.trim());
         }
         finally {
-            yield updateDiscussionStateComments(dispatchDiscussion, caseDispatch, caseDetails.caseNumber, allDiscussions, sort, caseFeedbacksHydra.data, discussionFiltersListState);
+            yield client.refetchQueries({ include: [GET_CASE_COMMENTS] });
             setIsUpdateClickedToShowError(false);
             setDescriptionValue('');
         }

package/lib/esm/components/shared/usePostComment.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"usePostComment.d.ts","sourceRoot":"","sources":["../../../../src/components/shared/usePostComment.tsx"],"names":[],"mappings":"AACA,OAAO,EAAE,mBAAmB,EAAE,MAAM,yCAAyC,CAAC;AAW9E,wBAAgB,cAAc,CAAC,EAAE,UAAU,EAAE;;CAAA;2FAgBtC,IAAI,CAAC,mBAAmB,EAAE,aAAa,GAAG,aAAa,GAAG,mBAAmB,CAAC,GAAG;QAChF,qBAAqB,EAAE,OAAO,CAAC;KAClC;;EAwBJ"}
+{"version":3,"file":"usePostComment.d.ts","sourceRoot":"","sources":["../../../../src/components/shared/usePostComment.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAE,mBAAmB,EAAE,MAAM,yCAAyC,CAAC;AAK9E,wBAAgB,cAAc,CAAC,EAAE,UAAU,EAAE;;CAAA;2FAWtC,IAAI,CAAC,mBAAmB,EAAE,aAAa,GAAG,aAAa,GAAG,mBAAmB,CAAC,GAAG;QAChF,qBAAqB,EAAE,OAAO,CAAC;KAClC;;EAiBJ"}