From 01d0953eb271470e8301c8736adc13fd479b36d1 Mon Sep 17 00:00:00 2001 From: Ian Bolton Date: Thu, 4 Apr 2024 11:59:49 -0400 Subject: [PATCH 1/2] :sparkles: Add empty state for empty groups Signed-off-by: Ian Bolton --- .../controls/stakeholders/stakeholders.tsx | 49 +++++++++++++------ 1 file changed, 35 insertions(+), 14 deletions(-) diff --git a/client/src/app/pages/controls/stakeholders/stakeholders.tsx b/client/src/app/pages/controls/stakeholders/stakeholders.tsx index e0ab62daf3..bc67a1fcc0 100644 --- a/client/src/app/pages/controls/stakeholders/stakeholders.tsx +++ b/client/src/app/pages/controls/stakeholders/stakeholders.tsx @@ -263,6 +263,7 @@ export const Stakeholders: React.FC = () => { numRenderedColumns={numRenderedColumns} > {currentPageItems?.map((stakeholder, rowIndex) => { + const hasGroups = stakeholder.stakeholderGroups?.length; return ( { className={spacing.pyLg} > - - - - {t("terms.group(s)")} - - {!!stakeholder.stakeholderGroups?.length && ( - - {stakeholder.stakeholderGroups - ?.map((f) => f.name) - .join(", ")} - - )} - - + {hasGroups ? ( + + + + {t("terms.group(s)")} + + {!!stakeholder.stakeholderGroups?.length && ( + + {stakeholder.stakeholderGroups + ?.map((f) => f.name) + .join(", ")} + + )} + + + ) : ( + + + + {t("composed.noDataStateTitle", { + what: t( + "terms.stakeholderGroups" + ).toLowerCase(), + })} + + + {t("composed.noDataStateBody", { + what: t( + "terms.stakeholderGroup" + ).toLowerCase(), + })} + + + )} From 7849653ff8f30ad8f484b988180302271ee9ba00 Mon Sep 17 00:00:00 2001 From: Ian Bolton Date: Thu, 4 Apr 2024 15:20:24 -0400 Subject: [PATCH 2/2] Extend generic noDataStateBody translation to handle add & import verbiage Signed-off-by: Ian Bolton --- client/public/locales/en/translation.json | 4 +- .../applications-table/applications-table.tsx | 1 + .../manage-imports/manage-imports.tsx | 3 +- .../business-services/business-services.tsx | 1 + .../controls/job-functions/job-functions.tsx | 1 + .../stakeholder-groups/stakeholder-groups.tsx | 47 +++++++++++++------ .../controls/stakeholders/stakeholders.tsx | 2 + client/src/app/pages/controls/tags/tags.tsx | 1 + .../src/app/pages/external/jira/trackers.tsx | 1 + .../src/app/pages/identities/identities.tsx | 1 + .../components/manage-applications-form.tsx | 1 + 11 files changed, 47 insertions(+), 16 deletions(-) diff --git a/client/public/locales/en/translation.json b/client/public/locales/en/translation.json index edcbefc65d..a4de299d5a 100644 --- a/client/public/locales/en/translation.json +++ b/client/public/locales/en/translation.json @@ -88,7 +88,7 @@ "error": "{{what}} error", "manage": "Manage {{what}}", "manageDependenciesFor": "Manage dependencies for {{what}}", - "noDataStateBody": "Create a new {{what}} to start seeing data here.", + "noDataStateBody": "{{how}} a new {{what}} to start seeing data here.", "noDataStateTitle": "No {{what}} available", "Nquestions": "{{n}} questions", "ofTotalApplications": "Of {{count}} application", @@ -272,6 +272,7 @@ "applicationName": "Application name", "archetypeName": "Archetype name", "applicationInformation": "Application information", + "applicationFile": "Application file", "archetype": "Archetype", "archetypes": "Archetypes", "archetypes_plural": "Archetypes", @@ -304,6 +305,7 @@ "connected": "Connected", "contributors": "Contributors", "controls": "Controls", + "create": "Create", "createdBy": "Created By", "credential": "Credential", "credentials": "Credentials", 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 ae078ec9af..a71f515032 100644 --- a/client/src/app/pages/applications/applications-table/applications-table.tsx +++ b/client/src/app/pages/applications/applications-table/applications-table.tsx @@ -860,6 +860,7 @@ export const ApplicationsTable: React.FC = () => { what: t("terms.applications").toLowerCase(), })} description={t("composed.noDataStateBody", { + how: t("terms.create"), what: t("terms.application").toLowerCase(), })} /> diff --git a/client/src/app/pages/applications/manage-imports/manage-imports.tsx b/client/src/app/pages/applications/manage-imports/manage-imports.tsx index a3dddbca96..cc20d3d4cf 100644 --- a/client/src/app/pages/applications/manage-imports/manage-imports.tsx +++ b/client/src/app/pages/applications/manage-imports/manage-imports.tsx @@ -243,7 +243,8 @@ export const ManageImports: React.FC = () => { {t("composed.noDataStateBody", { - what: t("terms.importSummary").toLowerCase(), + how: t("actions.import"), + what: t("terms.applicationFile").toLowerCase(), })} diff --git a/client/src/app/pages/controls/business-services/business-services.tsx b/client/src/app/pages/controls/business-services/business-services.tsx index a5b8c63de6..0eb1323a31 100644 --- a/client/src/app/pages/controls/business-services/business-services.tsx +++ b/client/src/app/pages/controls/business-services/business-services.tsx @@ -228,6 +228,7 @@ export const BusinessServices: React.FC = () => { {t("composed.noDataStateBody", { + how: t("terms.create"), what: t("terms.businessService").toLowerCase(), })} diff --git a/client/src/app/pages/controls/job-functions/job-functions.tsx b/client/src/app/pages/controls/job-functions/job-functions.tsx index 5a6fff4498..9a7d86fe5c 100644 --- a/client/src/app/pages/controls/job-functions/job-functions.tsx +++ b/client/src/app/pages/controls/job-functions/job-functions.tsx @@ -216,6 +216,7 @@ export const JobFunctions: React.FC = () => { })} // t('terms.jobFunction') description={t("composed.noDataStateBody", { + how: t("terms.create"), what: t("terms.jobFunction").toLowerCase(), })} /> diff --git a/client/src/app/pages/controls/stakeholder-groups/stakeholder-groups.tsx b/client/src/app/pages/controls/stakeholder-groups/stakeholder-groups.tsx index 8669ae70d5..12173c3ec5 100644 --- a/client/src/app/pages/controls/stakeholder-groups/stakeholder-groups.tsx +++ b/client/src/app/pages/controls/stakeholder-groups/stakeholder-groups.tsx @@ -246,6 +246,7 @@ export const StakeholderGroups: React.FC = () => { {t("composed.noDataStateBody", { + how: t("terms.add"), what: t("terms.stakeholderGroup").toLowerCase(), })} @@ -254,6 +255,7 @@ export const StakeholderGroups: React.FC = () => { numRenderedColumns={numRenderedColumns} > {currentPageItems?.map((stakeholderGroup, rowIndex) => { + const hasStakeholders = stakeholderGroup.stakeholders?.length; return ( { className={spacing.pyLg} > - - - - {t("terms.member(s)")} - - {!!stakeholderGroup.stakeholders?.length && ( - - {stakeholderGroup.stakeholders - ?.map((f) => f.name) - .join(", ")} - - )} - - + {hasStakeholders ? ( + + + + {t("terms.member(s)")} + + {!!stakeholderGroup.stakeholders?.length && ( + + {stakeholderGroup.stakeholders + ?.map((f) => f.name) + .join(", ")} + + )} + + + ) : ( + + + + {t("composed.noDataStateTitle", { + what: t("terms.stakeholder").toLowerCase(), + })} + + + {t("composed.noDataStateBody", { + how: t("terms.add"), + what: t("terms.stakeholder").toLowerCase(), + })} + + + )} diff --git a/client/src/app/pages/controls/stakeholders/stakeholders.tsx b/client/src/app/pages/controls/stakeholders/stakeholders.tsx index bc67a1fcc0..ef6bc4f171 100644 --- a/client/src/app/pages/controls/stakeholders/stakeholders.tsx +++ b/client/src/app/pages/controls/stakeholders/stakeholders.tsx @@ -255,6 +255,7 @@ export const Stakeholders: React.FC = () => { {t("composed.noDataStateBody", { + how: t("terms.add"), what: t("terms.stakeholder").toLowerCase(), })} @@ -338,6 +339,7 @@ export const Stakeholders: React.FC = () => { {t("composed.noDataStateBody", { + how: t("terms.add"), what: t( "terms.stakeholderGroup" ).toLowerCase(), diff --git a/client/src/app/pages/controls/tags/tags.tsx b/client/src/app/pages/controls/tags/tags.tsx index 19361cf990..66f791c507 100644 --- a/client/src/app/pages/controls/tags/tags.tsx +++ b/client/src/app/pages/controls/tags/tags.tsx @@ -340,6 +340,7 @@ export const Tags: React.FC = () => { {t("composed.noDataStateBody", { + how: t("terms.create"), what: t("terms.tags").toLowerCase(), })} diff --git a/client/src/app/pages/external/jira/trackers.tsx b/client/src/app/pages/external/jira/trackers.tsx index 31acc98c3d..43130fa648 100644 --- a/client/src/app/pages/external/jira/trackers.tsx +++ b/client/src/app/pages/external/jira/trackers.tsx @@ -235,6 +235,7 @@ export const JiraTrackers: React.FC = () => { {t("composed.noDataStateBody", { + how: t("actions.create"), what: t("terms.jiraConfig").toLowerCase(), })} diff --git a/client/src/app/pages/identities/identities.tsx b/client/src/app/pages/identities/identities.tsx index 245b09e090..ec42cfe090 100644 --- a/client/src/app/pages/identities/identities.tsx +++ b/client/src/app/pages/identities/identities.tsx @@ -330,6 +330,7 @@ export const Identities: React.FC = () => { what: "credentials", })} description={t("composed.noDataStateBody", { + how: t("terms.create"), what: "credential", })} /> diff --git a/client/src/app/pages/migration-waves/components/manage-applications-form.tsx b/client/src/app/pages/migration-waves/components/manage-applications-form.tsx index 461e20305e..a0783edca4 100644 --- a/client/src/app/pages/migration-waves/components/manage-applications-form.tsx +++ b/client/src/app/pages/migration-waves/components/manage-applications-form.tsx @@ -262,6 +262,7 @@ export const ManageApplicationsForm: React.FC = ({ what: t("terms.applications").toLowerCase(), })} description={t("composed.noDataStateBody", { + how: t("terms.add"), what: t("terms.application").toLowerCase(), })} />