diff --git a/app/components/SearchProviderToggle.client.vue b/app/components/SearchProviderToggle.client.vue
index 0c69ef88e0..0783ca7d87 100644
--- a/app/components/SearchProviderToggle.client.vue
+++ b/app/components/SearchProviderToggle.client.vue
@@ -1,12 +1,7 @@
 <script setup lang="ts">
 const route = useRoute()
 const router = useRouter()
-const { searchProvider } = useSearchProvider()
-const searchProviderValue = computed(() => {
-  const p = normalizeSearchParam(route.query.p)
-  if (p === 'npm' || searchProvider.value === 'npm') return 'npm'
-  return 'algolia'
-})
+const { searchProvider, searchProviderValue } = useSearchProvider()
 
 const isOpen = shallowRef(false)
 const toggleRef = useTemplateRef('toggleRef')
diff --git a/app/composables/npm/useOrgPackages.ts b/app/composables/npm/useOrgPackages.ts
index 568cf155a1..5a3083f07f 100644
--- a/app/composables/npm/useOrgPackages.ts
+++ b/app/composables/npm/useOrgPackages.ts
@@ -10,13 +10,7 @@ import { mapWithConcurrency } from '#shared/utils/async'
  * 3. Falls back to lightweight server-side package-meta lookups
  */
 export function useOrgPackages(orgName: MaybeRefOrGetter<string>) {
-  const route = useRoute()
-  const { searchProvider } = useSearchProvider()
-  const searchProviderValue = computed(() => {
-    const p = normalizeSearchParam(route.query.p)
-    if (p === 'npm' || searchProvider.value === 'npm') return 'npm'
-    return 'algolia'
-  })
+  const { searchProviderValue } = useSearchProvider()
   const { getPackagesByName } = useAlgoliaSearch()
 
   const asyncData = useLazyAsyncData(
diff --git a/app/composables/npm/useUserPackages.ts b/app/composables/npm/useUserPackages.ts
index f5490c79f6..b4a7897886 100644
--- a/app/composables/npm/useUserPackages.ts
+++ b/app/composables/npm/useUserPackages.ts
@@ -21,13 +21,7 @@ const MAX_RESULTS = 250
  * ```
  */
 export function useUserPackages(username: MaybeRefOrGetter<string>) {
-  const route = useRoute()
-  const { searchProvider } = useSearchProvider()
-  const searchProviderValue = computed(() => {
-    const p = normalizeSearchParam(route.query.p)
-    if (p === 'npm' || searchProvider.value === 'npm') return 'npm'
-    return 'algolia'
-  })
+  const { searchProviderValue } = useSearchProvider()
   // this is only used in npm path, but we need to extract it when the composable runs
   const { $npmRegistry } = useNuxtApp()
   const { searchByMaintainer } = useAlgoliaSearch()
diff --git a/app/composables/useGlobalSearch.ts b/app/composables/useGlobalSearch.ts
index 45bb478487..eecd177d17 100644
--- a/app/composables/useGlobalSearch.ts
+++ b/app/composables/useGlobalSearch.ts
@@ -8,12 +8,7 @@ const SEARCH_DEBOUNCE_MS = 100
 
 export function useGlobalSearch(place: 'header' | 'content' = 'content') {
   const { settings } = useSettings()
-  const { searchProvider } = useSearchProvider()
-  const searchProviderValue = computed(() => {
-    const p = normalizeSearchParam(route.query.p)
-    if (p === 'npm' || searchProvider.value === 'npm') return 'npm'
-    return 'algolia'
-  })
+  const { searchProvider, searchProviderValue } = useSearchProvider()
 
   const router = useRouter()
   const route = useRoute()
diff --git a/app/composables/useSettings.ts b/app/composables/useSettings.ts
index 0fa5a6a4b7..bfa860708d 100644
--- a/app/composables/useSettings.ts
+++ b/app/composables/useSettings.ts
@@ -200,6 +200,7 @@ export function useAccentColor() {
  * Composable for managing the search provider setting.
  */
 export function useSearchProvider() {
+  const route = useRoute()
   const { settings } = useSettings()
   const isMounted = useMounted()
 
@@ -210,7 +211,13 @@ export function useSearchProvider() {
     },
   })
 
-  const isAlgolia = computed(() => searchProvider.value === 'algolia')
+  const searchProviderValue = computed(() => {
+    const p = normalizeSearchParam(route.query.p)
+    if (p === 'npm' || searchProvider.value === 'npm') return 'npm'
+    return 'algolia'
+  })
+
+  const isAlgolia = computed(() => searchProviderValue.value === 'algolia')
 
   function toggle() {
     searchProvider.value = searchProvider.value === 'npm' ? 'algolia' : 'npm'
@@ -218,6 +225,7 @@ export function useSearchProvider() {
 
   return {
     searchProvider,
+    searchProviderValue,
     isAlgolia,
     toggle,
   }