fix: hoist useNuxtApp calls

Author: danielroe

app/composables/npm/useNpmSearch.ts

@@ -54,6 +54,8 @@ export function useNpmSearch(
   query: MaybeRefOrGetter<string>,
   options: MaybeRefOrGetter<NpmSearchOptions> = {},
 ) {
+  const { $npmRegistry } = useNuxtApp()
+
   // Client-side cache
   const cache = shallowRef<{
     query: string
@@ -144,7 +146,6 @@ export function useNpmSearch(
 
   // Fetch more results incrementally (only used in incremental mode)
   async function fetchMore(targetSize: number): Promise<void> {
-    const { $npmRegistry } = useNuxtApp()
     const q = toValue(query).trim()
     if (!q) {
       cache.value = null

app/composables/npm/useOrgPackages.ts

@@ -1,3 +1,4 @@
+import type { NuxtApp } from '#app'
 import type { NpmSearchResponse, NpmSearchResult, MinimalPackument } from '#shared/types'
 import { emptySearchResponse, packumentToSearchResult } from './useNpmSearch'
 import { mapWithConcurrency } from '#shared/utils/async'
@@ -9,10 +10,10 @@ import { mapWithConcurrency } from '#shared/utils/async'
  * Note: npm bulk downloads API does not support scoped packages.
  */
 async function fetchBulkDownloads(
+  $npmApi: NuxtApp['$npmApi'],
   packageNames: string[],
   options: Parameters<typeof $fetch>[1] = {},
 ): Promise<Map<string, number>> {
-  const { $npmApi } = useNuxtApp()
   const downloads = new Map<string, number>()
   if (packageNames.length === 0) return downloads
 
@@ -82,7 +83,7 @@ async function fetchBulkDownloads(
 export function useOrgPackages(orgName: MaybeRefOrGetter<string>) {
   const asyncData = useLazyAsyncData(
     () => `org-packages:${toValue(orgName)}`,
-    async ({ $npmRegistry }, { signal }) => {
+    async ({ $npmRegistry, $npmApi }, { signal }) => {
       const org = toValue(orgName)
       if (!org) {
         return emptySearchResponse
@@ -138,7 +139,7 @@ export function useOrgPackages(orgName: MaybeRefOrGetter<string>) {
           )
         })(),
         // Fetch downloads in bulk
-        fetchBulkDownloads(packageNames, { signal }),
+        fetchBulkDownloads($npmApi, packageNames, { signal }),
       ])
 
       // Convert to search results with download data

app/composables/npm/useOutdatedDependencies.ts

@@ -1,3 +1,4 @@
+import type { NuxtApp } from '#app'
 import { maxSatisfying, prerelease, major, minor, diff, gt } from 'semver'
 import type { Packument } from '#shared/types'
 import { mapWithConcurrency } from '#shared/utils/async'
@@ -17,11 +18,10 @@ const packumentCache = new Map<string, Promise<Packument | null>>()
  */
 async function checkDependencyOutdated(
   cachedFetch: CachedFetchFunction,
+  $npmRegistry: NuxtApp['$npmRegistry'],
   packageName: string,
   constraint: string,
 ): Promise<OutdatedDependencyInfo | null> {
-  const { $npmRegistry } = useNuxtApp()
-
   if (isNonSemverConstraint(constraint)) {
     return null
   }
@@ -93,6 +93,7 @@ async function checkDependencyOutdated(
 export function useOutdatedDependencies(
   dependencies: MaybeRefOrGetter<Record<string, string> | undefined>,
 ) {
+  const { $npmRegistry } = useNuxtApp()
   const cachedFetch = useCachedFetch()
   const outdated = shallowRef<Record<string, OutdatedDependencyInfo>>({})
 
@@ -106,7 +107,7 @@ export function useOutdatedDependencies(
     const batchResults = await mapWithConcurrency(
       entries,
       async ([name, constraint]) => {
-        const info = await checkDependencyOutdated(cachedFetch, name, constraint)
+        const info = await checkDependencyOutdated(cachedFetch, $npmRegistry, name, constraint)
         return [name, info] as const
       },
       5,