@esershnr/artalk-sidebar 1.0.3 → 1.0.4

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@esershnr/artalk-sidebar",
-  "version": "1.0.3",
+  "version": "1.0.4",
   "license": "MIT",
   "description": "The sidebar of artalk",
   "private": false,
@@ -16,7 +16,7 @@
   "devDependencies": {
     "@types/crypto-js": "^4.2.2",
     "@vitejs/plugin-vue": "^5.1.4",
-    "@esershnr/artalk": "workspace:^",
+    "@esershnr/artalk": "2.9.3",
     "crypto-js": "^4.2.0",
     "pinia": "^2.2.4",
     "typescript": "^5.6.3",

package/src/artalk.ts

@@ -15,6 +15,7 @@ export function setupArtalk() {
     server: '../',
     pageKey: bootParams.pageKey,
     site: bootParams.site,
+    locale: bootParams.locale || 'auto',
     darkMode: bootParams.darkMode,
     pvAdd: false,
     noComment: `<div class="atk-sidebar-no-content"></div>`,

package/src/global.ts

@@ -51,6 +51,7 @@ function getBootParams() {
     user,
     pageKey: p.get('pageKey') || '',
     site: p.get('site') || '',
+    locale: p.get('locale') || '',
     view: p.get('view') || '',
     viewParams: <any>null,
     darkMode,

package/src/main.ts

@@ -7,7 +7,7 @@ import { setupI18n } from './i18n'
 import '@esershnr/artalk/Artalk.css'
 import './style.scss'
 import App from './App.vue'
-import { setArtalk } from './global'
+import { bootParams, setArtalk } from './global'
 import { setupArtalk, syncArtalkUser } from './artalk'
 import './lib/promise-polyfill'
 
@@ -15,6 +15,23 @@ import './lib/promise-polyfill'
 // @see https://vue-i18n.intlify.dev
 const { i18n, setLocale } = setupI18n()
 
+// Debugging
+const ARTALK_LOCALE_KEY = 'atk_sidebar_forced_locale'
+
+// Immediately apply local passed from parent via URL params if present
+let urlLocale = bootParams.locale && bootParams.locale !== 'auto' ? bootParams.locale : ''
+
+// Store in sessionStorage to survive potential reloads (since replaceState clears URL)
+if (urlLocale) {
+  sessionStorage.setItem(ARTALK_LOCALE_KEY, urlLocale)
+} else {
+  urlLocale = sessionStorage.getItem(ARTALK_LOCALE_KEY) || ''
+}
+
+if (urlLocale) {
+  setLocale(urlLocale)
+}
+
 // Router
 // @see https://github.com/posva/unplugin-vue-router
 const router = createRouter({
@@ -36,7 +53,13 @@ const artalkLoader = () =>
     Artalk.use((ctx) => {
       // When artalk is ready, notify the loader and load the locale
       ctx.watchConf(['locale'], async (conf) => {
-        if (typeof conf.locale === 'string' && conf.locale !== 'auto') await setLocale(conf.locale) // update i18n locale
+        // PRIORITIZE: The locale passed from the parent site or stored in session
+        // FALLBACK: The locale set in the Artalk backend/admin panel
+        const locale = urlLocale || conf.locale
+
+        if (typeof locale === 'string' && locale !== 'auto') {
+          await setLocale(locale) // update i18n locale
+        }
 
         if (!artalkLoaded) {
           artalkLoaded = true