From bfb59673619fc275d1d04c348ceccb3a38bc7c05 Mon Sep 17 00:00:00 2001
From: Pascal Lukanek <pascal.lukanek@live.de>
Date: Wed, 2 Nov 2022 19:09:28 +0100
Subject: [PATCH] [OwnershipCard] Add type as subtitle + adjust query params

Signed-off-by: Pascal Lukanek <pascal.lukanek@live.de>
---
 .../components/Cards/OwnershipCard/ComponentsGrid.tsx  |  4 ++++
 .../Cards/OwnershipCard/OwnershipCard.test.tsx         | 10 ++++++++--
 .../components/Cards/OwnershipCard/useGetEntities.ts   |  5 ++++-
 3 files changed, 16 insertions(+), 3 deletions(-)

diff --git a/plugins/org/src/components/Cards/OwnershipCard/ComponentsGrid.tsx b/plugins/org/src/components/Cards/OwnershipCard/ComponentsGrid.tsx
index 6f7680849c..c1522c1fd1 100644
--- a/plugins/org/src/components/Cards/OwnershipCard/ComponentsGrid.tsx
+++ b/plugins/org/src/components/Cards/OwnershipCard/ComponentsGrid.tsx
@@ -56,11 +56,13 @@ const useStyles = makeStyles((theme: BackstageTheme) =>
 const EntityCountTile = ({
   counter,
   type,
+  kind,
   name,
   url,
 }: {
   counter: number;
   type: string;
+  kind: string;
   name: string;
   url: string;
 }) => {
@@ -80,6 +82,7 @@ const EntityCountTile = ({
         <Typography className={classes.bold} variant="h6">
           {pluralize(name, counter)}
         </Typography>
+        {kind != type && <Typography variant="subtitle1">{kind}</Typography>}
       </Box>
     </Link>
   );
@@ -116,6 +119,7 @@ export const ComponentsGrid = ({
         <Grid item xs={6} md={6} lg={4} key={c.name}>
           <EntityCountTile
             counter={c.counter}
+            kind={c.kind}
             type={c.type}
             name={c.name}
             url={`${catalogLink()}/?${c.queryParams}`}
diff --git a/plugins/org/src/components/Cards/OwnershipCard/OwnershipCard.test.tsx b/plugins/org/src/components/Cards/OwnershipCard/OwnershipCard.test.tsx
index 28fa3f4988..84f27fa183 100644
--- a/plugins/org/src/components/Cards/OwnershipCard/OwnershipCard.test.tsx
+++ b/plugins/org/src/components/Cards/OwnershipCard/OwnershipCard.test.tsx
@@ -217,10 +217,16 @@ describe('OwnershipCard', () => {
     expect(
       queryByText(getByText('SYSTEM').parentElement!, '1'),
     ).toBeInTheDocument();
+    expect(
+      queryByText(getByText('SYSTEM').parentElement!, 'System'),
+    ).not.toBeInTheDocument();
     expect(getByText('OPENAPI')).toBeInTheDocument();
     expect(
       queryByText(getByText('OPENAPI').parentElement!, '1'),
     ).toBeInTheDocument();
+    expect(
+      queryByText(getByText('OPENAPI').parentElement!, 'API'),
+    ).toBeInTheDocument();
     expect(() => getByText('LIBRARY')).toThrow();
   });
 
@@ -246,7 +252,7 @@ describe('OwnershipCard', () => {
 
     expect(getByText('OPENAPI').closest('a')).toHaveAttribute(
       'href',
-      '/create/?filters%5Bkind%5D=API&filters%5Btype%5D=openapi&filters%5Bowners%5D=my-team&filters%5Buser%5D=all',
+      '/create/?filters%5Bkind%5D=api&filters%5Btype%5D=openapi&filters%5Bowners%5D=my-team&filters%5Buser%5D=all',
     );
   });
 
@@ -292,7 +298,7 @@ describe('OwnershipCard', () => {
 
     expect(getByText('OPENAPI').closest('a')).toHaveAttribute(
       'href',
-      '/create/?filters%5Bkind%5D=API&filters%5Btype%5D=openapi&filters%5Bowners%5D=user%3Athe-user&filters%5Bowners%5D=my-team&filters%5Bowners%5D=custom%2Fsome-team&filters%5Buser%5D=all',
+      '/create/?filters%5Bkind%5D=api&filters%5Btype%5D=openapi&filters%5Bowners%5D=user%3Athe-user&filters%5Bowners%5D=my-team&filters%5Bowners%5D=custom%2Fsome-team&filters%5Buser%5D=all',
     );
   });
 
diff --git a/plugins/org/src/components/Cards/OwnershipCard/useGetEntities.ts b/plugins/org/src/components/Cards/OwnershipCard/useGetEntities.ts
index 7c0bb76e2e..77d5164830 100644
--- a/plugins/org/src/components/Cards/OwnershipCard/useGetEntities.ts
+++ b/plugins/org/src/components/Cards/OwnershipCard/useGetEntities.ts
@@ -49,7 +49,7 @@ const getQueryParams = (
     humanizeEntityRef(parseEntityRef(owner), { defaultKind: 'group' }),
   );
   const filters = {
-    kind,
+    kind: kind.toLowerCase(),
     type,
     owners,
     user: 'all',
@@ -135,6 +135,7 @@ export function useGetEntities(
     | {
         counter: number;
         type: string;
+        kind: string;
         name: string;
         queryParams: string;
       }[]
@@ -197,11 +198,13 @@ export function useGetEntities(
     return topN.map(topOwnedEntity => ({
       counter: topOwnedEntity.count,
       type: topOwnedEntity.type,
+      kind: topOwnedEntity.kind,
       name: topOwnedEntity.type.toLocaleUpperCase('en-US'),
       queryParams: getQueryParams(owners, topOwnedEntity),
     })) as Array<{
       counter: number;
       type: string;
+      kind: string;
       name: string;
       queryParams: string;
     }>;