refactor: Move the modrinth code into composable

xmcl-keystone-ui/src/composables/modrinthInstall.ts

@@ -1,12 +1,18 @@
 import { TaskItem } from '@/entities/task'
 import { Project, ProjectVersion } from '@xmcl/modrinth'
-import { InstanceModsServiceKey, ModrinthServiceKey, Resource, ResourceDomain, ResourceServiceKey, getModrinthVersionFileUri } from '@xmcl/runtime-api'
+import { InstanceInstallServiceKey, InstanceModsServiceKey, InstanceServiceKey, ModpackServiceKey, ModrinthServiceKey, Resource, ResourceDomain, ResourceServiceKey, getModrinthVersionFileUri } from '@xmcl/runtime-api'
 import { InjectionKey, Ref } from 'vue'
 import { useDialog } from './dialog'
 import { AddInstanceDialogKey } from './instanceTemplates'
 import { InstanceInstallDialog } from './instanceUpdate'
 import { useNotifier } from './notifier'
 import { useService } from './service'
+import { injection } from '@/util/inject'
+import { kInstances } from './instances'
+import { kInstanceFiles } from './instanceFiles'
+import { kInstanceVersionDiagnose } from './instanceVersionDiagnose'
+import { resolveModpackInstanceConfig } from '@/util/modpackFilesResolver'
+import { generateDistinctName } from '@/util/instanceName'
 
 export const kModrinthInstall: InjectionKey<ReturnType<typeof useModrinthInstall>> = Symbol('ModrinthInstall')
 
@@ -78,3 +84,45 @@ export function useModrinthInstall(project: Ref<Project | undefined>, tasks: Ref
     currentVersionResource,
   }
 }
+
+export function useModrinthInstallModpack(icon: Ref<string | undefined>) {
+  const { instances, selectedInstance } = injection(kInstances)
+  const { getModpackInstallFiles } = useService(ModpackServiceKey)
+  const { installInstanceFiles } = useService(InstanceInstallServiceKey)
+  const { createInstance } = useService(InstanceServiceKey)
+  const { installVersion } = useService(ModrinthServiceKey)
+  const { install, mutate } = injection(kInstanceFiles)
+  const { fix } = injection(kInstanceVersionDiagnose)
+  const { currentRoute, push } = useRouter()
+  const installModpack = async (v: ProjectVersion) => {
+    const result = await installVersion({ version: v, icon: icon.value })
+    const resource = result.resources[0]
+    const config = resolveModpackInstanceConfig(resource)
+
+    if (!config) return
+    const name = generateDistinctName(config.name, instances.value.map(i => i.name))
+    const path = await createInstance({
+      ...config,
+      name,
+    })
+    selectedInstance.value = path
+    if (currentRoute.path !== '/') {
+      push('/')
+    }
+    const files = await getModpackInstallFiles(resource.path)
+    await installInstanceFiles({
+      path,
+      files,
+    }).catch(() => {
+      if (selectedInstance.value === path) {
+        return install()
+      }
+    }).finally(() => {
+      mutate()
+    })
+    fix()
+  }
+  return {
+    installModpack,
+  }
+}

xmcl-keystone-ui/src/views/StoreProjectModrinth.vue

@@ -2,23 +2,19 @@
 import StoreProjectBase, { StoreProject } from '@/components/StoreProject.vue'
 import { StoreProjectVersion } from '@/components/StoreProjectInstallVersionDialog.vue'
 import { TeamMember } from '@/components/StoreProjectMembers.vue'
-import { useService } from '@/composables'
-import { kInstanceFiles } from '@/composables/instanceFiles'
-import { kInstanceVersionDiagnose } from '@/composables/instanceVersionDiagnose'
 import { kInstances } from '@/composables/instances'
 import { useMarkdown } from '@/composables/markdown'
 import { useModrinthTags } from '@/composables/modrinth'
+import { useModrinthInstallModpack } from '@/composables/modrinthInstall'
 import { useModrinthProject } from '@/composables/modrinthProject'
 import { useModrinthVersions } from '@/composables/modrinthVersions'
 import { usePresence } from '@/composables/presence'
 import { kSWRVConfig } from '@/composables/swrvConfig'
 import { useTasks } from '@/composables/task'
 import { clientModrinthV2 } from '@/util/clients'
 import { injection } from '@/util/inject'
-import { generateDistinctName } from '@/util/instanceName'
-import { resolveModpackInstanceConfig } from '@/util/modpackFilesResolver'
 import { ProjectVersion } from '@xmcl/modrinth'
-import { InstanceInstallServiceKey, InstanceServiceKey, ModpackServiceKey, ModrinthServiceKey, TaskState } from '@xmcl/runtime-api'
+import { TaskState } from '@xmcl/runtime-api'
 import useSWRV from 'swrv'
 
 const props = defineProps<{ id: string }>()
@@ -135,41 +131,7 @@ const tasks = useTasks((t) => {
   return false
 })
 const isDownloading = computed(() => tasks.value.length > 0)
-const { getModpackInstallFiles } = useService(ModpackServiceKey)
-const { installInstanceFiles } = useService(InstanceInstallServiceKey)
-const { createInstance } = useService(InstanceServiceKey)
-const { installVersion } = useService(ModrinthServiceKey)
-const { install, mutate } = injection(kInstanceFiles)
-const { fix } = injection(kInstanceVersionDiagnose)
-const { currentRoute } = useRouter()
-const installModpack = async (v: ProjectVersion) => {
-  const result = await installVersion({ version: v, icon: project.value?.iconUrl })
-  const resource = result.resources[0]
-  const config = resolveModpackInstanceConfig(resource)
-
-  if (!config) return
-  const name = generateDistinctName(config.name, instances.value.map(i => i.name))
-  const path = await createInstance({
-    ...config,
-    name,
-  })
-  selectedInstance.value = path
-  if (currentRoute.path !== '/') {
-    push('/')
-  }
-  const files = await getModpackInstallFiles(resource.path)
-  await installInstanceFiles({
-    path,
-    files,
-  }).catch(() => {
-    if (selectedInstance.value === path) {
-      return install()
-    }
-  }).finally(() => {
-    mutate()
-  })
-  fix()
-}
+const { installModpack } = useModrinthInstallModpack(computed(() => project.value?.iconUrl))
 
 const { isValidating: loadingMembers, error: teamError, data } = useSWRV(computed(() => `/modrinth/team/${props.id}`),
   () => clientModrinthV2.getProjectTeamMembers(props.id),