From 60cafe772736805f9f1be5532f224aa7b3dff078 Mon Sep 17 00:00:00 2001
From: Marley Powell <Marley.Powell@exclaimer.com>
Date: Mon, 8 Nov 2021 12:52:09 +0000
Subject: [PATCH] feat: Added subheader to `PullRequestCard` component.

Signed-off-by: Marley Powell <Marley.Powell@exclaimer.com>
---
 .../lib/PullRequestCard/PullRequestCard.tsx      | 16 ++++++++++++++++
 1 file changed, 16 insertions(+)

diff --git a/plugins/azure-devops/src/components/PullRequestsPage/lib/PullRequestCard/PullRequestCard.tsx b/plugins/azure-devops/src/components/PullRequestsPage/lib/PullRequestCard/PullRequestCard.tsx
index c7a472c082..1d30504f44 100644
--- a/plugins/azure-devops/src/components/PullRequestsPage/lib/PullRequestCard/PullRequestCard.tsx
+++ b/plugins/azure-devops/src/components/PullRequestsPage/lib/PullRequestCard/PullRequestCard.tsx
@@ -18,6 +18,7 @@ import { Card, CardContent, CardHeader, Link } from '@material-ui/core';
 
 import { AutoCompleteIcon } from '../AutoCompleteIcon';
 import { Avatar } from '@backstage/core-components';
+import { DateTime } from 'luxon';
 import { PullRequest } from '../../../../api/types';
 import { PullRequestCardPolicies } from './PullRequestCardPolicies';
 import { PullRequestCardReviewers } from './PullRequestCardReviewers';
@@ -71,6 +72,20 @@ export const PullRequestCard = ({
     </Link>
   );
 
+  const subheader = (
+    <span>
+      <Link
+        href={pullRequest.repository.url}
+        color="inherit"
+        target="_blank"
+        rel="noopener noreferrer"
+      >
+        {pullRequest.repository.name}
+      </Link>{' '}
+      · {DateTime.fromISO(pullRequest.creationDate.toString()).toRelative()}
+    </span>
+  );
+
   const avatar = (
     <Avatar
       displayName={pullRequest.createdBy.displayName}
@@ -86,6 +101,7 @@ export const PullRequestCard = ({
       <CardHeader
         avatar={avatar}
         title={title}
+        subheader={subheader}
         action={
           <AutoCompleteIcon hasAutoComplete={pullRequest.hasAutoComplete} />
         }