From 2145ce5c6fe3cc6f5a85b29a5bf11174c4e7bce1 Mon Sep 17 00:00:00 2001
From: Bobbie Goede <bobbiegoede@gmail.com>
Date: Fri, 2 Feb 2024 16:38:49 +0100
Subject: [PATCH] fix: `onUnmounted` warnings triggered by composable
 assignment (#2750)

---
 src/runtime/composables/index.ts    | 14 ++------------
 src/runtime/internal.ts             | 10 ++++++++++
 src/runtime/routing/extends/i18n.ts |  7 ++++---
 src/runtime/utils.ts                | 15 +++++++++------
 4 files changed, 25 insertions(+), 21 deletions(-)

diff --git a/src/runtime/composables/index.ts b/src/runtime/composables/index.ts
index 424842581..bd7db97e3 100644
--- a/src/runtime/composables/index.ts
+++ b/src/runtime/composables/index.ts
@@ -1,6 +1,6 @@
 import { useRequestHeaders, useCookie as useNuxtCookie } from '#imports'
 import { ref, computed, watch, onUnmounted } from 'vue'
-import { parseAcceptLanguage } from '../internal'
+import { parseAcceptLanguage, wrapComposable } from '../internal'
 import { localeCodes, normalizedLocales, nuxtI18nOptions } from '#build/i18n.options.mjs'
 import { getActiveHead } from 'unhead'
 import { getNormalizedLocales, initCommonComposableOptions } from '../utils'
@@ -23,21 +23,11 @@ import type { Ref } from 'vue'
 import type { Locale } from 'vue-i18n'
 import type { RouteLocation, RouteLocationNormalizedLoaded, RouteLocationRaw, Router } from 'vue-router'
 import type { I18nHeadMetaInfo, I18nHeadOptions, SeoAttributesOptions } from '#build/i18n.options.mjs'
-import type { CommonComposableOptions, HeadParam } from '../utils'
+import type { HeadParam } from '../utils'
 
 export * from 'vue-i18n'
 export * from './shared'
 
-type TailParameters<T> = T extends (first: CommonComposableOptions, ...rest: infer R) => unknown ? R : never
-
-// eslint-disable-next-line @typescript-eslint/no-explicit-any
-export function wrapComposable<F extends (common: CommonComposableOptions, ...args: any[]) => any>(
-  fn: F,
-  common = initCommonComposableOptions()
-) {
-  return (...args: TailParameters<F>) => fn(common, ...args)
-}
-
 /**
  * Returns a function to set i18n params.
  *
diff --git a/src/runtime/internal.ts b/src/runtime/internal.ts
index 79bbc8059..b72ca4d4b 100644
--- a/src/runtime/internal.ts
+++ b/src/runtime/internal.ts
@@ -20,6 +20,7 @@ import {
   normalizedLocales
 } from '#build/i18n.options.mjs'
 import { findBrowserLocale, getLocalesRegex, getI18nTarget } from './routing/utils'
+import { initCommonComposableOptions, type CommonComposableOptions } from './utils'
 
 import type { Locale } from 'vue-i18n'
 import type { DetectBrowserLanguageOptions, LocaleObject } from '#build/i18n.options.mjs'
@@ -46,6 +47,15 @@ export function defineGetter<K extends string | number | symbol, V>(obj: Record<
   Object.defineProperty(obj, key, { get: () => val })
 }
 
+type TailParameters<T> = T extends (first: CommonComposableOptions, ...rest: infer R) => unknown ? R : never
+// eslint-disable-next-line @typescript-eslint/no-explicit-any
+export function wrapComposable<F extends (common: CommonComposableOptions, ...args: any[]) => any>(
+  fn: F,
+  common = initCommonComposableOptions()
+) {
+  return (...args: TailParameters<F>) => fn(common, ...args)
+}
+
 /**
  * Parses locales provided from browser through `accept-language` header.
  *
diff --git a/src/runtime/routing/extends/i18n.ts b/src/runtime/routing/extends/i18n.ts
index bd4db9d2e..4918c06a6 100644
--- a/src/runtime/routing/extends/i18n.ts
+++ b/src/runtime/routing/extends/i18n.ts
@@ -4,13 +4,14 @@ import { DEFAULT_BASE_URL } from '#build/i18n.options.mjs'
 import { resolveBaseUrl, isVueI18n, getComposer, inBrowser } from '../utils'
 import {
   getRouteBaseName,
+  localeHead,
   localeLocation,
   localePath,
   localeRoute,
   resolveRoute,
   switchLocalePath
 } from '../compatibles'
-import { useLocaleHead, wrapComposable } from '../../composables'
+import { wrapComposable } from '../../internal'
 import { initCommonComposableOptions } from '../../utils'
 
 import type { NuxtApp } from 'nuxt/app'
@@ -143,13 +144,13 @@ export function extendI18n<Context = unknown, TI18n extends I18n = I18n>(
       // extend vue component instance
       vue.mixin({
         methods: {
-          resolveRoute,
           getRouteBaseName,
+          resolveRoute: wrapComposable(resolveRoute, common),
           localePath: wrapComposable(localePath, common),
           localeRoute: wrapComposable(localeRoute, common),
           localeLocation: wrapComposable(localeLocation, common),
           switchLocalePath: wrapComposable(switchLocalePath, common),
-          localeHead: useLocaleHead
+          localeHead: wrapComposable(localeHead, common)
         }
       })
     }
diff --git a/src/runtime/utils.ts b/src/runtime/utils.ts
index dd066e149..4a3bb9499 100644
--- a/src/runtime/utils.ts
+++ b/src/runtime/utils.ts
@@ -16,6 +16,7 @@ import {
   type LocaleObject
 } from '#build/i18n.options.mjs'
 import {
+  wrapComposable,
   detectBrowserLanguage,
   getLocaleCookie,
   callVueI18nInterfaces,
@@ -26,10 +27,12 @@ import {
   DefaultDetectBrowserLanguageFromResult
 } from './internal'
 import { loadLocale, makeFallbackLocaleCodes } from './messages'
-import { useLocaleRoute, useSwitchLocalePath, useLocalePath, useLocaleHead } from '#i18n'
 import {
-  switchLocalePath,
+  localeHead,
+  localePath,
+  localeRoute,
   getRouteBaseName,
+  switchLocalePath,
   DefaultPrefixable,
   DefaultSwitchLocalePathIntercepter
 } from './routing/compatibles'
@@ -402,10 +405,10 @@ export function injectNuxtHelpers(nuxt: NuxtApp, i18n: I18n | VueI18n | Composer
    */
   defineGetter(nuxt, '$i18n', getI18nTarget(i18n))
   defineGetter(nuxt, '$getRouteBaseName', getRouteBaseName)
-  defineGetter(nuxt, '$localePath', useLocalePath())
-  defineGetter(nuxt, '$localeRoute', useLocaleRoute())
-  defineGetter(nuxt, '$switchLocalePath', useSwitchLocalePath())
-  defineGetter(nuxt, '$localeHead', useLocaleHead())
+  defineGetter(nuxt, '$localePath', wrapComposable(localePath))
+  defineGetter(nuxt, '$localeRoute', wrapComposable(localeRoute))
+  defineGetter(nuxt, '$switchLocalePath', wrapComposable(switchLocalePath))
+  defineGetter(nuxt, '$localeHead', wrapComposable(localeHead))
 }
 
 // override prefix for route path, support domain