![google-labs-jules[bot]](/assets/img/avatar_default.png)
This commit introduces internationalization for several pages: - AuthCallbackPage.vue - ChoresPage.vue (a comprehensive page with many elements) - ErrorNotFound.vue - GroupDetailPage.vue (including sub-sections for members, invites, chores summary, and expenses summary) Key changes: - Integrated `useI18n` in each listed page to handle translatable strings. - Replaced hardcoded text in templates and relevant script sections (notifications, dynamic messages, fallbacks, etc.) with `t('key')` calls. - Added new translation keys, organized under page-specific namespaces (e.g., `authCallbackPage`, `choresPage`, `errorNotFoundPage`, `groupDetailPage`), to `fe/src/i18n/en.json`. - Added corresponding keys with placeholder translations (prefixed with DE:, FR:, ES:) to `fe/src/i18n/de.json`, `fe/src/i18n/fr.json`, and `fe/src/i18n/es.json`. - Reused existing translation keys (e.g., for chore frequency options) where applicable.
72 lines
2.3 KiB
TypeScript
72 lines
2.3 KiB
TypeScript
import { createApp } from 'vue';
|
|
import { createPinia } from 'pinia';
|
|
import * as Sentry from '@sentry/vue';
|
|
import { BrowserTracing } from '@sentry/tracing';
|
|
import App from './App.vue';
|
|
import router from './router';
|
|
import { createI18n } from 'vue-i18n';
|
|
import messages from '@/i18n';
|
|
|
|
// Global styles
|
|
import './assets/main.scss';
|
|
|
|
// API client (from your axios boot file)
|
|
import { api, globalAxios } from '@/services/api'; // Renamed from boot/axios to services/api
|
|
import { useAuthStore } from '@/stores/auth';
|
|
|
|
// Vue I18n setup (from your i18n boot file)
|
|
// // export type MessageLanguages = keyof typeof messages;
|
|
// // export type MessageSchema = (typeof messages)['en-US'];
|
|
|
|
// // declare module 'vue-i18n' {
|
|
// // export interface DefineLocaleMessage extends MessageSchema {}
|
|
// // // eslint-disable-next-line @typescript-eslint/no-empty-object-type
|
|
// // export interface DefineDateTimeFormat {}
|
|
// // // eslint-disable-next-line @typescript-eslint/no-empty-object-type
|
|
// // export interface DefineNumberFormat {}
|
|
// // }
|
|
const i18n = createI18n({
|
|
legacy: false, // Recommended for Vue 3
|
|
locale: 'en', // Default locale
|
|
fallbackLocale: 'en', // Fallback locale
|
|
messages,
|
|
});
|
|
|
|
const app = createApp(App);
|
|
const pinia = createPinia();
|
|
app.use(pinia);
|
|
|
|
// Initialize Sentry
|
|
Sentry.init({
|
|
app,
|
|
dsn: import.meta.env.VITE_SENTRY_DSN,
|
|
integrations: [
|
|
new BrowserTracing({
|
|
routingInstrumentation: Sentry.vueRouterInstrumentation(router),
|
|
tracingOrigins: ['localhost', /^\//],
|
|
}),
|
|
],
|
|
// Set tracesSampleRate to 1.0 to capture 100% of transactions for performance monitoring.
|
|
// We recommend adjusting this value in production
|
|
tracesSampleRate: 1.0,
|
|
// Set environment
|
|
environment: import.meta.env.MODE,
|
|
});
|
|
|
|
// Initialize auth state before mounting the app
|
|
const authStore = useAuthStore();
|
|
if (authStore.accessToken) {
|
|
authStore.fetchCurrentUser().catch(error => {
|
|
console.error('Failed to initialize current user state:', error);
|
|
// The fetchCurrentUser action handles token clearing on failure.
|
|
});
|
|
}
|
|
|
|
app.use(router);
|
|
app.use(i18n);
|
|
|
|
// Make API instance globally available (optional, prefer provide/inject or store)
|
|
app.config.globalProperties.$api = api;
|
|
app.config.globalProperties.$axios = globalAxios; // The original axios instance if needed
|
|
|
|
app.mount('#app'); |