Feat google ai studio

index.html

@@ -1027,6 +1027,16 @@ <h2 id="editBookmarkHeading">Edit Bookmark</h2>
                 <div class="tLabel" id="gemini">Gemini</div>
             </a>
             <!-- ---------------- -->
+            <a href="https://ai.google/studio/">
+                <div class="tIcon">
+                    <svg height="100%" viewBox="0 0 24 24" width="100%" xmlns="http://www.w3.org/2000/svg">
+                        <rect class="accentColor aiDarkIcons" width="100%" height="100%" rx="50%" />
+                        <path class="bgLightTint notTargeted" d="M12 4.5c-4.142 0-7.5 3.358-7.5 7.5S7.858 19.5 12 19.5 19.5 16.142 19.5 12 16.142 4.5 12 4.5zm0 1.5c1.854 0 3.5.894 4.5 2.296A4.497 4.497 0 0012 8.5c-1.97 0-3.657 1.23-4.27 2.963A5.993 5.993 0 0112 6zm0 11c-1.854 0-3.5-.894-4.5-2.296A4.497 4.497 0 0012 15.5c1.97 0 3.657-1.23 4.27-2.963A5.993 5.993 0 0112 17z" />
+                    </svg>
+                </div>
+                <div class="tLabel" id="googleAIStudio">Google AI Studio</div>
+            </a>
+            <!-- ---------------- -->
             <a href="https://copilot.microsoft.com/">
                 <div class="tIcon">
                     <svg height="100%" width="100%" viewBox="0 0 30 30" xmlns="http://www.w3.org/2000/svg">

locales/en.js

@@ -146,6 +146,7 @@ const en = {
     "ai_tools": "AI Tools",
     "chatGPT": "ChatGPT",
     "gemini": "Gemini",
+    "googleAIStudio": "Google AI Studio",
     "copilot": "Copilot",
     "claude": "Claude",
     "grok": "Grok",

scripts/ai-tools.js

@@ -10,21 +10,54 @@
 const aiToolsRaw = [
     { id: "chatGPT", visible: true, order: 0 },
     { id: "gemini", visible: true, order: 1 },
-    { id: "copilot", visible: true, order: 2 },
-    { id: "claude", visible: true, order: 3 },
-    { id: "deepseek", visible: true, order: 4 },
-    { id: "perplexity", visible: false, order: 5 },
-    { id: "grok", visible: false, order: 6 },
-    { id: "metaAI", visible: false, order: 7 },
-    { id: "qwen", visible: false, order: 8 },
-    { id: "firefly", visible: false, order: 9 }
+    { id: "googleAIStudio", visible: true, order: 2 },
+    { id: "copilot", visible: true, order: 3 },
+    { id: "claude", visible: true, order: 4 },
+    { id: "deepseek", visible: true, order: 5 },
+    { id: "perplexity", visible: false, order: 6 },
+    { id: "grok", visible: false, order: 7 },
+    { id: "metaAI", visible: false, order: 8 },
+    { id: "qwen", visible: false, order: 9 },
+    { id: "firefly", visible: false, order: 10 }
 ];
 // Translations for AI tools
 const aiTools = aiToolsRaw.map(tool => ({
     ...tool,
     label: translations[currentLanguage]?.[tool.id] || translations["en"][tool.id]
 }));
 
+function mergeAIToolsSettings(savedSettings) {
+    const normalizedSettings = [];
+    const seenToolIds = new Set();
+
+    if (Array.isArray(savedSettings)) {
+        savedSettings.forEach((item) => {
+            let toolId;
+            let isVisible = true;
+
+            if (typeof item === "string") {
+                toolId = item;
+            } else {
+                toolId = Object.keys(item)[0];
+                isVisible = false;
+            }
+
+            if (aiTools.some(tool => tool.id === toolId)) {
+                seenToolIds.add(toolId);
+                normalizedSettings.push(isVisible ? toolId : { [toolId]: false });
+            }
+        });
+    }
+
+    aiTools.forEach((tool) => {
+        if (!seenToolIds.has(tool.id)) {
+            normalizedSettings.push(tool.visible ? tool.id : { [tool.id]: false });
+        }
+    });
+
+    return normalizedSettings;
+}
+
 // DOM Elements
 const aiToolName = document.getElementById("toolsCont");
 const shortcuts = document.getElementById("shortcutsContainer");
@@ -131,12 +164,10 @@ function applyAIToolsSettings() {
     const savedSettings = JSON.parse(localStorage.getItem("aiToolsSettings") || "null");
     let settingsToApply;
 
-    if (!savedSettings || !Array.isArray(savedSettings)) {
-        // Initialize with default values if no settings exist
-        settingsToApply = aiTools.map(tool => tool.visible ? tool.id : { [tool.id]: false });
+    settingsToApply = mergeAIToolsSettings(savedSettings);
+
+    if (!savedSettings || !Array.isArray(savedSettings) || JSON.stringify(settingsToApply) !== JSON.stringify(savedSettings)) {
         localStorage.setItem("aiToolsSettings", JSON.stringify(settingsToApply));
-    } else {
-        settingsToApply = savedSettings;
     }
 
     // Create a map of current tool elements for quick lookup
@@ -243,23 +274,11 @@ function showAIToolsSettings() {
     aiToolsForm.innerHTML = "";
 
     // Load saved tool order and visibility or initialize from defaults
-    let savedSettings = JSON.parse(localStorage.getItem("aiToolsSettings") || "null");
-
-    // If no settings exist, create from aiTools
-    if (!savedSettings || !Array.isArray(savedSettings)) {
-        savedSettings = aiTools.map(tool => {
-            if (tool.visible) {
-                return tool.id;
-            } else {
-                const hiddenTool = {};
-                hiddenTool[tool.id] = false;
-                return hiddenTool;
-            }
-        });
-    }
+    const savedSettings = JSON.parse(localStorage.getItem("aiToolsSettings") || "null");
+    const normalizedSettings = mergeAIToolsSettings(savedSettings);
 
     // Generate the form with the saved settings
-    generateAIToolsForm(savedSettings);
+    generateAIToolsForm(normalizedSettings);
 
     // Show modal and overlay
     aiToolsSettingsModal.style.display = "block";