From d67e5e75c0ccb798a44b272bd8a158da68b96ce1 Mon Sep 17 00:00:00 2001
From: biersoeckli <meow@biersoeckli.ch>
Date: Fri, 15 Nov 2024 09:49:20 +0000
Subject: [PATCH] displaying shortened git commit hash

---
 .../project/app/[tabName]/overview/deployments.tsx    |  3 ++-
 src/components/custom/code.tsx                        |  4 ++--
 src/components/custom/short-commit-hash.tsx           | 11 +++++++++++
 3 files changed, 15 insertions(+), 3 deletions(-)
 create mode 100644 src/components/custom/short-commit-hash.tsx

diff --git a/src/app/project/app/[tabName]/overview/deployments.tsx b/src/app/project/app/[tabName]/overview/deployments.tsx
index f4df8d6..905564a 100644
--- a/src/app/project/app/[tabName]/overview/deployments.tsx
+++ b/src/app/project/app/[tabName]/overview/deployments.tsx
@@ -18,6 +18,7 @@ import DeploymentStatusBadge from "./deployment-status-badge";
 import { io } from "socket.io-client";
 import { podLogsSocket } from "@/lib/sockets";
 import { BuildLogsDialog } from "./build-logs-overlay";
+import ShortCommitHash from "@/components/custom/short-commit-hash";
 
 export default function BuildsTab({
     app
@@ -86,7 +87,7 @@ export default function BuildsTab({
                         ['buildJobName', 'Build Job Name', false],
                         ['status', 'Status', true, (item) => <DeploymentStatusBadge>{item.status}</DeploymentStatusBadge>],
                         ["startTime", "Started At", true, (item) => formatDateTime(item.createdAt)],
-                        ['gitCommit', 'Git Commit', true],
+                        ['gitCommit', 'Git Commit', true, (item) => <ShortCommitHash>{item.gitCommit}</ShortCommitHash>],
                     ]}
                         data={appBuilds}
                         hideSearchBar={true}
diff --git a/src/components/custom/code.tsx b/src/components/custom/code.tsx
index a450767..9b84f68 100644
--- a/src/components/custom/code.tsx
+++ b/src/components/custom/code.tsx
@@ -2,12 +2,12 @@
 
 import { toast } from "sonner";
 
-export function Code({ children, copieable = true }: { children: string | null | undefined, copieable?: boolean }) {
+export function Code({ children, copieable = true, copieableValue }: { children: string | null | undefined, copieable?: boolean, copieableValue?: string }) {
     return (children &&
         <code className={'relative rounded bg-muted px-[0.3rem] py-[0.2rem] font-mono text-sm font-semibold ' + (copieable ? 'cursor-pointer' : '')}
             onClick={() => {
                 if (!copieable) return;
-                navigator.clipboard.writeText(children || '');
+                navigator.clipboard.writeText(copieableValue || children || '');
                 toast.success('Copied to clipboard');
             }}>
             {children}
diff --git a/src/components/custom/short-commit-hash.tsx b/src/components/custom/short-commit-hash.tsx
new file mode 100644
index 0000000..f9fbc55
--- /dev/null
+++ b/src/components/custom/short-commit-hash.tsx
@@ -0,0 +1,11 @@
+import React from 'react';
+import { Code } from './code';
+
+export default function ShortCommitHash({ children }: { children?: string }) {
+    const shortHash = children ? children.slice(0, 7) : '';
+    if (!shortHash) {
+        return <></>;
+    }
+    return (<Code copieableValue={children}>{shortHash}</Code>);
+};
+