Skip to content
Snippets Groups Projects
Commit 50540412 authored by Sivert Kronen Hatteberg's avatar Sivert Kronen Hatteberg
Browse files

Show a loading msg if the translations are still being loaded 

Issue: GREG-37
parent 370b5140
No related branches found
No related tags found
1 merge request!46i18next support
Pipeline #92472 passed
Stage: test
    Hide whitespace changes
    Inline Side-by-side
    Showing
    with 41 additions and 34 deletions
    frontend/src/App.tsx
    + 41
    − 34
    View file @ 50540412
    import React, { useState } from 'react'; import React, { useState, Suspense } from 'react';
    import { useTranslation } from 'react-i18next'; import { useTranslation } from 'react-i18next';
    import './App.css'; import './App.css';
    ...@@ -31,41 +31,48 @@ const App = () => { ...@@ -31,41 +31,48 @@ const App = () => {
    } }
    return ( return (
    <div className="App"> <Suspense fallback="loading">
    <header className="App-header"> <div className="App">
    <Button href="https://example.com" target="_blank" rel="noopener"> <header className="App-header">
    Knapp <Button href="https://example.com" target="_blank" rel="noopener">
    </Button> Knapp
    <Button href="https://example.com" target="_blank" rel="noopener" pink> </Button>
    Rosa knapp <Button
    </Button> href="https://example.com"
    target="_blank"
    rel="noopener"
    pink
    >
    Rosa knapp
    </Button>
    <p>{t('common:test')}</p> <p>{t('common:test')}</p>
    <p>{t('common:nested.test')}</p> <p>{t('common:nested.test')}</p>
    <p>{t('footer:footerInfo')}</p> <p>{t('footer:footerInfo')}</p>
    <Button <Button
    onClick={() => onClick={() =>
    i18n.language === 'en' i18n.language === 'en'
    ? i18n.changeLanguage('nb') ? i18n.changeLanguage('nb')
    : i18n.changeLanguage('en') : i18n.changeLanguage('en')
    } }
    > >
    {t('common:language.change', { {t('common:language.change', {
    lang: i18n.language === 'en' ? 'Norsk' : 'Engelsk', lang: i18n.language === 'en' ? 'Norsk' : 'Engelsk',
    })} })}
    </Button> </Button>
    <p> <p>
    Version {appVersion} Version {appVersion}
    <br /> <br />
    Timezone {appTimezone} Timezone {appTimezone}
    <br /> <br />
    Theme {appTheme} Theme {appTheme}
    <br /> <br />
    API reachable? {apiHealth} API reachable? {apiHealth}
    </p> </p>
    </header> </header>
    </div> </div>
    </Suspense>
    ); );
    }; };
    ......
    0% or .
    You are about to add 0 people to the discussion. Proceed with caution.
    Finish editing this message first!
    Please register or to comment