fixed some theming stuff, buttons highlight correctly now

src/app/App.tsx

@@ -0,0 +1,59 @@
+import { Auth0Provider } from '@auth0/auth0-react'
+import { or } from '../utils/types'
+import AuthWrapper from '../providers/auth'
+import HTTPProvider from 'providers/http'
+import { useState } from 'react'
+import LoadingScreen from './LoadingScreen'
+import UserWrapper from './UserWrapper'
+import { Theme, ThemeProvider } from '@mui/material'
+import { CreateTheme } from '../theme/theme'
+import { getThemeType, setThemeType } from '../theme/themeType'
+
+function App() {
+  const [token, setToken] = useState<string | undefined>(undefined)
+  const [palette, setPalette] = useState<Theme>(CreateTheme(getThemeType()));
+
+  let url: string | undefined = import.meta.env.VITE_AUTH0_CLIENT_DOMAIN;
+  let audience: string | undefined = import.meta.env.VITE_AUTH0_AUDIENCE;
+
+  let client_id = import.meta.env.VITE_AUTH0_DEV_CLIENT_ID;
+
+  const toggleTheme = () => {
+    if (getThemeType() === "light") {
+      setPalette(CreateTheme("dark"));
+      setThemeType("dark");
+    } else {
+      setPalette(CreateTheme("light"));
+      setThemeType("light");
+    }
+  };
+
+  return (
+    <Auth0Provider
+      domain={or(url, "")}
+      clientId={or(client_id, "")}
+      authorizationParams={{
+        audience: or(audience, ""),
+        redirect_uri: window.location.origin + "/callback"
+      }}
+      useRefreshTokens={true}
+      cacheLocation='localstorage'
+    >
+      <ThemeProvider theme={palette}>
+        <AuthWrapper setToken={setToken}>
+          { token ? 
+            <HTTPProvider token={token}>
+              <UserWrapper toggleTheme={toggleTheme}/>
+            </HTTPProvider>
+          :
+            <LoadingScreen
+              message='Loading user profile'
+            />
+          }
+        </AuthWrapper>
+      </ThemeProvider>
+    </Auth0Provider>
+  )
+}
+
+export default App