fix: address coderabbit reviews

Author: danielroe

app/composables/npm/useUserPackages.ts

@@ -23,6 +23,7 @@ const MAX_RESULTS = 250
  */
 export function useUserPackages(username: MaybeRefOrGetter<string>) {
   const { searchProvider } = useSearchProvider()
+  // this is only used in npm path, but we need to extract it when the composable runs
   const { $npmRegistry } = useNuxtApp()
   const { searchByOwner } = useAlgoliaSearch()
 
@@ -103,7 +104,11 @@ export function useUserPackages(username: MaybeRefOrGetter<string>) {
     { default: () => emptySearchResponse },
   )
   // --- Fetch more (npm path only) ---
-  async function fetchMore(): Promise<void> {
+  /**
+   * Fetch the next page of results from npm registry.
+   * @param manageLoadingState - When false, caller manages isLoadingMore (used by loadAll to prevent flicker)
+   */
+  async function fetchMore(manageLoadingState = true): Promise<void> {
     const user = toValue(username)
     const provider = searchProvider.value
     if (!user || provider !== 'npm') return
@@ -119,7 +124,7 @@ export function useUserPackages(username: MaybeRefOrGetter<string>) {
 
     if (currentCount >= total) return
 
-    isLoadingMore.value = true
+    if (manageLoadingState) isLoadingMore.value = true
 
     try {
       const from = currentCount
@@ -155,7 +160,7 @@ export function useUserPackages(username: MaybeRefOrGetter<string>) {
         }
       }
     } finally {
-      isLoadingMore.value = false
+      if (manageLoadingState) isLoadingMore.value = false
     }
   }
 
@@ -173,7 +178,7 @@ export function useUserPackages(username: MaybeRefOrGetter<string>) {
     isLoadingMore.value = true
     try {
       while (hasMore.value) {
-        await fetchMore()
+        await fetchMore(false)
       }
     } finally {
       isLoadingMore.value = false
@@ -184,7 +189,6 @@ export function useUserPackages(username: MaybeRefOrGetter<string>) {
   watch(searchProvider, () => {
     cache.value = null
     currentPage.value = 1
-    asyncData.refresh()
   })
 
   // Computed data that uses cache

app/pages/settings.vue

@@ -166,7 +166,7 @@ const setLocale: typeof setNuxti18nLocale = locale => {
                 <select
                   id="search-provider-select"
                   :value="settings.searchProvider"
-                  class="w-full sm:w-auto min-w-48 bg-bg border border-border rounded-md px-3 py-2 text-sm text-fg focus-visible:outline-accent/70 cursor-pointer duration-200 transition-colors hover:border-fg-subtle"
+                  class="w-full sm:w-auto min-w-48 bg-bg border border-border rounded-md px-3 py-2 text-sm text-fg cursor-pointer duration-200 transition-colors hover:border-fg-subtle"
                   @change="
                     settings.searchProvider = ($event.target as HTMLSelectElement)
                       .value as typeof settings.searchProvider