From 48463905310724911f134f233b4b330082699ae0 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Carl-Gerhard=20Lindesva=CC=88rd?= <lindesvard@gmail.com>
Date: Wed, 16 Oct 2024 23:07:41 +0200
Subject: [PATCH] fix(dashboard): fixed minor ui issues and errors

---
 .../[profileId]/profile-metrics/profile-metrics.tsx       | 8 +++++++-
 apps/dashboard/src/components/ui/key-value.tsx            | 2 +-
 2 files changed, 8 insertions(+), 2 deletions(-)

diff --git a/apps/dashboard/src/app/(app)/[organizationSlug]/[projectId]/profiles/[profileId]/profile-metrics/profile-metrics.tsx b/apps/dashboard/src/app/(app)/[organizationSlug]/[projectId]/profiles/[profileId]/profile-metrics/profile-metrics.tsx
index 293326bb..73ec37fd 100644
--- a/apps/dashboard/src/app/(app)/[organizationSlug]/[projectId]/profiles/[profileId]/profile-metrics/profile-metrics.tsx
+++ b/apps/dashboard/src/app/(app)/[organizationSlug]/[projectId]/profiles/[profileId]/profile-metrics/profile-metrics.tsx
@@ -27,7 +27,13 @@ function Info({ title, value }: { title: string; value: string }) {
   return (
     <div className="col gap-2">
       <div className="capitalize text-muted-foreground">{title}</div>
-      <div className="truncate font-mono">{value || '-'}</div>
+      <div className="truncate font-mono">
+        {value
+          ? typeof value === 'string'
+            ? value
+            : JSON.stringify(value)
+          : '-'}
+      </div>
     </div>
   );
 }
diff --git a/apps/dashboard/src/components/ui/key-value.tsx b/apps/dashboard/src/components/ui/key-value.tsx
index 33aac5f1..aeef479b 100644
--- a/apps/dashboard/src/components/ui/key-value.tsx
+++ b/apps/dashboard/src/components/ui/key-value.tsx
@@ -23,7 +23,7 @@ export function KeyValue({ href, onClick, name, value }: KeyValueProps) {
       <div className="bg-black/5 p-1 px-2 capitalize">{name}</div>
       <div
         className={cn(
-          'font-mono overflow-hidden text-ellipsis whitespace-nowrap bg-card p-1 px-2 text-highlight',
+          'font-mono overflow-hidden max-w-[300px] text-ellipsis whitespace-nowrap bg-card p-1 px-2 text-highlight',
           clickable && 'group-hover:underline',
         )}
       >