refactor: update api calls 'cachePath' + useInitialQueries

app/src/composables/useInfos.ts

@@ -72,7 +72,7 @@ export const useInfos = createGlobalState(() => {
     // and login prompt will be shown automaticly
     await getYunoHostVersion()
     connected.value = true
-    await api.get({ uri: 'domains', cachePath: 'domainList' })
+    await api.get({ uri: 'domains', cachePath: 'domains' })
   }
 
   function onLogout(route?: RouteLocationNormalizedLoaded) {

app/src/composables/useInitialQueries.ts

@@ -3,32 +3,29 @@ import { ref, toValue } from 'vue'
 
 import type { APIQuery } from '@/api/api'
 import api from '@/api/api'
-import type { Obj } from '@/types/commons'
 
-export function useInitialQueries<
+export function useInitialQueries<T extends any[] = any[]>(
-  ResponsesType extends (Obj | string)[] = Obj[],
->(
   queries: MaybeRefOrGetter<APIQuery[]> | ComputedRef<APIQuery[]>,
   {
     onQueriesResponse,
     showModal = false,
   }: {
-    onQueriesResponse?: (...responses: ResponsesType) => Promise<void> | void
+    onQueriesResponse?: (...responses: T) => Promise<void> | void
     showModal?: boolean
   } = {},
 ) {
   const loading = ref(true)
-  const responses: Ref<ResponsesType | null> = ref(null)
+  const responses: Ref<T | null> = ref(null)
   // FIXME watch `queries` to call on change?
 
   function call(triggerLoading = true) {
     if (triggerLoading) loading.value = true
     return api
-      .fetchAll(toValue(queries), { showModal, initial: true })
+      .fetchAll<T>(toValue(queries), { showModal, initial: true })
       .then(async (responses_) => {
-        responses.value = responses_ as ResponsesType
+        responses.value = responses_
         if (onQueriesResponse) {
-          await onQueriesResponse(...(responses_ as ResponsesType))
+          await onQueriesResponse(...responses_)
         }
         loading.value = false
         return responses

app/src/views/domain/DomainAdd.vue

@@ -19,7 +19,7 @@ function onSubmit(data) {
   api
     .post({
       uri: 'domains',
-      cachePath: 'domains',
+      cachePath: `domains.${data.domain}`,
       data,
       humanKey: { key: 'domains.add', name: data.domain },
     })

app/src/views/domain/DomainInfo.vue

@@ -32,8 +32,7 @@ const { loading, refetch } = useInitialQueries(
     { uri: 'domains', cachePath: 'domains' },
     {
       uri: `domains/${props.name}`,
-      cachePath: 'domains_details',
+      cachePath: `domainDetails.${props.name}`,
-      cacheParams: { domain: props.name },
     },
     { uri: `domains/${props.name}/config?full` },
   ],
@@ -120,8 +119,7 @@ async function deleteDomain() {
   api
     .delete({
       uri: 'domains',
-      cachePath: 'domains',
+      cachePath: `domains.${props.name}`,
-      cacheParams: { domain: props.name },
       data,
       humanKey: {
         key: 'domains.delete',
@@ -140,7 +138,7 @@ async function setAsDefaultDomain() {
   api
     .put({
       uri: `domains/${props.name}/main`,
-      cachePath: 'main_domain',
+      cachePath: `mainDomain.${props.name}`,
       data: {},
       humanKey: { key: 'domains.set_default', name: props.name },
     })

app/src/views/group/GroupList.vue

@@ -120,12 +120,11 @@ async function onPermissionChanged({ option, groupName, action, applyMethod }) {
     )
     if (!confirmed) return
   }
-  // FIXME hacky way to update the store
+
   api
     .put({
       uri: `users/permissions/${permId}/${action}/${groupName}`,
-      cachePath: 'permissions',
+      cachePath: `permissions.${permId}`,
-      cacheParams: { groupName, action, permId },
       humanKey: { key: 'permissions.' + action, perm: option, name: groupName },
     })
     .then(() => applyMethod(option))
@@ -135,8 +134,7 @@ function onUserChanged({ option, groupName, action, applyMethod }) {
   api
     .put({
       uri: `users/groups/${groupName}/${action}/${option}`,
-      cachePath: 'groups',
+      cachePath: `groups.${groupName}`,
-      cacheParams: { groupName },
       humanKey: { key: 'groups.' + action, user: option, name: groupName },
     })
     .then(() => applyMethod(option))
@@ -156,8 +154,7 @@ async function deleteGroup(groupName) {
   api
     .delete({
       uri: `users/groups/${groupName}`,
-      cachePath: 'groups',
+      cachePath: `groups.${groupName}`,
-      cacheParams: { groupName },
       humanKey: { key: 'groups.delete', name: groupName },
     })
     .then(() => {

app/src/views/user/UserEdit.vue

@@ -32,8 +32,7 @@ const { loading } = useInitialQueries(
   [
     {
       uri: `users/${props.name}`,
-      cachePath: 'users_details',
+      cachePath: `userDetails.${props.name}`,
-      cacheParams: { username: props.name },
     },
     { uri: 'domains', cachePath: 'domains' },
   ],
@@ -213,8 +212,7 @@ const onUserEdit = onSubmit(async (onError, serverErrors) => {
   api
     .put({
       uri: `users/${props.name}`,
-      cachePath: 'users_details',
+      cachePath: `userDetails.${props.name}`,
-      cacheParams: { username: props.name },
       data,
       humanKey: { key: 'users.update', name: props.name },
     })

app/src/views/user/UserInfo.vue

@@ -12,8 +12,7 @@ const router = useRouter()
 const { loading } = useInitialQueries([
   {
     uri: `users/${props.name}`,
-    cachePath: 'users_details',
+    cachePath: `userDetails.${props.name}`,
-    cacheParams: { username: props.name },
   },
 ])
 
@@ -26,8 +25,7 @@ function deleteUser() {
   api
     .delete({
       uri: `users/${props.name}`,
-      cachePath: 'user_details',
+      cachePath: `userDetails.${props.name}`,
-      cacheParams: { username: props.name },
       data,
       humanKey: { key: 'users.delete', name: props.name },
     })