Nebula: Fix User Image message type

Author: MananTank

apps/dashboard/src/app/nebula-app/(app)/api/types.ts

@@ -6,11 +6,8 @@ type SessionContextFilter = {
 type NebulaUserMessageContentItem =
   | {
       type: "image";
-      image_url: string;
-    }
-  | {
-      type: "image";
-      b64: string;
+      image_url: string | null;
+      b64: string | null;
     }
   | {
       type: "text";

apps/dashboard/src/app/nebula-app/(app)/components/ChatBar.tsx

@@ -82,7 +82,11 @@ export function ChatBar(props: {
     if (images.length > 0) {
       for (const image of images) {
         if (image.b64) {
-          userMessage.content.push({ type: "image", b64: image.b64 });
+          userMessage.content.push({
+            type: "image",
+            b64: image.b64,
+            image_url: null,
+          });
         }
       }
     }

apps/dashboard/src/app/nebula-app/(app)/components/Chats.tsx

@@ -202,11 +202,11 @@ function RenderMessage(props: {
                 <NebulaImage
                   type="submitted"
                   url={
-                    "b64" in msg
+                    typeof msg.b64 === "string"
                       ? msg.b64.startsWith("data:image")
                         ? msg.b64
                         : `data:image/png;base64,${msg.b64}`
-                      : msg.image_url
+                      : (msg.image_url ?? "")
                   }
                   client={props.client}
                 />

apps/dashboard/src/app/nebula-app/(app)/components/NebulaImage.tsx

@@ -55,7 +55,9 @@ export function NebulaImage(
             height={props.type === "response" ? props.height : undefined}
             src={src}
             className="w-full rounded-lg border hover:border-active-border"
-            skeleton={<div className="animate-skeleton bg-muted" />}
+            skeleton={
+              <div className="min-h-[300px] animate-skeleton bg-muted" />
+            }
           />
         </DialogTrigger>