From a91df1b61b291f91b6a556a089c03715c11efb61 Mon Sep 17 00:00:00 2001
From: thomasrosen <thomas.rosen@me.com>
Date: Thu, 29 Apr 2021 09:50:40 +0200
Subject: [PATCH] moved language chooser into the main app component

---
 src/App.css |  2 +-
 src/App.js  | 42 ++++++++++++++++++++++--------------------
 2 files changed, 23 insertions(+), 21 deletions(-)

diff --git a/src/App.css b/src/App.css
index 9724012..6bb86c0 100644
--- a/src/App.css
+++ b/src/App.css
@@ -23,7 +23,7 @@ footer{
 }
 
 .locale_chooser{
-    margin: -8vmin 10vmin 10vmin 10vmin;
+    margin: 10vmin;
     text-align: center;
 }
 
diff --git a/src/App.js b/src/App.js
index ffd147f..4420a7f 100644
--- a/src/App.js
+++ b/src/App.js
@@ -101,7 +101,7 @@ function UmamiLink({ href, name, target, children, ...props }) {
     </a>
 }
 
-function App({ getString }) {
+function App({ getString, locales, currentLocale, onLanguageChange }) {
     const [frame, setFrame] = useState(null)
     const [hashtag, setHashtag] = useState(null)
     const [originalPhoto, setOriginalPhoto] = useState(null)
@@ -382,6 +382,26 @@ function App({ getString }) {
                     <Localized id="link_app_contact" />
                 </UmamiLink>
             </footer>
+
+            {
+                !!locales && !!onLanguageChange
+                ? <div className="locale_chooser">
+                    {
+                        Object.entries(locales)
+                        .map(([locale, name]) => {
+                            return <button
+                                className={locale === currentLocale ? 'isInRow choosen' : 'isInRow'}
+                                key={locale}
+                                data-locale={locale}
+                                onClick={onLanguageChange}
+                            >
+                                {name}
+                            </button>
+                        })
+                    }
+                </div>
+                : null
+            }
         </div>
     )
 }
@@ -414,25 +434,7 @@ function AppWrapper() {
         userLocales={userLocales}
         onLocaleChange={handleCurrentLocalesChange}
     >
-        <>
-            <AppLocalized />
-
-            <div className="locale_chooser">
-                {
-                    Object.entries(locales)
-                    .map(([locale, name]) => {
-                        return <button
-                            className={locale === currentLocale ? 'isInRow choosen' : 'isInRow'}
-                            key={locale}
-                            data-locale={locale}
-                            onClick={handleLanguageChange}
-                        >
-                            {name}
-                        </button>
-                    })
-                }
-            </div>
-        </>
+        <AppLocalized locales={locales} currentLocale={currentLocale} onLanguageChange={handleLanguageChange} />
     </AppLocalizationProvider>
 }
 export default withLocalization(AppWrapper)