@rh-support/troubleshoot 2.2.153 → 2.2.155

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (8) hide show
  1. package/lib/esm/components/CaseInformation/Description.d.ts.map +1 -1
  2. package/lib/esm/components/CaseInformation/Description.js +32 -18
  3. package/lib/esm/components/ImproveCase/KtQuestions.d.ts.map +1 -1
  4. package/lib/esm/components/ImproveCase/KtQuestions.js +8 -12
  5. package/lib/esm/components/Recommendations/Recommendations.d.ts.map +1 -1
  6. package/lib/esm/components/Recommendations/Recommendations.js +10 -2
  7. package/lib/esm/scss/_main.scss +4 -0
  8. package/package.json +2 -2
package/lib/esm/components/CaseInformation/Description.d.ts.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"Description.d.ts","sourceRoot":"","sources":["../../../../src/components/CaseInformation/Description.tsx"],"names":[],"mappings":"AAQA,OAAO,KAAmB,MAAM,OAAO,CAAC;AAQxC,UAAU,MAAM;IACZ,cAAc,CAAC,EAAE,OAAO,CAAC;IACzB,cAAc,CAAC,EAAE,OAAO,CAAC;IACzB,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,kBAAkB,CAAC,EAAE,OAAO,CAAC;CAChC;AAED,MAAM,CAAC,OAAO,UAAU,WAAW,CAAC,KAAK,EAAE,MAAM,qBAgLhD"}
1
+ {"version":3,"file":"Description.d.ts","sourceRoot":"","sources":["../../../../src/components/CaseInformation/Description.tsx"],"names":[],"mappings":"AAQA,OAAO,KAAsC,MAAM,OAAO,CAAC;AAQ3D,UAAU,MAAM;IACZ,cAAc,CAAC,EAAE,OAAO,CAAC;IACzB,cAAc,CAAC,EAAE,OAAO,CAAC;IACzB,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,kBAAkB,CAAC,EAAE,OAAO,CAAC;CAChC;AAED,MAAM,CAAC,OAAO,UAAU,WAAW,CAAC,KAAK,EAAE,MAAM,qBA6KhD"}
package/lib/esm/components/CaseInformation/Description.js CHANGED
@@ -1,11 +1,11 @@
1
- import { Badge, Button, Popover, Split, SplitItem, TextArea } from '@patternfly/react-core';
1
+ import { Badge, Button, Popover, TextArea } from '@patternfly/react-core';
2
2
  import HelpIcon from '@patternfly/react-icons/dist/js/icons/help-icon';
3
3
  // import ArrowRightIcon from '@patternfly/react-icons/dist/js/icons/arrow-right-icon'; This will be used for the Learn More button
4
4
  import StarIcon from '@patternfly/react-icons/dist/js/icons/star-icon';
5
5
  import { InlineEdit, useBreakpoint } from '@rh-support/components';
6
6
  import isEmpty from 'lodash/isEmpty';
7
7
  import isEqual from 'lodash/isEqual';
8
- import React, { useState } from 'react';
8
+ import React, { useEffect, useRef, useState } from 'react';
9
9
  import { Trans, useTranslation } from 'react-i18next';
10
10
  import { useCaseDispatch, useCaseSelector } from '../../context/CaseContext';
11
11
  import { CASE_DETAILS_ISSUE_LIMIT } from '../../reducers/CaseConstNTypes';
@@ -27,6 +27,13 @@ export default function Description(props) {
27
27
  const caseDispatch = useCaseDispatch();
28
28
  const breakPoint = useBreakpoint();
29
29
  const isLgScreenHeight = breakPoint.lgh; // min-height: 1100px
30
+ const [isOpen, setIsOpen] = useState(false);
31
+ const [hasShownPopover, setHasShownPopover] = useState(false);
32
+ const textAreaRef = useRef(null);
33
+ useEffect(() => {
34
+ const hasShown = localStorage.getItem('hasShownDescriptionPopover');
35
+ setHasShownPopover(hasShown === 'true');
36
+ }, []);
30
37
  const onCaseDetailsChange = (caseDetails) => {
31
38
  setCaseDetails(caseDispatch, caseDetails);
32
39
  };
@@ -35,32 +42,39 @@ export default function Description(props) {
35
42
  const newDescription = getUpdatedDescription(ktQ1Local, environment, periodicityOfIssue, timeFramesAndUrgency, v3ClusterName);
36
43
  onCaseDetailsChange({ issue: ktQ1Local, description: newDescription });
37
44
  };
38
- const isKT1Required = true;
39
- const [isOpen, setIsOpen] = useState(false);
45
+ const handleTextAreaClick = () => {
46
+ if (!hasShownPopover) {
47
+ setIsOpen(true);
48
+ setHasShownPopover(true);
49
+ localStorage.setItem('hasShownDescriptionPopover', 'true');
50
+ }
51
+ };
40
52
  const handleToggle = () => {
41
53
  setIsOpen(!isOpen);
42
54
  };
43
55
  const handleClose = () => {
44
56
  setIsOpen(false);
45
57
  };
58
+ const isKT1Required = true;
59
+ const headerPopoverContent = (React.createElement("div", null,
60
+ React.createElement("div", null,
61
+ React.createElement(Trans, null, "Describe your problem clearly for faster solutions")),
62
+ React.createElement("div", null,
63
+ React.createElement(Badge, { isRead: true, className: 'badge-icon-info' },
64
+ React.createElement(StarIcon, { className: "star-icon-info" }),
65
+ " ",
66
+ React.createElement(Trans, null, "New")))));
67
+ const PopoverContent = (React.createElement("div", null,
68
+ React.createElement("div", { className: "popover-body-info-description" },
69
+ React.createElement("p", null,
70
+ React.createElement(Trans, null, "Tell us what you've already done, and include error messages and screenshots. We'll share articles to help you troubleshoot before opening a ticket.")))));
46
71
  return (React.createElement(InlineEdit, { labelContent: React.createElement(React.Fragment, null, props.customTitle ? (props.customTitle) : (React.createElement(React.Fragment, null,
47
72
  React.createElement(Trans, null, "Describe your problem. Include specific actions and error messages."),
48
73
  isKT1Required && (React.createElement("span", { className: "form-required", "aria-hidden": true }, "*")),
49
- React.createElement(Popover, { hasAutoWidth: true, position: 'right', isVisible: isOpen, shouldClose: handleClose, headerContent: React.createElement("div", null,
50
- React.createElement("div", null, "Describe your problem clearly for faster solutions"),
51
- React.createElement("div", null,
52
- React.createElement(Badge, { isRead: true, className: 'badge-icon-info' },
53
- React.createElement(StarIcon, { className: "star-icon-info" }),
54
- " New"))), bodyContent: React.createElement("div", { className: "popover-body-info-description" },
55
- React.createElement("p", null, "Providing a detailed problem description helps us suggest the most relevant solutions quickly. Please include specific actions, error messages, and any relevant screenshots."),
56
- React.createElement("p", null,
57
- React.createElement("strong", null, "Maximum input will help us recommend articles that might solve your issue without creating a ticket.")),
58
- React.createElement("p", null, "For tips on crafting an effective problem description, refer to our \"Tips for describing your problem\" guide.")), footerContent: React.createElement(Split, { hasGutter: true },
59
- React.createElement(SplitItem, null,
60
- React.createElement(Button, { variant: "primary", onClick: handleClose }, "Got it"))) },
61
- React.createElement(Button, { variant: "plain", "aria-label": "More info for problem description", onClick: handleToggle },
74
+ React.createElement(Popover, { position: 'right', isVisible: isOpen, shouldClose: handleClose, headerContent: headerPopoverContent, bodyContent: PopoverContent },
75
+ React.createElement(Button, { variant: "plain", "aria-label": "More info for problem description", onClick: handleToggle, className: "pf-v5-u-pl-sm kt-question-help-icon" },
62
76
  React.createElement(HelpIcon, null)))))), labelProps: { htmlFor: 'get-support-ktQ1-issue' }, content: issue, allowInlineEdit: !!props.inlineEditable, hideSaveCancel: !!props.hideSaveCancel, initialIsEditing: isEmpty(issue), usePreformattedTag: true, saveOnBlur: true },
63
- React.createElement(TextArea, { id: "get-support-ktQ1-issue", name: "get-support-ktQ1-issue", className: (isEmpty(summary) || isEmpty(version)) && isEmpty(issue) ? 'kt1-disabled' : '', "aria-invalid": (issue === null || issue === void 0 ? void 0 : issue.length) > CASE_DETAILS_ISSUE_LIMIT ? 'true' : 'false', "aria-required": isKT1Required, isRequired: isKT1Required, value: issue, disabled: (isEmpty(summary) || isEmpty(version)) && isEmpty(issue), isDisabled: hasLargeCaseDescription && isEmpty(issue), onChange: (e, value) => onKTQ1IssueChange(value, e), "data-tracking-id": "get-support-ktQ1-issue", placeholder: t(`The more detail that you include, the easier it is for us to help you. \nExample: \nI’m unable to start the SSHD service and am receiving the error message “Bad yes/no \nargument for ShowPatchLevel parameter”`), resizeOrientation: "vertical", validated: props.isSummarizeInvalid ? 'error' : 'default', rows: isLgScreenHeight ? 10 : 4 }),
77
+ React.createElement(TextArea, { id: "get-support-ktQ1-issue", name: "get-support-ktQ1-issue", className: (isEmpty(summary) || isEmpty(version)) && isEmpty(issue) ? 'kt1-disabled' : '', "aria-invalid": (issue === null || issue === void 0 ? void 0 : issue.length) > CASE_DETAILS_ISSUE_LIMIT ? 'true' : 'false', "aria-required": isKT1Required, isRequired: isKT1Required, value: issue, disabled: (isEmpty(summary) || isEmpty(version)) && isEmpty(issue), isDisabled: hasLargeCaseDescription && isEmpty(issue), onChange: (e, value) => onKTQ1IssueChange(value, e), "data-tracking-id": "get-support-ktQ1-issue", placeholder: t(`The more detail that you include, the easier it is for us to help you. \nExample: \nI'm unable to start the SSHD service and am receiving the error message "Bad yes/no \nargument for ShowPatchLevel parameter"`), resizeOrientation: "vertical", validated: props.isSummarizeInvalid ? 'error' : 'default', rows: isLgScreenHeight ? 10 : 4, ref: textAreaRef, onClick: handleTextAreaClick }),
64
78
  React.createElement("p", { className: "form-instructions pf-v5-u-danger-color-100", "data-tracking-id": "large-20k-warning-ktQ1-environment" }, `${(issue === null || issue === void 0 ? void 0 : issue.length) > CASE_DETAILS_ISSUE_LIMIT
65
79
  ? `This description exceeds ${CASE_DETAILS_ISSUE_LIMIT}. Try shortening it.`
66
80
  : ''}`)));
package/lib/esm/components/ImproveCase/KtQuestions.d.ts.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"KtQuestions.d.ts","sourceRoot":"","sources":["../../../../src/components/ImproveCase/KtQuestions.tsx"],"names":[],"mappings":"AAKA,OAAO,KAA0C,MAAM,OAAO,CAAC;AAkB/D,UAAU,MAAM;IACZ,cAAc,CAAC,EAAE,OAAO,CAAC;IACzB,cAAc,CAAC,EAAE,OAAO,CAAC;IACzB,WAAW,CAAC,EAAE,OAAO,CAAC;CACzB;AAGD,iBAAS,WAAW,CAAC,KAAK,EAAE,MAAM,qBAsWjC;kBAtWQ,WAAW;;;AAwWpB,eAAe,WAAW,CAAC"}
1
+ {"version":3,"file":"KtQuestions.d.ts","sourceRoot":"","sources":["../../../../src/components/ImproveCase/KtQuestions.tsx"],"names":[],"mappings":"AAKA,OAAO,KAA0C,MAAM,OAAO,CAAC;AAkB/D,UAAU,MAAM;IACZ,cAAc,CAAC,EAAE,OAAO,CAAC;IACzB,cAAc,CAAC,EAAE,OAAO,CAAC;IACzB,WAAW,CAAC,EAAE,OAAO,CAAC;CACzB;AAGD,iBAAS,WAAW,CAAC,KAAK,EAAE,MAAM,qBA8VjC;kBA9VQ,WAAW;;;AAgWpB,eAAe,WAAW,CAAC"}
package/lib/esm/components/ImproveCase/KtQuestions.js CHANGED
@@ -76,23 +76,19 @@ function KtQuestions(props) {
76
76
  const invalidateQT4 = (value) => {
77
77
  return isEmpty(value) && hasFocusedLostKT4;
78
78
  };
79
- const [isQ2Empty, setIsQ2Empty] = useState(false);
80
- const [isQ3Empty, setIsQ3Empty] = useState(false);
81
79
  const [isQ4Empty, setIsQ4Empty] = useState(false);
82
80
  const [hasLargeQ2, setHasLargeQ2] = useState(false);
83
81
  const [hasLargeQ3, setHasLargeQ3] = useState(false);
84
82
  const [hasLargeQ4, setHasLargeQ4] = useState(false);
85
83
  useEffect(() => {
86
- setIsQ2Empty(environment ? isEmpty(environment.trim()) : true);
87
- setIsQ3Empty(periodicityOfIssue ? isEmpty(periodicityOfIssue.trim()) : true);
88
84
  setIsQ4Empty(timeFramesAndUrgency ? isEmpty(timeFramesAndUrgency.trim()) : true);
89
85
  environment && setHasLargeQ2(environment.length > KTQUESTION_MAX_LIMIT);
90
86
  periodicityOfIssue && setHasLargeQ3(periodicityOfIssue.length > KTQUESTION_MAX_LIMIT);
91
87
  timeFramesAndUrgency && setHasLargeQ4(timeFramesAndUrgency.length > KTQUESTION_MAX_LIMIT);
92
88
  // @ts-ignore
93
89
  }, [environment, periodicityOfIssue, timeFramesAndUrgency]);
94
- const getQ2Invalid = () => hasLargeQ2 || (isNextBtnClickedToShowValidationError && isQ2Empty);
95
- const getQ3Invalid = () => hasLargeQ3 || (isNextBtnClickedToShowValidationError && isQ3Empty);
90
+ const getQ2Invalid = () => hasLargeQ2;
91
+ const getQ3Invalid = () => hasLargeQ3;
96
92
  const getQ4Invalid = () => hasLargeQ4 || (isNextBtnClickedToShowValidationError && isQ4Empty);
97
93
  const getVariantQ2 = () => {
98
94
  if (getQ2Invalid())
@@ -134,7 +130,7 @@ function KtQuestions(props) {
134
130
  React.createElement(InlineEdit, { labelProps: { htmlFor: 'ktQ4-timeFramesAndUrgency' }, labelContent: React.createElement(React.Fragment, null,
135
131
  t(KtQuestionConstant.timeFramesAndUrgency),
136
132
  ' ',
137
- isKT4Required && (React.createElement("span", { className: "form-required", "aria-hidden": true }, "*"))), allowInlineEdit: props.inlineEditable, hideSaveCancel: props.hideSaveCancel, initialIsEditing: isEmpty(timeFramesAndUrgency), usePreformattedTag: true, saveOnBlur: true, content: timeFramesAndUrgency },
133
+ isKT4Required && (React.createElement("span", { className: "form-required", "aria-hidden": true }, "*"))), allowInlineEdit: props.inlineEditable, hideSaveCancel: props.hideSaveCancel, initialIsEditing: isEmpty(timeFramesAndUrgency) || timeFramesAndUrgency.length > KTQUESTION_MAX_LIMIT, usePreformattedTag: true, saveOnBlur: true, content: timeFramesAndUrgency },
138
134
  React.createElement(TextArea, { validated: invalidateQT4(timeFramesAndUrgency) ||
139
135
  (isNextBtnClickedToShowValidationError && isEmpty(timeFramesAndUrgency)) ||
140
136
  isKTQ4InValid
@@ -142,24 +138,24 @@ function KtQuestions(props) {
142
138
  : 'default', "aria-invalid": timeFramesAndUrgency && (timeFramesAndUrgency === null || timeFramesAndUrgency === void 0 ? void 0 : timeFramesAndUrgency.length) > CASE_DETAILS_TIMEFRAMESANDURGENCY_LIMIT
143
139
  ? 'true'
144
140
  : 'false', id: "ktQ4-timeFramesAndUrgency", value: timeFramesAndUrgency, isDisabled: isEmpty(timeFramesAndUrgency) && hasLargeCaseDescription && !isKTQ4TextAreaActive, onChange: (e, value) => onKtQ4Change(value, e), onFocus: onKTQ4FocusChange, onBlur: onKTQ4FocusChange, "aria-required": isKT4Required, "data-tracking-id": "get-support-ktQ4-timeFramesAndUrgency", placeholder: t('Describe the user or financial impact. Tell us about any legal, national, or medical urgency.'), isRequired: isKT4Required, resizeOrientation: "vertical", rows: 5 }),
145
- React.createElement(Progress, { value: timeFramesAndUrgency === null || timeFramesAndUrgency === void 0 ? void 0 : timeFramesAndUrgency.length, min: 0, max: KTQUESTION_MAX_LIMIT, size: ProgressSize.sm, label: `${timeFramesAndUrgency === null || timeFramesAndUrgency === void 0 ? void 0 : timeFramesAndUrgency.length} / ${KTQUESTION_MAX_LIMIT}`, valueText: `${timeFramesAndUrgency === null || timeFramesAndUrgency === void 0 ? void 0 : timeFramesAndUrgency.length} / ${KTQUESTION_MAX_LIMIT}`, measureLocation: ProgressMeasureLocation.top, "aria-label": `Progress - ${timeFramesAndUrgency === null || timeFramesAndUrgency === void 0 ? void 0 : timeFramesAndUrgency.length} / ${KTQUESTION_MAX_LIMIT}`, variant: getVariantQ4(), title: ' ', className: `pf-v5-u-mt-md ${!isNextBtnClickedToShowValidationError && isEmpty(timeFramesAndUrgency) ? 'gray' : ''} kt-progress-bar`, id: "summary-progress-bar" }),
141
+ React.createElement(Progress, { value: timeFramesAndUrgency === null || timeFramesAndUrgency === void 0 ? void 0 : timeFramesAndUrgency.length, min: 0, max: KTQUESTION_MAX_LIMIT, size: ProgressSize.sm, label: `${timeFramesAndUrgency === null || timeFramesAndUrgency === void 0 ? void 0 : timeFramesAndUrgency.length} / ${KTQUESTION_MAX_LIMIT}`, valueText: `${timeFramesAndUrgency === null || timeFramesAndUrgency === void 0 ? void 0 : timeFramesAndUrgency.length} / ${KTQUESTION_MAX_LIMIT}`, measureLocation: ProgressMeasureLocation.top, "aria-label": `Progress - ${timeFramesAndUrgency === null || timeFramesAndUrgency === void 0 ? void 0 : timeFramesAndUrgency.length} / ${KTQUESTION_MAX_LIMIT}`, variant: getVariantQ4(), title: ' ', className: `pf-v5-u-mt-md kt-progress-bar`, id: "summary-progress-bar" }),
146
142
  React.createElement("p", { className: "form-instructions pf-v5-u-danger-color-100", "data-tracking-id": "large-4k-warning-ktQ4-environment" }, `${(timeFramesAndUrgency === null || timeFramesAndUrgency === void 0 ? void 0 : timeFramesAndUrgency.length) > CASE_DETAILS_TIMEFRAMESANDURGENCY_LIMIT ? KTQ4LengthError : ''}`)),
147
143
  !props.onlyShowKT4 && (React.createElement(React.Fragment, null,
148
144
  React.createElement(InlineEdit, { labelProps: { htmlFor: 'ktQ2-environment' }, labelContent: React.createElement(React.Fragment, null,
149
145
  t(KtQuestionConstant.environment),
150
146
  ' ',
151
- isKT2Required && (React.createElement("span", { className: "form-required", "aria-hidden": true }, "*"))), allowInlineEdit: props.inlineEditable, hideSaveCancel: props.hideSaveCancel, initialIsEditing: isEmpty(environment), usePreformattedTag: true, saveOnBlur: true, content: environment },
147
+ isKT2Required && (React.createElement("span", { className: "form-required", "aria-hidden": true }, "*"))), allowInlineEdit: props.inlineEditable, hideSaveCancel: props.hideSaveCancel, initialIsEditing: isEmpty(environment) || environment.length > KTQUESTION_MAX_LIMIT, usePreformattedTag: true, saveOnBlur: true, content: environment },
152
148
  React.createElement(TextArea, { id: "ktQ2-environment", value: environment, isDisabled: isEmpty(environment) && hasLargeCaseDescription && !isKTQ2TextAreaActive, onChange: (e, value) => onKtQ2Change(value, e), onFocus: onKTQ2FocusChange, onBlur: onKTQ2FocusChange, "aria-required": isKT2Required, isRequired: isKT2Required, "data-tracking-id": "get-support-ktQ2-environment", "aria-invalid": environment && (environment === null || environment === void 0 ? void 0 : environment.length) > CASE_DEATILS_ENVIRONMENT_LIMIT ? 'true' : 'false', resizeOrientation: "vertical", placeholder: t('Please provide details about the location, device, software version, etc. where you encounter this issue'), rows: 5 }),
153
- React.createElement(Progress, { value: environment === null || environment === void 0 ? void 0 : environment.length, min: 0, max: KTQUESTION_MAX_LIMIT, size: ProgressSize.sm, label: `${environment === null || environment === void 0 ? void 0 : environment.length} / ${KTQUESTION_MAX_LIMIT}`, valueText: `${environment === null || environment === void 0 ? void 0 : environment.length} / ${KTQUESTION_MAX_LIMIT}`, measureLocation: ProgressMeasureLocation.top, "aria-label": `Progress - ${environment === null || environment === void 0 ? void 0 : environment.length} / ${KTQUESTION_MAX_LIMIT}`, variant: getVariantQ2(), title: ' ', className: `pf-v5-u-mt-md ${!isNextBtnClickedToShowValidationError && isEmpty(environment) ? 'gray' : ''} kt-progress-bar`, id: "summary-progress-bar" }),
149
+ React.createElement(Progress, { value: environment === null || environment === void 0 ? void 0 : environment.length, min: 0, max: KTQUESTION_MAX_LIMIT, size: ProgressSize.sm, label: `${environment === null || environment === void 0 ? void 0 : environment.length} / ${KTQUESTION_MAX_LIMIT}`, valueText: `${environment === null || environment === void 0 ? void 0 : environment.length} / ${KTQUESTION_MAX_LIMIT}`, measureLocation: ProgressMeasureLocation.top, "aria-label": `Progress - ${environment === null || environment === void 0 ? void 0 : environment.length} / ${KTQUESTION_MAX_LIMIT}`, variant: getVariantQ2(), title: ' ', className: `pf-v5-u-mt-md kt-progress-bar`, id: "summary-progress-bar" }),
154
150
  React.createElement("p", { className: "form-instructions pf-v5-u-danger-color-100", "data-tracking-id": "large-4k-warning-ktQ2-environment" }, `${(environment === null || environment === void 0 ? void 0 : environment.length) > KTQUESTION_MAX_LIMIT ? KTQ2LengthError : ''}`)),
155
151
  React.createElement(InlineEdit, { labelProps: { htmlFor: 'ktQ3-periodicityOfIssue' }, labelContent: React.createElement(React.Fragment, null,
156
152
  t(KtQuestionConstant.periodicityOfIssue),
157
153
  ' ',
158
- isKT3Required && (React.createElement("span", { className: "form-required", "aria-hidden": true }, "*"))), allowInlineEdit: props.inlineEditable, hideSaveCancel: props.hideSaveCancel, initialIsEditing: isEmpty(periodicityOfIssue), usePreformattedTag: true, saveOnBlur: true, content: periodicityOfIssue },
154
+ isKT3Required && (React.createElement("span", { className: "form-required", "aria-hidden": true }, "*"))), allowInlineEdit: props.inlineEditable, hideSaveCancel: props.hideSaveCancel, initialIsEditing: isEmpty(periodicityOfIssue) || periodicityOfIssue.length > KTQUESTION_MAX_LIMIT, usePreformattedTag: true, saveOnBlur: true, content: periodicityOfIssue },
159
155
  React.createElement(TextArea, { id: "ktQ3-periodicityOfIssue", value: periodicityOfIssue, isDisabled: isEmpty(periodicityOfIssue) && hasLargeCaseDescription && !isKTQ3TextAreaActive, onChange: (e, value) => onKtQ3Change(value, e), onFocus: onKTQ3FocusChange, onBlur: onKTQ3FocusChange, "aria-required": isKT3Required, isRequired: isKT3Required, "data-tracking-id": "get-support-ktQ3-periodicityOfIssue", "aria-invalid": periodicityOfIssue && (periodicityOfIssue === null || periodicityOfIssue === void 0 ? void 0 : periodicityOfIssue.length) > CASE_DEATILS_PERIODICITYOFISSUE_LIMIT
160
156
  ? 'true'
161
157
  : 'false', resizeOrientation: "vertical", placeholder: t('Describe when and how often the problem occurs, e.g., daily, after specific actions, at particular times of day, etc.'), rows: 5 }),
162
- React.createElement(Progress, { value: periodicityOfIssue === null || periodicityOfIssue === void 0 ? void 0 : periodicityOfIssue.length, min: 0, max: KTQUESTION_MAX_LIMIT, size: ProgressSize.sm, label: `${periodicityOfIssue === null || periodicityOfIssue === void 0 ? void 0 : periodicityOfIssue.length} / ${KTQUESTION_MAX_LIMIT}`, valueText: `${periodicityOfIssue === null || periodicityOfIssue === void 0 ? void 0 : periodicityOfIssue.length} / ${KTQUESTION_MAX_LIMIT}`, measureLocation: ProgressMeasureLocation.top, "aria-label": `Progress - ${periodicityOfIssue === null || periodicityOfIssue === void 0 ? void 0 : periodicityOfIssue.length} / ${KTQUESTION_MAX_LIMIT}`, variant: getVariantQ3(), title: ' ', className: `pf-v5-u-mt-md ${!isNextBtnClickedToShowValidationError && isEmpty(periodicityOfIssue) ? 'gray' : ''} kt-progress-bar`, id: "summary-progress-bar" }),
158
+ React.createElement(Progress, { value: periodicityOfIssue === null || periodicityOfIssue === void 0 ? void 0 : periodicityOfIssue.length, min: 0, max: KTQUESTION_MAX_LIMIT, size: ProgressSize.sm, label: `${periodicityOfIssue === null || periodicityOfIssue === void 0 ? void 0 : periodicityOfIssue.length} / ${KTQUESTION_MAX_LIMIT}`, valueText: `${periodicityOfIssue === null || periodicityOfIssue === void 0 ? void 0 : periodicityOfIssue.length} / ${KTQUESTION_MAX_LIMIT}`, measureLocation: ProgressMeasureLocation.top, "aria-label": `Progress - ${periodicityOfIssue === null || periodicityOfIssue === void 0 ? void 0 : periodicityOfIssue.length} / ${KTQUESTION_MAX_LIMIT}`, variant: getVariantQ3(), title: ' ', className: `pf-v5-u-mt-md kt-progress-bar`, id: "summary-progress-bar" }),
163
159
  React.createElement("p", { className: "form-instructions pf-v5-u-danger-color-100", "data-tracking-id": "large-4k-warning-ktQ3-environment" }, `${(periodicityOfIssue === null || periodicityOfIssue === void 0 ? void 0 : periodicityOfIssue.length) > CASE_DEATILS_PERIODICITYOFISSUE_LIMIT ? KTQ3LengthError : ''}`))))));
164
160
  }
165
161
  KtQuestions.defaultProps = defaultProps;
package/lib/esm/components/Recommendations/Recommendations.d.ts.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"Recommendations.d.ts","sourceRoot":"","sources":["../../../../src/components/Recommendations/Recommendations.tsx"],"names":[],"mappings":"AAmBA,OAAO,KAAkD,MAAM,OAAO,CAAC;AAEvE,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;IACjD,uBAAuB,CAAC,EAAE,CAAC,KAAK,EAAE,KAAK,CAAC,cAAc,CAAC,OAAO,CAAC,KAAK,IAAI,CAAC;CAC5E;AAED,MAAM,CAAC,OAAO,UAAU,eAAe,CAAC,KAAK,EAAE,MAAM,qBAgRpD"}
1
+ {"version":3,"file":"Recommendations.d.ts","sourceRoot":"","sources":["../../../../src/components/Recommendations/Recommendations.tsx"],"names":[],"mappings":"AAmBA,OAAO,KAAkD,MAAM,OAAO,CAAC;AAEvE,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;IACjD,uBAAuB,CAAC,EAAE,CAAC,KAAK,EAAE,KAAK,CAAC,cAAc,CAAC,OAAO,CAAC,KAAK,IAAI,CAAC;CAC5E;AAED,MAAM,CAAC,OAAO,UAAU,eAAe,CAAC,KAAK,EAAE,MAAM,qBA0RpD"}
package/lib/esm/components/Recommendations/Recommendations.js CHANGED
@@ -49,7 +49,12 @@ export default function Recommendations(props) {
49
49
  const MAXROW = 24;
50
50
  const recPageSize = pageSize !== null && pageSize !== void 0 ? pageSize : DEFAULTPAGESIZE;
51
51
  const abortControllerRef = useRef(undefined);
52
- const payload = { product: product, version: version, summary: summary + ' ' + (issue ? issue : '') };
52
+ const payload = {
53
+ product: product,
54
+ version: version,
55
+ summary: summary,
56
+ description: issue, // we don't need to truncate to 20k as Watsonx max recs is 4000 done for us already
57
+ };
53
58
  const isRecSearchPayloadSame = isEqual(payload, recommendationState.prevRecommendationsBody);
54
59
  useEffect(() => {
55
60
  // currently due to the debounce we use after the page load leads to some delay in the disbaling of next button
@@ -85,7 +90,6 @@ export default function Recommendations(props) {
85
90
  !loggedInUsersAccount.data.secureSupport
86
91
  ? fetchWatsonXRecommendations(recommendationDispatch, payload, MAXROW, recPageSize, 0, true, queryFilters, controller.signal)
87
92
  : fetchRecommendations(recommendationDispatch, payload, MAXROW, recPageSize, 0, true, caseNumber, isSecureSupportAccount, queryFilters, controller.signal);
88
- props.userSeenRecommendations && props.userSeenRecommendations(true);
89
93
  recommendationDispatch({
90
94
  type: RecommendationsConstants.userViewedDocs,
91
95
  payload: { userViewedDocs: true },
@@ -102,6 +106,10 @@ export default function Recommendations(props) {
102
106
  issue,
103
107
  recommendationState.insightsKcsIds,
104
108
  ], 1000);
109
+ useEffect(() => {
110
+ props.userSeenRecommendations && props.userSeenRecommendations(!recommendationState.isLoadingRecommendations);
111
+ // eslint-disable-next-line react-hooks/exhaustive-deps
112
+ }, [recommendationState.isLoadingRecommendations]);
105
113
  useEffect(() => {
106
114
  if (recommendationState.isLoadingRecommendations)
107
115
  return;
package/lib/esm/scss/_main.scss CHANGED
@@ -1017,3 +1017,7 @@ svg.pf-v5-u-ml-xs.icon-size {
1017
1017
  margin-right: var(--pf-v5-global--spacer--xs);
1018
1018
  }
1019
1019
  }
1020
+
1021
+ .kt-question-help-icon {
1022
+ font-size: var(--pf-v5-global--icon--FontSize--md);
1023
+ }
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@rh-support/troubleshoot",
3
- "version": "2.2.153",
3
+ "version": "2.2.155",
4
4
  "publishConfig": {
5
5
  "access": "public",
6
6
  "registry": "https://registry.npmjs.org"
@@ -131,5 +131,5 @@
131
131
  "defaults and supports es6-module",
132
132
  "maintained node versions"
133
133
  ],
134
- "gitHead": "c83dfde6b2b3b941cf947014ae27f94b9581fb61"
134
+ "gitHead": "8bf0d1abbac3feb19b000ef2cd8e5a2505bc47ea"
135
135
  }