Function fetchPackages

app/composables/usePackageComparison.ts:91–260

(names: string[])

  // Fetch function - only fetches packages not already in cache
  async function fetchPackages(names: string[]) {
    if (names.length === 0) {
      status.value = 'idle'
      return
    }

    // Handle "no dependency" column - add to cache immediately
    if (names.includes(NO_DEPENDENCY_ID) && !cache.value.has(NO_DEPENDENCY_ID)) {
      const newCache = new Map(cache.value)
      newCache.set(NO_DEPENDENCY_ID, createNoDependencyData())
      cache.value = newCache
    }

    // Only fetch packages not already cached (excluding "no dep" which has no remote data)
    const namesToFetch = names.filter(name => name !== NO_DEPENDENCY_ID && !cache.value.has(name))

    if (namesToFetch.length === 0) {
      status.value = 'success'
      return
    }

    status.value = 'pending'
    error.value = null

    // Mark packages as loading
    loadingPackages.value = new Set(namesToFetch)

    try {
      // First pass: fetch fast data (package info, downloads, analysis, vulns)
      const results = await Promise.all(
        namesToFetch.map(async (name): Promise<PackageComparisonData | null> => {
          try {
            // Fetch basic package info first (required)
            const { data: pkgData } = await $npmRegistry<Packument>(`/${encodePackageName(name)}`)
            const latestVersion = pkgData['dist-tags']?.latest
            if (!latestVersion) return null

            // Fetch fast additional data in parallel (optional - failures are ok)
            const repoInfo = parseRepositoryInfo(pkgData.repository)
            const isGitHub = repoInfo?.provider === 'github'
            const [downloads, analysis, vulns, likes, ghStars, ghIssues] = await Promise.all([
              $fetch<{ downloads: number }>(
                `https://api.npmjs.org/downloads/point/last-week/${encodePackageName(name)}`,
              ).catch(() => null),
              $fetch<PackageAnalysisResponse>(
                `/api/registry/analysis/${encodePackageName(name)}`,
              ).catch(() => null),
              $fetch<VulnerabilityTreeResult>(
                `/api/registry/vulnerabilities/${encodePackageName(name)}`,
              ).catch(() => null),
              $fetch<PackageLikes>(`/api/social/likes/${encodePackageName(name)}`).catch(
                () => null,
              ),
              isGitHub
                ? $fetch<{ repo: { stars: number } }>(
                    `https://ungh.cc/repos/${repoInfo.owner}/${repoInfo.repo}`,
                  )
                    .then(res => (typeof res?.repo?.stars === 'number' ? res.repo.stars : null))