Add settings UI page (#171)

* Add theme colors from Figma

* Rough-in of AppHeader

* Add styled ActionButton

* Add react-router and placeholder Settings page

* Add ability to set persistent defaultDir

* Add react-hot-toast for save success message

* Add defaultProjectName setting

* Handle case of stale empty defaultDir in storage

* Wrap app in BrowserRouter

* Wrap test App in BrowserRouter

* Don't need BrowserRouter outside of testing
because we use RouterProvider

src/Auth.tsx

@@ -4,6 +4,24 @@ import withBaseUrl from './lib/withBaseURL'
 import { App } from './App'
 import { SetToken } from './components/TokenInput'
 import { useStore } from './useStore'
+import {
+  createBrowserRouter,
+  RouterProvider,
+} from "react-router-dom"
+import { ErrorPage } from './components/ErrorPage'
+import { Settings } from './routes/Settings'
+
+const router = createBrowserRouter([
+  {
+    path: "/",
+    element: <App />,
+    errorElement: <ErrorPage />,
+  },
+  {
+    path: "/settings",
+    element: <Settings />,
+  }
+])
 
 export const Auth = () => {
   const { data: user } = useSWR(withBaseUrl('/user'), fetcher) as any
@@ -37,5 +55,5 @@ export const Auth = () => {
     )
   }
 
-  return <App />
+  return <RouterProvider router={router} />
 }