@rh-support/troubleshoot 2.4.10-beta.8 → 2.5.1

package/lib/esm/components/Recommendations/RecommendationInfoBox.js

@@ -0,0 +1,28 @@
+import { Accordion, AccordionContent, AccordionItem, AccordionToggle, List, ListItem } from '@patternfly/react-core';
+import React, { useState } from 'react';
+import { Trans, useTranslation } from 'react-i18next';
+export const RecommendationInfoBox = () => {
+    const { t } = useTranslation();
+    const [isExpanded, setIsExpanded] = useState(true);
+    return (React.createElement(React.Fragment, null,
+        React.createElement(Accordion, { isBordered: true, asDefinitionList: false, className: "pf-v5-u-mb-md" },
+            React.createElement(AccordionItem, null,
+                React.createElement(AccordionToggle, { id: "recommendation-tips", isExpanded: isExpanded, onClick: () => setIsExpanded(!isExpanded) }, t('Tips for describing your problem')),
+                React.createElement(AccordionContent, { isHidden: !isExpanded },
+                    React.createElement("span", { className: "pf-v5-u-color-100" },
+                        React.createElement(Trans, null, "To expedite your case, include these details: ")),
+                    React.createElement(List, { className: "pf-v5-u-ml-lg recommendation-box-tips", style: { listStyleType: 'disc' } },
+                        React.createElement(ListItem, null,
+                            React.createElement(Trans, null, "Problem")),
+                        React.createElement(ListItem, null,
+                            React.createElement(Trans, null, "Steps you've taken")),
+                        React.createElement(ListItem, null,
+                            React.createElement(Trans, null, "Error Messages"))),
+                    React.createElement("span", { className: "pf-v5-u-color-100" },
+                        React.createElement(Trans, null, "Example:")),
+                    React.createElement("span", { className: "extra-tips-for-describing" },
+                        React.createElement(Trans, null,
+                            "I\u2019m unable to start the SSHD service receiving the error message ",
+                            React.createElement("br", null),
+                            "\"Bad yes/no argument for ShowPatchLevel parameter\u201D")))))));
+};

package/lib/esm/components/Recommendations/Recommendations.d.ts

@@ -1,8 +1,12 @@
+import React from 'react';
 import { RouteComponentProps } from 'react-router-dom';
 import { IRouteUrlParams } from '../../reducers/RouteConstNTypes';
 interface IProps {
     routeProps: RouteComponentProps<IRouteUrlParams>;
+    userSeenRecommendations?: (value: React.SetStateAction<boolean>) => void;
+    userClickedNextonRecommendationsValue?: boolean;
+    resultsRowRef: any;
 }
-export default function Recommendations(props: IProps): JSX.Element;
+export default function Recommendations(props: IProps): React.JSX.Element;
 export {};
 //# sourceMappingURL=Recommendations.d.ts.map

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

@@ -1 +1 @@
-{"version":3,"file":"Recommendations.d.ts","sourceRoot":"","sources":["../../../../src/components/Recommendations/Recommendations.tsx"],"names":[],"mappings":"AAsBA,OAAO,EAAE,mBAAmB,EAAa,MAAM,kBAAkB,CAAC;AAelE,OAAO,EAAoB,eAAe,EAAE,MAAM,iCAAiC,CAAC;AAWpF,UAAU,MAAM;IACZ,UAAU,EAAE,mBAAmB,CAAC,eAAe,CAAC,CAAC;CACpD;AAED,MAAM,CAAC,OAAO,UAAU,eAAe,CAAC,KAAK,EAAE,MAAM,eAwQpD"}
+{"version":3,"file":"Recommendations.d.ts","sourceRoot":"","sources":["../../../../src/components/Recommendations/Recommendations.tsx"],"names":[],"mappings":"AAqBA,OAAO,KAAkD,MAAM,OAAO,CAAC;AAEvE,OAAO,EAAE,mBAAmB,EAAE,MAAM,kBAAkB,CAAC;AAevD,OAAO,EAAoB,eAAe,EAAE,MAAM,iCAAiC,CAAC;AAYpF,UAAU,MAAM;IACZ,UAAU,EAAE,mBAAmB,CAAC,eAAe,CAAC,CAAC;IACjD,uBAAuB,CAAC,EAAE,CAAC,KAAK,EAAE,KAAK,CAAC,cAAc,CAAC,OAAO,CAAC,KAAK,IAAI,CAAC;IACzE,qCAAqC,CAAC,EAAE,OAAO,CAAC;IAChD,aAAa,EAAE,GAAG,CAAC;CACtB;AAED,MAAM,CAAC,OAAO,UAAU,eAAe,CAAC,KAAK,EAAE,MAAM,qBA4YpD"}

package/lib/esm/components/Recommendations/Recommendations.js

@@ -1,64 +1,69 @@
 import { pcm } from '@cee-eng/hydrajs';
-import { Pagination, PaginationVariant } from '@patternfly/react-core';
+import { Label, Pagination, PaginationVariant, Popover, Spinner } from '@patternfly/react-core';
+import InfoCircleIcon from '@patternfly/react-icons/dist/js/icons/info-circle-icon';
+import StarIcon from '@patternfly/react-icons/dist/js/icons/star-icon';
 import { LoadingDots, useDebounce, usePrevious } from '@rh-support/components';
-import { useGlobalStateContext } from '@rh-support/react-context';
-import { computeRecommendationAbstract, computeRecommendationTitle, formatDate, getConfigField, PCM_CONFIG_FIELD_TYPE, scrollIntoView, } from '@rh-support/utils';
+import { computeRecommendationAbstract, computeRecommendationTitle, dtmTrackEventRecommendationListingDisplayed, dtmTrackEventRecommendationListingItemClicked, formatDate, getRecommendationTitle, } from '@rh-support/utils';
 import differenceBy from 'lodash/differenceBy';
+import find from 'lodash/find';
 import isEmpty from 'lodash/isEmpty';
 import isEqual from 'lodash/isEqual';
 import map from 'lodash/map';
 import React, { useContext, useEffect, useRef, useState } from 'react';
 import { Trans } from 'react-i18next';
-import { useParams } from 'react-router-dom';
 import { useCaseDispatch, useCaseSelector } from '../../context/CaseContext';
 import { RecommendationDispatchContext, RecommendationStateContext } from '../../context/RecommendationContext';
 import { RouteContext } from '../../context/RouteContext';
 import { SessionRestoreDispatchContext, SessionRestoreStateContext } from '../../context/SessionRestoreContext';
 import { getRecommendationObject } from '../../reducers/CaseHelpers';
 import { setCaseRecommendations } from '../../reducers/CaseReducer';
-import { fetchRecommendations, fetchWatsonXRecommendations, RecommendationsConstants, setCurrentPage, setVisibleDocs, } from '../../reducers/RecommendationsReducer';
+import { fetchWatsonXRecommendations, RecommendationsConstants, setCurrentPage, setVisibleDocs, } from '../../reducers/RecommendationsReducer';
 import { AppRouteSections } from '../../reducers/RouteConstNTypes';
 import { createOrUpdateSessionResources, getSessResFromRec, getSessResFromRecs, } from '../../reducers/SessionRestoreReducer';
 import RouteUtils from '../../utils/routeUtils';
-import { ShowRank } from './ShowRank';
+import { RecommendationsLoader } from './RecommendationsLoader';
+import { WatsonxAiIcon } from './WatsonxAiIcon';
 const { SessionResourceSource, SessionResourceVisibility } = pcm.preCase.session;
 export default function Recommendations(props) {
     var _a, _b, _c;
-    const { product, version, environment, summary, caseResourceLinks } = useCaseSelector((state) => ({
+    const { product, version, environment, summary, caseResourceLinks, issue, ABTestVariation, cveWorkflowRecommendation, } = useCaseSelector((state) => ({
         product: state.caseDetails.product,
         version: state.caseDetails.version,
         environment: state.caseDetails.environment,
         summary: state.caseDetails.summary,
+        issue: state.caseDetails.issue,
         caseResourceLinks: state.caseDetails.caseResourceLinks,
+        ABTestVariation: state.ABTestVariation,
+        cveWorkflowRecommendation: state.cveWorkflowRecommendation,
     }), isEqual);
     const caseDispatch = useCaseDispatch();
-    // Use Case Number
-    const { caseNumber } = useParams();
-    const { globalMetadataState: { navBarRef, loggedInUsersAccount, pcmConfig }, } = useGlobalStateContext();
-    const { isFetchingRecommendationsFromWatsonX } = useCaseSelector((state) => ({
-        isFetchingRecommendationsFromWatsonX: state.isFetchingRecommendationsFromWatsonX,
-    }), isEqual);
-    const isSecureSupportAccount = loggedInUsersAccount.data.secureSupport;
     const { routeState: { activeSection }, } = useContext(RouteContext);
     const { sessionRestore: { activeSessionId, sessionResourceTracking }, } = useContext(SessionRestoreStateContext);
     const sessionRestoreDispatch = useContext(SessionRestoreDispatchContext);
-    const resultRowRef = useRef(null);
     const [pageSize, setPageSize] = useState(null);
     const { recommendationState } = useContext(RecommendationStateContext);
     const prevMainRecommendations = usePrevious((_a = recommendationState === null || recommendationState === void 0 ? void 0 : recommendationState.visibleDocs) !== null && _a !== void 0 ? _a : []);
-    const prevIsFetchingRecommendationsFromWatsonX = usePrevious(isFetchingRecommendationsFromWatsonX);
     const recommendationDispatch = useContext(RecommendationDispatchContext);
-    const isRerankEnabled = getConfigField(pcmConfig.data, 'isRerankEnabled', PCM_CONFIG_FIELD_TYPE.FEATURE_FLAG);
     const DEFAULTPAGESIZE = 8;
     const MAXROW = 24;
     const recPageSize = pageSize !== null && pageSize !== void 0 ? pageSize : DEFAULTPAGESIZE;
     const abortControllerRef = useRef(undefined);
-    const payload = { product, version, summary };
+    const payload = {
+        product: product,
+        version: version,
+        summary: summary,
+        description: issue, // we don't need to truncate to 20k as Watsonx max recs is 4000 done for us already
+    };
+    const isATestvariation = ABTestVariation === 'A';
+    const isBTestvariation = ABTestVariation === 'B' || isEmpty(ABTestVariation);
     const isRecSearchPayloadSame = isEqual(payload, recommendationState.prevRecommendationsBody);
     useEffect(() => {
         // currently due to the debounce we use after the page load leads to some delay in the disbaling of next button
         // since the state of the next button depends on the loading rec flag so we force the flag to be true every time the
         // rec section is rendered for the first time except the case when we won't make a new search since there was no change in the rec payload.
+        if (activeSection !== AppRouteSections.SUMMARIZE || !summary || isRecSearchPayloadSame) {
+            return;
+        }
         !isRecSearchPayloadSame &&
             recommendationDispatch({
                 type: RecommendationsConstants.setIsLoadingRecommendations,
@@ -71,10 +76,7 @@ export default function Recommendations(props) {
      * Also, log the newly presented resources on the session
      */
     useDebounce(() => {
-        if (activeSection !== AppRouteSections.SUMMARIZE ||
-            !summary ||
-            (isRecSearchPayloadSame &&
-                prevIsFetchingRecommendationsFromWatsonX === isFetchingRecommendationsFromWatsonX)) {
+        if (activeSection !== AppRouteSections.SUMMARIZE || isRecSearchPayloadSame) {
             return;
         }
         setCurrentPage(recommendationDispatch, 1);
@@ -88,9 +90,13 @@ export default function Recommendations(props) {
         // recreate a new AbortController for each call
         let controller = new AbortController();
         abortControllerRef.current = controller;
-        isFetchingRecommendationsFromWatsonX && !loggedInUsersAccount.data.secureSupport
-            ? fetchWatsonXRecommendations(recommendationDispatch, payload, MAXROW, recPageSize, 0, true, caseNumber, isSecureSupportAccount, queryFilters, controller.signal, isRerankEnabled)
-            : fetchRecommendations(recommendationDispatch, payload, MAXROW, recPageSize, 0, true, caseNumber, isSecureSupportAccount, queryFilters, controller.signal);
+        if (!isEmpty(issue) || !isEmpty(summary)) {
+            fetchWatsonXRecommendations(recommendationDispatch, payload, MAXROW, recPageSize, 0, true, queryFilters, controller.signal);
+            recommendationDispatch({
+                type: RecommendationsConstants.userViewedDocs,
+                payload: { userViewedDocs: true },
+            });
+        }
     }, [
         activeSection,
         environment,
@@ -99,10 +105,16 @@ export default function Recommendations(props) {
         sessionRestoreDispatch,
         summary,
         version,
+        issue,
         recommendationState.insightsKcsIds,
-        isFetchingRecommendationsFromWatsonX,
     ], 1000);
     useEffect(() => {
+        props.userSeenRecommendations && props.userSeenRecommendations(false); //reset userSeenRecommendations when recommendationState changes
+        // eslint-disable-next-line react-hooks/exhaustive-deps
+    }, [recommendationState.numFound]);
+    useEffect(() => {
+        if (recommendationState.isLoadingRecommendations)
+            return;
         const visibleRecs = [];
         recommendationState.visibleDocs.forEach((doc, i) => {
             visibleRecs.push(getRecommendationObject(doc, i));
@@ -111,9 +123,21 @@ export default function Recommendations(props) {
         if (newRecommendations.length > 0) {
             setCaseRecommendations(caseDispatch, recommendationState.visibleDocs, caseResourceLinks);
         }
-        createOrUpdateSessionResources(sessionRestoreDispatch, activeSessionId, sessionResourceTracking, SessionResourceSource.RECOMMENDATIONS, getSessResFromRecs(recommendationState.visibleDocs, SessionResourceVisibility.PRESENTED), JSON.stringify(payload));
+        createOrUpdateSessionResources(sessionRestoreDispatch, activeSessionId, sessionResourceTracking, SessionResourceSource.RECOMMENDATIONS, getSessResFromRecs(recommendationState.visibleDocs, SessionResourceVisibility.PRESENTED, pageSize || DEFAULTPAGESIZE, recommendationState.currentPage || 1), typeof payload === 'string' ? payload : JSON.stringify(payload));
+        const listing = recommendationState.visibleDocs.map((doc, i) => ({
+            content: {
+                contentID: doc.id,
+                contentPosition: i + 1,
+                contentTitle: doc.publishedTitle,
+                contentUrl: doc.view_uri,
+                displayFeature: 'Troubleshooting',
+                displayFeatureTitle: '',
+            },
+            isDisplayed: true,
+        }));
+        dtmTrackEventRecommendationListingDisplayed('middle', activeSection, listing, recommendationState.numFound);
         // eslint-disable-next-line react-hooks/exhaustive-deps
-    }, [caseDispatch, recommendationState.visibleDocs, caseResourceLinks, activeSessionId]);
+    }, [caseDispatch, recommendationState.visibleDocs, activeSessionId]);
     useEffect(() => {
         // added the numFound !-==0 for when user click on back/continue button and we have no solution result
         // in this case we don't want to scroll to start of the solution result div
@@ -128,7 +152,6 @@ export default function Recommendations(props) {
     };
     const onPaginationChange = () => {
         const p = recommendationState.currentPage;
-        scrollIntoView(resultRowRef, { navBarRef, timeout: 0, onlyIfNotInViewport: true, offset: 30 });
         const visDocs = recommendationState.allDocs.slice((p - 1) * recPageSize, (p - 1) * recPageSize + recPageSize);
         setVisibleDocs(recommendationDispatch, visDocs);
     };
@@ -137,32 +160,78 @@ export default function Recommendations(props) {
         setCurrentPage(recommendationDispatch, 1);
     };
     const onResourceClick = (doc, index) => (event) => {
-        createOrUpdateSessionResources(sessionRestoreDispatch, activeSessionId, sessionResourceTracking, SessionResourceSource.RECOMMENDATIONS, [getSessResFromRec(doc, SessionResourceVisibility.VISITED, index)], JSON.stringify(payload));
+        const rank = index + 1 + (pageSize || DEFAULTPAGESIZE) * ((recommendationState.currentPage || 1) - 1);
+        createOrUpdateSessionResources(sessionRestoreDispatch, activeSessionId, sessionResourceTracking, SessionResourceSource.RECOMMENDATIONS, [
+            getSessResFromRec(doc, SessionResourceVisibility.VISITED, index + 1 + (pageSize || DEFAULTPAGESIZE) * ((recommendationState.currentPage || 1) - 1)),
+        ], typeof payload === 'string' ? payload : JSON.stringify(payload));
+        dtmTrackEventRecommendationListingItemClicked(window.location.href, activeSection, 'middle', doc.id, rank, doc.allTitle, doc.view_uri, 'Main Recommendation', 'Live search results powered by OpenShift AI');
+    };
+    const infoPopover = (React.createElement(Popover, { triggerAction: "hover", "aria-label": "Hoverable popover", headerContent: React.createElement("div", null,
+            React.createElement(Trans, null, "Powered by Openshift AI")), bodyContent: React.createElement("div", null,
+            React.createElement(Trans, null, "These articles have been selected based on the information provided."),
+            React.createElement("br", null)) },
+        React.createElement(InfoCircleIcon, { color: "white" })));
+    function getRankPercentage(decimal) {
+        return Math.round(decimal * 100);
+    }
+    const computeLabel = (recommendationDoc) => {
+        const { rerank_score } = recommendationDoc;
+        const title = getRecommendationTitle(recommendationDoc);
+        const isCveExist = !isEmpty(find(cveWorkflowRecommendation, (cveW) => (cveW === null || cveW === void 0 ? void 0 : cveW.title) === title));
+        const percentage = getRankPercentage(rerank_score);
+        return (React.createElement(React.Fragment, null,
+            (percentage >= 80 || isCveExist) && (React.createElement(Label, { color: "green", className: "match-label", icon: React.createElement(StarIcon, null) }, isCveExist ? 'Exact match' : 'Best match')),
+            !isCveExist && (React.createElement(Label, { className: "match-label", color: "purple" },
+                percentage,
+                "% Match"))));
     };
     return (React.createElement(React.Fragment, null,
-        React.createElement(LoadingDots, { show: recommendationState.isLoadingRecommendations && !isEmpty(summary) }),
-        React.createElement("div", { className: "recommendation-list pf-u-mt-lg", ref: resultRowRef },
-            React.createElement("ul", { className: "list-flat" }, map(recommendationState.visibleDocs, (doc, i) => {
+        isBTestvariation && (React.createElement(LoadingDots, { className: "recommendation-loading-dots", show: recommendationState.isLoadingRecommendations && !isEmpty(summary) })),
+        React.createElement("div", { className: "recommendation-list pf-v5-u-pt-md", ref: props.resultsRowRef },
+            isATestvariation
+                ? (recommendationState.visibleDocs.length !== 0 ||
+                    recommendationState.isLoadingRecommendations) && (React.createElement("div", { className: `${recommendationState.isLoadingRecommendations ? 'gradient' : ''} label-container-icon` },
+                    React.createElement(Label, { id: "DeepPurpleColorAILabel", className: "pf-v5-u-mb-md" },
+                        recommendationState.isLoadingRecommendations ? (React.createElement(React.Fragment, null,
+                            React.createElement(Spinner, { size: "sm", className: "pf-v5-u-mr-xs" }),
+                            ' ',
+                            React.createElement(Trans, null,
+                                recommendationState.visibleDocs.length
+                                    ? 'Updating recommendations '
+                                    : 'Recommending articles ',
+                                "using OpenShift AI"),
+                            ' ',
+                            React.createElement(InfoCircleIcon, { color: "white" }))) : (React.createElement(React.Fragment, null,
+                            React.createElement(WatsonxAiIcon, { fillColor: "#FFFFFF", className: "pf-v5-u-mr-xs" }),
+                            ' ',
+                            React.createElement(Trans, null, "Articles recommended by OpenShift AI"),
+                            " ",
+                            infoPopover)),
+                        ' ')))
+                : recommendationState.visibleDocs.length !== 0 && (React.createElement(Label, { color: "purple", className: "pf-v5-u-mb-md" },
+                    React.createElement(WatsonxAiIcon, { fillColor: "#6753ac", className: "pf-v5-u-mr-xs" }),
+                    React.createElement(Trans, null, "Live search results powered by OpenShift AI"))),
+            isATestvariation && recommendationState.isLoadingRecommendations ? (React.createElement(RecommendationsLoader, null)) : (React.createElement("ul", { className: "list-flat" }, map(recommendationState.visibleDocs, (doc, i) => {
                 var _a, _b;
                 return (React.createElement("li", { className: "result", key: doc.id },
                     React.createElement("header", { className: "result-header" },
                         React.createElement("a", { href: `${doc.view_uri}?${RouteUtils.getSEResourceQueryParams(activeSessionId, (_b = (_a = sessionResourceTracking[SessionResourceSource.RECOMMENDATIONS]) === null || _a === void 0 ? void 0 : _a.resourceOriginId) !== null && _b !== void 0 ? _b : '', SessionResourceSource.RECOMMENDATIONS)}`, className: "se-recommended ts-result", "data-tracking-id": `se-recommended-main-recommendations-${i}`, rel: "noopener noreferrer", target: "_blank", onClick: onResourceClick(doc, i), dangerouslySetInnerHTML: computeRecommendationTitle(doc) }),
                         React.createElement("div", { className: "header-meta" },
+                            isATestvariation && doc.rerank_score && computeLabel(doc),
                             doc.kcsState === 'verified' && (React.createElement(React.Fragment, null,
-                                React.createElement("span", { className: "status-verified" }, "verified"),
+                                React.createElement("span", { className: "status-verified pf-v5-u-font-weight-bold pf-v5-u-success-color-100" }, "verified"),
                                 React.createElement("span", { className: "list-separator" }, "\u2013"))),
                             React.createElement("span", { className: "meta" }, doc.documentKind),
                             React.createElement("span", { className: "list-separator" }, "\u2013"),
                             React.createElement("time", { className: "moment_date meta", title: doc.lastModifiedDate.toString() }, formatDate(doc.lastModifiedDate)))),
-                    isFetchingRecommendationsFromWatsonX && (React.createElement(ShowRank, { index: i, originalRank: doc.original_rank, routeProps: props.routeProps, perPage: recPageSize, pageNo: recommendationState.currentPage })),
                     React.createElement("p", { className: "result-body", dangerouslySetInnerHTML: computeRecommendationAbstract(doc, 300) })));
-            })),
+            }))),
             recommendationState.numFound !== 0 && recommendationState.numFound > DEFAULTPAGESIZE && (React.createElement("div", { className: "pagination-footer" },
                 React.createElement(Pagination, { className: "push-top", itemCount: (_c = (_b = recommendationState.allDocs) === null || _b === void 0 ? void 0 : _b.length) !== null && _c !== void 0 ? _c : 0, perPage: recPageSize, page: recommendationState.currentPage, variant: PaginationVariant.bottom, onSetPage: pageChanged, dropDirection: "up", onPerPageSelect: onPageSizeChanged })))),
-        recommendationState.visibleDocs.length === 0 &&
+        recommendationState.numFound === 0 &&
             !recommendationState.isLoadingRecommendations &&
             !recommendationState.isLoadingRecommendationsError &&
-            !isEmpty(summary) &&
-            !isEmpty(prevMainRecommendations) && (React.createElement("p", null,
+            !isEmpty(issue) &&
+            isEmpty(prevMainRecommendations) && (React.createElement("p", null,
             React.createElement(Trans, null, "We couldn't find any matches. Revise your search for better results.")))));
 }

package/lib/esm/components/Recommendations/RecommendationsLoader.d.ts

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

package/lib/esm/components/Recommendations/RecommendationsLoader.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"RecommendationsLoader.d.ts","sourceRoot":"","sources":["../../../../src/components/Recommendations/RecommendationsLoader.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,MAAM,OAAO,CAAC;AAE1B,eAAO,MAAM,qBAAqB,yBAejC,CAAC"}

package/lib/esm/components/Recommendations/RecommendationsLoader.js

@@ -0,0 +1,11 @@
+import { Skeleton } from '@patternfly/react-core';
+import React from 'react';
+export const RecommendationsLoader = () => {
+    return (React.createElement("div", { className: "pf-v5-u-mt-md" }, [...Array(5)].map((_, i) => (React.createElement(React.Fragment, { key: `recommendation-loading-${i}` },
+        React.createElement(Skeleton, { height: "20px", width: "100%" }),
+        React.createElement("br", null),
+        React.createElement(Skeleton, { height: "45px", width: "100%" }),
+        React.createElement("br", null),
+        React.createElement("br", null),
+        React.createElement("br", null))))));
+};

package/lib/esm/components/Recommendations/RulesModal.d.ts

@@ -1,3 +1,4 @@
+import React from 'react';
 import { IExtendedRule } from '../../reducers/RulesReducer';
 import { ISOSReportRecommendation } from './InsightsResults';
 interface IProps {
@@ -7,6 +8,6 @@ interface IProps {
     onModalToggle: () => any;
     isRenderedMain?: boolean;
 }
-export declare function InsightResultModal(props: IProps): JSX.Element;
+export declare function InsightResultModal(props: IProps): React.JSX.Element;
 export {};
 //# sourceMappingURL=RulesModal.d.ts.map

package/lib/esm/components/Recommendations/RulesModal.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"RulesModal.d.ts","sourceRoot":"","sources":["../../../../src/components/Recommendations/RulesModal.tsx"],"names":[],"mappings":"AAmBA,OAAO,EAAE,aAAa,EAAE,MAAM,6BAA6B,CAAC;AAI5D,OAAO,EAAE,wBAAwB,EAAE,MAAM,mBAAmB,CAAC;AAG7D,UAAU,MAAM;IACZ,cAAc,EAAE,wBAAwB,EAAE,CAAC;IAC3C,MAAM,EAAE,OAAO,CAAC;IAChB,MAAM,EAAE,aAAa,EAAE,CAAC;IACxB,aAAa,EAAE,MAAM,GAAG,CAAC;IACzB,cAAc,CAAC,EAAE,OAAO,CAAC;CAC5B;AAED,wBAAgB,kBAAkB,CAAC,KAAK,EAAE,MAAM,eA8M/C"}
+{"version":3,"file":"RulesModal.d.ts","sourceRoot":"","sources":["../../../../src/components/Recommendations/RulesModal.tsx"],"names":[],"mappings":"AAaA,OAAO,KAA0C,MAAM,OAAO,CAAC;AAM/D,OAAO,EAAE,aAAa,EAAE,MAAM,6BAA6B,CAAC;AAG5D,OAAO,EAAE,wBAAwB,EAAE,MAAM,mBAAmB,CAAC;AAI7D,UAAU,MAAM;IACZ,cAAc,EAAE,wBAAwB,EAAE,CAAC;IAC3C,MAAM,EAAE,OAAO,CAAC;IAChB,MAAM,EAAE,aAAa,EAAE,CAAC;IACxB,aAAa,EAAE,MAAM,GAAG,CAAC;IACzB,cAAc,CAAC,EAAE,OAAO,CAAC;CAC5B;AAED,wBAAgB,kBAAkB,CAAC,KAAK,EAAE,MAAM,qBA2M/C"}

package/lib/esm/components/Recommendations/RulesModal.js

@@ -14,16 +14,14 @@ import { getResTypeFromUrl } from '@rh-support/utils';
 import React, { useContext, useEffect, useState } from 'react';
 import { Trans, useTranslation } from 'react-i18next';
 import { useCaseDispatch } from '../../context/CaseContext';
-import { SessionRestoreDispatchContext, SessionRestoreStateContext } from '../../context/SessionRestoreContext';
+import { SessionRestoreStateContext } from '../../context/SessionRestoreContext';
 import { setCaseState } from '../../reducers/CaseReducer';
-import { createOrUpdateSessionResources, getSessResFromRecs } from '../../reducers/SessionRestoreReducer';
 import { AttachmentStateContext } from '../shared/fileUpload/reducer/AttachmentReducerContext';
 import { EARuleInfoAccordion } from './EARules/EARuleInfoAccordion';
 import { InsightsRuleInfo } from './InsightsRuleInfo';
 import { RecommendationFeedbackModal } from './RecommendationFeedbackModal';
 export function InsightResultModal(props) {
     const { t } = useTranslation();
-    const sessionRestoreDispatch = useContext(SessionRestoreDispatchContext);
     const potentialDuplicate = {};
     props.insightResults.map((value) => {
         if (potentialDuplicate.hasOwnProperty(value.id)) {
@@ -38,7 +36,7 @@ export function InsightResultModal(props) {
     });
     const { attachmentState: { caseFiles: { selectedLocalFiles }, }, } = useContext(AttachmentStateContext);
     const [canShowNewTag, setCanShowNewTag] = useState(false);
-    const { SessionResourceSource, SessionResourceVisibility } = pcm.preCase.session;
+    const { SessionResourceSource } = pcm.preCase.session;
     const { request: resolveSessionRequest, isFetching } = useFetch(pcm.preCase.session.resolveSession);
     const { sessionRestore: { activeSessionId, sessionResourceTracking }, } = useContext(SessionRestoreStateContext);
     const [isModalVisible, setIsModalVisible] = useState(false);
@@ -67,11 +65,6 @@ export function InsightResultModal(props) {
     const onExpand = (event, id) => {
         setIsExpanded(!isExpanded);
     };
-    useEffect(() => {
-        props.isOpen &&
-            createOrUpdateSessionResources(sessionRestoreDispatch, activeSessionId, sessionResourceTracking, SessionResourceSource.INSIGHTS, getSessResFromRecs(props.insightResults, SessionResourceVisibility.PRESENTED));
-        // eslint-disable-next-line react-hooks/exhaustive-deps
-    }, [props.insightResults, activeSessionId, props.isOpen]);
     useEffect(() => {
         let total = props.EARule.length;
         let trueValues = 0;
@@ -95,21 +88,22 @@ export function InsightResultModal(props) {
     }, [selectedLocalFiles, props.EARule]);
     if (props.isRenderedMain) {
         setCaseState(caseDispatch, { isFileRecommendationsTriggered: true });
-        return (React.createElement(Card, { id: "expandable-card", className: "card-support top-recommendations pf-u-mt-md", isExpanded: isExpanded, isCompact: true },
+        return (React.createElement(Card, { id: "expandable-card", className: "card-support top-recommendations pf-v5-u-mt-md", isExpanded: isExpanded, isCompact: true },
             React.createElement(CardHeader, { onExpand: onExpand, toggleButtonProps: {
                     id: 'toggle-button1',
                     'aria-label': t('File recommendations'),
                     'aria-labelledby': 'expandable-card-title toggle-button1',
                     'aria-expanded': isExpanded,
+                    className: 'popular-solutions-toggle-button',
                 }, className: "popular-solutions" },
                 React.createElement(CardTitle, { id: "expandable-card-title", className: "card-title" },
                     React.createElement(Trans, null, "File recommendations"))),
             React.createElement(CardExpandableContent, null,
                 React.createElement(CardBody, { className: "file-recommendation", "data-tracking-id": "file-recommendation-tracking-id" },
                     React.createElement(Accordion, { headingLevel: "h5", asDefinitionList: false, isBordered: true },
-                        props.insightResults.map((doc) => (React.createElement(InsightsRuleInfo, { duplicateKeys: duplicateKeys, showNewTag: canShowNewTag, key: doc.id + doc.attachmentId, doc: doc }))),
+                        props.insightResults.map((doc, index) => (React.createElement(InsightsRuleInfo, { duplicateKeys: duplicateKeys, showNewTag: canShowNewTag, key: doc.id + doc.attachmentId, doc: doc, rank: index + 1 }))),
                         props.EARule.length > 0 &&
-                            props.EARule.map((rule, index) => (React.createElement(EARuleInfoAccordion, { showNewTag: canShowNewTag, key: `${index}_eaRule`, rule: rule }))))))));
+                            props.EARule.map((rule, index) => (React.createElement(EARuleInfoAccordion, { showNewTag: canShowNewTag, key: `${index}_eaRule`, rule: rule, rank: index + props.insightResults.length + 1 }))))))));
     }
     return (React.createElement(React.Fragment, null,
         React.createElement(RecommendationFeedbackModal, { isModalOpen: isModalVisible, handleModalToggle: onModalToggle, modalContent: t(`Great, we're glad that resolved your issue`) }),
@@ -121,7 +115,7 @@ export function InsightResultModal(props) {
                 React.createElement(Button, { onClick: props.onModalToggle, key: "confirm", variant: "secondary", "data-tracking-id": "cancel-critical-solutions-modal" }, t('Cancel')),
             ] },
             React.createElement(Accordion, { className: "push-top-narrow rules-modal-items", headingLevel: "h2", asDefinitionList: false, isBordered: true },
-                props.insightResults.map((doc) => (React.createElement(InsightsRuleInfo, { duplicateKeys: duplicateKeys, showNewTag: canShowNewTag, key: doc.id + doc.attachmentId, doc: doc }))),
+                props.insightResults.map((doc, index) => (React.createElement(InsightsRuleInfo, { duplicateKeys: duplicateKeys, showNewTag: canShowNewTag, key: doc.id + doc.attachmentId, doc: doc, rank: index + 1 }))),
                 props.EARule.length > 0 &&
-                    props.EARule.map((rule, index) => (React.createElement(EARuleInfoAccordion, { showNewTag: canShowNewTag, key: `${index}_eaRule`, rule: rule })))))));
+                    props.EARule.map((rule, index) => (React.createElement(EARuleInfoAccordion, { showNewTag: canShowNewTag, key: `${index}_eaRule`, rule: rule, rank: index + props.insightResults.length + 1 })))))));
 }

package/lib/esm/components/Recommendations/WatsonxAiIcon.d.ts

@@ -0,0 +1,10 @@
+import React from 'react';
+interface IconProps {
+    width?: number;
+    height?: number;
+    fillColor?: string;
+    className?: string;
+}
+export declare const WatsonxAiIcon: (props: IconProps) => React.JSX.Element;
+export {};
+//# sourceMappingURL=WatsonxAiIcon.d.ts.map

package/lib/esm/components/Recommendations/WatsonxAiIcon.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"WatsonxAiIcon.d.ts","sourceRoot":"","sources":["../../../../src/components/Recommendations/WatsonxAiIcon.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAE1B,UAAU,SAAS;IACf,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,SAAS,CAAC,EAAE,MAAM,CAAC;CACtB;AAED,eAAO,MAAM,aAAa,UAAW,SAAS,sBA4B7C,CAAC"}

package/lib/esm/components/Recommendations/WatsonxAiIcon.js

@@ -0,0 +1,13 @@
+import React from 'react';
+export const WatsonxAiIcon = (props) => {
+    const { width = 32, height = 32 } = props;
+    const viewBox = '0 0 ' + width + ' ' + height;
+    return (React.createElement("svg", { xmlns: "http://www.w3.org/2000/svg", viewBox: viewBox, width: width, height: height, className: `pf-v5-svg ${props.className}` },
+        React.createElement("g", null,
+            React.createElement("g", { fill: props.fillColor },
+                React.createElement("path", { d: "m26,24c-1.1046,0-2,.8954-2,2,0,.0764.0142.1488.0225.2229-2.2808,1.7963-5.0792,2.7771-8.0225,2.7771-4.2617,0-8-3.9722-8-8.5,0-4.687,3.813-8.5,8.5-8.5h.5v-2h-.5c-5.7896,0-10.5,4.7104-10.5,10.5,0,1.8839.5304,3.6896,1.4371,5.2565-2.7133-2.3843-4.4371-5.869-4.4371-9.7565,0-2.1152.4917-4.1328,1.4619-5.9956l-1.7744-.9238c-1.104,2.1211-1.6875,4.5137-1.6875,6.9194,0,8.271,6.729,15,15,15,3.3744,0,6.5818-1.1193,9.2048-3.1662.244.106.5123.1662.7952.1662,1.1046,0,2-.8954,2-2s-.8954-2-2-2Z" }),
+                React.createElement("rect", { x: "11", y: "20", width: "2", height: "2", transform: "translate(33 9) rotate(90)" }),
+                React.createElement("rect", { x: "19", y: "10", width: "2", height: "2", transform: "translate(31 -9) rotate(90)" }),
+                React.createElement("path", { d: "m16,1c-3.3744,0-6.5818,1.1193-9.2048,3.1662-.244-.106-.5123-.1662-.7952-.1662-1.1046,0-2,.8954-2,2s.8954,2,2,2,2-.8954,2-2c0-.0764-.0142-.1488-.0225-.2229,2.2808-1.7963,5.0792-2.7771,8.0225-2.7771,4.2617,0,8,3.9722,8,8.5,0,4.687-3.813,8.5-8.5,8.5h-.5v2h.5c5.7896,0,10.5-4.7104,10.5-10.5,0-1.8853-.5322-3.6917-1.4401-5.2593,2.715,2.3843,4.4401,5.8704,4.4401,9.7593,0,2.1152-.4917,4.1328-1.4619,5.9956l1.7744.9238c1.104-2.1211,1.6875-4.5137,1.6875-6.9194C31,7.729,24.271,1,16,1Z" })),
+            React.createElement("rect", { fill: "none", id: "_Transparent_Rectangle_", "data-name": "<Transparent Rectangle>", width: "32", height: "32" }))));
+};

package/lib/esm/components/RemoteRider/RemoteRiderAcceptanceModal.d.ts

@@ -1,5 +1,6 @@
 import { IApiResponseDetails } from '@rh-support/types/shared';
 import { UserAuth } from '@rh-support/user-permissions';
+import React from 'react';
 interface IProps {
     isModalOpen: boolean;
     onModalClose?: () => void;
@@ -9,6 +10,6 @@ interface IProps {
     caseNumber: string;
     loggedInUserRights: IApiResponseDetails<UserAuth>;
 }
-export default function RemoteRiderAcceptanceModal(props: IProps): JSX.Element;
+export default function RemoteRiderAcceptanceModal(props: IProps): React.JSX.Element;
 export {};
 //# sourceMappingURL=RemoteRiderAcceptanceModal.d.ts.map

package/lib/esm/components/RemoteRider/RemoteRiderAcceptanceModal.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"RemoteRiderAcceptanceModal.d.ts","sourceRoot":"","sources":["../../../../src/components/RemoteRider/RemoteRiderAcceptanceModal.tsx"],"names":[],"mappings":"AAGA,OAAO,EAAE,mBAAmB,EAAE,MAAM,0BAA0B,CAAC;AAC/D,OAAO,EAAE,QAAQ,EAAE,MAAM,8BAA8B,CAAC;AAKxD,UAAU,MAAM;IACZ,WAAW,EAAE,OAAO,CAAC;IACrB,YAAY,CAAC,EAAE,MAAM,IAAI,CAAC;IAC1B,SAAS,EAAE,MAAM,IAAI,CAAC;IACtB,SAAS,EAAE,MAAM,IAAI,CAAC;IACtB,iBAAiB,CAAC,EAAE,OAAO,CAAC;IAC5B,UAAU,EAAE,MAAM,CAAC;IACnB,kBAAkB,EAAE,mBAAmB,CAAC,QAAQ,CAAC,CAAC;CACrD;AAED,MAAM,CAAC,OAAO,UAAU,0BAA0B,CAAC,KAAK,EAAE,MAAM,eAsD/D"}
+{"version":3,"file":"RemoteRiderAcceptanceModal.d.ts","sourceRoot":"","sources":["../../../../src/components/RemoteRider/RemoteRiderAcceptanceModal.tsx"],"names":[],"mappings":"AAGA,OAAO,EAAE,mBAAmB,EAAE,MAAM,0BAA0B,CAAC;AAC/D,OAAO,EAAE,QAAQ,EAAE,MAAM,8BAA8B,CAAC;AAExD,OAAO,KAAqB,MAAM,OAAO,CAAC;AAG1C,UAAU,MAAM;IACZ,WAAW,EAAE,OAAO,CAAC;IACrB,YAAY,CAAC,EAAE,MAAM,IAAI,CAAC;IAC1B,SAAS,EAAE,MAAM,IAAI,CAAC;IACtB,SAAS,EAAE,MAAM,IAAI,CAAC;IACtB,iBAAiB,CAAC,EAAE,OAAO,CAAC;IAC5B,UAAU,EAAE,MAAM,CAAC;IACnB,kBAAkB,EAAE,mBAAmB,CAAC,QAAQ,CAAC,CAAC;CACrD;AAED,MAAM,CAAC,OAAO,UAAU,0BAA0B,CAAC,KAAK,EAAE,MAAM,qBAsD/D"}

package/lib/esm/components/RemoteRider/RemoteRiderBanner.d.ts

@@ -1,5 +1,6 @@
 import { IApiResponseDetails } from '@rh-support/types/shared';
 import { UserAuth } from '@rh-support/user-permissions';
+import React from 'react';
 interface IProps {
     onConfirm: () => void;
     onClose: () => void;
@@ -7,6 +8,6 @@ interface IProps {
     isSecureSupport: boolean;
     loggedInUserRights: IApiResponseDetails<UserAuth>;
 }
-export declare function RemoteRiderBanner(props: IProps): JSX.Element;
+export declare function RemoteRiderBanner(props: IProps): React.JSX.Element;
 export {};
 //# sourceMappingURL=RemoteRiderBanner.d.ts.map

package/lib/esm/components/RemoteRider/RemoteRiderBanner.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"RemoteRiderBanner.d.ts","sourceRoot":"","sources":["../../../../src/components/RemoteRider/RemoteRiderBanner.tsx"],"names":[],"mappings":"AAGA,OAAO,EAAE,mBAAmB,EAAE,MAAM,0BAA0B,CAAC;AAC/D,OAAO,EAAE,QAAQ,EAAE,MAAM,8BAA8B,CAAC;AAOxD,UAAU,MAAM;IACZ,SAAS,EAAE,MAAM,IAAI,CAAC;IACtB,OAAO,EAAE,MAAM,IAAI,CAAC;IACpB,UAAU,EAAE,MAAM,CAAC;IACnB,eAAe,EAAE,OAAO,CAAC;IACzB,kBAAkB,EAAE,mBAAmB,CAAC,QAAQ,CAAC,CAAC;CACrD;AAMD,wBAAgB,iBAAiB,CAAC,KAAK,EAAE,MAAM,eAmF9C"}
+{"version":3,"file":"RemoteRiderBanner.d.ts","sourceRoot":"","sources":["../../../../src/components/RemoteRider/RemoteRiderBanner.tsx"],"names":[],"mappings":"AAGA,OAAO,EAAE,mBAAmB,EAAE,MAAM,0BAA0B,CAAC;AAC/D,OAAO,EAAE,QAAQ,EAAE,MAAM,8BAA8B,CAAC;AACxD,OAAO,KAAmB,MAAM,OAAO,CAAC;AAMxC,UAAU,MAAM;IACZ,SAAS,EAAE,MAAM,IAAI,CAAC;IACtB,OAAO,EAAE,MAAM,IAAI,CAAC;IACpB,UAAU,EAAE,MAAM,CAAC;IACnB,eAAe,EAAE,OAAO,CAAC;IACzB,kBAAkB,EAAE,mBAAmB,CAAC,QAAQ,CAAC,CAAC;CACrD;AAMD,wBAAgB,iBAAiB,CAAC,KAAK,EAAE,MAAM,qBAmF9C"}

package/lib/esm/components/RemoteRider/RemoteRiderBanner.js

@@ -33,7 +33,7 @@ export function RemoteRiderBanner(props) {
         setIsRemoteRiderModalVisible(false);
     };
     return (React.createElement(React.Fragment, null,
-        React.createElement(Alert, { isInline: true, className: "pf-u-mb-md", variant: areTermsAccepted ? AlertVariant.success : AlertVariant.info, title: "Remote support", actionLinks: areTermsAccepted ? (React.createElement("a", { href: "/articles/3566571", target: "_blank", rel: "noopener noreferrer", "data-tracking-id": "remote-rider-kbase" },
+        React.createElement(Alert, { isInline: true, className: "pf-v5-u-mb-md", variant: areTermsAccepted ? AlertVariant.success : AlertVariant.info, title: "Remote support", actionLinks: areTermsAccepted ? (React.createElement("a", { href: "/articles/3566571", target: "_blank", rel: "noopener noreferrer", "data-tracking-id": "remote-rider-kbase" },
                 t('Learn how to join a remote session'),
                 " ",
                 React.createElement(ExternalLinkAltIcon, null))) : (React.createElement(React.Fragment, null,

package/lib/esm/components/Review/Review.d.ts

@@ -1,8 +1,9 @@
-import { RouteComponentProps } from 'react-router';
+import React from 'react';
+import { RouteComponentProps } from 'react-router-dom';
 import { IRouteUrlParams } from '../../reducers/RouteConstNTypes';
 interface IProps {
     routeProps: RouteComponentProps<IRouteUrlParams>;
 }
-export default function Review(props: IProps): JSX.Element;
+export default function Review(props: IProps): React.JSX.Element;
 export {};
 //# sourceMappingURL=Review.d.ts.map

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

@@ -1 +1 @@
-{"version":3,"file":"Review.d.ts","sourceRoot":"","sources":["../../../../src/components/Review/Review.tsx"],"names":[],"mappings":"AAOA,OAAO,EAAE,mBAAmB,EAAE,MAAM,cAAc,CAAC;AAInD,OAAO,EAAE,eAAe,EAAE,MAAM,iCAAiC,CAAC;AAuBlE,UAAU,MAAM;IACZ,UAAU,EAAE,mBAAmB,CAAC,eAAe,CAAC,CAAC;CACpD;AACD,MAAM,CAAC,OAAO,UAAU,MAAM,CAAC,KAAK,EAAE,MAAM,eAsE3C"}
+{"version":3,"file":"Review.d.ts","sourceRoot":"","sources":["../../../../src/components/Review/Review.tsx"],"names":[],"mappings":"AAMA,OAAO,KAAqB,MAAM,OAAO,CAAC;AAC1C,OAAO,EAAE,mBAAmB,EAAE,MAAM,kBAAkB,CAAC;AAIvD,OAAO,EAAE,eAAe,EAAE,MAAM,iCAAiC,CAAC;AAsBlE,UAAU,MAAM;IACZ,UAAU,EAAE,mBAAmB,CAAC,eAAe,CAAC,CAAC;CACpD;AACD,MAAM,CAAC,OAAO,UAAU,MAAM,CAAC,KAAK,EAAE,MAAM,qBAiF3C"}

package/lib/esm/components/Review/Review.js

@@ -1,4 +1,4 @@
-import { Flex, FlexItem } from '@patternfly/react-core';
+import { Grid, GridItem } from '@patternfly/react-core';
 import { useGlobalStateContext } from '@rh-support/react-context';
 import { AbilityContext, CaseDetailsFields, resourceActions, resources } from '@rh-support/user-permissions';
 import { isSpecialSupportOfferingEnabled } from '@rh-support/utils';
@@ -13,7 +13,6 @@ import CaseGroup from '../CaseInformation/CaseGroup';
 import CaseType from '../CaseInformation/CaseType';
 import { ContactPhoneNumber } from '../CaseInformation/ContactPhoneNumber';
 import { ContactPhoneNumberAlert } from '../CaseInformation/ContactPhoneNumberAlert';
-import Description from '../CaseInformation/Description';
 import Fts from '../CaseInformation/Fts';
 import Severity from '../CaseInformation/Severity';
 import SupportLevel from '../CaseInformation/SupportLevel';
@@ -31,9 +30,10 @@ import { EARuleWidget } from '../Recommendations/EARules/EARuleWidget';
 export default function Review(props) {
     var _a;
     const caseDispatch = useCaseDispatch();
-    const { contactInfo24x7, product } = useCaseSelector((state) => ({
+    const { contactInfo24x7, product, ABTestVariation } = useCaseSelector((state) => ({
         contactInfo24x7: state.caseDetails.contactInfo24x7,
         product: state.caseDetails.product,
+        ABTestVariation: state.ABTestVariation,
     }), isEqual);
     const ability = useContext(AbilityContext);
     const canSeeEmailNotifications = ability.can(resourceActions.PATCH, resources.CASE_DETAILS, CaseDetailsFields.CASE_DETAILS_SEND_NOTIFICATIONS);
@@ -42,29 +42,32 @@ export default function Review(props) {
     const onSeverityChange = (payload) => {
         setCaseDetails(caseDispatch, payload);
     };
+    const isBTestvariation = ABTestVariation === 'B' || isEmpty(ABTestVariation);
     // To check if the user is ESS Customer and Product has ESS Support
     const isESSCustomer = isSpecialSupportOfferingEnabled((_a = allProducts.data) === null || _a === void 0 ? void 0 : _a.productsResult, selectedProduct);
     return (React.createElement(React.Fragment, null,
-        React.createElement(EARuleWidget, null),
+        isBTestvariation && React.createElement(EARuleWidget, null),
         React.createElement("form", { className: "review-form card card-light push-bottom" },
             React.createElement(AccountSelector, null),
             React.createElement(OwnerSelector, null),
-            React.createElement(AllProductsSelector, { routeProps: props.routeProps, loadTCOnChange: true, showTCAfterButtonClicked: true, checkEntitledProduct: true }),
+            React.createElement(AllProductsSelector, { routeProps: props.routeProps, loadTCOnChange: true, showTCAfterButtonClicked: true, checkEntitledProduct: true, isOnReviewPage: true }),
             React.createElement(OpenShiftClusterId, null),
             React.createElement(Hostname, null),
-            React.createElement(Description, { inlineEditable: true, hideSaveCancel: true }),
             React.createElement(KtQuestions, { inlineEditable: true, hideSaveCancel: true }),
             React.createElement(CaseType, { hideIdea: true }),
             React.createElement(SupportLevel, null),
-            React.createElement(Flex, { direction: { default: 'column', '2xl': 'row' } },
-                React.createElement(FlexItem, { flex: { default: 'flex_1' }, className: "pf-u-mb-xl" },
+            React.createElement(Grid, { hasGutter: true },
+                React.createElement(GridItem, { span: 12, xl2: 6, className: "pf-v5-u-mb-xl" },
                     React.createElement(Severity, { showSeverityInfoIcon: true, onSeverityChange: onSeverityChange })),
-                React.createElement(FlexItem, { flex: { default: 'flex_1' }, className: "pf-u-mb-xl" },
+                React.createElement(GridItem, { span: 12, xl2: 6, className: "pf-v5-u-mb-xl" },
                     React.createElement(ContactPhoneNumber, null))),
             React.createElement(ContactPhoneNumberAlert, null),
             React.createElement(Fts, { inlineEditable: true, initialIsEditing: isEmpty(contactInfo24x7), hideSaveCancel: true }),
-            React.createElement(CaseLanguageSelector, null),
-            React.createElement(CaseGroup, null),
+            React.createElement(Grid, { hasGutter: true },
+                React.createElement(GridItem, { span: 12, xl2: 6, className: "pf-v5-u-mb-xs" },
+                    React.createElement(CaseLanguageSelector, null)),
+                React.createElement(GridItem, { span: 12, xl2: 6, className: "pf-v5-u-mb-xs" },
+                    React.createElement(CaseGroup, null))),
             canSeeEmailNotifications && React.createElement(CaseContactSelector, null),
             React.createElement(RHAssociatesSelector, null),
             React.createElement(OpenReferenceNumber, { inlineEditable: false, hideSaveCancel: true }),

package/lib/esm/components/SessionRestore/SessionItem.d.ts

@@ -1,8 +1,9 @@
 import { ISessionItem } from '@cee-eng/hydrajs/@types/api/pcm/troubleshootSession';
+import React from 'react';
 interface IProps {
     onRestore: (sessionItem: ISessionItem) => Promise<void>;
     sessionItem: ISessionItem;
 }
-export declare function SessionItem(props: IProps): JSX.Element;
+export declare function SessionItem(props: IProps): React.JSX.Element;
 export {};
 //# sourceMappingURL=SessionItem.d.ts.map