diff --git a/.changeset/plenty-timers-flow.md b/.changeset/plenty-timers-flow.md
new file mode 100644
index 0000000000..8a26c8068b
--- /dev/null
+++ b/.changeset/plenty-timers-flow.md
@@ -0,0 +1,6 @@
+---
+'@backstage/plugin-cost-insights': patch
+'@backstage/plugin-cost-insights-common': patch
+---
+
+Add name property to Group
diff --git a/plugins/cost-insights-common/api-report.md b/plugins/cost-insights-common/api-report.md
index a5f7045854..8d9e2d030d 100644
--- a/plugins/cost-insights-common/api-report.md
+++ b/plugins/cost-insights-common/api-report.md
@@ -44,6 +44,7 @@ export interface Entity {
// @public (undocumented)
export type Group = {
id: string;
+ name?: string;
};
// @public (undocumented)
diff --git a/plugins/cost-insights-common/src/types/Group.ts b/plugins/cost-insights-common/src/types/Group.ts
index b34cac083f..ad384abe7b 100644
--- a/plugins/cost-insights-common/src/types/Group.ts
+++ b/plugins/cost-insights-common/src/types/Group.ts
@@ -19,4 +19,5 @@
*/
export type Group = {
id: string;
+ name?: string;
};
diff --git a/plugins/cost-insights/src/components/CostInsightsTabs/CostInsightsTabs.test.tsx b/plugins/cost-insights/src/components/CostInsightsTabs/CostInsightsTabs.test.tsx
index 6da6286515..2e2131daff 100644
--- a/plugins/cost-insights/src/components/CostInsightsTabs/CostInsightsTabs.test.tsx
+++ b/plugins/cost-insights/src/components/CostInsightsTabs/CostInsightsTabs.test.tsx
@@ -32,6 +32,7 @@ const mockGroups: Group[] = [
},
{
id: 'test-group-3',
+ name: 'Test Group 3',
},
];
@@ -76,7 +77,7 @@ describe('', () => {
);
await userEvent.click(rendered.getByTestId('cost-insights-groups-tab'));
mockGroups.forEach(group =>
- expect(rendered.getByText(group.id)).toBeInTheDocument(),
+ expect(rendered.getByText(group.name ?? group.id)).toBeInTheDocument(),
);
});
});
diff --git a/plugins/cost-insights/src/components/CostInsightsTabs/CostInsightsTabs.tsx b/plugins/cost-insights/src/components/CostInsightsTabs/CostInsightsTabs.tsx
index 3bb3f14214..935184ee55 100644
--- a/plugins/cost-insights/src/components/CostInsightsTabs/CostInsightsTabs.tsx
+++ b/plugins/cost-insights/src/components/CostInsightsTabs/CostInsightsTabs.tsx
@@ -100,7 +100,7 @@ export const CostInsightsTabs = ({ groups }: CostInsightsTabsProps) => {
data-testid={g.id}
onClick={updateGroupFilterAndCloseMenu(g)}
>
- {g.id}
+ {g.name ?? g.id}
))}
diff --git a/plugins/cost-insights/src/example/client.ts b/plugins/cost-insights/src/example/client.ts
index a7a2a0e22f..a6aadedd09 100644
--- a/plugins/cost-insights/src/example/client.ts
+++ b/plugins/cost-insights/src/example/client.ts
@@ -52,7 +52,8 @@ export class ExampleCostInsightsClient implements CostInsightsApi {
async getUserGroups(userId: string): Promise {
const groups: Group[] = await this.request({ userId }, [
- { id: 'pied-piper' },
+ { id: 'group-a', name: 'Group A' },
+ { id: 'group-b', name: 'Group B' },
]);
return groups;