From 6ad8fe1a0adf22eb7b64c82322518b61d6aacb0b Mon Sep 17 00:00:00 2001
From: Oliver Sand <oliver.sand@sda-se.com>
Date: Tue, 7 Sep 2021 15:08:31 +0200
Subject: [PATCH 1/2] Make ownership card style customizable via custom
 `theme.getPageTheme()`

Signed-off-by: Oliver Sand <oliver.sand@sda-se.com>
---
 .changeset/lucky-lies-count.md                     |  5 +++++
 .../Cards/OwnershipCard/OwnershipCard.tsx          | 14 ++------------
 2 files changed, 7 insertions(+), 12 deletions(-)
 create mode 100644 .changeset/lucky-lies-count.md

diff --git a/.changeset/lucky-lies-count.md b/.changeset/lucky-lies-count.md
new file mode 100644
index 0000000000..79e7c09391
--- /dev/null
+++ b/.changeset/lucky-lies-count.md
@@ -0,0 +1,5 @@
+---
+'@backstage/plugin-org': patch
+---
+
+Make ownership card style customizable via custom `theme.getPageTheme()`.
diff --git a/plugins/org/src/components/Cards/OwnershipCard/OwnershipCard.tsx b/plugins/org/src/components/Cards/OwnershipCard/OwnershipCard.tsx
index da7f8381e3..cc0a379ff9 100644
--- a/plugins/org/src/components/Cards/OwnershipCard/OwnershipCard.tsx
+++ b/plugins/org/src/components/Cards/OwnershipCard/OwnershipCard.tsx
@@ -29,7 +29,7 @@ import {
   isOwnerOf,
   useEntity,
 } from '@backstage/plugin-catalog-react';
-import { BackstageTheme, genPageTheme } from '@backstage/theme';
+import { BackstageTheme } from '@backstage/theme';
 import {
   Box,
   createStyles,
@@ -49,16 +49,6 @@ type EntityTypeProps = {
   count: number;
 };
 
-const createPageTheme = (
-  theme: BackstageTheme,
-  shapeKey: string,
-  colorsKey: string,
-) => {
-  const { colors } = theme.getPageTheme({ themeId: colorsKey });
-  const { shape } = theme.getPageTheme({ themeId: shapeKey });
-  return genPageTheme(colors, shape).backgroundImage;
-};
-
 const useStyles = makeStyles((theme: BackstageTheme) =>
   createStyles({
     card: {
@@ -77,7 +67,7 @@ const useStyles = makeStyles((theme: BackstageTheme) =>
     },
     entityTypeBox: {
       background: (props: { type: string }) =>
-        createPageTheme(theme, props.type, props.type),
+        theme.getPageTheme({ themeId: props.type }).backgroundImage,
     },
   }),
 );

From 70718686f1a6336072bbd43c1a60cdf7fdf2cad2 Mon Sep 17 00:00:00 2001
From: Oliver Sand <oliver.sand@sda-se.com>
Date: Tue, 7 Sep 2021 16:17:52 +0200
Subject: [PATCH 2/2] Use correct `Link` in ownership card to avoid a full
 reload of the app while navigating

Signed-off-by: Oliver Sand <oliver.sand@sda-se.com>
---
 .changeset/sour-bees-pretend.md                            | 5 +++++
 .../src/components/Cards/OwnershipCard/OwnershipCard.tsx   | 7 +++----
 2 files changed, 8 insertions(+), 4 deletions(-)
 create mode 100644 .changeset/sour-bees-pretend.md

diff --git a/.changeset/sour-bees-pretend.md b/.changeset/sour-bees-pretend.md
new file mode 100644
index 0000000000..748266132c
--- /dev/null
+++ b/.changeset/sour-bees-pretend.md
@@ -0,0 +1,5 @@
+---
+'@backstage/plugin-org': patch
+---
+
+Use correct `Link` in ownership card to avoid a full reload of the app while navigating.
diff --git a/plugins/org/src/components/Cards/OwnershipCard/OwnershipCard.tsx b/plugins/org/src/components/Cards/OwnershipCard/OwnershipCard.tsx
index cc0a379ff9..96e7d08c31 100644
--- a/plugins/org/src/components/Cards/OwnershipCard/OwnershipCard.tsx
+++ b/plugins/org/src/components/Cards/OwnershipCard/OwnershipCard.tsx
@@ -18,6 +18,7 @@ import { Entity } from '@backstage/catalog-model';
 import {
   InfoCard,
   InfoCardVariants,
+  Link,
   Progress,
   ResponseErrorPanel,
 } from '@backstage/core-components';
@@ -34,13 +35,11 @@ import {
   Box,
   createStyles,
   Grid,
-  Link,
   makeStyles,
   Typography,
 } from '@material-ui/core';
 import qs from 'qs';
 import React from 'react';
-import { generatePath } from 'react-router';
 import { useAsync } from 'react-use';
 
 type EntityTypeProps = {
@@ -86,7 +85,7 @@ const EntityCountTile = ({
   const classes = useStyles({ type });
 
   return (
-    <Link href={url} variant="body2">
+    <Link to={url} variant="body2">
       <Box
         className={`${classes.card} ${classes.entityTypeBox}`}
         display="flex"
@@ -208,7 +207,7 @@ export const OwnershipCard = ({
               counter={c.counter}
               type={c.type}
               name={c.name}
-              url={generatePath(`${catalogLink()}/?${c.queryParams}`)}
+              url={`${catalogLink()}/?${c.queryParams}`}
             />
           </Grid>
         ))}