From af5ffc3316f6c67c270c02867f30857b7a44f9b4 Mon Sep 17 00:00:00 2001 From: Mike Turley Date: Wed, 20 Sep 2023 14:00:46 -0400 Subject: [PATCH 1/2] :sparkles: Add tooltip for auto-answered assessment questions Signed-off-by: Mike Turley --- client/public/locales/en/translation.json | 2 + client/src/app/api/models.ts | 1 + .../multi-input-selection.tsx | 39 ++++++++++++++++++- 3 files changed, 40 insertions(+), 2 deletions(-) diff --git a/client/public/locales/en/translation.json b/client/public/locales/en/translation.json index f7e7d3b991..fabae9032b 100644 --- a/client/public/locales/en/translation.json +++ b/client/public/locales/en/translation.json @@ -176,6 +176,8 @@ "reasonForError": "The reported reason for the error:", "reviewInstructions": "Use this section to provide your assessment of the possible migration/modernization plan and effort estimation.", "savingSelection": "Saving selection", + "selectedBecauseArchetypeTags": "Selected because the archetype has the {{tagOrTags}} {{tagList}}", + "selectedBecauseAppOrArchetypeTags": "Selected because the application or archetype has the {{tagOrTags}} {{tagList}}", "selectOwnerFromStakeholdersList": "Select owner from list of stakeholders", "suggestedAdoptionPlanHelpText": "The suggested approach to migration based on effort, priority, and dependencies.", "taskInProgressForTags": "A new analysis is in-progress. Tags may be updated upon completion.", diff --git a/client/src/app/api/models.ts b/client/src/app/api/models.ts index 78983090a6..804c807ee7 100644 --- a/client/src/app/api/models.ts +++ b/client/src/app/api/models.ts @@ -682,6 +682,7 @@ export interface Answer { mitigation?: string; applyTags?: CategorizedTag[]; autoAnswerFor?: CategorizedTag[]; + autoAnswered?: boolean; selected?: boolean; } export interface Thresholds { diff --git a/client/src/app/pages/assessment/components/questionnaire-form/multi-input-selection/multi-input-selection.tsx b/client/src/app/pages/assessment/components/questionnaire-form/multi-input-selection/multi-input-selection.tsx index f237960c37..51e29433ca 100644 --- a/client/src/app/pages/assessment/components/questionnaire-form/multi-input-selection/multi-input-selection.tsx +++ b/client/src/app/pages/assessment/components/questionnaire-form/multi-input-selection/multi-input-selection.tsx @@ -1,11 +1,14 @@ import React, { useMemo } from "react"; -import { Radio, Stack, StackItem } from "@patternfly/react-core"; +import { Icon, Radio, Stack, StackItem, Tooltip } from "@patternfly/react-core"; +import InfoCircleIcon from "@patternfly/react-icons/dist/esm/icons/info-circle-icon"; import { Question } from "@app/api/models"; import { HookFormPFGroupController } from "@app/components/HookFormPFFields"; import { useFormContext } from "react-hook-form"; import { getQuestionFieldName } from "../../../form-utils"; import { AssessmentWizardValues } from "@app/pages/assessment/components/assessment-wizard/assessment-wizard"; +import useIsArchetype from "@app/hooks/useIsArchetype"; +import { useTranslation } from "react-i18next"; export interface MultiInputSelectionProps { question: Question; @@ -21,6 +24,10 @@ export const MultiInputSelection: React.FC = ({ }, [question]); const questionFieldName = getQuestionFieldName(question, true); + + const isArchetype = useIsArchetype(); + const { t } = useTranslation(); + return ( {sortedOptions.map((option, i) => ( @@ -37,7 +44,35 @@ export const MultiInputSelection: React.FC = ({ onChange={(checked, e) => { onChange(option.text); }} - label={option.text} + aria-label={option.text} + label={ + <> + {option.autoAnswered && option.autoAnswerFor?.length ? ( + `"${t.tag}"`) + .join(", "), + } + )} + > + + + + + ) : null}{" "} + {option.text} + + } value={option.text} /> )} From d13f097ab3cbd153b3b95e4409cc442b59614cdc Mon Sep 17 00:00:00 2001 From: Mike Turley Date: Wed, 20 Sep 2023 14:05:36 -0400 Subject: [PATCH 2/2] Rephrase Signed-off-by: Mike Turley --- client/public/locales/en/translation.json | 4 ++-- .../multi-input-selection/multi-input-selection.tsx | 7 +------ 2 files changed, 3 insertions(+), 8 deletions(-) diff --git a/client/public/locales/en/translation.json b/client/public/locales/en/translation.json index fabae9032b..7fe9fd91c9 100644 --- a/client/public/locales/en/translation.json +++ b/client/public/locales/en/translation.json @@ -176,8 +176,8 @@ "reasonForError": "The reported reason for the error:", "reviewInstructions": "Use this section to provide your assessment of the possible migration/modernization plan and effort estimation.", "savingSelection": "Saving selection", - "selectedBecauseArchetypeTags": "Selected because the archetype has the {{tagOrTags}} {{tagList}}", - "selectedBecauseAppOrArchetypeTags": "Selected because the application or archetype has the {{tagOrTags}} {{tagList}}", + "selectedBecauseArchetypeTags": "Selected because the archetype's tags include {{tags}}", + "selectedBecauseAppOrArchetypeTags": "Selected because the application or archetype's tags include {{tags}}", "selectOwnerFromStakeholdersList": "Select owner from list of stakeholders", "suggestedAdoptionPlanHelpText": "The suggested approach to migration based on effort, priority, and dependencies.", "taskInProgressForTags": "A new analysis is in-progress. Tags may be updated upon completion.", diff --git a/client/src/app/pages/assessment/components/questionnaire-form/multi-input-selection/multi-input-selection.tsx b/client/src/app/pages/assessment/components/questionnaire-form/multi-input-selection/multi-input-selection.tsx index 51e29433ca..5a74d2d966 100644 --- a/client/src/app/pages/assessment/components/questionnaire-form/multi-input-selection/multi-input-selection.tsx +++ b/client/src/app/pages/assessment/components/questionnaire-form/multi-input-selection/multi-input-selection.tsx @@ -54,12 +54,7 @@ export const MultiInputSelection: React.FC = ({ ? "message.selectedBecauseArchetypeTags" : "message.selectedBecauseAppOrArchetypeTags", { - tagOrTags: t( - option.autoAnswerFor.length === 1 - ? "terms.tag" - : "terms.tags" - ).toLowerCase(), - tagList: option.autoAnswerFor + tags: option.autoAnswerFor .map((t) => `"${t.tag}"`) .join(", "), }