feat: Account settings in dedicated page

.eslintrc.yaml

@@ -26,9 +26,12 @@ extends:
 
 plugins:
   - vue
+  - perfectionist
 
 rules:
   'no-unused-vars': [ 'warn', { argsIgnorePattern: '^_', varsIgnorePattern: '^_' } ]
 
   'vue/multi-word-component-names': 'off'
   'vue/no-v-html': 'off'
+
+  perfectionist/sort-imports: [ "warn" ]

package.json

@@ -68,6 +68,7 @@
     "autoprefixer": "^10.4.20",
     "eslint": "^8.57.0",
     "eslint-config-prettier": "^9.1.0",
+    "eslint-plugin-perfectionist": "^3.9.1",
     "eslint-plugin-vue": "^9.27.0",
     "postcss": "^8.4.41",
     "prettier": "^3.3.3",

src/apis/subscriptions/services.gen.ts

@@ -1,6 +1,7 @@
 // This file is auto-generated by @hey-api/openapi-ts
 
 import { createClient, createConfig, type Options } from '@hey-api/client-axios';
+
 import type {
   GetUserSubscriptionsSubscriptionsGetData,
   GetUserSubscriptionsSubscriptionsGetError,

src/boot/utils.ts

@@ -1,12 +1,10 @@
-import { boot } from 'quasar/wrappers';
-
 import dayjs from 'dayjs';
 import localizedFormat from 'dayjs/plugin/localizedFormat';
 import relativeTime from 'dayjs/plugin/relativeTime';
-
+import * as pdfjs from 'pdfjs-dist';
+import { boot } from 'quasar/wrappers';
 // @ts-expect-error
 import workerSrc from 'pdfjs-dist/build/pdf.worker?worker&url';
-import * as pdfjs from 'pdfjs-dist';
 
 export default boot(() => {
   dayjs.extend(localizedFormat);

src/boot/wagmi.ts

@@ -1,7 +1,8 @@
-import { boot } from 'quasar/wrappers';
+import { QueryClient, VueQueryPlugin } from '@tanstack/vue-query';
 import { WagmiPlugin } from '@wagmi/vue';
+import { boot } from 'quasar/wrappers';
+
 import { config } from '../config/wagmi';
-import { QueryClient, VueQueryPlugin } from '@tanstack/vue-query';
 
 export default boot(({ app }) => {
   const queryClient = new QueryClient();

src/components/AccountButton.vue

@@ -44,12 +44,12 @@
 </template>
 
 <script lang="ts" setup>
-import { useAccountStore } from 'stores/account';
 import { useAccount, useConnect, useDisconnect } from '@wagmi/vue';
 import { watchAccount } from '@wagmi/vue/actions';
+import LtaiIcon from 'components/libertai/LtaiIcon.vue';
 import { config } from 'src/config/wagmi';
+import { useAccountStore } from 'stores/account';
 import { watchEffect } from 'vue';
-import LtaiIcon from 'components/libertai/LtaiIcon.vue';
 
 const accountStore = useAccountStore();
 

src/components/ChatsList.vue

@@ -64,14 +64,14 @@
 </template>
 
 <script lang="ts" setup>
+import ChatSettingsDialog from 'components/dialog/ChatSettingsDialog.vue';
+import LtaiDialog from 'components/libertai/LtaiDialog.vue';
+import LtaiIcon from 'components/libertai/LtaiIcon.vue';
 import { storeToRefs } from 'pinia';
+import { Chat } from 'src/types/chats';
 import { useChatsStore } from 'stores/chats';
-import { useRoute, useRouter } from 'vue-router';
 import { nextTick, ref } from 'vue';
-import ChatSettingsDialog from 'components/dialog/ChatSettingsDialog.vue';
-import { Chat } from 'src/types/chats';
-import LtaiIcon from 'components/libertai/LtaiIcon.vue';
-import LtaiDialog from 'components/libertai/LtaiDialog.vue';
+import { useRoute, useRouter } from 'vue-router';
 
 const chatsStore = useChatsStore();
 const route = useRoute();

src/components/MarkdownRenderer.vue

@@ -3,11 +3,11 @@
 </template>
 
 <script lang="ts" setup>
-import { ref, watch } from 'vue';
+import DOMPurify from 'dompurify';
+import hljs from 'highlight.js';
 import { Marked } from 'marked';
 import { markedHighlight } from 'marked-highlight';
-import hljs from 'highlight.js';
-import DOMPurify from 'dompurify';
+import { ref, watch } from 'vue';
 
 const props = defineProps({
   content: {

src/components/MessageInput.vue

@@ -63,12 +63,12 @@
 </template>
 
 <script lang="ts" setup>
-import { PropType, ref, watch } from 'vue';
+import LtaiIcon from 'components/libertai/LtaiIcon.vue';
+import { useQuasar } from 'quasar';
 import { MessageAttachment, SendMessageParams } from 'src/types/chats';
 import { processAttachment } from 'src/utils/knowledge/attachments';
-import { useQuasar } from 'quasar';
-import LtaiIcon from 'components/libertai/LtaiIcon.vue';
 import { supportedInputFiles } from 'src/utils/knowledge/parsing';
+import { PropType, ref, watch } from 'vue';
 
 const props = defineProps({
   isLoading: {

src/components/dialog/ChatSettingsDialog.vue

@@ -39,18 +39,18 @@
 </template>
 
 <script lang="ts" setup>
-import { useSettingsStore } from 'stores/settings';
-import { ref, watch } from 'vue';
-import { getPersonaAvatarUrl } from 'src/utils/personas';
+import LtaiDialog from 'components/libertai/LtaiDialog.vue';
+import KnowledgeBasesSelector from 'components/select/KnowledgeBasesSelector.vue';
+import ModelSelector from 'components/select/ModelSelector.vue';
+import PersonaDropdown from 'components/select/PersonaSelector.vue';
 import { Chat } from 'src/types/chats';
+import { UIPersona } from 'src/types/personas';
 import { UIModel } from 'src/utils/models';
-import ModelSelector from 'components/select/ModelSelector.vue';
+import { getPersonaAvatarUrl } from 'src/utils/personas';
 import { useModelsStore } from 'stores/models';
-import { UIPersona } from 'src/types/personas';
-import PersonaDropdown from 'components/select/PersonaSelector.vue';
 import { usePersonasStore } from 'stores/personas';
-import LtaiDialog from 'components/libertai/LtaiDialog.vue';
-import KnowledgeBasesSelector from 'components/select/KnowledgeBasesSelector.vue';
+import { useSettingsStore } from 'stores/settings';
+import { ref, watch } from 'vue';
 
 const { avatar } = useSettingsStore();
 const personasStore = usePersonasStore();

src/components/dialog/KnowledgeBaseCreationDialog.vue

@@ -10,8 +10,8 @@
 </template>
 
 <script lang="ts" setup>
-import { ref } from 'vue';
 import LtaiDialog from 'components/libertai/LtaiDialog.vue';
+import { ref } from 'vue';
 
 const emit = defineEmits<{ create: [name: string] }>();
 

src/components/dialog/PersonaDialog.vue

@@ -38,11 +38,11 @@
 </template>
 
 <script lang="ts" setup>
-import { PropType, ref, toRaw, watch } from 'vue';
 import AlephAvatar from 'components/AlephAvatar.vue';
-import { BasePersonaEdition, defaultBasePersona } from 'src/types/personas';
 import LtaiDialog from 'components/libertai/LtaiDialog.vue';
 import KnowledgeBasesSelector from 'components/select/KnowledgeBasesSelector.vue';
+import { BasePersonaEdition, defaultBasePersona } from 'src/types/personas';
+import { PropType, ref, toRaw, watch } from 'vue';
 
 const props = defineProps({
   title: {