added a loading info when fetching models

_locales/en/messages.json

@@ -414,5 +414,9 @@
   "ChatGPT_Models_Error_fetching": {
     "message": "Error trying to fetch ChatGPT models",
     "description": ""
+  },
+  "ChatGPT_Models_Loading": {
+    "message": "Loading...",
+    "description": ""
   }
 }

options/mzta-options.css

@@ -102,6 +102,11 @@ div#miczTranslate{
 }
 */
 
+#model_fetch_loading{
+    display: none;
+    font-style: italic;
+}
+
 @media (prefers-color-scheme: dark) {
     body {
         background-color: rgb(35, 34, 43);

options/mzta-options.html

@@ -115,7 +115,7 @@
           </label>
         </td>
         <td>
-          <button id="btnUpdateChatGPTModels">__MSG_ChatGPT_Models_Fetch__</button><br>
+          <button id="btnUpdateChatGPTModels">__MSG_ChatGPT_Models_Fetch__</button> <span id="model_fetch_loading">__MSG_ChatGPT_Models_Loading__</span><br>
           <label>
             <select id="model_chatgpt" name="model_chatgpt" class="option-input">
             </select>

options/mzta-options.js

@@ -163,8 +163,10 @@ document.addEventListener('DOMContentLoaded', async () => {
   select_model_chatgpt.appendChild(option);
 
   document.getElementById('btnUpdateChatGPTModels').addEventListener('click', () => {
+    document.getElementById('model_fetch_loading').style.display = 'inline';
     openai.fetchModels().then((data) => {
       if(!data){
+        document.getElementById('model_fetch_loading').style.display = 'none';
         console.error("[ThunderAI] " + browser.i18n.getMessage("ChatGPT_Models_Error_fetching"));
         alert(browser.i18n.getMessage("ChatGPT_Models_Error_fetching"));
         return;
@@ -178,6 +180,7 @@ document.addEventListener('DOMContentLoaded', async () => {
           select_model_chatgpt.appendChild(option);
         }
       });
+      document.getElementById('model_fetch_loading').style.display = 'none';
     })
   });
 }, { once: true });