feat(chat): send attachments to gemini and move package to peerDeps

Author: igdmdimitrov

package-lock.json

@@ -51,7 +51,6 @@
   },
   "dependencies": {
     "@floating-ui/dom": "^1.7.0",
-    "@google/genai": "^1.3.0",
     "@lit-labs/virtualizer": "^2.1.0",
     "@lit/context": "^1.1.5",
     "lit": "^3.3.0"
@@ -104,7 +103,8 @@
   },
   "peerDependencies": {
     "@supabase/supabase-js": "^2.49.4",
-    "marked": "^12.0.0"
+    "marked": "^12.0.0",
+    "@google/genai": "^1.3.0"
   },
   "browserslist": [
     "defaults"

package.json

@@ -437,6 +437,23 @@ function generateAIResponse(message: string): string {
   return 'How can I help? Possible commands: hello, help, feature, weather, thank, code, image, list, heading.';
 }
 
+function fileToGenerativePart(buffer, mimeType) {
+  // Convert ArrayBuffer to base64 string in the browser
+  let binary = '';
+  const bytes = new Uint8Array(buffer);
+  for (let i = 0; i < bytes.byteLength; i++) {
+    binary += String.fromCharCode(bytes[i]);
+  }
+  const base64String = btoa(binary);
+
+  return {
+    inlineData: {
+      data: base64String,
+      mimeType,
+    },
+  };
+}
+
 async function handleAIMessageSend(e: CustomEvent) {
   const newMessage: IgcMessage = e.detail;
   const chat = document.querySelector('igc-chat');
@@ -456,6 +473,18 @@ async function handleAIMessageSend(e: CustomEvent) {
 
   userMessages.push({ role: 'user', parts: [{ text: newMessage.text }] });
 
+  if (newMessage.attachments && newMessage.attachments.length > 0) {
+    for (const attachment of newMessage.attachments) {
+      if (attachment.file) {
+        const filePart = fileToGenerativePart(
+          await attachment.file.arrayBuffer(),
+          attachment.file.type
+        );
+        userMessages.push({ role: 'user', parts: [filePart] });
+      }
+    }
+  }
+
   if (newMessage.text.includes('image')) {
     response = await ai.models.generateContent({
       model: 'gemini-2.0-flash-preview-image-generation',