[NEB-210] Nebula: Add image upload

Author: MananTank

apps/dashboard/src/@/components/ui/image-upload-button.tsx

@@ -0,0 +1,45 @@
+"use client";
+
+import { Button } from "@/components/ui/button";
+import type React from "react";
+import { useRef } from "react";
+
+interface ImageUploadProps {
+  value: File | undefined;
+  onChange?: (files: File[]) => void;
+  children?: React.ReactNode;
+  variant?: React.ComponentProps<typeof Button>["variant"];
+  className?: string;
+  tooltipLabel?: string;
+  multiple?: boolean;
+}
+
+export function ImageUploadButton(props: ImageUploadProps) {
+  const fileInputRef = useRef<HTMLInputElement>(null);
+
+  const handleFileChange = (e: React.ChangeEvent<HTMLInputElement>) => {
+    const files = Array.from(e.target.files || []);
+    props.onChange?.(files);
+  };
+
+  return (
+    <div>
+      <Button
+        variant={props.variant}
+        onClick={() => fileInputRef.current?.click()}
+        className={props.className}
+      >
+        {props.children}
+      </Button>
+      <input
+        ref={fileInputRef}
+        type="file"
+        multiple={props.multiple}
+        accept="image/*"
+        onChange={handleFileChange}
+        className="hidden"
+        aria-label="Upload image"
+      />
+    </div>
+  );
+}

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

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