feat: select config

Author: kunish

components/ResourceConfigs.vue

@@ -1,5 +1,7 @@
 <script setup lang="ts">
 import type { ConfigFormModal } from '#components'
+import * as mutations from '~/mutations'
+import * as queries from '~/queries'
 
 const apiStore = useAPIStore()
 const defaults = await apiStore.getDefaults()
@@ -12,37 +14,7 @@ const updateConfigFormModalRef = ref<InstanceType<typeof ConfigFormModal>>()
 const { data: configs, execute: reloadConfigs } = useAsyncData(
   'configs',
   async () => {
-    const data = await apiStore.apiClient?.query(
-      graphql(`
-        query Configs {
-          configs {
-            id
-            name
-            selected
-            global {
-              logLevel
-              tproxyPort
-              allowInsecure
-              checkInterval
-              checkTolerance
-              lanInterface
-              wanInterface
-              udpCheckDns
-              tcpCheckUrl
-              dialMode
-              tcpCheckHttpMethod
-              disableWaitingNetwork
-              autoConfigKernelParameter
-              sniffingTimeout
-              tlsImplementation
-              utlsImitate
-              tproxyPortProtect
-            }
-          }
-        }
-      `),
-      {}
-    )
+    const data = await apiStore.apiClient?.query(queries.configs, {})
 
     return data?.data?.configs
   }
@@ -54,20 +26,27 @@ const removeConfig = async (id: string | number) => {
   isRemovingConfig.value = true
 
   try {
-    await apiStore.apiClient?.mutation(
-      graphql(`
-        mutation RemoveConfig($id: ID!) {
-          removeConfig(id: $id)
-        }
-      `),
-      { id }
-    )
+    await apiStore.apiClient?.mutation(mutations.removeConfig, { id })
 
     await reloadConfigs()
   } finally {
     isRemovingConfig.value = false
   }
 }
+
+const isSelectingConfig = ref(false)
+
+const selectConfig = async (id: string | number) => {
+  isSelectingConfig.value = true
+
+  try {
+    await apiStore.apiClient?.mutation(mutations.selectConfig, { id })
+
+    await reloadConfigs()
+  } finally {
+    isSelectingConfig.value = false
+  }
+}
 </script>
 
 <template>
@@ -114,11 +93,21 @@ const removeConfig = async (id: string | number) => {
 
           <UButton
             :loading="isRemovingConfig"
-            :disabled="config.id === defaults?.defaultConfigID"
+            :disabled="
+              config.id === defaults?.defaultConfigID || config.selected
+            "
             size="xs"
             icon="i-heroicons-minus"
             @click="removeConfig(config.id)"
           />
+
+          <UButton
+            :loading="isSelectingConfig"
+            :disabled="config.selected"
+            size="xs"
+            icon="i-heroicons-map-pin"
+            @click="selectConfig(config.id)"
+          />
         </div>
       </template>
     </UCard>

components/ResourceGroups.vue

@@ -1,5 +1,6 @@
 <script setup lang="ts">
 import type { ConfigFormModal } from '#components'
+import * as mutations from '~/mutations'
 import * as queries from '~/queries'
 
 const apiStore = useAPIStore()
@@ -25,14 +26,7 @@ const removeGroup = async (id: string | number) => {
   isRemovingGroup.value = true
 
   try {
-    await apiStore.apiClient?.mutation(
-      graphql(`
-        mutation RemoveConfig($id: ID!) {
-          removeConfig(id: $id)
-        }
-      `),
-      { id }
-    )
+    await apiStore.apiClient?.mutation(mutations.removeGroup, { id })
 
     await reloadGroups()
   } finally {

package.json

@@ -12,10 +12,10 @@
     "preview": "nuxt preview"
   },
   "dependencies": {
-    "@0no-co/graphqlsp": "^1.6.0",
+    "@0no-co/graphqlsp": "^1.6.1",
     "@commitlint/config-conventional": "^19.1.0",
     "@nuxt/eslint-config": "^0.2.0",
-    "@nuxt/fonts": "^0.3.0",
+    "@nuxt/fonts": "^0.4.0",
     "@nuxt/ui": "^2.14.2",
     "@nuxtjs/i18n": "^8.2.0",
     "@pinia/nuxt": "^0.5.1",
@@ -33,7 +33,7 @@
     "husky": "^9.0.11",
     "lint-staged": "^15.2.2",
     "lodash-es": "^4.17.21",
-    "monaco-editor": "^0.44.0",
+    "monaco-editor": "^0.45.0",
     "nuxt": "^3.11.1",
     "nuxt-monaco-editor": "^1.2.7",
     "nuxt-zod-i18n": "^1.4.0",
@@ -43,7 +43,7 @@
     "sort-package-json": "^2.8.0",
     "splitpanes": "^3.1.5",
     "tailwindcss": "^3.4.1",
-    "typescript": "^5.4.2",
+    "typescript": "^5.4.3",
     "vue": "^3.4.21",
     "vue-router": "^4.3.0",
     "zod": "^3.22.4"