fix: i18n live-reload for dashboard — tabs now respect language setting
Root cause: dashboard tabs rendered via t() template literals had no data-i18n attributes, so setLocale() _applyDOM() could not re-translate them live. User switching to English in profile saw no effect without page reload. Changes: - i18n.js: expose t/initI18n/setLocale/getLocale/tr globally (window.*) for non-module script compatibility - viewer.js: add data-i18n attributes to all 4 dashboard tabs + loading text + empty state messages (12 elements total) Verified: tabs show 'Statistics/Bookmarks/Recent/Shared' in EN mode
This commit is contained in:
@@ -138,6 +138,13 @@ async function _loadLocaleStrings(locale) {
|
||||
}
|
||||
}
|
||||
|
||||
// ── Global exports for non-module scripts (legacy app.js) ──────────────────
|
||||
window.t = t;
|
||||
window.tr = tr;
|
||||
window.getLocale = getLocale;
|
||||
window.setLocale = setLocale;
|
||||
window.initI18n = initI18n;
|
||||
|
||||
/** Walk the DOM and update every element with a data-i18n* attribute. */
|
||||
function _applyDOM() {
|
||||
// textContent
|
||||
|
||||
+11
-11
@@ -932,16 +932,16 @@ export function showWelcome() {
|
||||
<div id="dashboard-home" class="dashboard-home" role="region" aria-label="Tableau de bord">
|
||||
<!-- Dashboard Tabs -->
|
||||
<div class="dashboard-tabs">
|
||||
<button class="dashboard-tab active" data-tab="stats">
|
||||
<button class="dashboard-tab active" data-tab="stats" data-i18n="dashboard.stats">
|
||||
<i data-lucide="bar-chart-3" style="width:14px;height:14px"></i> ${t('dashboard.stats')}
|
||||
</button>
|
||||
<button class="dashboard-tab" data-tab="bookmarks">
|
||||
<button class="dashboard-tab" data-tab="bookmarks" data-i18n="dashboard.bookmarks">
|
||||
<i data-lucide="bookmark" style="width:14px;height:14px"></i> ${t('dashboard.bookmarks')}
|
||||
</button>
|
||||
<button class="dashboard-tab" data-tab="recent">
|
||||
<button class="dashboard-tab" data-tab="recent" data-i18n="dashboard.tab_recent">
|
||||
<i data-lucide="clock" style="width:14px;height:14px"></i> ${t('dashboard.tab_recent')}
|
||||
</button>
|
||||
<button class="dashboard-tab" data-tab="shared">
|
||||
<button class="dashboard-tab" data-tab="shared" data-i18n="dashboard.tab_shared">
|
||||
<i data-lucide="share-2" style="width:14px;height:14px"></i> ${t('dashboard.tab_shared')}
|
||||
</button>
|
||||
</div>
|
||||
@@ -949,7 +949,7 @@ export function showWelcome() {
|
||||
<!-- Stats Panel -->
|
||||
<div id="dashboard-panel-stats" class="dashboard-panel active">
|
||||
<div id="dashboard-stats-grid" class="dashboard-stats-grid">
|
||||
<div class="dashboard-stats-loading">${t('common.loading')}</div>
|
||||
<div class="dashboard-stats-loading" data-i18n="common.loading">${t('common.loading')}</div>
|
||||
</div>
|
||||
<div id="dashboard-conflicts-container" style="margin-top:16px"></div>
|
||||
</div>
|
||||
@@ -959,8 +959,8 @@ export function showWelcome() {
|
||||
<div id="dashboard-bookmarks-grid" class="dashboard-recent-grid"></div>
|
||||
<div id="dashboard-bookmarks-empty" class="dashboard-recent-empty">
|
||||
<i data-lucide="pin"></i>
|
||||
<span>${t('dashboard.no_bookmarks')}</span>
|
||||
<p>${t('dashboard.pin_hint')}</p>
|
||||
<span data-i18n="dashboard.no_bookmarks">${t('dashboard.no_bookmarks')}</span>
|
||||
<p data-i18n="dashboard.pin_hint">${t('dashboard.pin_hint')}</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@@ -978,8 +978,8 @@ export function showWelcome() {
|
||||
</div>
|
||||
<div id="dashboard-recent-empty" class="dashboard-recent-empty hidden">
|
||||
<i data-lucide="inbox"></i>
|
||||
<span>${t('dashboard.no_recent')}</span>
|
||||
<p>${t('dashboard.recent_hint')}</p>
|
||||
<span data-i18n="dashboard.no_recent">${t('dashboard.no_recent')}</span>
|
||||
<p data-i18n="dashboard.recent_hint">${t('dashboard.recent_hint')}</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@@ -988,8 +988,8 @@ export function showWelcome() {
|
||||
<div id="dashboard-shared-grid" class="dashboard-recent-grid"></div>
|
||||
<div id="dashboard-shared-empty" class="dashboard-recent-empty">
|
||||
<i data-lucide="share-2"></i>
|
||||
<span>${t('dashboard.no_shares')}</span>
|
||||
<p>${t('dashboard.shared_hint')}</p>
|
||||
<span data-i18n="dashboard.no_shares">${t('dashboard.no_shares')}</span>
|
||||
<p data-i18n="dashboard.shared_hint">${t('dashboard.shared_hint')}</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>`;
|
||||
|
||||
Reference in New Issue
Block a user