@rh-support/troubleshoot 2.7.1 → 2.7.10

package/lib/esm/components/TroubleshootSection/ResponseActions.js

@@ -0,0 +1,54 @@
+import OutlinedCopyIcon from '@patternfly/react-icons/dist/esm/icons/outlined-copy-icon';
+import OutlinedThumbsDownIcon from '@patternfly/react-icons/dist/esm/icons/outlined-thumbs-down-icon';
+import OutlinedThumbsUpIcon from '@patternfly/react-icons/dist/esm/icons/outlined-thumbs-up-icon';
+import React, { useEffect, useRef, useState } from 'react';
+import { useTranslation } from 'react-i18next';
+import ResponseActionButton from './ResponseActionButton';
+export const ResponseActions = ({ actions, submittedFeedbackTypes = [] }) => {
+    var _a, _b, _c, _d, _e, _f;
+    const { t } = useTranslation();
+    const [activeButton, setActiveButton] = useState();
+    const [clickStatePersisted, setClickStatePersisted] = useState(false);
+    useEffect(() => {
+        // Define the order of precedence for checking initial `isClicked`
+        const actionPrecedence = ['positive', 'negative', 'copy'];
+        let initialActive;
+        // Check predefined actions first based on precedence
+        for (const actionName of actionPrecedence) {
+            const actionProp = actions[actionName];
+            if (actionProp === null || actionProp === void 0 ? void 0 : actionProp.isClicked) {
+                initialActive = actionName;
+                break;
+            }
+        }
+        if (initialActive) {
+            // Click state is explicitly controlled by consumer.
+            setClickStatePersisted(true);
+        }
+        setActiveButton(initialActive);
+        // eslint-disable-next-line react-hooks/exhaustive-deps
+    }, [actions]);
+    const { positive, negative, copy } = actions;
+    const responseActions = useRef(null);
+    useEffect(() => {
+        const handleClickOutside = (e) => {
+            if (responseActions.current && !responseActions.current.contains(e.target) && !clickStatePersisted) {
+                setActiveButton(undefined);
+            }
+        };
+        window.addEventListener('click', handleClickOutside);
+        return () => {
+            window.removeEventListener('click', handleClickOutside);
+        };
+    }, [clickStatePersisted]);
+    const handleClick = (e, id, onClick) => {
+        setClickStatePersisted(false);
+        setActiveButton(id);
+        onClick && onClick(e);
+    };
+    return (React.createElement("div", { ref: responseActions, className: "pf-chatbot__response-actions" },
+        positive && (React.createElement(ResponseActionButton, { ariaLabel: t('Good response'), clickedAriaLabel: t('Response recorded'), onClick: (e) => handleClick(e, 'positive', positive.onClick), tooltipContent: (_a = positive.tooltipContent) !== null && _a !== void 0 ? _a : t('Good response'), clickedTooltipContent: (_b = positive.clickedTooltipContent) !== null && _b !== void 0 ? _b : t('Response recorded'), icon: React.createElement(OutlinedThumbsUpIcon, null), isClicked: activeButton === 'positive', isDisabled: submittedFeedbackTypes === null || submittedFeedbackTypes === void 0 ? void 0 : submittedFeedbackTypes.includes('positive') })),
+        negative && (React.createElement(ResponseActionButton, { ariaLabel: t('Bad response'), clickedAriaLabel: t('Response recorded'), onClick: (e) => handleClick(e, 'negative', negative.onClick), tooltipContent: (_c = negative.tooltipContent) !== null && _c !== void 0 ? _c : t('Bad response'), clickedTooltipContent: (_d = negative.clickedTooltipContent) !== null && _d !== void 0 ? _d : t('Response recorded'), icon: React.createElement(OutlinedThumbsDownIcon, null), isClicked: activeButton === 'negative', isDisabled: submittedFeedbackTypes === null || submittedFeedbackTypes === void 0 ? void 0 : submittedFeedbackTypes.includes('negative') })),
+        copy && (React.createElement(ResponseActionButton, { ariaLabel: t('Copy'), clickedAriaLabel: t('Copied'), onClick: (e) => handleClick(e, 'copy', copy.onClick), tooltipContent: (_e = copy.tooltipContent) !== null && _e !== void 0 ? _e : t('Copy'), clickedTooltipContent: (_f = copy.clickedTooltipContent) !== null && _f !== void 0 ? _f : t('Copied'), icon: React.createElement(OutlinedCopyIcon, null), isClicked: activeButton === 'copy' }))));
+};
+export default ResponseActions;

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

@@ -1,11 +1,31 @@
+import '@ifd-ui/ask-redhat-core/ask-redhat-core.css';
 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;
+    userClickedNextonRecommendations?: boolean;
+    resultsRowRef: React.MutableRefObject<HTMLDivElement | null>;
     inlineEditable: boolean;
     initialIsEditing?: boolean;
     required?: boolean;
     collapseOnBlur?: boolean;
     autoFocus?: boolean;
     hideSaveCancel?: boolean;
+    isAIChatMode: boolean;
+    setIsAIChatMode: (value: boolean) => void;
+    onChatWithAIClick?: () => void;
+    aiServicesAvailable: boolean;
+    isSecureSupport?: boolean;
+    hasConfirmedStatesideSupport?: boolean;
+    onBack?: (e: React.MouseEvent<HTMLButtonElement>) => void;
+    haveARHFieldsChanged?: boolean;
+    haveARHFieldsChangedForBRef?: React.MutableRefObject<boolean>;
+    haveNewARHFieldsChangedRef?: React.MutableRefObject<boolean>;
+    resetARHFieldsChanged?: () => void;
+    resetARHFieldsChangedForB?: () => void;
+    onSeeMoreResources?: () => void;
 }
 declare function TroubleshootSection(props: IProps): React.JSX.Element;
 declare namespace TroubleshootSection {

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

@@ -1 +1 @@
-{"version":3,"file":"TroubleshootSection.d.ts","sourceRoot":"","sources":["../../../../src/components/TroubleshootSection/TroubleshootSection.tsx"],"names":[],"mappings":"AAMA,OAAO,KAAqB,MAAM,OAAO,CAAC;AAU1C,UAAU,MAAM;IACZ,cAAc,EAAE,OAAO,CAAC;IACxB,gBAAgB,CAAC,EAAE,OAAO,CAAC;IAC3B,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,cAAc,CAAC,EAAE,OAAO,CAAC;IACzB,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,cAAc,CAAC,EAAE,OAAO,CAAC;CAC5B;AASD,iBAAS,mBAAmB,CAAC,KAAK,EAAE,MAAM,qBAyFzC;kBAzFQ,mBAAmB;;;AA4F5B,eAAe,mBAAmB,CAAC"}
+{"version":3,"file":"TroubleshootSection.d.ts","sourceRoot":"","sources":["../../../../src/components/TroubleshootSection/TroubleshootSection.tsx"],"names":[],"mappings":"AAAA,OAAO,6CAA6C,CAAC;AAkBrD,OAAO,KAA+D,MAAM,OAAO,CAAC;AAEpF,OAAO,EAAE,mBAAmB,EAAE,MAAM,kBAAkB,CAAC;AAWvD,OAAO,EAAoB,eAAe,EAAE,MAAM,iCAAiC,CAAC;AAmCpF,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,gCAAgC,CAAC,EAAE,OAAO,CAAC;IAC3C,aAAa,EAAE,KAAK,CAAC,gBAAgB,CAAC,cAAc,GAAG,IAAI,CAAC,CAAC;IAC7D,cAAc,EAAE,OAAO,CAAC;IACxB,gBAAgB,CAAC,EAAE,OAAO,CAAC;IAC3B,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,cAAc,CAAC,EAAE,OAAO,CAAC;IACzB,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,cAAc,CAAC,EAAE,OAAO,CAAC;IACzB,YAAY,EAAE,OAAO,CAAC;IACtB,eAAe,EAAE,CAAC,KAAK,EAAE,OAAO,KAAK,IAAI,CAAC;IAC1C,iBAAiB,CAAC,EAAE,MAAM,IAAI,CAAC;IAC/B,mBAAmB,EAAE,OAAO,CAAC;IAC7B,eAAe,CAAC,EAAE,OAAO,CAAC;IAC1B,4BAA4B,CAAC,EAAE,OAAO,CAAC;IACvC,MAAM,CAAC,EAAE,CAAC,CAAC,EAAE,KAAK,CAAC,UAAU,CAAC,iBAAiB,CAAC,KAAK,IAAI,CAAC;IAC1D,oBAAoB,CAAC,EAAE,OAAO,CAAC;IAC/B,2BAA2B,CAAC,EAAE,KAAK,CAAC,gBAAgB,CAAC,OAAO,CAAC,CAAC;IAC9D,0BAA0B,CAAC,EAAE,KAAK,CAAC,gBAAgB,CAAC,OAAO,CAAC,CAAC;IAC7D,qBAAqB,CAAC,EAAE,MAAM,IAAI,CAAC;IACnC,yBAAyB,CAAC,EAAE,MAAM,IAAI,CAAC;IACvC,kBAAkB,CAAC,EAAE,MAAM,IAAI,CAAC;CACnC;AAWD,iBAAS,mBAAmB,CAAC,KAAK,EAAE,MAAM,qBA6fzC;kBA7fQ,mBAAmB;;;AAggB5B,eAAe,mBAAmB,CAAC"}

package/lib/esm/components/TroubleshootSection/TroubleshootSection.js

@@ -1,29 +1,102 @@
-import { Card, CardBody, CardHeader, CardTitle, Tooltip } from '@patternfly/react-core';
+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 '@ifd-ui/ask-redhat-core/ask-redhat-core.css';
+import { Env, pcm } from '@cee-eng/hydrajs';
+import { ARHEventName, AskRedHatChat, setAuthToken, } from '@ifd-ui/ask-redhat-core';
+import { Button, Card, CardBody, CardHeader, Tooltip } from '@patternfly/react-core';
 import InfoCircleIcon from '@patternfly/react-icons/dist/js/icons/info-circle-icon';
 import { ErrorBoundary, LoadingDots } from '@rh-support/components';
-import { PreviousCaseTypes } from '@rh-support/utils';
+import { getValidUUID, isFunctionalCookieAccepted, PreviousCaseTypes } from '@rh-support/utils';
+import i18next from 'i18next';
 import isEmpty from 'lodash/isEmpty';
 import isEqual from 'lodash/isEqual';
-import React, { useContext } from 'react';
+import React, { useCallback, useContext, useEffect, useRef, useState } from 'react';
 import { Trans, useTranslation } from 'react-i18next';
+import { useAIResponseDispatch, useAIResponseState } from '../../context/AIResponseContext';
 import { useCaseSelector } from '../../context/CaseContext';
+import { RouteContext } from '../../context/RouteContext';
+import { SessionRestoreDispatchContext, SessionRestoreStateContext } from '../../context/SessionRestoreContext';
 import { TCStateContext } from '../../context/TopContentContext';
+import { useAB } from '../../hooks/useAB';
+import { ARHConversationErrorType } from '../../reducers/AIResponseConstNTypes';
+import { setHasChunkReceived, updateConversationId } from '../../reducers/AIResponseReducer';
+import { appSourceId_ARH, excludedCaseTypesforARH } from '../../reducers/CaseConstNTypes';
+import { AppRouteSections } from '../../reducers/RouteConstNTypes';
+import { createOrUpdateSessionResources, updateSession } from '../../reducers/SessionRestoreReducer';
+import { calculateEngagementWindow, DEFAULT_ENGAGEMENT_WINDOW } from '../../utils/engagementUtils';
 import { OpenShiftClusterId } from '../CaseManagement/OpenShiftClusterId';
 import ClusterRecommendations from '../Recommendations/ClusterRecommendations';
 import InsightsResults from '../Recommendations/InsightsResults';
+import Recommendations from '../Recommendations/Recommendations';
 import Suggestions from '../Suggestions/Suggestions';
+import { generateAIQuestion } from '../wizardLayout/WizardMain';
+import { AskRedHat } from './AskRedHat';
+const { SessionResourceSource, SessionResourceVisibility } = pcm.preCase.session;
+const getSessResFromARHSource = (source, visibilityStatus, rank = 1) => ({
+    visibilityStatus,
+    resourceEntityId: source.link || source.url,
+    url: source.link || source.url,
+    rank,
+});
+const getSessResFromAISources = (sources, visibilityStatus) => {
+    if (!sources || sources.length === 0)
+        return;
+    return sources.map((source, index) => getSessResFromARHSource(source, visibilityStatus, index + 1));
+};
+// Flag to track if streaming error occurred - persists until fields change
+const setStreamingErrorOccurred = () => {
+    window.__arhStreamingErrorOccurred = true;
+};
+const getStreamingErrorFlag = () => window.__arhStreamingErrorOccurred === true;
+const clearStreamingErrorFlag = () => {
+    window.__arhStreamingErrorOccurred = false;
+};
 const defaultProps = {
     initialIsEditing: false,
     required: false,
     collapseOnBlur: false,
     autoFocus: false,
     hideSaveCancel: false,
+    aiServicesAvailable: false,
+    haveARHFieldsChanged: false,
 };
 function TroubleshootSection(props) {
-    var _a;
+    var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r;
     const { t } = useTranslation();
+    const { isVariationA } = useAB();
+    const { isAIChatMode } = props;
+    const lastDispatchedConversationIdRef = useRef(null);
+    if ((_a = props.haveNewARHFieldsChangedRef) === null || _a === void 0 ? void 0 : _a.current) {
+        clearStreamingErrorFlag();
+    }
+    const streamingErrorOccurred = getStreamingErrorFlag();
+    const hasFirstMessageSentRef = useRef(streamingErrorOccurred);
+    if (streamingErrorOccurred) {
+        hasFirstMessageSentRef.current = true;
+    }
+    const sourcesRef = useRef(null);
+    const clickedSourcesRef = useRef(new Set());
+    const engagementTimerRef = useRef(null);
+    const hasInteractionHappenedRef = useRef(false);
+    const engagementWindowRef = useRef(DEFAULT_ENGAGEMENT_WINDOW);
+    const [hasAnswerReceived, setHasAnswerReceived] = useState(false);
     const { topContentState: { topContent }, } = useContext(TCStateContext);
-    const { product, version, isCreatingCase, caseType } = useCaseSelector((state) => ({
+    const { routeState: { isCaseCreate, activeSection }, } = useContext(RouteContext);
+    const { caseDetails } = useCaseSelector((state) => ({
+        caseDetails: state.caseDetails,
+    }), isEqual);
+    const aiResponseState = useAIResponseState();
+    const aiResponseDispatch = useAIResponseDispatch();
+    const session = window === null || window === void 0 ? void 0 : window.sessionjs;
+    const keycloakSession = (_c = (_b = session === null || session === void 0 ? void 0 : session._state) === null || _b === void 0 ? void 0 : _b.keycloak) !== null && _c !== void 0 ? _c : null;
+    const { product, version, summary, issue, isCreatingCase, caseType } = useCaseSelector((state) => ({
         product: state.caseDetails.product,
         version: state.caseDetails.version,
         summary: state.caseDetails.summary,
@@ -31,33 +104,279 @@ function TroubleshootSection(props) {
         caseType: state.caseDetails.caseType,
         issue: state.caseDetails.issue,
     }), isEqual);
+    const { sessionRestore: { activeSessionId, sessionResourceTracking, previousSessions }, } = useContext(SessionRestoreStateContext);
+    const sessionRestoreDispatch = useContext(SessionRestoreDispatchContext);
     const canShowTopProducts = isEmpty(product);
-    const canShowTopContent = !canShowTopProducts && ((_a = topContent === null || topContent === void 0 ? void 0 : topContent.data) === null || _a === void 0 ? void 0 : _a.length) > 0;
+    const canShowTopContent = !canShowTopProducts && ((_d = topContent === null || topContent === void 0 ? void 0 : topContent.data) === null || _d === void 0 ? void 0 : _d.length) > 0;
     const isNotAnIdea = caseType !== PreviousCaseTypes.FEATURE_ENHANCEMENT;
-    return (React.createElement(React.Fragment, null,
+    const clearEngagementTimer = useCallback(() => {
+        if (engagementTimerRef.current) {
+            clearTimeout(engagementTimerRef.current);
+            engagementTimerRef.current = null;
+        }
+    }, []);
+    // Call resource API with sources if available, otherwise create resource origin with payload only
+    const callResourceAPI = useCallback((sources, visibilityStatus) => {
+        if (!activeSessionId)
+            return;
+        const payload = JSON.stringify({ product, version, summary, issue });
+        if (sources && sources.length > 0) {
+            const sessionResources = visibilityStatus === SessionResourceVisibility.VISITED
+                ? sources.map((source, index) => getSessResFromARHSource(source, visibilityStatus, index + 1))
+                : getSessResFromAISources(sources, visibilityStatus);
+            createOrUpdateSessionResources(sessionRestoreDispatch, activeSessionId, sessionResourceTracking, SessionResourceSource.ASK_RED_HAT, sessionResources, payload);
+        }
+        else {
+            createOrUpdateSessionResources(sessionRestoreDispatch, activeSessionId, sessionResourceTracking, SessionResourceSource.ASK_RED_HAT, undefined, payload);
+        }
+    }, [activeSessionId, product, version, summary, issue, sessionRestoreDispatch, sessionResourceTracking]);
+    const handleARHEvent = useCallback((eventData) => {
+        var _a, _b, _c, _d;
+        const { conversationId } = eventData.payload;
+        if (isVariationA && conversationId && conversationId !== lastDispatchedConversationIdRef.current) {
+            lastDispatchedConversationIdRef.current = conversationId;
+            aiResponseDispatch(updateConversationId(conversationId));
+            // Store conversationId in session for persistence
+            if (activeSessionId) {
+                const sessionDetails = (_a = previousSessions.data[activeSessionId]) === null || _a === void 0 ? void 0 : _a.sessionDetails;
+                const newSession = { conversationId };
+                updateSession(sessionRestoreDispatch, activeSessionId, sessionDetails, newSession);
+            }
+        }
+        // Enable Continue button when first chunk is received
+        if (eventData.eventName === ARHEventName.FirstMessageReceived) {
+            aiResponseDispatch(setHasChunkReceived(true));
+        }
+        // If message sent with conversationId, call API immediately (engagement happened)
+        if (eventData.eventName === ARHEventName.MessageSent && isVariationA) {
+            if (conversationId === undefined || conversationId === null || conversationId === '') {
+                hasFirstMessageSentRef.current = true;
+            }
+            if (conversationId !== undefined && conversationId !== null && conversationId !== '') {
+                clearEngagementTimer();
+                if (!hasInteractionHappenedRef.current) {
+                    hasInteractionHappenedRef.current = true;
+                    callResourceAPI(sourcesRef.current, SessionResourceVisibility.PRESENTED);
+                }
+            }
+        }
+        if (eventData.eventName === ARHEventName.SourcePresented) {
+            const { sources } = eventData.payload;
+            if (sources && Array.isArray(sources)) {
+                sourcesRef.current = sources.map((source) => (Object.assign(Object.assign({}, source), { url: source.sourceUrl || source.url, link: source.sourceUrl || source.link })));
+            }
+            if (conversationId && conversationId !== lastDispatchedConversationIdRef.current) {
+                lastDispatchedConversationIdRef.current = conversationId;
+                aiResponseDispatch(updateConversationId(conversationId));
+            }
+        }
+        if (eventData.eventName === ARHEventName.SourceClicked && isVariationA) {
+            const { sourceUrl, sourceText } = eventData.payload;
+            if (!sourceUrl || clickedSourcesRef.current.has(sourceUrl))
+                return;
+            clickedSourcesRef.current.add(sourceUrl);
+            hasInteractionHappenedRef.current = true;
+            clearEngagementTimer();
+            const source = { url: sourceUrl, link: sourceUrl, sourceUrl, sourceText };
+            callResourceAPI([source], SessionResourceVisibility.VISITED);
+        }
+        if (eventData.eventName === 'arh:streaming:error') {
+            hasFirstMessageSentRef.current = true;
+            setStreamingErrorOccurred();
+            aiResponseDispatch(setHasChunkReceived(true));
+            const existingSessionConversationId = (_c = (_b = previousSessions.data[activeSessionId]) === null || _b === void 0 ? void 0 : _b.session) === null || _c === void 0 ? void 0 : _c.conversationId;
+            if (!conversationId && activeSessionId && !existingSessionConversationId) {
+                const sessionDetails = (_d = previousSessions.data[activeSessionId]) === null || _d === void 0 ? void 0 : _d.sessionDetails;
+                updateSession(sessionRestoreDispatch, activeSessionId, sessionDetails, {
+                    conversationId: ARHConversationErrorType.AI_RESPONSE_ERROR,
+                });
+            }
+        }
+        // Count characters from DOM when answer is fully received
+        if (eventData.eventName === ARHEventName.AnswerReceived) {
+            setTimeout(() => {
+                const allMessageContainers = document.querySelectorAll('.pf-chatbot__message-and-actions');
+                const messageContainer = allMessageContainers[allMessageContainers.length - 1];
+                if (!messageContainer)
+                    return;
+                const excludedSelectors = ['.pf-chatbot__response-actions', '.pf-chatbot__source'];
+                const trimmedText = Array.from(messageContainer.children)
+                    .filter((child) => !excludedSelectors.some((selector) => child.matches(selector)))
+                    .map((child) => child.textContent || '')
+                    .join(' ')
+                    .trim();
+                engagementWindowRef.current = calculateEngagementWindow(trimmedText, false);
+                setHasAnswerReceived(true);
+            }, 100);
+        }
+    }, [
+        activeSessionId,
+        aiResponseDispatch,
+        callResourceAPI,
+        clearEngagementTimer,
+        isVariationA,
+        previousSessions.data,
+        sessionRestoreDispatch,
+    ]);
+    const preprocessRequest = () => __awaiter(this, void 0, void 0, function* () {
+        var _a;
+        if (!keycloakSession) {
+            throw new Error('No Keycloak session available');
+        }
+        try {
+            yield ((_a = session === null || session === void 0 ? void 0 : session.updateToken) === null || _a === void 0 ? void 0 : _a.call(session, 500));
+            const token = session === null || session === void 0 ? void 0 : session.getEncodedToken();
+            if (token) {
+                setAuthToken(token);
+            }
+            else {
+                throw new Error('No token available');
+            }
+            return Promise.resolve();
+        }
+        catch (error) {
+            console.error('Failed to refresh token:', error);
+            throw error;
+        }
+    });
+    const detailedQuestion = generateAIQuestion(isCaseCreate ? AppRouteSections.SUMMARIZE : AppRouteSections.TROUBLESHOOT, caseDetails.product, caseDetails.version, caseDetails.summary, caseDetails.issue, caseDetails.caseType || '', i18next.language || 'en');
+    const latestUserMessage = (isVariationA && ((_e = aiResponseState.aiResponse) === null || _e === void 0 ? void 0 : _e.conversationId) && props.haveARHFieldsChanged) ||
+        (!isVariationA && ((_f = aiResponseState.aiResponse) === null || _f === void 0 ? void 0 : _f.conversationId) && ((_g = props.haveARHFieldsChangedForBRef) === null || _g === void 0 ? void 0 : _g.current))
+        ? detailedQuestion
+        : '';
+    const firstUserMessage = isVariationA &&
+        !((_h = aiResponseState.aiResponse) === null || _h === void 0 ? void 0 : _h.conversationId) &&
+        !hasFirstMessageSentRef.current &&
+        isFunctionalCookieAccepted()
+        ? detailedQuestion
+        : '';
+    useEffect(() => {
+        var _a;
+        if (!isFunctionalCookieAccepted() && activeSessionId) {
+            const sessionDetails = (_a = previousSessions.data[activeSessionId]) === null || _a === void 0 ? void 0 : _a.sessionDetails;
+            updateSession(sessionRestoreDispatch, activeSessionId, sessionDetails, {
+                conversationId: ARHConversationErrorType.FUNCTIONAL_COOKIE_NOT_ACCEPTED,
+            });
+        }
+        // eslint-disable-next-line react-hooks/exhaustive-deps
+    }, [activeSessionId]);
+    // Reset haveNewARHFieldsChangedRef after 100ms on mount
+    useEffect(() => {
+        const timer = setTimeout(() => {
+            if (props.haveNewARHFieldsChangedRef) {
+                props.haveNewARHFieldsChangedRef.current = false;
+            }
+        }, 100);
+        return () => {
+            var _a;
+            clearTimeout(timer);
+            (_a = props.resetARHFieldsChanged) === null || _a === void 0 ? void 0 : _a.call(props);
+        };
+        // eslint-disable-next-line react-hooks/exhaustive-deps
+    }, []);
+    // Dynamic engagement timer - call API if no source clicked or message not sent by user
+    useEffect(() => {
+        if (hasAnswerReceived && isVariationA) {
+            engagementTimerRef.current = setTimeout(() => {
+                if (hasInteractionHappenedRef.current || clickedSourcesRef.current.size > 0) {
+                    return;
+                }
+                callResourceAPI(sourcesRef.current, SessionResourceVisibility.PRESENTED);
+                engagementTimerRef.current = null;
+            }, engagementWindowRef.current);
+            return clearEngagementTimer;
+        }
+    }, [hasAnswerReceived, isVariationA, callResourceAPI, clearEngagementTimer]);
+    const initConfig = {
+        packageVersion: (_j = window === null || window === void 0 ? void 0 : window.supportVersionInfo) === null || _j === void 0 ? void 0 : _j.packageVersion,
+        enableHeaderNewChatButton: false,
+        appSourceId: appSourceId_ARH,
+        enableDebugLogging: false,
+        headerTitle: isCaseCreate ? t('Resolve your issue now with AI insights') : t('Troubleshoot with AI insights'),
+        appEnv: Env.getEnvName(),
+        showWelcomeMessage: false,
+        firstUserMessage: firstUserMessage,
+        conversationId: (_l = getValidUUID((_k = aiResponseState.aiResponse) === null || _k === void 0 ? void 0 : _k.conversationId)) !== null && _l !== void 0 ? _l : '',
+        latestUserMessage: latestUserMessage,
+        enableHeaderMenu: false,
+        enableTheme: false,
+        openLinkInNewTab: true,
+        customPrivacyMessage: (React.createElement(Trans, { i18nKey: "This feature uses AI technology. Interactions may be used to improve Red Hat's products or services. For more information about Red Hat\u2019s privacy practices, please refer to the <a>Red Hat Privacy Statement.</a>", components: {
+                a: (
+                // eslint-disable-next-line jsx-a11y/anchor-has-content
+                React.createElement("a", { href: "https://www.redhat.com/en/about/privacy-policy", target: "_blank", rel: "noopener noreferrer" })),
+            } })),
+        tokenAuth: {
+            auth: {
+                userInfo: (_p = (_o = (_m = window === null || window === void 0 ? void 0 : window.sessionjs) === null || _m === void 0 ? void 0 : _m.getToken) === null || _o === void 0 ? void 0 : _o.call(_m)) !== null && _p !== void 0 ? _p : {},
+                authToken: (_r = (_q = window === null || window === void 0 ? void 0 : window.sessionjs) === null || _q === void 0 ? void 0 : _q.getEncodedToken()) !== null && _r !== void 0 ? _r : '',
+            },
+            events: {
+                preprocessRequest,
+                isAuthenticated: () => {
+                    var _a, _b, _c;
+                    return (_c = (_b = (_a = window === null || window === void 0 ? void 0 : window.sessionjs) === null || _a === void 0 ? void 0 : _a.isAuthenticated) === null || _b === void 0 ? void 0 : _b.call(_a)) !== null && _c !== void 0 ? _c : false;
+                },
+            },
+        },
+        onARHEvent: handleARHEvent,
+        onUnauthenticatedLogin: () => {
+            var _a, _b;
+            (_b = (_a = window === null || window === void 0 ? void 0 : window.sessionjs) === null || _a === void 0 ? void 0 : _a.login) === null || _b === void 0 ? void 0 : _b.call(_a);
+        },
+    };
+    const shouldShowARHUI = () => {
+        if (isVariationA) {
+            return false;
+        }
+        // Check if the case type is allowed (not in the excluded list)
+        const isCaseTypeAllowed = !excludedCaseTypesforARH.includes(caseType !== null && caseType !== void 0 ? caseType : '');
+        // Check if user is not a secure support or confirmed stateside support user
+        const isNotSecureOrStatesideUser = !props.isSecureSupport && !props.hasConfirmedStatesideSupport;
+        // Check if AI services are available
+        const isAIServicesAvailable = props.aiServicesAvailable;
+        return isCaseTypeAllowed && isNotSecureOrStatesideUser && isAIServicesAvailable;
+    };
+    const handleChatWithAIClick = () => {
+        var _a;
+        if (!isVariationA) {
+            setTimeout(() => {
+                var _a;
+                (_a = props.resetARHFieldsChangedForB) === null || _a === void 0 ? void 0 : _a.call(props);
+            }, 200);
+        }
+        props.setIsAIChatMode(true);
+        (_a = props.onChatWithAIClick) === null || _a === void 0 ? void 0 : _a.call(props);
+    };
+    return (React.createElement(React.Fragment, null, isAIChatMode ? (React.createElement(React.Fragment, null,
+        React.createElement(AskRedHatChat, { initConfig: initConfig }),
+        React.createElement("div", { className: "fullscreen-chat-footer" }, isVariationA && activeSection === AppRouteSections.RESOURCES ? (React.createElement(React.Fragment, null,
+            React.createElement("button", { onClick: props.onBack, className: "btn btn-app btn-open-white main-nav-button", type: "button" }, t('Go back')),
+            React.createElement("button", { onClick: props.onSeeMoreResources, className: "btn btn-app btn-primary main-nav-button", type: "button", disabled: isFunctionalCookieAccepted() &&
+                    props.aiServicesAvailable &&
+                    !aiResponseState.hasChunkReceived &&
+                    !aiResponseState.error }, t('Continue')))) : isCaseCreate ? (React.createElement("span", null,
+            React.createElement(Trans, { i18nKey: "<span>Return to</span> <button>case creation</button>", components: {
+                    span: React.createElement("span", { className: "return-to-case-text" }),
+                    button: (React.createElement(Button, { className: "return-to-case-btn", variant: "link", component: "a", onClick: () => props.setIsAIChatMode(false) })),
+                } }))) : (React.createElement(Button, { onClick: () => props.setIsAIChatMode(false), variant: "link", className: "return-to-resources-btn" }, t('Back to resources')))))) : (React.createElement(React.Fragment, null,
         React.createElement("section", null,
-            React.createElement("header", null,
-                React.createElement("p", { className: "pf-v5-u-pt-md" },
-                    React.createElement("span", { className: "pf-v5-u-font-family-heading pf-v5-u-pr-xs" }, t('Product')),
-                    " ",
-                    product),
-                React.createElement("p", null,
-                    React.createElement("span", { className: "pf-v5-u-font-family-heading pf-v5-u-pr-xs" }, t('Version')),
-                    version)),
-            !isCreatingCase && (React.createElement(OpenShiftClusterId, { className: "push-bottom", "data-tracking-id": "troubleshoot-section-openshift-cluster-id" })),
+            isVariationA && !props.isSecureSupport && !props.hasConfirmedStatesideSupport ? (React.createElement("div", { className: "suggestions-result-section" },
+                React.createElement(ErrorBoundary, { errorMsgInfo: { message: t('There was an error loading recommendations') } }, !isEmpty(version) && (React.createElement("div", { className: "common-suggestions" },
+                    React.createElement(Recommendations, { routeProps: props.routeProps, userSeenRecommendations: props.userSeenRecommendations, userClickedNextonRecommendationsValue: props.userClickedNextonRecommendations, resultsRowRef: props.resultsRowRef })))))) : (shouldShowARHUI() && React.createElement(AskRedHat, { onChatWithAIClick: handleChatWithAIClick })),
+            !isVariationA && !isCreatingCase && (React.createElement(OpenShiftClusterId, { className: "push-bottom", "data-tracking-id": "troubleshoot-section-openshift-cluster-id" })),
             React.createElement(LoadingDots, { show: topContent.isFetching }),
-            topContent.data.length === 0 && (React.createElement(Card, { id: "card", className: "card-support top-recommendations pf-v5-u-mb-md", isCompact: true },
-                React.createElement(CardHeader, { "aria-label": t('Red Hat hand picked support articles'), className: "popular-solutions" },
-                    React.createElement(CardTitle, { id: "card-title", className: "card-title" },
-                        React.createElement(Trans, { i18nKey: 'i18nKeyPopularSolutions' }, "Red Hat hand picked support articles"),
-                        React.createElement(Tooltip, { content: React.createElement("div", null,
-                                React.createElement(Trans, null, "Support articles are matched to the product and version details you selected, not the problem details you entered.")) },
-                            React.createElement(InfoCircleIcon, { className: "pf-v5-u-ml-sm", "aria-label": "More info about how support articles are matched" })))),
-                React.createElement(CardBody, { "aria-label": t('No recommendations for this product'), className: "file-recs-no-recommendation pf-v5-u-mt-md" },
+            !isVariationA && topContent.data.length === 0 && (React.createElement(Card, { id: "card", className: "pf-v6-u-mb-md" },
+                React.createElement(CardHeader, { id: "card-title" },
+                    React.createElement(Trans, { i18nKey: 'i18nKeyPopularSolutions' }, "Red Hat hand picked support articles"),
+                    React.createElement(Tooltip, { content: React.createElement("div", null,
+                            React.createElement(Trans, null, "Support articles are matched to the product and version details you selected, not the problem details you entered.")) },
+                        React.createElement(InfoCircleIcon, { className: "pf-v6-u-ml-sm", "aria-label": t('More info about how support articles are matched') }))),
+                React.createElement(CardBody, { "aria-label": t('No recommendations for this product'), className: "file-recs-no-recommendation pf-v6-u-mt-md" },
                     React.createElement(Trans, null, "No recommendations for this product")))),
-            React.createElement(ErrorBoundary, { errorMsgInfo: { message: t('There was an error loading suggestions') } }, canShowTopContent && !isEmpty(version) && React.createElement(Suggestions, null)),
-            !isCreatingCase && React.createElement(ClusterRecommendations, { className: "pf-v5-u-mt-lg" })),
-        React.createElement("section", { className: "pf-v5-u-mt-lg" }, isNotAnIdea && (React.createElement(InsightsResults, { isDisplayOnMain: true, "data-tracking-id": "troubleshoot-section-file-recs" })))));
+            React.createElement(ErrorBoundary, { errorMsgInfo: { message: t('There was an error loading suggestions') } }, canShowTopContent && !isEmpty(version) && !isVariationA && React.createElement(Suggestions, null)),
+            !isCreatingCase && React.createElement(ClusterRecommendations, { className: "pf-v6-u-mt-lg" })),
+        React.createElement("section", { className: "pf-v6-u-mt-lg" }, isNotAnIdea && (React.createElement(InsightsResults, { isDisplayOnMain: true, "data-tracking-id": "troubleshoot-section-file-recs" })))))));
 }
 TroubleshootSection.defaultProps = defaultProps;
 export default TroubleshootSection;

package/lib/esm/components/TroubleshootSection/UserFeedback.d.ts

@@ -0,0 +1,13 @@
+import { CardProps, OUIAProps } from '@patternfly/react-core';
+import { type FunctionComponent } from 'react';
+import QuickResponse from './QuickResponse';
+export interface UserFeedbackProps extends Omit<CardProps, 'onSubmit'>, OUIAProps {
+    quickResponses?: QuickResponse[];
+    hasTextArea?: boolean;
+    onSubmit: (selectedResponse?: string, additionalFeedback?: string) => void;
+    onClose: () => void;
+    isSubmitting?: boolean;
+}
+declare const UserFeedback: FunctionComponent<UserFeedbackProps>;
+export default UserFeedback;
+//# sourceMappingURL=UserFeedback.d.ts.map

package/lib/esm/components/TroubleshootSection/UserFeedback.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"UserFeedback.d.ts","sourceRoot":"","sources":["../../../../src/components/TroubleshootSection/UserFeedback.tsx"],"names":[],"mappings":"AAAA,OAAO,EAMH,SAAS,EAET,SAAS,EAEZ,MAAM,wBAAwB,CAAC;AAEhC,OAAc,EAAE,KAAK,iBAAiB,EAAY,MAAM,OAAO,CAAC;AAIhE,OAAO,aAAa,MAAM,iBAAiB,CAAC;AAE5C,MAAM,WAAW,iBAAkB,SAAQ,IAAI,CAAC,SAAS,EAAE,UAAU,CAAC,EAAE,SAAS;IAC7E,cAAc,CAAC,EAAE,aAAa,EAAE,CAAC;IACjC,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,QAAQ,EAAE,CAAC,gBAAgB,CAAC,EAAE,MAAM,EAAE,kBAAkB,CAAC,EAAE,MAAM,KAAK,IAAI,CAAC;IAC3E,OAAO,EAAE,MAAM,IAAI,CAAC;IACpB,YAAY,CAAC,EAAE,OAAO,CAAC;CAC1B;AAED,QAAA,MAAM,YAAY,EAAE,iBAAiB,CAAC,iBAAiB,CAmFtD,CAAC;AAEF,eAAe,YAAY,CAAC"}

package/lib/esm/components/TroubleshootSection/UserFeedback.js

@@ -0,0 +1,50 @@
+var __rest = (this && this.__rest) || function (s, e) {
+    var t = {};
+    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
+        t[p] = s[p];
+    if (s != null && typeof Object.getOwnPropertySymbols === "function")
+        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
+            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
+                t[p[i]] = s[p[i]];
+        }
+    return t;
+};
+import { ActionGroup, Button, Card, CardBody, CardHeader, Form, TextArea, } from '@patternfly/react-core';
+import isEmpty from 'lodash/isEmpty';
+import React, { useState } from 'react';
+import { Trans, useTranslation } from 'react-i18next';
+import CloseButton from './CloseButton';
+import QuickResponse from './QuickResponse';
+const UserFeedback = (_a) => {
+    var { title: propsTitle, hasTextArea, quickResponses, onSubmit, onClose, isCompact, isSubmitting = false } = _a, props = __rest(_a, ["title", "hasTextArea", "quickResponses", "onSubmit", "onClose", "isCompact", "isSubmitting"]);
+    const { t } = useTranslation();
+    const title = !isEmpty(propsTitle) ? propsTitle : t('Why did you choose this rating?');
+    const [selectedResponse, setSelectedResponse] = useState();
+    const [value, setValue] = useState('');
+    return (React.createElement(Card, Object.assign({ isCompact: isCompact, className: "pf-chatbot__feedback-card" }, props),
+        React.createElement(CardHeader, { actions: {
+                actions: React.createElement(CloseButton, { onClose: onClose }),
+            } },
+            React.createElement("h1", { className: "pf-chatbot__feedback-card-title" }, typeof title === 'string' ? React.createElement("span", { dangerouslySetInnerHTML: { __html: title } }) : title)),
+        React.createElement(CardBody, null,
+            React.createElement(Form, { className: `pf-chatbot__feedback-card-form ${isCompact ? 'pf-m-compact' : ''}` },
+                quickResponses && (React.createElement(QuickResponse, { quickResponses: quickResponses, onSelect: (id) => {
+                        const selectedQuickResponse = quickResponses.find((response) => response.id === id);
+                        setSelectedResponse(selectedQuickResponse === null || selectedQuickResponse === void 0 ? void 0 : selectedQuickResponse.content);
+                    }, isCompact: isCompact })),
+                hasTextArea && (React.createElement(React.Fragment, null,
+                    React.createElement(TextArea, { value: value, onChange: (_event, value) => {
+                            setValue(value);
+                        }, placeholder: t('Provide optional additional feedback'), "aria-label": t('Provide optional additional feedback'), resizeOrientation: "vertical" }),
+                    React.createElement("div", { className: "privacy-notice-container" },
+                        React.createElement(Trans, { i18nKey: "Do not share any personal or other sensitive information in your feedback. Feedback may\n                                be used to improve Red Hat's products or services. For more information about Red Hat\u2019s\n                                privacy practices, please refer to the <a><u>Red Hat Privacy Statement.</u></a>", components: {
+                                a: (
+                                // eslint-disable-next-line jsx-a11y/anchor-has-content
+                                React.createElement("a", { href: "https://www.redhat.com/en/about/privacy-policy", target: "_blank", rel: "noreferrer" })),
+                                u: React.createElement("u", null),
+                            } })))),
+                React.createElement(ActionGroup, null,
+                    React.createElement(Button, { onClick: () => onSubmit(selectedResponse, value), isDisabled: isSubmitting, isLoading: isSubmitting },
+                        React.createElement(Trans, null, "Send Feedback")))))));
+};
+export default UserFeedback;

package/lib/esm/components/TroubleshootSection/UserFeedbackComplete.d.ts

@@ -0,0 +1,10 @@
+import { CardProps, OUIAProps } from '@patternfly/react-core';
+import React, { type FunctionComponent } from 'react';
+export interface UserFeedbackCompleteProps extends Omit<CardProps, 'ref'>, OUIAProps {
+    title?: string;
+    body?: string | React.ReactNode;
+    onClose?: () => void;
+}
+declare const UserFeedbackComplete: FunctionComponent<UserFeedbackCompleteProps>;
+export default UserFeedbackComplete;
+//# sourceMappingURL=UserFeedbackComplete.d.ts.map

package/lib/esm/components/TroubleshootSection/UserFeedbackComplete.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"UserFeedbackComplete.d.ts","sourceRoot":"","sources":["../../../../src/components/TroubleshootSection/UserFeedbackComplete.tsx"],"names":[],"mappings":"AAAA,OAAO,EAA8B,SAAS,EAAa,SAAS,EAAE,MAAM,wBAAwB,CAAC;AACrG,OAAO,KAAK,EAAE,EAAE,KAAK,iBAAiB,EAAE,MAAM,OAAO,CAAC;AAKtD,MAAM,WAAW,yBAA0B,SAAQ,IAAI,CAAC,SAAS,EAAE,KAAK,CAAC,EAAE,SAAS;IAChF,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,IAAI,CAAC,EAAE,MAAM,GAAG,KAAK,CAAC,SAAS,CAAC;IAChC,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;CACxB;AAED,QAAA,MAAM,oBAAoB,EAAE,iBAAiB,CAAC,yBAAyB,CAiFtE,CAAC;AAEF,eAAe,oBAAoB,CAAC"}