connect theme toggle

src/app/UserWrapper.tsx

@@ -6,7 +6,7 @@ import { useUserAPI } from '../providers/pond/userAPI'
 import { useAuth0 } from '@auth0/auth0-react'
 import { or } from '../utils/types'
 import LoadingScreen from './LoadingScreen'
-import { pond } from "protobuf-ts/pond";
+// import { pond } from "protobuf-ts/pond";
 import NavigationContainer from '../navigation/NavigationContainer'
 import { GlobalState, GlobalStateAction, StateProvider } from '../providers/StateContainer'
 import { User } from '../models/user'
@@ -28,14 +28,19 @@ const globalDefault = {
   backgroundTasksComplete: false
 }
 
-export default function UserWrapper() {
+interface Props {
+  toggleTheme: () => void;
+}
+
+export default function UserWrapper(props: Props) {
+  const { toggleTheme } = props;
   const [count, setCount] = useState(0)
   const [loading, setLoading] = useState(false)
   const userAPI = useUserAPI();
   const useAuth = useAuth0();
   const hasFetched = useRef(false);
   // const [user, setUser] = useState<pond.User | undefined>(undefined)
-  const [message, setMessage] = useState("Loading user profile...")
+  // const [message, setMessage] = useState("Loading user profile...")
   const [global, setGlobal] = useState<undefined | GlobalState>(undefined)
 
   let user_id = or(useAuth.user?.sub, "")
@@ -72,14 +77,12 @@ export default function UserWrapper() {
   console.log(loading)
   console.log(global)
   if (loading || !global) return (
-    <LoadingScreen
-      message={message}
-    />
+    <LoadingScreen />
   )
 
   return (
     <StateProvider state={global} reducer={reducer}>
-      <NavigationContainer>
+      <NavigationContainer toggleTheme={toggleTheme}>
         <div>
           <a href="https://vitejs.dev" target="_blank">
               <img src={viteLogo} className="logo" alt="Vite logo" />