diff --git a/client/src/app/pages/applications/components/application-form/application-form.tsx b/client/src/app/pages/applications/components/application-form/application-form.tsx index 0afa0d8b9b..16f3e21bd6 100644 --- a/client/src/app/pages/applications/components/application-form/application-form.tsx +++ b/client/src/app/pages/applications/components/application-form/application-form.tsx @@ -106,7 +106,7 @@ export const ApplicationForm: React.FC = ({ const manualTags: TagRef[] = useMemo(() => { const rawManualTags: TagRef[] = - application?.tags?.filter((t) => t?.source ?? "" === "") ?? []; + application?.tags?.filter((t) => !t?.source) ?? []; return dedupeArrayOfObjects(rawManualTags, "name"); }, [application?.tags]); diff --git a/client/src/app/pages/archetypes/components/archetype-detail-drawer.tsx b/client/src/app/pages/archetypes/components/archetype-detail-drawer.tsx index 515be69c7b..f3a3fa86cb 100644 --- a/client/src/app/pages/archetypes/components/archetype-detail-drawer.tsx +++ b/client/src/app/pages/archetypes/components/archetype-detail-drawer.tsx @@ -16,12 +16,13 @@ import { } from "@patternfly/react-core"; import spacing from "@patternfly/react-styles/css/utilities/Spacing/spacing"; -import { Archetype, Tag } from "@app/api/models"; +import { Archetype, Tag, TagRef } from "@app/api/models"; import { EmptyTextMessage } from "@app/components/EmptyTextMessage"; import { PageDrawerContent } from "@app/components/PageDrawerContext"; import { useFetchTagCategories } from "@app/queries/tags"; import "./archetype-detail-drawer.css"; +import { dedupeArrayOfObjects } from "@app/utils/utils"; export interface IArchetypeDetailDrawerProps { onCloseClick: () => void; @@ -40,17 +41,17 @@ const ArchetypeDetailDrawer: React.FC = ({ [tagCategories] ); - const archetypeTags = - archetype?.tags - ?.filter((t) => t?.source ?? "" === "") - .map((ref) => tags.find((tag) => ref.id === tag.id)) - .filter(Boolean) ?? []; + const manualTags: TagRef[] = useMemo(() => { + const rawManualTags: TagRef[] = + archetype?.tags?.filter((t) => !t?.source) ?? []; + return dedupeArrayOfObjects(rawManualTags, "name"); + }, [archetype?.tags]); - const assessmentTags = - archetype?.tags - ?.filter((t) => t?.source ?? "" !== "") - .map((ref) => tags.find((tag) => ref.id === tag.id)) - .filter(Boolean) ?? []; + const assessmentTags: TagRef[] = useMemo(() => { + const rawAssessmentTags: TagRef[] = + archetype?.tags?.filter((t) => t?.source === "assessment") ?? []; + return dedupeArrayOfObjects(rawAssessmentTags, "name"); + }, [archetype?.tags]); return ( = ({ {t("terms.tagsArchetype")} - {archetypeTags.length > 0 ? ( - + {manualTags.length > 0 ? ( + ) : ( )} diff --git a/client/src/app/pages/archetypes/components/archetype-form/archetype-form.tsx b/client/src/app/pages/archetypes/components/archetype-form/archetype-form.tsx index f4c4e114bc..108a015b29 100644 --- a/client/src/app/pages/archetypes/components/archetype-form/archetype-form.tsx +++ b/client/src/app/pages/archetypes/components/archetype-form/archetype-form.tsx @@ -18,6 +18,7 @@ import type { Stakeholder, StakeholderGroup, Tag, + TagRef, } from "@app/api/models"; import { HookFormPFTextArea, @@ -30,7 +31,11 @@ import { useCreateArchetypeMutation, useUpdateArchetypeMutation, } from "@app/queries/archetypes"; -import { duplicateNameCheck, getAxiosErrorMessage } from "@app/utils/utils"; +import { + dedupeArrayOfObjects, + duplicateNameCheck, + getAxiosErrorMessage, +} from "@app/utils/utils"; import { useFetchTagCategories } from "@app/queries/tags"; import { useFetchStakeholderGroups } from "@app/queries/stakeholdergoups"; @@ -78,11 +83,17 @@ export const ArchetypeForm: React.FC = ({ onActionSuccess: onClose, }); - const archetypeTags = - archetype?.tags?.filter((t) => t?.source ?? "" === "") ?? []; + const manualTags: TagRef[] = useMemo(() => { + const rawManualTags: TagRef[] = + archetype?.tags?.filter((t) => !t?.source) ?? []; + return dedupeArrayOfObjects(rawManualTags, "name"); + }, [archetype?.tags]); - const assessmentTags = - archetype?.tags?.filter((t) => t?.source ?? "" !== "") ?? []; + const assessmentTags: TagRef[] = useMemo(() => { + const rawAssessmentTags: TagRef[] = + archetype?.tags?.filter((t) => t?.source === "assessment") ?? []; + return dedupeArrayOfObjects(rawAssessmentTags, "name"); + }, [archetype?.tags]); const validationSchema = yup.object().shape({ name: yup @@ -154,7 +165,7 @@ export const ArchetypeForm: React.FC = ({ comments: archetype?.comments || "", criteria: archetype?.criteria?.map((tag) => tag.name).sort() ?? [], - tags: archetypeTags.map((tag) => tag.name).sort() ?? [], + tags: manualTags.map((tag) => tag.name).sort() ?? [], stakeholders: archetype?.stakeholders?.map((sh) => sh.name).sort() ?? [], stakeholderGroups: @@ -167,14 +178,14 @@ export const ArchetypeForm: React.FC = ({ const onValidSubmit = (values: ArchetypeFormValues) => { // Note: We need to manually retain the tags with source != "" in the payload const tags = [...(tagsToRefs(values.tags) ?? []), ...assessmentTags]; + const criteriaTags = tagsToRefs(values.criteria) ?? []; const payload: New = { name: values.name.trim(), description: values.description?.trim() ?? "", comments: values.comments?.trim() ?? "", - criteria: values.criteria - .map((tagName) => tags.find((tag) => tag.name === tagName)) + .map((tagName) => criteriaTags.find((tag) => tag.name === tagName)) .filter(Boolean), tags: values.tags diff --git a/client/src/app/pages/assessment/components/assessment-wizard/assessment-wizard.tsx b/client/src/app/pages/assessment/components/assessment-wizard/assessment-wizard.tsx index 926ebdfe26..461b012d56 100644 --- a/client/src/app/pages/assessment/components/assessment-wizard/assessment-wizard.tsx +++ b/client/src/app/pages/assessment/components/assessment-wizard/assessment-wizard.tsx @@ -566,12 +566,15 @@ export const AssessmentWizard: React.FC = ({ ); useEffect(() => { - return () => { - if (assessment) { + const unlisten = history.listen((newLocation, action) => { + if (action === "PUSH" && assessment) { handleCancelAssessment(); } + }); + return () => { + unlisten(); }; - }, [assessment]); + }, [history, assessment]); const handleCancelAssessment = () => { if (assessment) {