fix default values when going back to start (#11)

* add border radius

* fix settings styling a little

* move hook

* get default values from localstorage

src/App.tsx

@@ -7,7 +7,7 @@ import { Player } from './Types/Player';
 
 import { ThemeProvider } from '@mui/material';
 import { theme } from './Data/theme';
-import { useAnalytics } from './Data/useAnalytics';
+import { useAnalytics } from './Hooks/useAnalytics';
 
 const GlobalStyles = createGlobalStyle`
   html,
@@ -19,12 +19,12 @@ const GlobalStyles = createGlobalStyle`
   }
 `;
 
-const RootWrapper2 = styled.div`
+const StartWrapper = styled.div`
   max-width: fit-content;
   max-height: fit-content;
 `;
 
-const RootWrapper = styled.div`
+const PlayWrapper = styled.div`
   max-width: fit-content;
   max-height: fit-content;
   @media (orientation: portrait) {
@@ -32,6 +32,12 @@ const RootWrapper = styled.div`
   }
 `;
 
+const removeLocalStorage = async () => {
+  localStorage.removeItem('initialGameSettings');
+  localStorage.removeItem('players');
+  localStorage.removeItem('playing');
+};
+
 const App = () => {
   const analytics = useAnalytics();
   const savedPlayers = localStorage.getItem('players');
@@ -61,18 +67,16 @@ const App = () => {
     setPlayers(updatedPlayers);
   };
 
-  const resetCurrentGame = () => {
+  const resetCurrentGame = async () => {
     const currentPlayers = localStorage.getItem('players');
     if (currentPlayers) {
       analytics.trackEvent('go_to_start', {
         playersBeforeReset: currentPlayers,
       });
     }
+    await removeLocalStorage();
 
     setPlayers([]);
-    localStorage.removeItem('players');
-    localStorage.removeItem('playing');
-    localStorage.removeItem('initialGameSettings');
   };
 
   return (
@@ -80,22 +84,22 @@ const App = () => {
       <GlobalStyles />
 
       {players.length > 0 && initialGameSettings ? (
-        <RootWrapper>
+        <PlayWrapper>
           <Play
             players={players}
             onPlayerChange={handlePlayerChange}
             gridAreas={initialGameSettings?.gridAreas}
             resetCurrentGame={resetCurrentGame}
           />
-        </RootWrapper>
+        </PlayWrapper>
       ) : (
-        <RootWrapper2>
+        <StartWrapper>
           <StartMenu
             initialGameSettings={initialGameSettings}
             setInitialGameSettings={setInitialGameSettings}
             setPlayers={setPlayers}
           />
-        </RootWrapper2>
+        </StartWrapper>
       )}
     </ThemeProvider>
   );