Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

✨ Add empty state for empty groups / stakeholders list #1817

Merged
merged 4 commits into from
Apr 10, 2024
Merged

✨ Add empty state for empty groups / stakeholders list #1817

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
4 commits
Select commit Hold shift + click to select a range
01d0953
:sparkles: Add empty state for empty groups
ibolton336 Apr 4, 2024
7849653
Extend generic noDataStateBody translation to handle add & import ver…
ibolton336 Apr 4, 2024
01430e8
Merge branch 'main' into sh-g-empty-fix
ibolton336 Apr 9, 2024
81f60bb
Merge branch 'main' into sh-g-empty-fix
ibolton336 Apr 10, 2024
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
4 changes: 3 additions & 1 deletion client/public/locales/en/translation.json
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -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",
Expand Down Expand Up @@ -272,6 +272,7 @@
"applicationName": "Application name",
"archetypeName": "Archetype name",
"applicationInformation": "Application information",
"applicationFile": "Application file",
"archetype": "Archetype",
"archetypes": "Archetypes",
"archetypes_plural": "Archetypes",
Expand Down Expand Up @@ -304,6 +305,7 @@
"connected": "Connected",
"contributors": "Contributors",
"controls": "Controls",
"create": "Create",
"createdBy": "Created By",
"credential": "Credential",
"credentials": "Credentials",
Expand Down
1 change: 1 addition & 0 deletions client/src/app/pages/applications/applications-table/applications-table.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -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(),
})}
/>
Expand Down
3 changes: 2 additions & 1 deletion client/src/app/pages/applications/manage-imports/manage-imports.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -243,7 +243,8 @@ export const ManageImports: React.FC = () => {
</Title>
<EmptyStateBody>
{t("composed.noDataStateBody", {
what: t("terms.importSummary").toLowerCase(),
how: t("actions.import"),
what: t("terms.applicationFile").toLowerCase(),
})}
</EmptyStateBody>
</EmptyState>
Expand Down
1 change: 1 addition & 0 deletions client/src/app/pages/controls/business-services/business-services.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -228,6 +228,7 @@ export const BusinessServices: React.FC = () => {
</Title>
<EmptyStateBody>
{t("composed.noDataStateBody", {
how: t("terms.create"),
what: t("terms.businessService").toLowerCase(),
})}
</EmptyStateBody>
Expand Down
1 change: 1 addition & 0 deletions client/src/app/pages/controls/job-functions/job-functions.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -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(),
})}
/>
Expand Down
47 changes: 33 additions & 14 deletions client/src/app/pages/controls/stakeholder-groups/stakeholder-groups.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -246,6 +246,7 @@ export const StakeholderGroups: React.FC = () => {
</Title>
<EmptyStateBody>
{t("composed.noDataStateBody", {
how: t("terms.add"),
what: t("terms.stakeholderGroup").toLowerCase(),
})}
</EmptyStateBody>
Expand All @@ -254,6 +255,7 @@ export const StakeholderGroups: React.FC = () => {
numRenderedColumns={numRenderedColumns}
>
{currentPageItems?.map((stakeholderGroup, rowIndex) => {
const hasStakeholders = stakeholderGroup.stakeholders?.length;
return (
<Tbody
key={stakeholderGroup.id}
Expand Down Expand Up @@ -297,20 +299,37 @@ export const StakeholderGroups: React.FC = () => {
className={spacing.pyLg}
>
<ExpandableRowContent>
<DescriptionList>
<DescriptionListGroup>
<DescriptionListTerm>
{t("terms.member(s)")}
</DescriptionListTerm>
{!!stakeholderGroup.stakeholders?.length && (
<DescriptionListDescription>
{stakeholderGroup.stakeholders
?.map((f) => f.name)
.join(", ")}
</DescriptionListDescription>
)}
</DescriptionListGroup>
</DescriptionList>
{hasStakeholders ? (
<DescriptionList>
<DescriptionListGroup>
<DescriptionListTerm>
{t("terms.member(s)")}
</DescriptionListTerm>
{!!stakeholderGroup.stakeholders?.length && (
<DescriptionListDescription>
{stakeholderGroup.stakeholders
?.map((f) => f.name)
.join(", ")}
</DescriptionListDescription>
)}
</DescriptionListGroup>
</DescriptionList>
) : (
<EmptyState variant="sm">
<EmptyStateIcon icon={CubesIcon} />
<Title headingLevel="h2" size="lg">
{t("composed.noDataStateTitle", {
what: t("terms.stakeholder").toLowerCase(),
})}
</Title>
<EmptyStateBody>
{t("composed.noDataStateBody", {
how: t("terms.add"),
what: t("terms.stakeholder").toLowerCase(),
})}
</EmptyStateBody>
</EmptyState>
)}
</ExpandableRowContent>
</Td>
</Tr>
Expand Down
51 changes: 37 additions & 14 deletions client/src/app/pages/controls/stakeholders/stakeholders.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -255,6 +255,7 @@ export const Stakeholders: React.FC = () => {
</Title>
<EmptyStateBody>
{t("composed.noDataStateBody", {
how: t("terms.add"),
what: t("terms.stakeholder").toLowerCase(),
})}
</EmptyStateBody>
Expand All @@ -263,6 +264,7 @@ export const Stakeholders: React.FC = () => {
numRenderedColumns={numRenderedColumns}
>
{currentPageItems?.map((stakeholder, rowIndex) => {
const hasGroups = stakeholder.stakeholderGroups?.length;
return (
<Tbody
key={stakeholder.id}
Expand Down Expand Up @@ -310,20 +312,41 @@ export const Stakeholders: React.FC = () => {
className={spacing.pyLg}
>
<ExpandableRowContent>
<DescriptionList>
<DescriptionListGroup>
<DescriptionListTerm>
{t("terms.group(s)")}
</DescriptionListTerm>
{!!stakeholder.stakeholderGroups?.length && (
<DescriptionListDescription>
{stakeholder.stakeholderGroups
?.map((f) => f.name)
.join(", ")}
</DescriptionListDescription>
)}
</DescriptionListGroup>
</DescriptionList>
{hasGroups ? (
<DescriptionList>
<DescriptionListGroup>
<DescriptionListTerm>
{t("terms.group(s)")}
</DescriptionListTerm>
{!!stakeholder.stakeholderGroups?.length && (
<DescriptionListDescription>
{stakeholder.stakeholderGroups
?.map((f) => f.name)
.join(", ")}
</DescriptionListDescription>
)}
</DescriptionListGroup>
</DescriptionList>
) : (
<EmptyState variant="sm">
<EmptyStateIcon icon={CubesIcon} />
<Title headingLevel="h2" size="lg">
{t("composed.noDataStateTitle", {
what: t(
"terms.stakeholderGroups"
).toLowerCase(),
})}
</Title>
<EmptyStateBody>
{t("composed.noDataStateBody", {
how: t("terms.add"),
what: t(
"terms.stakeholderGroup"
).toLowerCase(),
})}
</EmptyStateBody>
</EmptyState>
)}
</ExpandableRowContent>
</Td>
</Tr>
Expand Down
1 change: 1 addition & 0 deletions client/src/app/pages/controls/tags/tags.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -340,6 +340,7 @@ export const Tags: React.FC = () => {
</Title>
<EmptyStateBody>
{t("composed.noDataStateBody", {
how: t("terms.create"),
what: t("terms.tags").toLowerCase(),
})}
</EmptyStateBody>
Expand Down
1 change: 1 addition & 0 deletions client/src/app/pages/external/jira/trackers.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -235,6 +235,7 @@ export const JiraTrackers: React.FC = () => {
</Title>
<EmptyStateBody>
{t("composed.noDataStateBody", {
how: t("actions.create"),
what: t("terms.jiraConfig").toLowerCase(),
})}
</EmptyStateBody>
Expand Down
1 change: 1 addition & 0 deletions client/src/app/pages/identities/identities.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -330,6 +330,7 @@ export const Identities: React.FC = () => {
what: "credentials",
})}
description={t("composed.noDataStateBody", {
how: t("terms.create"),
what: "credential",
})}
/>
Expand Down
1 change: 1 addition & 0 deletions client/src/app/pages/migration-waves/components/manage-applications-form.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -262,6 +262,7 @@ export const ManageApplicationsForm: React.FC<ManageApplicationsFormProps> = ({
what: t("terms.applications").toLowerCase(),
})}
description={t("composed.noDataStateBody", {
how: t("terms.add"),
what: t("terms.application").toLowerCase(),
})}
/>
Expand Down
Loading