Skip to content

fix: use useI18n instead of window.i18n #404

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
merged 5 commits into from
Oct 28, 2025
Merged

fix: use useI18n instead of window.i18n #404

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
5 commits
Select commit Hold shift + click to select a range
2a2b20b
fix: use useI18n instead of window.i18n
yaroslav8765 Oct 20, 2025
6c66d27
Revert "fix: use useI18n instead of window.i18n"
yaroslav8765 Oct 21, 2025
8085af1
fix: declare global interface for i18n on window object
yaroslav8765 Oct 21, 2025
69f04e0
Merge branch 'next' of github.com:devforth/adminforth into AdminForth…
yaroslav8765 Oct 23, 2025
bd8b122
fix: add translations to the callApi error messages
yaroslav8765 Oct 23, 2025
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
2 changes: 1 addition & 1 deletion adminforth/spa/package.json
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -10,7 +10,7 @@
"build-only": "vite build",
"type-check": "vue-tsc --build --force",
"lint": "eslint . --ext .vue,.js,.jsx,.cjs,.mjs,.ts,.tsx,.cts,.mts --fix --ignore-path .gitignore",
"i18n:extract": "echo {} > i18n-empty.json && vue-i18n-extract report --vueFiles \"./src/**/*.{js,vue}\" --output ./i18n-messages.json --languageFiles \"i18n-empty.json\" --add"
"i18n:extract": "echo {} > i18n-empty.json && vue-i18n-extract report --vueFiles \"./src/**/*.{js,vue,ts}\" --output ./i18n-messages.json --languageFiles \"i18n-empty.json\" --add"
},
"dependencies": {
"@iconify-prerendered/vue-flag": "^0.28.1748584105",
Expand Down
6 changes: 4 additions & 2 deletions adminforth/spa/src/i18n.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -7,7 +7,7 @@ function slavicPluralRule(choice: number, choicesLength: number, orgRule: any) {
if (choice === 0) {
return 0
}

const teen = choice > 10 && choice < 20
const endsWithOne = choice % 10 === 1

Expand All @@ -21,6 +21,8 @@ function slavicPluralRule(choice: number, choicesLength: number, orgRule: any) {
return choicesLength < 4 ? 2 : 3
}

export let i18nInstance: ReturnType<typeof createI18n> | null = null

export function initI18n(app: ReturnType<typeof createApp>) {
const i18n = createI18n({
legacy: false,
Expand Down Expand Up @@ -48,7 +50,7 @@ export function initI18n(app: ReturnType<typeof createApp>) {
return key + ' ';
},
});

app.use(i18n);
i18nInstance = i18n
return i18n
}
2 changes: 1 addition & 1 deletion adminforth/spa/src/main.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -14,7 +14,7 @@ app.use(createPinia())
app.use(router)

// get access to i18n instance outside components
window.i18n = initI18n(app);
initI18n(app);


/* IMPORTANT:ADMINFORTH CUSTOM USES */
Expand Down
6 changes: 4 additions & 2 deletions adminforth/spa/src/utils.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -9,6 +9,7 @@ import adminforth from './adminforth';
import sanitizeHtml from 'sanitize-html'
import debounce from 'debounce';
import type { AdminForthResourceColumnInputCommon, Predicate } from '@/types/Common';
import { i18nInstance } from './i18n'

const LS_LANG_KEY = `afLanguage`;
const MAX_CONSECUTIVE_EMPTY_RESULTS = 2;
Expand All @@ -19,6 +20,7 @@ export async function callApi({path, method, body, headers}: {
body?: any
headers?: Record<string, string>
}): Promise<any> {
const t = i18nInstance?.global.t || ((s: string) => s)
const options = {
method,
headers: {
Expand All @@ -42,11 +44,11 @@ export async function callApi({path, method, body, headers}: {
// if it is internal error, say to user
if (e instanceof TypeError && e.message === 'Failed to fetch') {
// this is a network error
adminforth.alert({variant:'danger', message: window.i18n?.global?.t('Network error, please check your Internet connection and try again'),})
adminforth.alert({variant:'danger', message: t('Network error, please check your Internet connection and try again'),})
return null;
}

adminforth.alert({variant:'danger', message: window.i18n?.global?.t('Something went wrong, please try again later'),})
adminforth.alert({variant:'danger', message: t('Something went wrong, please try again later'),})
console.error(`error in callApi ${path}`, e);
}
}
Expand Down