From f1c48aa31849e81068033ed5fd3228366fe43353 Mon Sep 17 00:00:00 2001
From: Jack Palmer <jackpalmer@spotify.com>
Date: Mon, 5 Dec 2022 15:45:20 +0000
Subject: [PATCH 1/3] fix: InfoCard - Do not render subheader container when
 there is not a subheader or icon

Signed-off-by: Jack Palmer <jackpalmer@spotify.com>
---
 packages/core-components/src/layout/InfoCard/InfoCard.tsx | 4 ++++
 1 file changed, 4 insertions(+)

diff --git a/packages/core-components/src/layout/InfoCard/InfoCard.tsx b/packages/core-components/src/layout/InfoCard/InfoCard.tsx
index 2026a7eced..cafd65de28 100644
--- a/packages/core-components/src/layout/InfoCard/InfoCard.tsx
+++ b/packages/core-components/src/layout/InfoCard/InfoCard.tsx
@@ -200,6 +200,10 @@ export function InfoCard(props: Props): JSX.Element {
   }
 
   const cardSubTitle = () => {
+    if (!subheader && !icon) {
+      return null;
+    }
+
     return (
       <div className={classes.headerSubheader}>
         {subheader && <div className={classes.subheader}>{subheader}</div>}

From 16e31e690f720bf9c2200831e0ab5983ccd9d6b3 Mon Sep 17 00:00:00 2001
From: Jack Palmer <jackpalmer@spotify.com>
Date: Mon, 5 Dec 2022 15:49:48 +0000
Subject: [PATCH 2/3] chore: Add changeset

Signed-off-by: Jack Palmer <jackpalmer@spotify.com>
---
 .changeset/sweet-pandas-relax.md | 5 +++++
 1 file changed, 5 insertions(+)
 create mode 100644 .changeset/sweet-pandas-relax.md

diff --git a/.changeset/sweet-pandas-relax.md b/.changeset/sweet-pandas-relax.md
new file mode 100644
index 0000000000..97cff5a89d
--- /dev/null
+++ b/.changeset/sweet-pandas-relax.md
@@ -0,0 +1,5 @@
+---
+'@backstage/core-components': patch
+---
+
+InfoCard - Remove subheader container when there is not a subheader or icon

From 73a352e10a3698acbbf1f51fc969051e607e0995 Mon Sep 17 00:00:00 2001
From: Jack Palmer <jackpalmer@spotify.com>
Date: Tue, 6 Dec 2022 09:20:24 +0000
Subject: [PATCH 3/3] chore: Add tests for InfoCard subheading

Signed-off-by: Jack Palmer <jackpalmer@spotify.com>
---
 .../src/layout/InfoCard/InfoCard.test.tsx     | 35 +++++++++++++++++++
 .../src/layout/InfoCard/InfoCard.tsx          |  5 ++-
 2 files changed, 39 insertions(+), 1 deletion(-)

diff --git a/packages/core-components/src/layout/InfoCard/InfoCard.test.tsx b/packages/core-components/src/layout/InfoCard/InfoCard.test.tsx
index 479efe4fd4..0db7c24c96 100644
--- a/packages/core-components/src/layout/InfoCard/InfoCard.test.tsx
+++ b/packages/core-components/src/layout/InfoCard/InfoCard.test.tsx
@@ -16,6 +16,7 @@
 
 import React from 'react';
 import { renderInTestApp } from '@backstage/test-utils';
+import { within } from '@testing-library/react';
 import { InfoCard } from './InfoCard';
 
 const minProps = {
@@ -36,4 +37,38 @@ describe('<InfoCard />', () => {
     const rendered = await renderInTestApp(<InfoCard {...minProps} />);
     expect(rendered.getByText('A deepLink title')).toBeInTheDocument();
   });
+
+  describe('Subheader', () => {
+    it('shows the subheader passed in via the subheader prop', async () => {
+      const { getByTestId } = await renderInTestApp(
+        <InfoCard {...minProps} subheader="example subheader" />,
+      );
+
+      const subheaderContainer = getByTestId('info-card-subheader');
+
+      expect(
+        within(subheaderContainer).getByText('example subheader'),
+      ).toBeInTheDocument();
+    });
+
+    it('shows the icon passed in via the icon prop', async () => {
+      const { getByTestId } = await renderInTestApp(
+        <InfoCard {...minProps} icon={<span data-testid="mock-icon" />} />,
+      );
+
+      const subheaderContainer = getByTestId('info-card-subheader');
+
+      expect(
+        within(subheaderContainer).getByTestId('mock-icon'),
+      ).toBeInTheDocument();
+    });
+
+    it('is not rendered where there is not an icon or subheading', async () => {
+      const { queryByTestId } = await renderInTestApp(
+        <InfoCard {...minProps} />,
+      );
+
+      expect(queryByTestId('info-card-subheader')).not.toBeInTheDocument();
+    });
+  });
 });
diff --git a/packages/core-components/src/layout/InfoCard/InfoCard.tsx b/packages/core-components/src/layout/InfoCard/InfoCard.tsx
index cafd65de28..95d474aae4 100644
--- a/packages/core-components/src/layout/InfoCard/InfoCard.tsx
+++ b/packages/core-components/src/layout/InfoCard/InfoCard.tsx
@@ -205,7 +205,10 @@ export function InfoCard(props: Props): JSX.Element {
     }
 
     return (
-      <div className={classes.headerSubheader}>
+      <div
+        className={classes.headerSubheader}
+        data-testid="info-card-subheader"
+      >
         {subheader && <div className={classes.subheader}>{subheader}</div>}
         {icon}
       </div>