diff --git a/client/public/locales/en/translation.json b/client/public/locales/en/translation.json index cc2460a23a..c7b1c840ac 100644 --- a/client/public/locales/en/translation.json +++ b/client/public/locales/en/translation.json @@ -256,16 +256,16 @@ "analysis": "Analysis", "answer": "Answer", "application": "Application", + "application_plural": "Applications", "applicationReview": "Application review", "application(s)": "Application(s)", + "applications": "Applications", "applicationImports": "Application imports", "applicationName": "Application name", "archetypeName": "Archetype name", "applicationInformation": "Application information", - "applications": "Applications", "archetype": "Archetype", "archetypes": "Archetypes", - "archetypes_singular": "Archetype", "archetypes_plural": "Archetypes", "artifact": "Artifact", "artifactAssociated": "Associated artifact", diff --git a/client/src/app/pages/applications/applications-table/applications-table.tsx b/client/src/app/pages/applications/applications-table/applications-table.tsx index c13ac32e57..c4306c9e50 100644 --- a/client/src/app/pages/applications/applications-table/applications-table.tsx +++ b/client/src/app/pages/applications/applications-table/applications-table.tsx @@ -360,8 +360,9 @@ export const ApplicationsTable: React.FC = () => { selectOptions: [ ...new Set( applications - .flatMap((application) => - application?.archetypes?.map((archetype) => archetype.name) + .flatMap( + (application) => + application?.archetypes?.map((archetype) => archetype.name) ) .filter(Boolean) ), diff --git a/client/src/app/pages/applications/components/application-detail-drawer/application-detail-drawer.tsx b/client/src/app/pages/applications/components/application-detail-drawer/application-detail-drawer.tsx index def5112708..227ac1a756 100644 --- a/client/src/app/pages/applications/components/application-detail-drawer/application-detail-drawer.tsx +++ b/client/src/app/pages/applications/components/application-detail-drawer/application-detail-drawer.tsx @@ -58,8 +58,6 @@ import { RiskLabel } from "@app/components/RiskLabel"; import { ApplicationDetailFields } from "./application-detail-fields"; import { useFetchArchetypes } from "@app/queries/archetypes"; import { AssessedArchetypes } from "./components/assessed-archetypes"; -import { serializeFilterUrlParams } from "@app/hooks/table-controls"; -import { Paths } from "@app/Paths"; export interface IApplicationDetailDrawerProps extends Pick { @@ -194,16 +192,15 @@ export const ApplicationDetailDrawer: React.FC< {application?.archetypes?.length ? ( <> - - {application.archetypes.length}{" "} - {t("terms.archetypes", { - count: application.archetypes.length, - context: - application.archetypes.length > 1 - ? "plural" - : "singular", - }).toLocaleLowerCase()}{" "} - + + {application.archetypes.length ?? 0 > 0 ? ( + + ) : ( + + )} + ) : ( @@ -453,16 +450,3 @@ const ArchetypeLabels: React.FC<{ archetypeRefs?: Ref[] }> = ({ const ArchetypeItem: React.FC<{ archetype: Archetype }> = ({ archetype }) => { return ; }; - -const getArchetypesUrl = (applicationName: string) => { - const filterValues = { - "application.name": [applicationName], - }; - - const serializedParams = serializeFilterUrlParams(filterValues); - - const queryString = serializedParams.filters - ? `filters=${serializedParams.filters}` - : ""; - return `${Paths.archetypes}?${queryString}`; -}; 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 648fdd01f3..90b85d0574 100644 --- a/client/src/app/pages/archetypes/components/archetype-detail-drawer.tsx +++ b/client/src/app/pages/archetypes/components/archetype-detail-drawer.tsx @@ -27,6 +27,9 @@ import { LabelsFromItems } from "@app/components/labels/labels-from-items/labels import { ReviewFields } from "@app/pages/applications/components/application-detail-drawer/review-fields"; import { RiskLabel } from "@app/components/RiskLabel"; import { LabelsFromTags } from "@app/components/labels/labels-from-tags/labels-from-tags"; +import { serializeFilterUrlParams } from "@app/hooks/table-controls"; +import { Paths } from "@app/Paths"; +import { Link } from "react-router-dom"; export interface IArchetypeDetailDrawerProps { onCloseClick: () => void; @@ -103,10 +106,19 @@ const ArchetypeDetailDrawer: React.FC = ({ {t("terms.applications")} - {archetype?.applications?.length ?? 0 > 0 ? ( - + {archetype?.applications?.length ? ( + <> + + {archetype.applications.length}{" "} + {t("terms.application", { + count: archetype.applications.length, + context: + archetype.applications.length > 1 + ? "plural" + : "singular", + }).toLocaleLowerCase()}{" "} + + ) : ( )} @@ -223,10 +235,6 @@ const ArchetypeDetailDrawer: React.FC = ({ ); }; -const ApplicationLabels: React.FC<{ applicationRefs?: Ref[] }> = ({ - applicationRefs, -}) => ; - const TagLabels: React.FC<{ tags?: Tag[] }> = ({ tags }) => ( ); @@ -240,3 +248,16 @@ const StakeholderGroupsLabels: React.FC<{ archetype: Archetype }> = ({ }) => ; export default ArchetypeDetailDrawer; + +const getApplicationsUrl = (archetypeName: string) => { + const filterValues = { + archetypes: [archetypeName], + }; + + const serializedParams = serializeFilterUrlParams(filterValues); + + const queryString = serializedParams.filters + ? `filters=${serializedParams.filters}` + : ""; + return `${Paths.applications}?${queryString}`; +};