Skip to content

Commit

Permalink
feat(vuex): expose nuxt-i18n API on store
Browse files Browse the repository at this point in the history
The '$i18n' was already there but not `localePath` and other "root" APIs.

Resolves #1031
  • Loading branch information
rchl committed Mar 8, 2021
1 parent c3399f1 commit 58c89d3
Show file tree
Hide file tree
Showing 5 changed files with 58 additions and 6 deletions.
10 changes: 5 additions & 5 deletions src/templates/plugin.routing.js
Original file line number Diff line number Diff line change
Expand Up @@ -209,9 +209,9 @@ const plugin = {

export default (context) => {
Vue.use(plugin)
const { app } = context
app.localePath = NuxtContextProxy(context, localePath)
app.localeRoute = NuxtContextProxy(context, localeRoute)
app.switchLocalePath = NuxtContextProxy(context, switchLocalePath)
app.getRouteBaseName = NuxtContextProxy(context, getRouteBaseName)
const { app, store = {} } = context
app.localePath = store.localePath = NuxtContextProxy(context, localePath)
app.localeRoute = store.localeRoute = NuxtContextProxy(context, localeRoute)
app.switchLocalePath = store.switchLocalePath = NuxtContextProxy(context, switchLocalePath)
app.getRouteBaseName = store.getRouteBaseName = NuxtContextProxy(context, getRouteBaseName)
}
1 change: 1 addition & 0 deletions test/fixture/basic/pages/about.vue
Original file line number Diff line number Diff line change
Expand Up @@ -3,6 +3,7 @@
<LangSwitcher />
<div id="current-page">page: {{ $t('about') }}</div>
<nuxt-link id="link-home" exact :to="localePath('index')">{{ $t('home') }}</nuxt-link>
<div id="store-path-fr">{{ $store.state.routePathFr }}</div>
</div>
</template>

Expand Down
26 changes: 26 additions & 0 deletions test/fixture/basic/store/index.js
Original file line number Diff line number Diff line change
@@ -0,0 +1,26 @@
/**
* @typedef {{
* routePathFr: string
* }} State
*
* @typedef {import('vuex').Store<State>} TestStore
*/

/** @return {TestStore['state']} */
export const state = () => ({
routePathFr: ''
})

/** @type {import('vuex').MutationTree<State>} */
export const mutations = {
setInitialRoutePath (state, path) {
state.routePathFr = path
}
}

/** @type {import('vuex').ActionTree<State, State>} */
export const actions = {
nuxtServerInit ({ commit }) {
commit('setInitialRoutePath', this.switchLocalePath('fr'))
}
}
20 changes: 20 additions & 0 deletions test/module.test.js
Original file line number Diff line number Diff line change
Expand Up @@ -2111,3 +2111,23 @@ describe('Composition API', () => {
expect(dom.querySelector('#processed-url')?.getAttribute('href')).toBe('/')
})
})

describe('Store', () => {
/** @type {Nuxt} */
let nuxt

beforeAll(async () => {
nuxt = (await setup(loadConfig(__dirname, 'basic'))).nuxt
})

afterAll(async () => {
await nuxt.close()
})

test('API is available in store instance', async () => {
const html = await get('/about-us')
const dom = getDom(html)

expect(dom.querySelector('#store-path-fr')?.textContent).toBe('/a-propos')
})
})
7 changes: 6 additions & 1 deletion types/vue.d.ts
Original file line number Diff line number Diff line change
@@ -1,4 +1,5 @@
import Vue from 'vue'
import 'vue'
import 'vuex'
import { Location, RawLocation, Route } from 'vue-router'
import VueI18n, { IVueI18n } from 'vue-i18n'
import { MetaInfo } from 'vue-meta'
Expand Down Expand Up @@ -63,5 +64,9 @@ declare module '@nuxt/types' {
declare module 'vuex/types/index' {
interface Store<S> {
readonly $i18n: VueI18n & IVueI18n
getRouteBaseName(route?: Route): string
localePath(route: RawLocation, locale?: string): string
localeRoute(route: RawLocation, locale?: string): Location | undefined
switchLocalePath(locale: string): string
}
}

0 comments on commit 58c89d3

Please sign in to comment.