fix: UI localization on load + update all namespaced locales

client/components/admin/admin-rendering.vue

@@ -6,7 +6,7 @@
           img.animated.fadeInUp(src='/svg/icon-process.svg', alt='Rendering', style='width: 80px;')
           .admin-header-title
             .headline.primary--text.animated.fadeInLeft Rendering
-            .subheading.grey--text.animated.fadeInLeft.wait-p4s Configure how content is rendered
+            .subheading.grey--text.animated.fadeInLeft.wait-p4s Configure how content is rendered #[v-chip(label, color='primary', small).white--text coming soon]
           v-spacer
           v-btn.animated.fadeInDown.wait-p2s(outline, color='grey', @click='refresh', large)
             v-icon refresh

client/components/editor/editor-modal-media.vue

@@ -2,7 +2,7 @@
   v-card.editor-modal-media.animated.fadeInLeft(flat, tile)
     v-container.pa-3(grid-list-lg, fluid)
       v-layout(row, wrap)
-        v-flex(xs12, xl9)
+        v-flex(xs12, lg9)
           v-card.radius-7.animated.fadeInLeft.wait-p1s(:light='!$vuetify.dark', :dark='$vuetify.dark')
             v-card-text
               .d-flex
@@ -125,7 +125,7 @@
                   v-icon(left) save_alt
                   span {{$t('common:actions.insert')}}
 
-        v-flex(xs12, xl3)
+        v-flex(xs12, lg3)
           v-card.radius-7.animated.fadeInRight.wait-p3s(:light='!$vuetify.dark', :dark='$vuetify.dark')
             v-card-text
               .d-flex

client/components/editor/editor-modal-properties.vue

@@ -74,12 +74,13 @@
           multiple
           v-model='tags'
           single-line
-          :hint='$t(`editor:props.tagsHint`)'
+          :hint='`COMING SOON - ` + $t(`editor:props.tagsHint`)'
           persistent-hint
+          disabled
           )
       v-divider
       v-card-text.pb-5.grey(:class='darkMode ? `darken-3-d5` : `lighten-4`')
-        v-subheader.pl-0 {{$t('editor:props.publishState')}}
+        v-subheader.pl-0 {{$t('editor:props.publishState')}} #[v-chip.ml-3(label, color='grey', small, outline).white--text coming soon]
         v-container.pa-0(fluid, grid-list-lg)
           v-layout(row, wrap)
             v-flex(xs12, md4)
@@ -89,6 +90,7 @@
                 color='primary'
                 :hint='$t(`editor:props.publishToggleHint`)'
                 persistent-hint
+                disabled
                 )
             v-flex(xs12, md4)
               v-dialog(
@@ -99,7 +101,7 @@
                 :return-value.sync='publishStartDate'
                 full-width
                 width='460px'
-                :disabled='!isPublished'
+                :disabled='!isPublished || true'
                 )
                 v-text-field(
                   slot='activator'
@@ -112,7 +114,7 @@
                   clearable
                   :hint='$t(`editor:props.publishStartHint`)'
                   persistent-hint
-                  :disabled='!isPublished'
+                  :disabled='!isPublished || true'
                   )
                 v-date-picker(
                   v-model='publishStartDate'
@@ -142,7 +144,7 @@
                 :return-value.sync='publishEndDate'
                 full-width
                 width='460px'
-                :disabled='!isPublished'
+                :disabled='!isPublished || true'
                 )
                 v-text-field(
                   slot='activator'
@@ -155,7 +157,7 @@
                   clearable
                   :hint='$t(`editor:props.publishEndHint`)'
                   persistent-hint
-                  :disabled='!isPublished'
+                  :disabled='!isPublished || true'
                   )
                 v-date-picker(
                   v-model='publishEndDate'

client/themes/default/components/page.vue

@@ -141,8 +141,6 @@ import Prism from '@/libs/prism/prism.js'
 import { get } from 'vuex-pathify'
 import _ from 'lodash'
 
-/* global siteLangs */
-
 export default {
   components: {
     StatusIndicator
@@ -261,10 +259,6 @@ export default {
     this.$store.commit('page/SET_UPDATED_AT', this.updatedAt)
 
     this.$store.commit('page/SET_MODE', 'view')
-
-    if (siteLangs.length > 0) {
-      this.$i18n.i18next.changeLanguage(this.locale)
-    }
   },
   mounted () {
     Prism.highlightAllUnder(this.$refs.container)

server/controllers/common.js

@@ -34,6 +34,8 @@ router.get('/healthz', (req, res, next) => {
 router.get(['/e', '/e/*'], async (req, res, next) => {
   const pageArgs = pageHelper.parsePath(req.path, { stripExt: true })
 
+  _.set(res, 'locals.siteConfig.lang', pageArgs.locale)
+
   if (pageHelper.isReservedPath(pageArgs.path)) {
     return next(new Error('Cannot create this page because it starts with a system reserved path.'))
   }
@@ -95,6 +97,8 @@ router.get(['/p', '/p/*'], (req, res, next) => {
 router.get(['/h', '/h/*'], async (req, res, next) => {
   const pageArgs = pageHelper.parsePath(req.path, { stripExt: true })
 
+  _.set(res, 'locals.siteConfig.lang', pageArgs.locale)
+
   if (!WIKI.auth.checkAccess(req.user, ['read:pages'], pageArgs)) {
     _.set(res.locals, 'pageMeta.title', 'Unauthorized')
     return res.render('unauthorized', { action: 'history' })
@@ -121,6 +125,8 @@ router.get(['/h', '/h/*'], async (req, res, next) => {
 router.get(['/s', '/s/*'], async (req, res, next) => {
   const pageArgs = pageHelper.parsePath(req.path, { stripExt: true })
 
+  _.set(res, 'locals.siteConfig.lang', pageArgs.locale)
+
   if (!WIKI.auth.checkAccess(req.user, ['read:pages'], pageArgs)) {
     return res.render('unauthorized', { action: 'source' })
   }
@@ -160,6 +166,9 @@ router.get('/*', async (req, res, next) => {
       userId: req.user.id,
       isPrivate: false
     })
+
+    _.set(res, 'locals.siteConfig.lang', pageArgs.locale)
+
     if (page) {
       _.set(res.locals, 'pageMeta.title', page.title)
       _.set(res.locals, 'pageMeta.description', page.description)

server/jobs/sync-graph-locales.js

@@ -29,39 +29,45 @@ module.exports = async () => {
     })
     const locales = _.sortBy(_.get(respList, 'data.localization.locales', []), 'name').map(lc => ({...lc, isInstalled: (lc.code === 'en')}))
     WIKI.cache.set('locales', locales)
-    const currentLocale = _.find(locales, ['code', WIKI.config.lang.code])
 
     // -> Download locale strings
 
     if (WIKI.config.lang.autoUpdate) {
-      const respStrings = await apollo({
+      const activeLocales = WIKI.config.lang.namespacing ? WIKI.config.lang.namespaces : [WIKI.config.lang.code]
-        query: `query ($code: String!) {
+      for (const currentLocale of activeLocales) {
-          localization {
+        const localeInfo = _.find(locales, ['code', currentLocale])
-            strings(code: $code) {
-              key
-              value
-            }
-          }
-        }`,
-        variables: {
-          code: WIKI.config.lang.code
-        }
-      })
-      const strings = _.get(respStrings, 'data.localization.strings', [])
-      let lcObj = {}
-      _.forEach(strings, row => {
-        if (_.includes(row.key, '::')) { return }
-        if (_.isEmpty(row.value)) { row.value = row.key }
-        _.set(lcObj, row.key.replace(':', '.'), row.value)
-      })
 
-      await WIKI.models.locales.query().update({
+        const respStrings = await apollo({
-        code: WIKI.config.lang.code,
+          query: `query ($code: String!) {
-        strings: lcObj,
+            localization {
-        isRTL: currentLocale.isRTL,
+              strings(code: $code) {
-        name: currentLocale.name,
+                key
-        nativeName: currentLocale.nativeName
+                value
-      }).where('code', WIKI.config.lang.code)
+              }
+            }
+          }`,
+          variables: {
+            code: currentLocale
+          }
+        })
+        const strings = _.get(respStrings, 'data.localization.strings', [])
+        let lcObj = {}
+        _.forEach(strings, row => {
+          if (_.includes(row.key, '::')) { return }
+          if (_.isEmpty(row.value)) { row.value = row.key }
+          _.set(lcObj, row.key.replace(':', '.'), row.value)
+        })
+
+        await WIKI.models.locales.query().update({
+          code: currentLocale,
+          strings: lcObj,
+          isRTL: localeInfo.isRTL,
+          name: localeInfo.name,
+          nativeName: localeInfo.nativeName
+        }).where('code', currentLocale)
+
+        WIKI.logger.info(`Pulled latest locale updates for ${localeInfo.name} from Graph endpoint: [ COMPLETED ]`)
+      }
     }
 
     await WIKI.lang.refreshNamespaces()