Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

refactor!: functions in the config to be used through hooks #1919

Merged
merged 4 commits into from Mar 12, 2023
Merged

refactor!: functions in the config to be used through hooks #1919

Show file tree
Hide file tree
Changes from 1 commit
Commits
Show all changes
4 commits
Select commit Hold shift + click to select a range
e35c696
chore: initial plan
ineshbose Mar 9, 2023
76104b1
chore: progressing on it
ineshbose Mar 11, 2023
b22cb7f
chore: wrapping up
ineshbose Mar 11, 2023
5675650
chore: minor polish
ineshbose Mar 12, 2023
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Jump to
Jump to file
Failed to load files.
Diff view
Diff view
4 changes: 4 additions & 0 deletions docs/content/2.guide/15.migrating.md
View file
Open in desktop
Expand Up @@ -149,6 +149,10 @@ About details, See also [Lang Switcher](/api/lang-switcher#dynamic-route-paramet

This option is no longer necessary, because i18n custom block is supported by [unplugin-vue-i18n](https://github.com/intlify/bundle-tools/tree/main/packages/unplugin-vue-i18n) **as default**.

### Deprecated `onBeforeLanguageSwitch` and `onLanguageSwitched` function options

These functions can now be triggered using Nuxt runtime hooks. Please refer to [runtime hooks](/guide/runtime-hooks) to see how to use these.

### Change some export APIs name on Nuxt context

The following API will be changed to `$`:
Expand Down
2 changes: 2 additions & 0 deletions docs/content/2.guide/2.runtime-hooks.md
View file
Open in desktop
Expand Up @@ -17,6 +17,8 @@ Parameters:
- **initialSetup**: set to `true` if it's the initial locale switch that triggers on app load. It's a special case since the locale is not technically set yet so we're switching from no locale to locale.
- **context**: the Nuxt app

Returns: `string` or nothing

### `i18n:localeSwitched`

Called right after the app's locale has been switched.
Expand Down
12 changes: 0 additions & 12 deletions docs/content/4.API/3.vue-i18n.md
View file
Open in desktop
Expand Up @@ -102,15 +102,3 @@ Object of the current locale properties.
- **Type**: `boolean`

Whether `differentDomains` option is enabled.

### onBeforeLanguageSwitch

- **Type**: `Function`

See [callbacks](/guide/callbacks)

### onLanguageSwitched

- **Type**: `Function`

See [callbacks](/guide/callbacks)
15 changes: 15 additions & 0 deletions specs/fixtures/plugins/i18nHooks.ts
View file
Open in desktop
@@ -0,0 +1,15 @@
import { defineNuxtPlugin } from '#imports'

export default defineNuxtPlugin(nuxtApp => {
nuxtApp.hook('i18n:beforeLocaleSwitch', ({ oldLocale, newLocale, initialSetup }) => {
console.log('onBeforeLanguageSwitch', oldLocale, newLocale, initialSetup)

if (newLocale === 'en') {
return 'fr'
}
})

nuxtApp.hook('i18n:localeSwitched', ({ oldLocale, newLocale }) => {
console.log('onLanguageSwitched', oldLocale, newLocale)
})
})
4 changes: 2 additions & 2 deletions specs/callbacks.spec.ts → specs/runtime_hooks.spec.ts
View file
Open in desktop
Expand Up @@ -8,12 +8,12 @@ await setup({
browser: true,
// overrides
nuxtConfig: {
plugins: [fileURLToPath(new URL(`../playground/plugins/i18n.ts`, import.meta.url))],
plugins: [fileURLToPath(new URL(`./fixtures/plugins/i18nHooks.ts`, import.meta.url))],
i18n: { defaultLocale: 'en' }
}
})

describe('onBeforeLanguageSwitch / onLanguageSwitched', () => {
describe('beforeLocaleSwitch / localeSwitched', () => {
test('<NuxtLink>', async () => {
const home = url('/')
const page = await createPage()
Expand Down
2 changes: 0 additions & 2 deletions src/options.d.ts
View file
Open in desktop
Expand Up @@ -37,7 +37,5 @@ export {
NuxtI18nInternalOptions,
DetectBrowserLanguageOptions,
RootRedirectOptions,
LanguageSwitchedHandler,
BeforeLanguageSwitchHandler,
LanguageSwitchedHandler
ineshbose marked this conversation as resolved.
Show resolved Hide resolved
} from './types'
4 changes: 2 additions & 2 deletions src/runtime/types.d.ts
View file
Open in desktop
Expand Up @@ -26,15 +26,15 @@ type BeforeLanguageSwitchHandler = (
newLocale: string,
initialSetup: boolean,
context: NuxtApp
) => Promise<unknown>
) => Promise<string | void>

/**
* Called after the app's locale is switched.
*
* @param oldLocale - The app's locale before the switch
* @param newLocale - The app's locale after the switch.
*/
type LanguageSwitchedHandler = (oldLocale: string, newLocale: string) => Promise<unknown>
type LanguageSwitchedHandler = (oldLocale: string, newLocale: string) => Promise<void>

export interface ComposerCustomProperties {
/**
Expand Down
8 changes: 4 additions & 4 deletions src/runtime/utils.ts
View file
Open in desktop
Expand Up @@ -171,7 +171,7 @@ export async function loadAndSetLocale<Context extends NuxtApp = NuxtApp>(
}

// call onBeforeLanguageSwitch
const localeOverride = onBeforeLanguageSwitch(i18n, oldLocale, newLocale, initial, context)
const localeOverride = await onBeforeLanguageSwitch(i18n, oldLocale, newLocale, initial, context)
const localeCodes = getLocaleCodes(i18n)
if (localeOverride && localeCodes && localeCodes.includes(localeOverride)) {
if (localeOverride === oldLocale) {
Expand Down Expand Up @@ -201,11 +201,11 @@ export async function loadAndSetLocale<Context extends NuxtApp = NuxtApp>(

// set the locale
if (useCookie) {
setCookieLocale(i18n, newLocale)
await setCookieLocale(i18n, newLocale)
ineshbose marked this conversation as resolved.
Show resolved Hide resolved
}
setLocale(i18n, newLocale)
await setLocale(i18n, newLocale)

onLanguageSwitched(i18n, oldLocale, newLocale)
await onLanguageSwitched(i18n, oldLocale, newLocale)

ret = true
return [ret, oldLocale]
Expand Down
9 changes: 0 additions & 9 deletions src/types.ts
View file
Open in desktop
Expand Up @@ -36,15 +36,6 @@ export type CustomRoutePages = {
}
}

export type BeforeLanguageSwitchHandler = <Context = unknown>(
oldLocale: string,
newLocale: string,
initialSetup: boolean,
context: Context
) => Promise<unknown>

export type LanguageSwitchedHandler = (oldLocale: string, newLocale: string) => Promise<unknown>

export type NuxtI18nOptions<Context = unknown> = {
differentDomains?: boolean
detectBrowserLanguage?: DetectBrowserLanguageOptions | false
Expand Down
6 changes: 3 additions & 3 deletions test/__snapshots__/gen.test.ts.snap
View file
Open in desktop
Expand Up @@ -24,7 +24,7 @@ export const resolveNuxtI18nOptions = async (context) => {
return nuxtI18nOptions
}

export const nuxtI18nOptionsDefault = Object({vueI18n: undefined,locales: [],defaultLocale: \\"\\",defaultDirection: \\"ltr\\",routesNameSeparator: \\"___\\",trailingSlash: false,defaultLocaleRouteNameSuffix: \\"default\\",strategy: \\"prefix_except_default\\",lazy: false,langDir: null,rootRedirect: null,detectBrowserLanguage: Object({\\"alwaysRedirect\\":false,\\"cookieCrossOrigin\\":false,\\"cookieDomain\\":null,\\"cookieKey\\":\\"i18n_redirected\\",\\"cookieSecure\\":false,\\"fallbackLocale\\":\\"\\",\\"redirectOn\\":\\"root\\",\\"useCookie\\":true}),differentDomains: false,baseUrl: \\"\\",dynamicRouteParams: false,customRoutes: \\"page\\",pages: Object({}),skipSettingLocaleOnNavigate: false,onBeforeLanguageSwitch: (() => \\"\\"),onLanguageSwitched: (() => null),types: undefined,debug: false})
export const nuxtI18nOptionsDefault = Object({vueI18n: undefined,locales: [],defaultLocale: \\"\\",defaultDirection: \\"ltr\\",routesNameSeparator: \\"___\\",trailingSlash: false,defaultLocaleRouteNameSuffix: \\"default\\",strategy: \\"prefix_except_default\\",lazy: false,langDir: null,rootRedirect: null,detectBrowserLanguage: Object({\\"alwaysRedirect\\":false,\\"cookieCrossOrigin\\":false,\\"cookieDomain\\":null,\\"cookieKey\\":\\"i18n_redirected\\",\\"cookieSecure\\":false,\\"fallbackLocale\\":\\"\\",\\"redirectOn\\":\\"root\\",\\"useCookie\\":true}),differentDomains: false,baseUrl: \\"\\",dynamicRouteParams: false,customRoutes: \\"page\\",pages: Object({}),skipSettingLocaleOnNavigate: false,types: undefined,debug: false})

export const nuxtI18nInternalOptions = Object({__normalizedLocales: [Object({\\"code\\":\\"en\\"})]})
export const NUXT_I18N_MODULE_ID = \\"@nuxtjs/i18n\\"
Expand Down Expand Up @@ -141,7 +141,7 @@ export const resolveNuxtI18nOptions = async (context) => {
return nuxtI18nOptions
}

export const nuxtI18nOptionsDefault = Object({vueI18n: undefined,locales: [],defaultLocale: \\"\\",defaultDirection: \\"ltr\\",routesNameSeparator: \\"___\\",trailingSlash: false,defaultLocaleRouteNameSuffix: \\"default\\",strategy: \\"prefix_except_default\\",lazy: false,langDir: null,rootRedirect: null,detectBrowserLanguage: Object({\\"alwaysRedirect\\":false,\\"cookieCrossOrigin\\":false,\\"cookieDomain\\":null,\\"cookieKey\\":\\"i18n_redirected\\",\\"cookieSecure\\":false,\\"fallbackLocale\\":\\"\\",\\"redirectOn\\":\\"root\\",\\"useCookie\\":true}),differentDomains: false,baseUrl: \\"\\",dynamicRouteParams: false,customRoutes: \\"page\\",pages: Object({}),skipSettingLocaleOnNavigate: false,onBeforeLanguageSwitch: (() => \\"\\"),onLanguageSwitched: (() => null),types: undefined,debug: false})
export const nuxtI18nOptionsDefault = Object({vueI18n: undefined,locales: [],defaultLocale: \\"\\",defaultDirection: \\"ltr\\",routesNameSeparator: \\"___\\",trailingSlash: false,defaultLocaleRouteNameSuffix: \\"default\\",strategy: \\"prefix_except_default\\",lazy: false,langDir: null,rootRedirect: null,detectBrowserLanguage: Object({\\"alwaysRedirect\\":false,\\"cookieCrossOrigin\\":false,\\"cookieDomain\\":null,\\"cookieKey\\":\\"i18n_redirected\\",\\"cookieSecure\\":false,\\"fallbackLocale\\":\\"\\",\\"redirectOn\\":\\"root\\",\\"useCookie\\":true}),differentDomains: false,baseUrl: \\"\\",dynamicRouteParams: false,customRoutes: \\"page\\",pages: Object({}),skipSettingLocaleOnNavigate: false,types: undefined,debug: false})

export const nuxtI18nInternalOptions = Object({__normalizedLocales: [Object({\\"code\\":\\"en\\"})]})
export const NUXT_I18N_MODULE_ID = \\"@nuxtjs/i18n\\"
Expand Down Expand Up @@ -172,7 +172,7 @@ export const resolveNuxtI18nOptions = async (context) => {
return nuxtI18nOptions
}

export const nuxtI18nOptionsDefault = Object({vueI18n: undefined,locales: [],defaultLocale: \\"\\",defaultDirection: \\"ltr\\",routesNameSeparator: \\"___\\",trailingSlash: false,defaultLocaleRouteNameSuffix: \\"default\\",strategy: \\"prefix_except_default\\",lazy: false,langDir: null,rootRedirect: null,detectBrowserLanguage: Object({\\"alwaysRedirect\\":false,\\"cookieCrossOrigin\\":false,\\"cookieDomain\\":null,\\"cookieKey\\":\\"i18n_redirected\\",\\"cookieSecure\\":false,\\"fallbackLocale\\":\\"\\",\\"redirectOn\\":\\"root\\",\\"useCookie\\":true}),differentDomains: false,baseUrl: \\"\\",dynamicRouteParams: false,customRoutes: \\"page\\",pages: Object({}),skipSettingLocaleOnNavigate: false,onBeforeLanguageSwitch: (() => \\"\\"),onLanguageSwitched: (() => null),types: undefined,debug: false})
export const nuxtI18nOptionsDefault = Object({vueI18n: undefined,locales: [],defaultLocale: \\"\\",defaultDirection: \\"ltr\\",routesNameSeparator: \\"___\\",trailingSlash: false,defaultLocaleRouteNameSuffix: \\"default\\",strategy: \\"prefix_except_default\\",lazy: false,langDir: null,rootRedirect: null,detectBrowserLanguage: Object({\\"alwaysRedirect\\":false,\\"cookieCrossOrigin\\":false,\\"cookieDomain\\":null,\\"cookieKey\\":\\"i18n_redirected\\",\\"cookieSecure\\":false,\\"fallbackLocale\\":\\"\\",\\"redirectOn\\":\\"root\\",\\"useCookie\\":true}),differentDomains: false,baseUrl: \\"\\",dynamicRouteParams: false,customRoutes: \\"page\\",pages: Object({}),skipSettingLocaleOnNavigate: false,types: undefined,debug: false})

export const nuxtI18nInternalOptions = Object({__normalizedLocales: [Object({\\"code\\":\\"en\\"})]})
export const NUXT_I18N_MODULE_ID = \\"@nuxtjs/i18n\\"
Expand Down