Plugins: Show latest commit date at plugin details right panel (#95333)

* get last commit info from backend

* change last commit date type

* fix tests

* add tests to check lastCommitDate

public/app/features/plugins/admin/api.ts

@@ -17,7 +17,6 @@ import {
 export async function getPluginDetails(id: string): Promise<CatalogPluginDetails> {
   const remote = await getRemotePlugin(id);
   const isPublished = Boolean(remote);
-
   const [localPlugins, versions, localReadme, localChangelog] = await Promise.all([
     getLocalPlugins(),
     getPluginVersions(id, isPublished),
@@ -36,6 +35,7 @@ export async function getPluginDetails(id: string): Promise<CatalogPluginDetails
     versions,
     statusContext: remote?.statusContext ?? '',
     iam: remote?.json?.iam,
+    lastCommitDate: remote?.lastCommitDate,
     changelog: remote?.changelog || localChangelog,
   };
 }

public/app/features/plugins/admin/components/PluginDetailsRightPanel.tsx

@@ -46,9 +46,23 @@ export function PluginDetailsRightPanel(props: Props): React.ReactElement | null
           {plugin.updatedAt && (
             <Stack direction="column" gap={0.5}>
               <Text color="secondary">
-                <Trans i18nKey="plugins.details.labels.updatedAt">Last updated: </Trans>
+                <Trans i18nKey="plugins.details.labels.updatedAt">Last updated:</Trans>
               </Text>{' '}
-              <Text>{formatDate(new Date(plugin.updatedAt))}</Text>
+              <Text>{formatDate(new Date(plugin.updatedAt), { day: 'numeric', month: 'short', year: 'numeric' })}</Text>
+            </Stack>
+          )}
+          {plugin?.details?.lastCommitDate && (
+            <Stack direction="column" gap={0.5}>
+              <Text color="secondary">
+                <Trans i18nKey="plugins.details.labels.lastCommitDate">Last commit date:</Trans>
+              </Text>{' '}
+              <Text>
+                {formatDate(new Date(plugin.details.lastCommitDate), {
+                  day: 'numeric',
+                  month: 'short',
+                  year: 'numeric',
+                })}
+              </Text>
             </Stack>
           )}
         </Stack>

public/app/features/plugins/admin/pages/PluginDetails.test.tsx

@@ -917,7 +917,7 @@ describe('Plugin details page', () => {
       const updatedAt = '2023-10-26T16:54:55.000Z';
       const { queryByText } = renderPluginDetails({ id, updatedAt });
       expect(queryByText('Last updated:')).toBeVisible();
-      expect(queryByText('10/26/2023')).toBeVisible();
+      expect(queryByText('Oct 26, 2023')).toBeVisible();
       expect(queryByText('Report a concern')).toBeVisible();
     });
 
@@ -928,6 +928,21 @@ describe('Plugin details page', () => {
       expect(queryByText('Last updated:')).toBeNull();
     });
 
+    it('should display last commit date information', async () => {
+      const id = 'right-panel-test-plugin';
+      const lastCommitDate = '2023-10-26T16:54:55.000Z';
+      const { queryByText } = renderPluginDetails({ id, details: { lastCommitDate, links: [] } });
+      expect(queryByText('Last commit date:')).toBeVisible();
+      expect(queryByText('Oct 26, 2023')).toBeVisible();
+    });
+
+    it('should not display last commit date if there is no lastCommit data', async () => {
+      const id = 'right-panel-test-plugin';
+      const lastCommitDate = undefined;
+      const { queryByText } = renderPluginDetails({ id, details: { lastCommitDate, links: [] } });
+      expect(queryByText('Last commit date:')).toBeNull();
+    });
+
     it('should not display Report Abuse if the plugin is Core', async () => {
       const id = 'right-panel-test-plugin';
       const isCore = true;

public/app/features/plugins/admin/types.ts

@@ -78,6 +78,7 @@ export interface CatalogPluginDetails {
   statusContext?: string;
   iam?: IdentityAccessManagement;
   changelog?: string;
+  lastCommitDate?: string;
 }
 
 export interface CatalogPluginInfo {
@@ -139,6 +140,7 @@ export type RemotePlugin = {
   versionSignedByOrgName: string;
   versionStatus: string;
   angularDetected?: boolean;
+  lastCommitDate?: string;
 };
 
 // The available status codes on GCOM are available here:

public/locales/en-US/grafana.json

@@ -2178,12 +2178,13 @@
         "downloads": "Downloads",
         "from": "From",
         "installedVersion": "Installed version: ",
+        "lastCommitDate": "Last commit date:",
         "latestVersion": "Latest version: ",
         "links": "Links ",
         "reportAbuse": "Report a concern ",
         "signature": "Signature",
         "status": "Status",
-        "updatedAt": "Last updated: ",
+        "updatedAt": "Last updated:",
         "version": "Version"
       }
     },

public/locales/pseudo-LOCALE/grafana.json

@@ -2178,12 +2178,13 @@
         "downloads": "Đőŵʼnľőäđş",
         "from": "Fřőm",
         "installedVersion": "Ĩʼnşŧäľľęđ vęřşįőʼn: ",
+        "lastCommitDate": "Ŀäşŧ čőmmįŧ đäŧę:",
         "latestVersion": "Ŀäŧęşŧ vęřşįőʼn: ",
         "links": "Ŀįʼnĸş ",
         "reportAbuse": "Ŗępőřŧ ä čőʼnčęřʼn ",
         "signature": "Ŝįģʼnäŧūřę",
         "status": "Ŝŧäŧūş",
-        "updatedAt": "Ŀäşŧ ūpđäŧęđ: ",
+        "updatedAt": "Ŀäşŧ ūpđäŧęđ:",
         "version": "Vęřşįőʼn"
       }
     },