chore: improve version loading logic

Author: alexdln

app/composables/npm/useResolvedVersion.ts

@@ -1,18 +1,18 @@
 import type { ResolvedPackageVersion } from 'fast-npm-meta'
 
-export function useResolvedVersion(
+export async function useResolvedVersion(
   packageName: MaybeRefOrGetter<string>,
   requestedVersion: MaybeRefOrGetter<string | null>,
 ) {
-  return useFetch(
-    () => {
-      const version = toValue(requestedVersion)
-      return version
-        ? `https://npm.antfu.dev/${toValue(packageName)}@${version}`
-        : `https://npm.antfu.dev/${toValue(packageName)}`
-    },
-    {
-      transform: (data: ResolvedPackageVersion) => data.version,
-    },
-  )
+  const versionData = useState<string | null>('versionData')
+
+  await callOnce(async () => {
+    const version = toValue(requestedVersion)
+    const name = toValue(packageName)
+    const url = version
+      ? `https://npm.antfu.dev/${name}@${version}`
+      : `https://npm.antfu.dev/${name}`
+    versionData.value = await $fetch<ResolvedPackageVersion>(url).then(data => data.version)
+  })
+  return versionData
 }

app/pages/package/[[org]]/[name].vue

@@ -194,18 +194,9 @@ const { data: skillsData } = useLazyFetch<SkillsListResponse>(
 const { data: packageAnalysis } = usePackageAnalysis(packageName, requestedVersion)
 const { data: moduleReplacement } = useModuleReplacement(packageName)
 
-const {
-  data: resolvedVersion,
-  status: versionStatus,
-  error: versionError,
-} = await useResolvedVersion(packageName, requestedVersion)
-
-if (
-  versionStatus.value === 'error' &&
-  versionError.value?.statusCode &&
-  versionError.value.statusCode >= 400 &&
-  versionError.value.statusCode < 500
-) {
+const resolvedVersion = await useResolvedVersion(packageName, requestedVersion)
+
+if (resolvedVersion.value === null) {
   throw createError({
     statusCode: 404,
     statusMessage: $t('package.not_found'),