diff --git a/nuxt.config.js b/nuxt.config.js
index e4116cb8bd..a0fe37340f 100644
--- a/nuxt.config.js
+++ b/nuxt.config.js
@@ -174,20 +174,19 @@ export default {
],
lazy: true,
langDir: 'locales',
- strategy: 'no_prefix',
defaultLocale: 'en',
/**
- * This section is critical for the current, iframed production environment
- * {@link https://i18n.nuxtjs.org/options-reference/#detectbrowserlanguage}
+ * `detectBrowserLanguage` must be false to prevent nuxt/i18n from automatically
+ * setting the locale based on headers or the client-side `navigator` object.
+ *
+ * Such detection is handled at the parent level in WP.org.
+ *
+ * More info about the Nuxt i18n:
+ *
+ * - [detectBrowserLanguage](https://i18n.nuxtjs.org/options-reference/#detectbrowserlanguage)
+ * - [Browser language detection info](https://i18n.nuxtjs.org/browser-language-detection)
* */
- detectBrowserLanguage: {
- useCookie: true,
- cookieKey: 'i18n_redirected',
- alwaysRedirect: true,
- cookieCrossOrigin: true,
- cookieSecure: true,
- },
- baseUrl: 'http://localhost:8443',
+ detectBrowserLanguage: false,
vueI18n: '~/plugins/vue-i18n.js',
},
/**
diff --git a/src/components/VAllResultsGrid/VAllResultsGrid.vue b/src/components/VAllResultsGrid/VAllResultsGrid.vue
index 287c5aea9a..dee5eb9c62 100644
--- a/src/components/VAllResultsGrid/VAllResultsGrid.vue
+++ b/src/components/VAllResultsGrid/VAllResultsGrid.vue
@@ -7,8 +7,8 @@
diff --git a/src/composables/use-match-routes.js b/src/composables/use-match-routes.js
index b004e9cfd6..53ccab1792 100644
--- a/src/composables/use-match-routes.js
+++ b/src/composables/use-match-routes.js
@@ -1,17 +1,25 @@
+import { useContext } from '@nuxtjs/composition-api'
import { ref, useRoute, useRouter } from '@nuxtjs/composition-api'
/**
* Reactive property that returns true only on the matching routes.
* Note that routes are matched by name, not the url path.
*
+ * Routes are also localized before comparison, so 'search' becomes
+ * 'search__en', for example.
+ *
* @returns {{matches: import('@nuxtjs/composition-api').Ref}}
*/
export const useMatchRoute = (routes = []) => {
+ const { app } = useContext()
const route = useRoute()
const router = useRouter()
- const matches = ref(routes.includes(route.value.name))
+ const localizedRoutes = routes.map(
+ (route) => app.localeRoute({ name: route }).name
+ )
+ const matches = ref(localizedRoutes.includes(route.value.name))
router.beforeEach((to, from, next) => {
- matches.value = routes.includes(to.name)
+ matches.value = localizedRoutes.includes(to.name)
next()
})
return { matches }
diff --git a/src/pages/audio/_id.vue b/src/pages/audio/_id.vue
index d713ac32a4..5f86afbbdd 100644
--- a/src/pages/audio/_id.vue
+++ b/src/pages/audio/_id.vue
@@ -75,7 +75,10 @@ const AudioDetailPage = {
},
beforeRouteEnter(to, from, nextPage) {
nextPage((_this) => {
- if (from.path === '/search/' || from.path === '/search/audio') {
+ if (
+ from.name === _this.localeRoute({ path: '/search/' }).name ||
+ from.name === _this.localeRoute({ path: '/search/audio' }).name
+ ) {
_this.shouldShowBreadcrumb = true
_this.breadCrumbURL = from.fullPath
}
diff --git a/src/pages/image/_id.vue b/src/pages/image/_id.vue
index f03870cccd..bc018c40c1 100644
--- a/src/pages/image/_id.vue
+++ b/src/pages/image/_id.vue
@@ -61,7 +61,10 @@ const PhotoDetailPage = {
},
beforeRouteEnter(to, from, nextPage) {
nextPage((_this) => {
- if (from.path === '/search/' || from.path === '/search/image') {
+ if (
+ from.name === _this.localeRoute({ path: '/search/' }).name ||
+ from.name === _this.localeRoute({ path: '/search/image' }).name
+ ) {
_this.shouldShowBreadcrumb = true
_this.breadCrumbURL = from.fullPath
}
diff --git a/src/pages/index.vue b/src/pages/index.vue
index cba4795201..ffe2c62023 100644
--- a/src/pages/index.vue
+++ b/src/pages/index.vue
@@ -157,10 +157,12 @@ const HomePage = {
images: setItem.images.map((imageItem) => ({
...imageItem,
src: require(`~/assets/homepage_images/${setItem.prefix}-${imageItem.index}.jpg`),
- url: router.resolve({
- name: 'image-id',
- params: { id: imageItem.identifier },
- }).href,
+ url: router.resolve(
+ app.localePath({
+ name: 'image-id',
+ params: { id: imageItem.identifier },
+ })
+ ).href,
})),
}))