I18N: Add Lingui core translation framework. (#41827)

* I18N: Add Core Lingui framework for translating the UI

* Make FieldSet accept ReactNode for the label, so it can be translated

* Translate a phrase in the User profile edit form

* Translate phrase

* run lingui compile before webpack builds

* init i18n more lazily

* i1n:compile in drone lint step

* wip for getting tests to work

* Use mock lingui/macros because its too hard to use the real macros in Jest...

* mock messages for tests

* use specific lingui version

* add comment for test helper

* we actually don't need the i18n setup in tests because we mock out <Trans />

* update package.json

* remove unneded imports

* revert back babel core version

* Create a I18nProvider wrapper
This commit is contained in:
Josh Hunt
2021-12-15 17:00:37 +01:00
committed by GitHub
parent 50c6c7a528
commit 4f6d08f14b
18 changed files with 636 additions and 104 deletions
+31 -28
View File
@@ -16,6 +16,7 @@ import { AppNotificationList } from './core/components/AppNotifications/AppNotif
import { SearchWrapper } from 'app/features/search';
import { LiveConnectionWarning } from './features/live/LiveConnectionWarning';
import { AngularRoot } from './angular/AngularRoot';
import { I18nProvider } from './core/localisation';
interface AppWrapperProps {
app: GrafanaApp;
@@ -95,35 +96,37 @@ export class AppWrapper extends React.Component<AppWrapperProps, AppWrapperState
return (
<Provider store={store}>
<ErrorBoundaryAlert style="page">
<ConfigContext.Provider value={config}>
<ThemeProvider>
<ModalsProvider>
<GlobalStyles />
<div className="grafana-app">
<Router history={locationService.getHistory()}>
{newNavigationEnabled ? <NavBarNext /> : <NavBar />}
<main className="main-view">
{pageBanners.map((Banner, index) => (
<Banner key={index.toString()} />
))}
<I18nProvider>
<ErrorBoundaryAlert style="page">
<ConfigContext.Provider value={config}>
<ThemeProvider>
<ModalsProvider>
<GlobalStyles />
<div className="grafana-app">
<Router history={locationService.getHistory()}>
{newNavigationEnabled ? <NavBarNext /> : <NavBar />}
<main className="main-view">
{pageBanners.map((Banner, index) => (
<Banner key={index.toString()} />
))}
<AngularRoot ref={this.container} />
<AppNotificationList />
<SearchWrapper />
{this.state.ngInjector && this.renderRoutes()}
{bodyRenderHooks.map((Hook, index) => (
<Hook key={index.toString()} />
))}
</main>
</Router>
</div>
<LiveConnectionWarning />
<ModalRoot />
</ModalsProvider>
</ThemeProvider>
</ConfigContext.Provider>
</ErrorBoundaryAlert>
<AngularRoot ref={this.container} />
<AppNotificationList />
<SearchWrapper />
{this.state.ngInjector && this.renderRoutes()}
{bodyRenderHooks.map((Hook, index) => (
<Hook key={index.toString()} />
))}
</main>
</Router>
</div>
<LiveConnectionWarning />
<ModalRoot />
</ModalsProvider>
</ThemeProvider>
</ConfigContext.Provider>
</ErrorBoundaryAlert>
</I18nProvider>
</Provider>
);
}