- Removed OpenAI API parameter options from persistent storage.

- Added image style settings to Settings component.

.gitignore

@@ -22,7 +22,3 @@ dist-ssr
 *.njsproj
 *.sln
 *.sw?
-
-
-new-format.json
-old-format.json

CHANGELOG.md

@@ -17,16 +17,9 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0
 ## [BACKLOG]
 - Add language information to messages and extract it automatically to know current language.
 - Should make iconColor() a utility function.
-- Should text and image generation models be merged in QuickSettings? And selection icons in input field removed?
 - Length of persona name should be restricted to e.g. 32 characters to fit dropdown selection box.
 - Avatars should be scaled down to save storage space. Unless stored as separate files, only once.
 
-### [MAJOR]
-´`
-### [MINOR]
-
-### [PATCH]
-
 ### [KNOWN-BUGS]
 - ResizeObserver loop completed with undelivered notifications. 
   https://github.com/quasarframework/quasar/issues/2233#issuecomment-1719873402
@@ -35,6 +28,10 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0
 
 ## [UNRELEASED]
 
+## v1.2.0 - 2023-11-14
+- Removed OpenAI API parameter options from persistent storage.
+- Added image style settings to Settings component.
+
 ## v1.1.0 - 2023-11-09
 - Added new text generation model GPT-4 Turbo (gpt-4-1106-preview).
 - Added new image generation model DALL-E 3, along with image quality and image style settings.

package.json

@@ -1,7 +1,7 @@
 {
   "name": "team-ai",
   "private": true,
-  "version": "1.1.0",
+  "version": "1.2.0",
   "type": "module",
   "scripts": {
     "dev": "vite",

src/components/QuickSettings.vue

@@ -143,6 +143,7 @@ import { useTeamsStore } from '../stores/teams-store.js';
 import { storeToRefs } from "pinia";
 import { useI18n } from 'vue-i18n';
 import { useQuasar } from 'quasar';
+import openaiConfig from '../services/openai.config.json';
 
 export default {
     name: "QuickSettings",
@@ -155,7 +156,6 @@ export default {
             appMode,
             conversationMode,
             model,
-            modelOptions,
             maxTokens,
             temperature,
             choices,
@@ -184,10 +184,12 @@ export default {
             });
         }
 
-        // Image related
-        const imageSizeOptions = ['1024x1024', '1024x1792', '1792x1024'];
-        const imageQualityOptions = ['standard', 'hd'];
-        const imageStyleOptions = ['vivid', 'natural'];
+        // Load OpenAI model options
+        const modelOptions = openaiConfig.gptModels;
+        const imageSizeOptions = openaiConfig.imageSizeOptions;
+        const imageQualityOptions = openaiConfig.imageQualityOptions;
+        const imageStyleOptions = openaiConfig.imageStyleOptions;
+
         const imageSizeValue = ref(imageSizeOptions.indexOf(imageSize.value));
         const imageQualityValue = ref(imageQualityOptions.indexOf(imageQuality.value));
         const imageStyleValue = ref(imageStyleOptions.indexOf(imageStyle.value));
@@ -210,7 +212,6 @@ export default {
             conversationMode,
             appMode,
             model,
-            modelOptions,
             maxTokens,
             temperature,
             choices,
@@ -232,9 +233,9 @@ export default {
                     return;
                 }
 
-                let index = modelOptions.value.indexOf(model.value);
-                index = (index + 1) % modelOptions.value.length;
-                model.value = modelOptions.value[index];
+                let index = modelOptions.indexOf(model.value);
+                index = (index + 1) % modelOptions.length;
+                model.value = modelOptions[index];
             },
 
             iconColor: computed(() => $q.dark.isActive ? 'grey-4' : 'grey-8')

src/components/Settings.vue

@@ -307,6 +307,20 @@
                     </q-item-section>
                 </q-item>
 
+                <q-item>
+                    <q-item-section avatar>
+                        <q-icon name="mdi-palette" :color="iconColor" />
+                    </q-item-section>
+                    <q-item-section>
+                        <q-item-label caption>{{ t('settings.openAI.style.label') }} ({{ imageStyle }})</q-item-label>
+                        <q-slider :model-value="imageStyleValue" @update:model-value="val => { imageStyleValue = val }" snap
+                            :min="0" :max="1" :step="1" :markers="1" label :label-value="imageStyle" />
+                        <q-tooltip :delay="1000" max-width="300px" transition-show="scale" transition-hide="scale">
+                            {{ t('settings.openAI.style.tooltip') }}
+                        </q-tooltip>
+                    </q-item-section>
+                </q-item>
+
             </q-list>
         </q-card-section>
     </q-card>
@@ -319,6 +333,7 @@ import { useTeamsStore } from '../stores/teams-store.js';
 import { storeToRefs } from "pinia";
 import { useI18n } from 'vue-i18n';
 import { useQuasar } from 'quasar';
+import openaiConfig from '../services/openai.config.json';
 
 export default {
     name: "AppSettings",
@@ -334,12 +349,12 @@ export default {
             chatDirection,
             apiKey,
             model,
-            modelOptions,
             maxTokens,
             temperature,
             choices,
             imageSize,
             imageQuality,
+            imageStyle,
             personas,
             quickSettings,
             speechLanguage,
@@ -361,11 +376,15 @@ export default {
             });
         }
 
-        // Image related
-        const imageSizeOptions = ['1024x1024', '1024x1792', '1792x1024'];
-        const imageQualityOptions = ['standard', 'hd'];
+        // Load OpenAI model options
+        const modelOptions = openaiConfig.gptModels;
+        const imageSizeOptions = openaiConfig.imageSizeOptions;
+        const imageQualityOptions = openaiConfig.imageQualityOptions;
+        const imageStyleOptions = openaiConfig.imageStyleOptions;
+
         const imageSizeValue = ref(imageSizeOptions.indexOf(imageSize.value));
         const imageQualityValue = ref(imageQualityOptions.indexOf(imageQuality.value));
+        const imageStyleValue = ref(imageStyleOptions.indexOf(imageStyle.value));
 
         watch(imageSizeValue, () => {
             imageSize.value = imageSizeOptions[imageSizeValue.value];
@@ -375,6 +394,10 @@ export default {
             imageQuality.value = imageQualityOptions[imageQualityValue.value];
         });
 
+        watch(imageStyleValue, () => {
+            imageStyle.value = imageStyleOptions[imageStyleValue.value];
+        });
+
         // Avatar related
         const avatarImage = ref(null);
         const avatarPicker = ref(null);
@@ -411,6 +434,8 @@ export default {
             imageSizeValue,
             imageQuality,
             imageQualityValue,
+            imageStyle,
+            imageStyleValue,
             personaOptions,
             personaFilterFn,
             personas,

src/services/databaseUpgrader.js

@@ -27,13 +27,20 @@ const databaseUpgrader = () => {
             description: 'Added new OpenAI models.',
             caption: t('databaseUpgrade.inProgress.caption', { version: '7' }),
             upgrade: () => upgradeToVersion7()
+        },
+        {
+            version: 8,
+            description: 'Removed OpenAI API parameter options from persistent storage.',
+            caption: t('databaseUpgrade.inProgress.caption', { version: '8' }),
+            upgrade: () => upgradeToVersion8()
         }
     ];
 
     // =================================================================================================
     // Update latest database version here when needed
     // -------------------------------------------------------------------------------------------------
-    const LATEST_DB_VERSION = 7;
+    const LATEST_DB_VERSION = 8;
+
     // =================================================================================================
     const getDBVersion = async () => parseInt(JSON.parse(await settingsDB.getItem('dBVersion')));
     const setDBVersion = async (version) => await settingsDB.setItem('dBVersion', JSON.stringify(version));
@@ -61,6 +68,15 @@ const databaseUpgrader = () => {
         }
     }
 
+    // Clean up stuff that should not be persisted as states
+    const upgradeToVersion8 = async () => {
+        try {
+            await settingsDB.removeItem('modelOptions');
+        } catch (error) {
+            console.error(error);
+            throw error;
+        }
+    }
     // Upgrade to mitigate performance issues due to images being stored in message objects.
     // This upgrade moves images to a separate table, imageDB.
     const upgradeToVersion6 = async () => {

src/services/openai.config.json

@@ -0,0 +1,6 @@
+{
+    "gptModels": ["gpt-3.5-turbo", "gpt-4", "gpt-4-1106-preview"],
+    "imageSizeOptions": ["1024x1024", "1024x1792", "1792x1024"],
+    "imageQualityOptions": ["standard", "hd"],
+    "imageStyleOptions": ["natural", "vivid"]
+}

src/stores/settings-store.js

@@ -17,25 +17,7 @@ export const useSettingsStore = defineStore('settings', () => {
         // OpenAI settings
         apiKey: ref(''),
 
-        // Models - NOT USED YET
-        models: ref([
-            { type: 'text', id: 'gpt-3.5-turbo', name: 'GPT-3.5 Turbo', maxTokens: 4096, contextWindow: 4096, description: '' },
-            { type: 'text', id: 'gpt-3.5-turbo-16k', name: 'GPT-3.5 Turbo 16k', maxTokens: 4096, contextWindow: 16385, description: '' },
-
-            { type: 'text', id: 'gpt-4', name: 'GPT-4', maxTokens: 4096, contextWindow: 8192, description: '' },
-            { type: 'text', id: 'gpt-4-32k', name: 'GPT-4 32k', maxTokens: 4096, contextWindow: 32768, description: '' },
-            { type: 'text', id: 'gpt-4-1106-preview', name: 'GPT-4 Turbo (preview)', maxTokens: 4096, contextWindow: 128000, description: '' },
-            { type: 'text', id: 'gpt-4-vision-preview', name: 'GPT-4 Turbo with Vision (preview)', maxTokens: 4096, contextWindow: 128000, description: '' }, ,
-
-            { type: 'image', id: 'dall-e-2', name: 'DALL·E 2', imageSize: ['256x256', '512x512', '1024x1024'], description: '' },
-            { type: 'image', id: 'dall-e-3', name: 'DALL·E 3', imageSize: ['1024x1024', '1024x1792', '1792x1024'], imageQuality: ['standard', 'hd'], description: '' },
-
-            { type: 'tts', id: '', name: '', description: 'Text-to-speech' },
-            { type: 'stt', id: '', name: '', description: 'Speech-to-text' }
-        ]),
-
         // Chat completion settings
-        modelOptions: ref(['gpt-3.5-turbo', 'gpt-4', 'gpt-4-1106-preview']),
         model: ref('gpt-4-1106-preview'),
         maxTokens: ref(4096),
         temperature: ref(0.2),