starting to work on the gemini api. getting the models list in the options page. see #204

_locales/en/messages.json

@@ -894,5 +894,25 @@
   "prompt_add_tags_force_lang": {
     "message": "The tags must be written in",
     "description": ""
+  },
+  "prefs_Connection_type_Google_Gemini_API": {
+    "message": "Google Gemini API",
+    "description": ""
+  },
+  "prefs_GoogleGemini_API_Key": {
+    "message": "API Key",
+    "description": ""
+  },
+  "GoogleGemini_Models": {
+    "message": "Google Gemini API Models",
+    "description": ""
+  },
+  "GoogleGemini_Models_Fetch": {
+    "message": "Update Google Gemini Models list",
+    "description": ""
+  },
+  "GoogleGemini_Models_Error_fetching": {
+    "message": "Error trying to fetch Google Gemini models",
+    "description": ""
   }
 }

js/api/google_gemini.js

@@ -0,0 +1,75 @@
+/*
+ *  ThunderAI [https://micz.it/thunderbird-addon-thunderai/]
+ *  Copyright (C) 2024  Mic (m@micz.it)
+
+ *  This program is free software: you can redistribute it and/or modify
+ *  it under the terms of the GNU General Public License as published by
+ *  the Free Software Foundation, either version 3 of the License, or
+ *  (at your option) any later version.
+
+ *  This program is distributed in the hope that it will be useful,
+ *  but WITHOUT ANY WARRANTY; without even the implied warranty of
+ *  MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
+ *  GNU General Public License for more details.
+
+ *  You should have received a copy of the GNU General Public License
+ *  along with this program.  If not, see <http://www.gnu.org/licenses/>.
+ */
+
+
+
+export class GoogleGemini {
+
+  apiKey = '';
+  model = '';
+  stream = false;
+
+  constructor(apiKey, model, stream) {
+    this.apiKey = apiKey;
+    this.model = model;
+    this.stream = stream;
+  }
+
+
+  fetchModels = async () => {
+    try{
+      const response = await fetch("https://generativelanguage.googleapis.com/v1beta/models?key=" + this.apiKey, {
+          method: "GET",
+          headers: {
+              "Content-Type": "application/json"
+          },
+      });
+
+      if (!response.ok) {
+          const errorDetail = await response.text();
+          let err_msg = "[ThunderAI] Google Gemini API request failed: " + response.status + " " + response.statusText + ", Detail: " + errorDetail;
+          console.error(err_msg);
+          let output = {};
+          output.ok = false;
+          output.error = errorDetail;
+          return output;
+      }
+
+      let output = {};
+      output.ok = true;
+      let output_response = await response.json();
+      console.log("[ThunderAI] Google Gemini API response: " + JSON.stringify(output_response));
+      output.response = output_response.models;
+
+      return output;
+    }catch (error) {
+      console.error("[ThunderAI] Google Gemini API request failed: " + error);
+      let output = {};
+      output.is_exception = true;
+      output.ok = false;
+      output.error = "Google Gemini API request failed: " + error;
+      return output;
+    }
+  }
+  
+//TODO
+  fetchResponse = async (messages, maxTokens = 0) => {
+    
+  }
+
+}

js/workers/model-worker-google_gemini.js

@@ -0,0 +1,124 @@
+/*
+ *  ThunderAI [https://micz.it/thunderbird-addon-thunderai/]
+ *  Copyright (C) 2024  Mic (m@micz.it)
+
+ *  This program is free software: you can redistribute it and/or modify
+ *  it under the terms of the GNU General Public License as published by
+ *  the Free Software Foundation, either version 3 of the License, or
+ *  (at your option) any later version.
+
+ *  This program is distributed in the hope that it will be useful,
+ *  but WITHOUT ANY WARRANTY; without even the implied warranty of
+ *  MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
+ *  GNU General Public License for more details.
+
+ *  You should have received a copy of the GNU General Public License
+ *  along with this program.  If not, see <http://www.gnu.org/licenses/>.
+ * 
+ * 
+ *  This file contains a modified version of the code from the project at https://github.com/boxabirds/chatgpt-frontend-nobuild
+ *  The original code has been released under the Apache License, Version 2.0.
+ */
+
+import { OpenAI } from '../api/openai.js';
+import { taLogger } from '../mzta-logger.js';
+
+let chatgpt_api_key = null;
+let chatgpt_model = '';
+let openai = null;
+let stopStreaming = false;
+let i18nStrings = null;
+let do_debug = false;
+let taLog = null;
+
+let conversationHistory = [];
+let assistantResponseAccumulator = '';
+
+self.onmessage = async function(event) {
+    if (event.data.type === 'init') {
+        chatgpt_api_key = event.data.chatgpt_api_key;
+        chatgpt_model = event.data.chatgpt_model;
+        openai = new OpenAI(chatgpt_api_key, chatgpt_model, true);
+        do_debug = event.data.do_debug;
+        i18nStrings = event.data.i18nStrings;
+        taLog = new taLogger('model-worker-openai', do_debug);
+    } else if (event.data.type === 'chatMessage') {
+        conversationHistory.push({ role: 'user', content: event.data.message });
+
+    const response = await openai.fetchResponse(conversationHistory); //4096);
+        postMessage({ type: 'messageSent' });
+
+        if (!response.ok) {
+            let error_message = '';
+            let errorDetail = '';
+            if(response.is_exception === true){
+                error_message = response.error;
+            }else{
+                try{
+                    const errorJSON = await response.json();
+                    errorDetail = JSON.stringify(errorJSON);
+                    error_message = errorJSON.error.message;
+                }catch(e){
+                    error_message = response.statusText;
+                }
+                taLog.log("error_message: " + JSON.stringify(error_message));
+            }
+            postMessage({ type: 'error', payload: i18nStrings["chatgpt_api_request_failed"] + ": " + response.status + " " + response.statusText + ", Detail: " + error_message + " " + errorDetail });
+            throw new Error("[ThunderAI] OpenAI ChatGPT API request failed: " + response.status + " " + response.statusText + ", Detail: " + error_message + " " + errorDetail);
+        }
+
+        const reader = response.body.getReader();
+        const decoder = new TextDecoder("utf-8");
+        let buffer = '';
+    
+        while (true) {
+            if (stopStreaming) {
+                stopStreaming = false;
+                reader.cancel();
+                conversationHistory.push({ role: 'assistant', content: assistantResponseAccumulator });
+                assistantResponseAccumulator = '';
+                postMessage({ type: 'tokensDone' });
+                break;
+            }
+            const { done, value } = await reader.read();
+            if (done) {
+                conversationHistory.push({ role: 'assistant', content: assistantResponseAccumulator });
+                assistantResponseAccumulator = '';
+                postMessage({ type: 'tokensDone' });
+                break;
+            }
+            // lots of low-level OpenAI response parsing stuff
+            const chunk = decoder.decode(value);
+            buffer += chunk;
+            taLog.log("buffer " + buffer);
+            const lines = buffer.split("\n");
+            buffer = lines.pop();
+            let parsedLines = [];
+            try{
+                parsedLines = lines
+                    .map((line) => line.replace(/^data: /, "").trim()) // Remove the "data: " prefix
+                    .filter((line) => line !== "" && line !== "[DONE]") // Remove empty lines and "[DONE]"
+                    // .map((line) => JSON.parse(line)); // Parse the JSON string
+                    .map((line) => {
+                        taLog.log("line: " + JSON.stringify(line));
+                        return JSON.parse(line);
+                    });
+            }catch(e){
+                taLog.error("Error parsing lines: " + e);
+            }
+    
+            for (const parsedLine of parsedLines) {
+                const { choices } = parsedLine;
+                const { delta } = choices[0];
+                const { content } = delta;
+                // Update the UI with the new content
+                if (content) {
+                    assistantResponseAccumulator += content;
+                    postMessage({ type: 'newToken', payload: { token: content } });
+                }
+            }
+        }
+    } else if (event.data.type === 'stop') {
+        stopStreaming = true;
+    }
+};

options/mzta-options.css

@@ -104,11 +104,20 @@ tr.conntype_openai_comp_api, tr.conntype_openai_comp_api2{
     background-color: rgb(213, 169, 238);
 }
 
+tr.conntype_google_gemini_api, tr.conntype_google_gemini_api2{
+    background-color: rgb(233, 238, 169);
+}
+
 #chatgpt_model_fetch_loading{
     display: none;
     font-style: italic;
 }
 
+#google_gemini_model_fetch_loading{
+    display: none;
+    font-style: italic;
+}
+
 .api_key-container {
     position: relative;
     width: 100%;
@@ -218,6 +227,10 @@ input.option-input[type="text"]{
         background-color: rgb(89, 20, 129);
     }
 
+    tr.conntype_google_gemini_api, tr.conntype_google_gemini_api2{
+        background-color: rgb(72, 77, 3);
+    }
+
     .api_key-container .toggle-icon img {
         filter: invert(1);
     }

options/mzta-options.html

@@ -109,6 +109,7 @@
             <select id="connection_type" name="connection_type" class="option-input">
               <option value="chatgpt_web">__MSG_prefs_Connection_type_ChatGPT_Web__</option>
               <option value="chatgpt_api">__MSG_prefs_Connection_type_ChatGPT_API__</option>
+              <option value="google_gemini_api">__MSG_prefs_Connection_type_Google_Gemini_API__</option>
               <option value="ollama_api">__MSG_prefs_Connection_type_Ollama_API__</option>
               <option value="openai_comp_api">__MSG_prefs_Connection_type_OpenAI_Comp_API__</option>
             </select>
@@ -174,6 +175,33 @@
           </label>
         </td>
       </tr>
+      <tr class="conntype_google_gemini_api">
+        <td><label>
+          <span>__MSG_prefs_GoogleGemini_API_Key__</span>
+        </label></td>
+        <td>
+          <div class="api_key-container">
+            <label>
+              <input type="password" id="google_gemini_api_key" name="google_gemini_api_key" class="option-input"/>
+            </label>
+            <span class="toggle-icon" id="toggle_google_gemini_api_key"><img src="../images/pwd-show.png" id="pwd-icon_google_gemini_api_key"></span>
+          </div>
+        </td>
+      </tr>
+      <tr class="conntype_google_gemini_api">
+        <td>
+          <label>
+            <span>__MSG_GoogleGemini_Models__</span>
+          </label>
+        </td>
+        <td>
+          <button id="btnUpdateGoogleGeminiModels">__MSG_GoogleGemini_Models_Fetch__</button> <span id="google_gemini_model_fetch_loading">__MSG_Loading__</span><br>
+          <label>
+            <select id="google_gemini_model" name="google_gemini_model" class="option-input">
+            </select>
+          </label>
+        </td>
+      </tr>
       <tr class="conntype_ollama_api">
         <td><label>
           <span>__MSG_prefs_API_Host__</span>

options/mzta-options.js

@@ -22,6 +22,7 @@ import { taLogger } from '../js/mzta-logger.js';
 import { OpenAI } from '../js/api/openai.js';
 import { Ollama } from '../js/api/ollama.js';
 import { OpenAIComp } from '../js/api/openai_comp.js'
+import { GoogleGemini } from '../js/api/google_gemini.js';
 
 let taLog = new taLogger("mzta-options",true);
 
@@ -55,7 +56,7 @@ function saveOptions(e) {
 async function restoreOptions() {
   function setCurrentChoice(result) {
     document.querySelectorAll(".option-input").forEach(element => {
-      taLog.log("Options restoring " + element.id + " = " + (element.id=="chatgpt_api_key" || element.id=="openai_comp_api_key" ? "****************" : result[element.id]));
+      taLog.log("Options restoring " + element.id + " = " + (element.id=="chatgpt_api_key" || element.id=="openai_comp_api_key" || element.id=="google_gemini_api_key" ? "****************" : result[element.id]));
       switch (element.type) {
         case 'checkbox':
           element.checked = result[element.id] || false;
@@ -99,12 +100,14 @@ function showConnectionOptions() {
   let chatgpt_api_display = 'none';
   let ollama_api_display = 'none';
   let openai_comp_api_display = 'none';
+  let google_gemini_api_display = 'none';
   let conntype_select = document.getElementById("connection_type");
   let parent = conntype_select.parentElement.parentElement.parentElement;
   parent.classList.toggle("conntype_chatgpt_web", (conntype_select.value === "chatgpt_web"));
   parent.classList.toggle("conntype_chatgpt_api", (conntype_select.value === "chatgpt_api"));
   parent.classList.toggle("conntype_ollama_api", (conntype_select.value === "ollama_api"));
   parent.classList.toggle("conntype_openai_comp_api", (conntype_select.value === "openai_comp_api"));
+  parent.classList.toggle("conntype_google_gemini_api", (conntype_select.value === "google_gemini_api"));
   if (conntype_select.value === "chatgpt_web") {
     chatgpt_web_display = 'table-row';
   }else{
@@ -125,6 +128,11 @@ function showConnectionOptions() {
   }else{
     openai_comp_api_display = 'none';
   }
+  if (conntype_select.value === "google_gemini_api") {
+    google_gemini_api_display = 'table-row';
+  }else{
+    google_gemini_api_display = 'none';
+  }
   document.querySelectorAll(".conntype_chatgpt_web").forEach(element => {
     element.style.display = chatgpt_web_display;
   });
@@ -137,6 +145,9 @@ function showConnectionOptions() {
   document.querySelectorAll(".conntype_openai_comp_api").forEach(element => {
     element.style.display = openai_comp_api_display;
   });
+  document.querySelectorAll(".conntype_google_gemini_api").forEach(element => {
+    element.style.display = google_gemini_api_display;
+  });
 }
 
 function warn_ChatGPT_APIKeyEmpty() {
@@ -161,6 +172,28 @@ function warn_ChatGPT_APIKeyEmpty() {
   }
 }
 
+function warn_GoogleGemini_APIKeyEmpty() {
+  let apiKeyInput = document.getElementById('google_gemini_api_key');
+  let btnFetchGoogleGeminiModels = document.getElementById('btnUpdateGoogleGeminiModels');
+  let modelGoogleGemini = document.getElementById('google_gemini_model');
+  if(apiKeyInput.value === ''){
+    apiKeyInput.style.border = '2px solid red';
+    btnFetchGoogleGeminiModels.disabled = true;
+    modelGoogleGemini.disabled = true;
+    modelGoogleGemini.selectedIndex = -1;
+    modelGoogleGemini.style.border = '';
+  }else{
+    apiKeyInput.style.border = '';
+    btnFetchGoogleGeminiModels.disabled = false;
+    modelGoogleGemini.disabled = false;
+    if((modelGoogleGemini.selectedIndex === -1)||(modelGoogleGemini.value === '')){
+      modelGoogleGemini.style.border = '2px solid red';
+    }else{
+      modelGoogleGemini.style.border = '';
+    }
+  }
+}
+
 function warn_Ollama_HostEmpty() {
   let hostInput = document.getElementById('ollama_host');
   let btnFetchOllamaModels = document.getElementById('btnUpdateOllamaModels');
@@ -294,11 +327,13 @@ document.addEventListener('DOMContentLoaded', async () => {
   conntype_select.addEventListener("change", warn_ChatGPT_APIKeyEmpty);
   conntype_select.addEventListener("change", warn_Ollama_HostEmpty);
   conntype_select.addEventListener("change", warn_OpenAIComp_HostEmpty);
+  conntype_select.addEventListener("change", warn_GoogleGemini_APIKeyEmpty);
   document.getElementById("chatgpt_api_key").addEventListener("change", warn_ChatGPT_APIKeyEmpty);
   document.getElementById("ollama_host").addEventListener("change", warn_Ollama_HostEmpty);
   document.getElementById("openai_comp_host").addEventListener("change", warn_OpenAIComp_HostEmpty);
+  document.getElementById("google_gemini_api_key").addEventListener("change", warn_GoogleGemini_APIKeyEmpty);
 
-  let prefs = await browser.storage.sync.get({chatgpt_model: '', ollama_model: '', openai_comp_model: ''});
+  let prefs = await browser.storage.sync.get({chatgpt_model: '', ollama_model: '', openai_comp_model: '', google_gemini_model: ''});
   
   // OpenAI API ChatGPT model fetching
   let select_chatgpt_model = document.getElementById('chatgpt_model');
@@ -340,6 +375,46 @@ document.addEventListener('DOMContentLoaded', async () => {
     warn_ChatGPT_APIKeyEmpty();
   });
 
+  // Google Gemini API ChatGPT model fetching
+  let select_google_gemini_model = document.getElementById('google_gemini_model');
+  const google_gemini_option = document.createElement('option');
+  google_gemini_option.value = prefs.google_gemini_model;
+  google_gemini_option.text = prefs.google_gemini_model;
+  select_google_gemini_model.appendChild(google_gemini_option);
+  select_google_gemini_model.addEventListener("change", warn_GoogleGemini_APIKeyEmpty);
+
+  document.getElementById('btnUpdateGoogleGeminiModels').addEventListener('click', async () => {
+    document.getElementById('google_gemini_model_fetch_loading').style.display = 'inline';
+    let google_gemini = new GoogleGemini(document.getElementById("google_gemini_api_key").value, '', true);
+    google_gemini.fetchModels().then((data) => {
+      if(!data.ok){
+        let errorDetail;
+        try {
+          errorDetail = JSON.parse(data.error);
+          errorDetail = errorDetail.error.message;
+        } catch (e) {
+          errorDetail = data.error;
+        }
+        document.getElementById('google_gemini_model_fetch_loading').style.display = 'none';
+        console.error("[ThunderAI] " + browser.i18n.getMessage("GoogleGemini_Models_Error_fetching"));
+        alert(browser.i18n.getMessage("GoogleGemini_Models_Error_fetching")+": " + errorDetail);
+        return;
+      }
+      taLog.log("GoogleGemini models: " + JSON.stringify(data));
+      data.response.forEach(model => {
+        if (!Array.from(select_google_gemini_model.options).some(option => option.value === model.id)) {
+          const option = document.createElement('option');
+          option.value = model.name.substring(model.name.lastIndexOf("/") + 1);;
+          option.text = model.displayName;
+          select_google_gemini_model.appendChild(option);
+        }
+      });
+      document.getElementById('google_gemini_model_fetch_loading').style.display = 'none';
+    });
+    
+    warn_GoogleGemini_APIKeyEmpty();
+  });
+
 // Ollama API Model fetching
 let select_ollama_model = document.getElementById('ollama_model');
 const ollama_option = document.createElement('option');
@@ -442,6 +517,7 @@ select_openai_comp_model.addEventListener("change", warn_OpenAIComp_HostEmpty);
   warn_ChatGPT_APIKeyEmpty();
   warn_Ollama_HostEmpty();
   warn_OpenAIComp_HostEmpty();
+  warn_GoogleGemini_APIKeyEmpty();
   disable_MaxPromptLength();
   disable_AddTags();
 
@@ -456,6 +532,17 @@ select_openai_comp_model.addEventListener("change", warn_OpenAIComp_HostEmpty);
       icon_img_chatgpt_api_key.src = type === 'password' ? "../images/pwd-show.png" : "../images/pwd-hide.png";
   });
 
+  const passwordField_google_gemini_api_key = document.getElementById('google_gemini_api_key');
+  const toggleIcon_google_gemini_api_key = document.getElementById('toggle_google_gemini_api_key');
+  const icon_img_google_gemini_api_key = document.getElementById('pwd-icon_google_gemini_api_key');
+
+  toggleIcon_google_gemini_api_key.addEventListener('click', () => {
+      const type = passwordField_google_gemini_api_key.getAttribute('type') === 'password' ? 'text' : 'password';
+      passwordField_google_gemini_api_key.setAttribute('type', type);
+
+      icon_img_google_gemini_api_key.src = type === 'password' ? "../images/pwd-show.png" : "../images/pwd-hide.png";
+  });
+
   const passwordField_openai_comp_api_key = document.getElementById('openai_comp_api_key');
   const toggleIcon_openai_comp_api_key = document.getElementById('toggle_openai_comp_api_key');
   const icon_img_openai_comp_api_key = document.getElementById('pwd-icon_openai_comp_api_key');