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

package/lib/esm/components/Suggestions/Suggestions.js

@@ -1,4 +1,6 @@
 import { pcm } from '@cee-eng/hydrajs';
+import { Tooltip } from '@patternfly/react-core';
+import InfoCircleIcon from '@patternfly/react-icons/dist/esm/icons/info-circle-icon';
 import { TopContentSearch } from '@rh-support/components';
 import { FeatureFlagKey, useIsFeatureAvailable } from '@rh-support/react-context';
 import isEqual from 'lodash/isEqual';
@@ -42,10 +44,15 @@ export default function Suggestions(props) {
             (_b = accordionRef.current) === null || _b === void 0 ? void 0 : _b.collapseAll();
         }
     };
-    return (React.createElement("div", null,
+    return (React.createElement("div", { className: "top-content-suggestion-accordion" },
         showTitleDescription && (React.createElement("div", { className: "card card-support" },
-            !isTCSearchEnabled && (React.createElement(Trans, null,
-                React.createElement("h3", { className: "card-heading popular-solutions green-card-heading" }, props.title ? props.title : t('i18nKeyPopularSolutions', 'Popular solutions and docs')))),
+            !isTCSearchEnabled && (React.createElement("h3", { className: "card-heading popular-solutions green-card-heading" },
+                props.title
+                    ? props.title
+                    : t('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": t('More info about how support articles are matched') })))),
             isTCSearchEnabled && (React.createElement("div", { className: "card-body" },
                 React.createElement(TopContentSearch, { topContentData: topContent.data, topContentResultsWrapperRef: accordionRef, onSearch: onSearchChange, dataTrackingId: "top-content-filter-troubleshoot", enableEventTracking: true }))))),
         React.createElement("pfe-accordion", { ref: accordionRef }, map(filteredTC.slice(0, maxTC), (sug, index) => {

package/lib/esm/components/Suggestions/TopContent.d.ts

@@ -1,5 +1,5 @@
-import '@patternfly/pfe-accordion';
 import { ITopContent } from '@cee-eng/hydrajs/@types/models/topContent/topContentModel';
+import React from 'react';
 interface IProps {
     name: string;
     items: ITopContent[];
@@ -9,6 +9,6 @@ interface IProps {
     onResourceClick: (item: ITopContent) => void;
     helperText?: string;
 }
-export default function TopContent(props: IProps): JSX.Element;
+export default function TopContent(props: IProps): React.JSX.Element;
 export {};
 //# sourceMappingURL=TopContent.d.ts.map

package/lib/esm/components/Suggestions/TopContent.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"TopContent.d.ts","sourceRoot":"","sources":["../../../../src/components/Suggestions/TopContent.tsx"],"names":[],"mappings":"AAAA,OAAO,2BAA2B,CAAC;AAGnC,OAAO,EAAE,WAAW,EAAE,MAAM,2DAA2D,CAAC;AAQxF,UAAU,MAAM;IACZ,IAAI,EAAE,MAAM,CAAC;IACb,KAAK,EAAE,WAAW,EAAE,CAAC;IACrB,WAAW,EAAE,MAAM,CAAC;IACpB,kBAAkB,EAAE,MAAM,CAAC;IAC3B,eAAe,EAAE,MAAM,CAAC;IACxB,eAAe,EAAE,CAAC,IAAI,EAAE,WAAW,KAAK,IAAI,CAAC;IAC7C,UAAU,CAAC,EAAE,MAAM,CAAC;CACvB;AAED,MAAM,CAAC,OAAO,UAAU,UAAU,CAAC,KAAK,EAAE,MAAM,eA6C/C"}
+{"version":3,"file":"TopContent.d.ts","sourceRoot":"","sources":["../../../../src/components/Suggestions/TopContent.tsx"],"names":[],"mappings":"AACA,OAAO,EAAE,WAAW,EAAE,MAAM,2DAA2D,CAAC;AAIxF,OAAO,KAAmB,MAAM,OAAO,CAAC;AASxC,UAAU,MAAM;IACZ,IAAI,EAAE,MAAM,CAAC;IACb,KAAK,EAAE,WAAW,EAAE,CAAC;IACrB,WAAW,EAAE,MAAM,CAAC;IACpB,kBAAkB,EAAE,MAAM,CAAC;IAC3B,eAAe,EAAE,MAAM,CAAC;IACxB,eAAe,EAAE,CAAC,IAAI,EAAE,WAAW,KAAK,IAAI,CAAC;IAC7C,UAAU,CAAC,EAAE,MAAM,CAAC;CACvB;AAED,MAAM,CAAC,OAAO,UAAU,UAAU,CAAC,KAAK,EAAE,MAAM,qBA8I/C"}

package/lib/esm/components/Suggestions/TopContent.js

@@ -1,21 +1,66 @@
-import '@patternfly/pfe-accordion';
 import { pcm } from '@cee-eng/hydrajs';
-import { Tooltip } from '@patternfly/react-core';
+import { Accordion, AccordionContent, AccordionItem, AccordionToggle, Tooltip } from '@patternfly/react-core';
+import isEqual from 'lodash/isEqual';
 import map from 'lodash/map';
-import React from 'react';
+import React, { useState } from 'react';
+import { useCaseSelector } from '../../context/CaseContext';
+import { SessionRestoreDispatchContext, SessionRestoreStateContext } from '../../context/SessionRestoreContext';
+import { getDescriptionWOQues } from '../../reducers/CaseHelpers';
+import { createOrUpdateSessionResources, getSessResTC } from '../../reducers/SessionRestoreReducer';
 import RouteUtils from '../../utils/routeUtils';
-const { SessionResourceSource } = pcm.preCase.session;
+const { SessionResourceVisibility, SessionResourceSource } = pcm.preCase.session;
 export default function TopContent(props) {
+    const sessionRestoreDispatch = React.useContext(SessionRestoreDispatchContext);
+    const { sessionRestore: { activeSessionId, sessionResourceTracking }, } = React.useContext(SessionRestoreStateContext);
+    const [expanded, setExpanded] = useState('');
+    const { product, version, summary, issue, environment, periodicityOfIssue, timeFramesAndUrgency } = useCaseSelector((state) => ({
+        product: state.caseDetails.product,
+        version: state.caseDetails.version,
+        summary: state.caseDetails.summary,
+        issue: state.caseDetails.issue,
+        environment: state.caseDetails.environment,
+        periodicityOfIssue: state.caseDetails.periodicityOfIssue,
+        timeFramesAndUrgency: state.caseDetails.timeFramesAndUrgency,
+    }), isEqual);
     const onLinkClick = (item) => (event) => {
         props.onResourceClick && props.onResourceClick(item);
     };
-    return (React.createElement(React.Fragment, null,
-        props.helperText ? (React.createElement(Tooltip, { content: React.createElement("div", null, props.helperText) },
-            React.createElement("pfe-accordion-header", { "data-tracking-id": `top-content-accordion-header-${props.topContentIndex}` },
-                React.createElement("h3", null, props.name)))) : (React.createElement("pfe-accordion-header", { "data-tracking-id": `top-content-accordion-header-${props.topContentIndex}` },
-            React.createElement("h3", null, props.name))),
-        React.createElement("pfe-accordion-panel", null,
-            React.createElement("ul", { className: "list-flushleft" }, map(props.items, (item, i) => (React.createElement("li", { key: i + item.contentTitle },
-                React.createElement("p", null,
-                    React.createElement("a", { className: "se-recommended ts-top-problems", "data-tracking-id": "se-recommended-top-content", onClick: onLinkClick(item), href: `${item.contentUrl}?${RouteUtils.getSEResourceQueryParams(props.seSessionId, props.seResourceOriginID, SessionResourceSource.TOP_CONTENT)}`, target: "_blank", rel: "noopener noreferrer" }, item.contentTitle)))))))));
+    const onToggle = (id) => {
+        if (id === expanded) {
+            setExpanded('');
+        }
+        else {
+            setExpanded(id);
+            onTopContentTabClicked(props.items);
+        }
+    };
+    // when user opens a top content tab, presented resouces are sent to session api
+    const onTopContentTabClicked = (docs) => {
+        createOrUpdateSessionResources(sessionRestoreDispatch, activeSessionId, sessionResourceTracking, SessionResourceSource.TOP_CONTENT, docs.map((doc, index) => getSessResTC(doc, SessionResourceVisibility.PRESENTED, index + 1)), JSON.stringify({
+            product,
+            version,
+            summary,
+            description: getDescriptionWOQues(issue, environment, periodicityOfIssue, timeFramesAndUrgency),
+        }));
+    };
+    return (React.createElement(React.Fragment, null, props.helperText ? (React.createElement(Tooltip, { content: React.createElement("div", null, props.helperText) },
+        React.createElement(Accordion, { isBordered: true },
+            React.createElement(AccordionItem, null,
+                React.createElement(AccordionToggle, { onClick: () => {
+                        onToggle(`${props.topContentIndex}`);
+                    }, isExpanded: expanded === `${props.topContentIndex}`, "data-tracking-id": `top-content-accordion-header-${props.topContentIndex}`, id: `${props.topContentIndex}` },
+                    React.createElement("h3", null, props.name)),
+                React.createElement(AccordionContent, { id: `${props.topContentIndex}`, isHidden: expanded !== `${props.topContentIndex}` },
+                    React.createElement("ul", { className: "list-flushleft", style: { listStyleType: 'disc' } }, map(props.items, (item, i) => (React.createElement("li", { key: i + item.contentTitle },
+                        React.createElement("p", null,
+                            React.createElement("a", { className: "se-recommended ts-top-problems", "data-tracking-id": "se-recommended-top-content", onClick: onLinkClick(item), href: `${item.contentUrl}?${RouteUtils.getSEResourceQueryParams(props.seSessionId, props.seResourceOriginID, SessionResourceSource.TOP_CONTENT)}`, target: "_blank", rel: "noopener noreferrer" }, item.contentTitle))))))))))) : (React.createElement(Accordion, { isBordered: true },
+        React.createElement(AccordionItem, null,
+            React.createElement(AccordionToggle, { onClick: () => {
+                    onToggle(`${props.topContentIndex}`);
+                }, isExpanded: expanded === `${props.topContentIndex}`, "data-tracking-id": `top-content-accordion-header-${props.topContentIndex}`, id: `${props.topContentIndex}` },
+                React.createElement("h3", null, props.name)),
+            React.createElement(AccordionContent, { id: `${props.topContentIndex}`, isHidden: expanded !== `${props.topContentIndex}` },
+                React.createElement("ul", { className: "list-flushleft", style: { listStyleType: 'disc' } }, map(props.items, (item, i) => (React.createElement("li", { key: i + item.contentTitle },
+                    React.createElement("p", null,
+                        React.createElement("a", { className: "se-recommended ts-top-problems", "data-tracking-id": "se-recommended-top-content", onClick: onLinkClick(item), href: `${item.contentUrl}?${RouteUtils.getSEResourceQueryParams(props.seSessionId, props.seResourceOriginID, SessionResourceSource.TOP_CONTENT)}`, target: "_blank", rel: "noopener noreferrer" }, item.contentTitle))))))))))));
 }

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

@@ -1,3 +1,4 @@
+import React from 'react';
 interface IProps {
     inlineEditable: boolean;
     initialIsEditing?: boolean;
@@ -6,7 +7,7 @@ interface IProps {
     autoFocus?: boolean;
     hideSaveCancel?: boolean;
 }
-declare function TroubleshootSection(props: IProps): JSX.Element;
+declare function TroubleshootSection(props: IProps): React.JSX.Element;
 declare namespace TroubleshootSection {
     var defaultProps: Partial<IProps>;
 }

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":"AAmBA,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,eA4GzC;kBA5GQ,mBAAmB;;;AA+G5B,eAAe,mBAAmB,CAAC"}
+{"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"}

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

@@ -1,7 +1,6 @@
-import { Card, CardBody, CardHeader, CardTitle } from '@patternfly/react-core';
+import { Card, CardBody, CardHeader, CardTitle, 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 { GlobalMetadataStateContext } from '@rh-support/react-context';
-import { ability, CaseListFields, resourceActions, resources } from '@rh-support/user-permissions';
 import { PreviousCaseTypes } from '@rh-support/utils';
 import isEmpty from 'lodash/isEmpty';
 import isEqual from 'lodash/isEqual';
@@ -9,8 +8,6 @@ import React, { useContext } from 'react';
 import { Trans, useTranslation } from 'react-i18next';
 import { useCaseSelector } from '../../context/CaseContext';
 import { TCStateContext } from '../../context/TopContentContext';
-// import { isClusterIdEnabledForProduct } from '../../utils/caseOpenshiftClusterIdUtils';
-import { FileDiag } from '../CaseInformation/FileDiag';
 import { OpenShiftClusterId } from '../CaseManagement/OpenShiftClusterId';
 import ClusterRecommendations from '../Recommendations/ClusterRecommendations';
 import InsightsResults from '../Recommendations/InsightsResults';
@@ -26,47 +23,41 @@ function TroubleshootSection(props) {
     var _a;
     const { t } = useTranslation();
     const { topContentState: { topContent }, } = useContext(TCStateContext);
-    const { globalMetadataState: { loggedInUsersAccount }, } = useContext(GlobalMetadataStateContext);
     const { product, version, isCreatingCase, caseType } = useCaseSelector((state) => ({
         product: state.caseDetails.product,
         version: state.caseDetails.version,
+        summary: state.caseDetails.summary,
         isCreatingCase: state.isCreatingCase,
         caseType: state.caseDetails.caseType,
+        issue: state.caseDetails.issue,
     }), isEqual);
     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 canAddAttachments = ability.can(resourceActions.PATCH, resources.CASE_CREATE, CaseListFields.ATTACHMENTS);
     const isNotAnIdea = caseType !== PreviousCaseTypes.FEATURE_ENHANCEMENT;
     return (React.createElement(React.Fragment, null,
-        !isCreatingCase && (React.createElement(OpenShiftClusterId, { className: "push-bottom", "data-tracking-id": "troubleshoot-section-openshift-cluster-id" })),
         React.createElement("section", null,
             React.createElement("header", null,
-                React.createElement("h3", null,
-                    React.createElement("p", { className: "selected-product-suggestion" },
-                        t('Because you selected'),
-                        " ",
-                        React.createElement("b", null, product))),
-                React.createElement(LoadingDots, { show: topContent.isFetching }),
-                topContent.data.length === 0 && (React.createElement(Card, { id: "card", className: "card-support top-recommendations pf-u-mb-md", isCompact: true },
-                    React.createElement(CardHeader, { "aria-label": t('Popular solutions and docs'), className: "popular-solutions" },
-                        React.createElement(CardTitle, { id: "card-title", className: "card-title" },
-                            React.createElement(Trans, { i18nKey: 'i18nKeyPopularSolutions' }, "Popular solutions and docs"))),
-                    React.createElement(CardBody, { "aria-label": t('No recommendations for this product'), className: "file-recs-no-recommendation pf-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-u-mt-lg" }))),
-        React.createElement("section", { className: "pf-u-mt-lg" },
-            isNotAnIdea && (React.createElement(InsightsResults, { isDisplayOnMain: true, "data-tracking-id": "troubleshoot-section-file-recs" })),
-            React.createElement("div", { className: "pf-u-mt-lg" }, canAddAttachments ? (React.createElement(FileDiag, null)) : (React.createElement(React.Fragment, null,
-                React.createElement(Card, { id: "card", className: "card-support card-white file-diag", isCompact: true },
-                    React.createElement(CardHeader, { "aria-label": !isNotAnIdea || loggedInUsersAccount.data.secureSupport
-                            ? t('File uploader')
-                            : t('Upload file to analyze'), className: "card-heading" },
-                        React.createElement(CardTitle, { id: "card-title", className: "card-title" }, !isNotAnIdea || loggedInUsersAccount.data.secureSupport ? (React.createElement(Trans, null, "File uploader")) : (React.createElement(Trans, null, "Upload file to analyze")))),
-                    React.createElement(CardBody, { "aria-label": t('No recommendations for this product'), className: "no-access-file-diag" },
-                        React.createElement("div", { className: "display-dashed pf-u-font-weight-bold pf-u-text-align-center pf-u-mt-md" },
-                            React.createElement(Trans, null, "You do not have access to upload files"),
-                            ".")))))))));
+                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" })),
+            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" },
+                    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" })))));
 }
 TroubleshootSection.defaultProps = defaultProps;
 export default TroubleshootSection;

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

@@ -1,9 +1,10 @@
+import React from 'react';
 interface IProps {
     isDisabled?: boolean;
     isFetching?: boolean;
     show: boolean;
     onClose: () => void;
 }
-export default function UpdateSeverityModal(props: IProps): JSX.Element;
+export default function UpdateSeverityModal(props: IProps): React.JSX.Element;
 export {};
 //# sourceMappingURL=UpdateSeverityModal.d.ts.map

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":"AAuCA,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,eAgZxD"}
+{"version":3,"file":"UpdateSeverityModal.d.ts","sourceRoot":"","sources":["../../../../src/components/UpdateSeverityModal/UpdateSeverityModal.tsx"],"names":[],"mappings":"AAgCA,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,qBA+kBxD"}