feat: dynamic params interceptor (#82)

Author: BobbieGoede

packages/vue-i18n-routing/src/compatibles/routing.ts

@@ -292,6 +292,11 @@ function getLocalizableMetaFromDynamicParams(
   }
 }
 
+export type MetaDynamicParamsInterceptor = (
+  route: Route | RouteLocationNormalizedLoaded,
+  key: Required<I18nRoutingOptions>['dynamicRouteParamsKey']
+) => Record<Locale, unknown>
+
 /**
  * Returns path of the current route for specified locale.
  *
@@ -309,7 +314,10 @@ export function switchLocalePath(this: RoutingProxy, locale: Locale): string {
     return ''
   }
 
-  const { switchLocalePathIntercepter, dynamicRouteParamsKey } = getI18nRoutingOptions(this.router, this)
+  const { switchLocalePathIntercepter, dynamicRouteParamsKey, dynamicParamsInterceptor } = getI18nRoutingOptions(
+    this.router,
+    this
+  )
 
   // prettier-ignore
   const routeValue = isVue3
@@ -318,14 +326,17 @@ export function switchLocalePath(this: RoutingProxy, locale: Locale): string {
       ? route.value
       : route
   const routeCopy = routeToObject(routeValue)
+  const langSwitchParamsIntercepted = dynamicParamsInterceptor?.()?.value?.[locale]
   const langSwitchParams = getLocalizableMetaFromDynamicParams(route, dynamicRouteParamsKey)[locale] || {}
 
+  const resolvedParams = langSwitchParamsIntercepted ?? langSwitchParams ?? {}
+
   // eslint-disable-next-line @typescript-eslint/no-explicit-any
   const _baseRoute: any = {
     name,
     params: {
       ...routeCopy.params,
-      ...langSwitchParams
+      ...resolvedParams
     }
   }
   if (isVue2) {

packages/vue-i18n-routing/src/compatibles/utils.ts

@@ -41,7 +41,8 @@ export function getI18nRoutingOptions(
     switchLocalePathIntercepter = DefaultSwitchLocalePathIntercepter,
     dynamicRouteParamsKey = DEFAULT_DYNAMIC_PARAMS_KEY
   }: I18nRoutingGlobalOptions = {}
-): Required<I18nRoutingGlobalOptions> {
+): Required<Omit<I18nRoutingGlobalOptions, 'dynamicParamsInterceptor'>> &
+  Pick<I18nRoutingGlobalOptions, 'dynamicParamsInterceptor'> {
   const options = getGlobalOptions(router)
   return {
     defaultLocale: proxy.defaultLocale || options.defaultLocale || defaultLocale,
@@ -55,7 +56,8 @@ export function getI18nRoutingOptions(
     prefixable: proxy.prefixable || options.prefixable || prefixable,
     switchLocalePathIntercepter:
       proxy.switchLocalePathIntercepter || options.switchLocalePathIntercepter || switchLocalePathIntercepter,
-    dynamicRouteParamsKey: proxy.dynamicRouteParamsKey || options.dynamicRouteParamsKey || dynamicRouteParamsKey
+    dynamicRouteParamsKey: proxy.dynamicRouteParamsKey || options.dynamicRouteParamsKey || dynamicRouteParamsKey,
+    dynamicParamsInterceptor: options.dynamicParamsInterceptor || undefined
   }
 }
 

packages/vue-i18n-routing/src/extends/router.ts

@@ -27,6 +27,8 @@ import type {
   RouteLocationNormalizedLoaded,
   RouteLocationNormalized
 } from '@intlify/vue-router-bridge'
+import type { Ref } from 'vue-demi'
+import type { Locale } from 'vue-i18n'
 
 /**
  * Global options for i18n routing
@@ -42,8 +44,9 @@ export type I18nRoutingGlobalOptions<Context = unknown> = Pick<
   | 'prefixable'
   | 'switchLocalePathIntercepter'
   | 'dynamicRouteParamsKey'
-> & { localeCodes?: string[] }
+> & { localeCodes?: string[]; dynamicParamsInterceptor?: DynamicParamsInterceptor }
 
+export type DynamicParamsInterceptor = () => Ref<Record<Locale, unknown>>
 const GlobalOptionsRegistory = makeSymbol('vue-i18n-routing-gor')
 
 /**