Set up localization with feature flag control (#9649)

Refers #8128 

Changes Introduced:
- Added i18n configuration.
- Added a feature flag for localization.
- Enabled language switching based on the flag.

---------

Co-authored-by: Félix Malfait <felix@twenty.com>
This commit is contained in:
Anne Deepa Prasanna
2025-01-17 01:30:56 +05:30
committed by GitHub
parent b81ffcc77c
commit f44b31573a
38 changed files with 912 additions and 79 deletions

View File

@ -5,29 +5,41 @@ import { RecoilDebugObserverEffect } from '@/debug/components/RecoilDebugObserve
import { AppErrorBoundary } from '@/error-handler/components/AppErrorBoundary';
import { ExceptionHandlerProvider } from '@/error-handler/components/ExceptionHandlerProvider';
import { SnackBarProviderScope } from '@/ui/feedback/snack-bar-manager/scopes/SnackBarProviderScope';
import { i18n } from '@lingui/core';
import { I18nProvider } from '@lingui/react';
import { HelmetProvider } from 'react-helmet-async';
import { RecoilRoot } from 'recoil';
import { RecoilURLSyncJSON } from 'recoil-sync';
import { IconsProvider } from 'twenty-ui';
import { messages as enMessages } from '../../../locales/en/messages';
import { messages as frMessages } from '../../../locales/fr/messages';
i18n.load({
en: enMessages,
fr: frMessages,
});
i18n.activate('fr');
export const App = () => {
return (
<RecoilRoot>
<RecoilURLSyncJSON location={{ part: 'queryParams' }}>
<AppErrorBoundary>
<CaptchaProvider>
<RecoilDebugObserverEffect />
<ApolloDevLogEffect />
<SnackBarProviderScope snackBarManagerScopeId="snack-bar-manager">
<IconsProvider>
<ExceptionHandlerProvider>
<HelmetProvider>
<AppRouter />
</HelmetProvider>
</ExceptionHandlerProvider>
</IconsProvider>
</SnackBarProviderScope>
</CaptchaProvider>
<I18nProvider i18n={i18n}>
<CaptchaProvider>
<RecoilDebugObserverEffect />
<ApolloDevLogEffect />
<SnackBarProviderScope snackBarManagerScopeId="snack-bar-manager">
<IconsProvider>
<ExceptionHandlerProvider>
<HelmetProvider>
<AppRouter />
</HelmetProvider>
</ExceptionHandlerProvider>
</IconsProvider>
</SnackBarProviderScope>
</CaptchaProvider>
</I18nProvider>
</AppErrorBoundary>
</RecoilURLSyncJSON>
</RecoilRoot>

View File

@ -123,11 +123,11 @@ const SettingsProfile = lazy(() =>
})),
);
const SettingsAppearance = lazy(() =>
const SettingsExperience = lazy(() =>
import(
'~/pages/settings/profile/appearance/components/SettingsAppearance'
'~/pages/settings/profile/appearance/components/SettingsExperience'
).then((module) => ({
default: module.SettingsAppearance,
default: module.SettingsExperience,
})),
);
@ -278,7 +278,7 @@ export const SettingsRoutes = ({
<Suspense fallback={<SettingsSkeletonLoader />}>
<Routes>
<Route path={SettingsPath.ProfilePage} element={<SettingsProfile />} />
<Route path={SettingsPath.Appearance} element={<SettingsAppearance />} />
<Route path={SettingsPath.Experience} element={<SettingsExperience />} />
<Route path={SettingsPath.Accounts} element={<SettingsAccounts />} />
<Route path={SettingsPath.NewAccount} element={<SettingsNewAccount />} />
<Route