feat: attempt login at home

src/App.tsx

@@ -66,7 +66,7 @@ export default function App() {
         <RemoveTrailingSlash />
         <Routes>
           <Route path="/">
-            <Route index element={<AuthIndicator controller={window.fastAuthController} />} />
+            <Route index element={<AuthIndicator />} />
             <Route path="login" element={<Login />} />
             <Route path="create-account" element={<CreateAccount />} />
             <Route path="add-device" element={<AddDevice />} />

src/components/AuthIndicator/AuthIndicator.tsx

@@ -1,23 +1,22 @@
-import * as React from 'react';
-import { useEffect, useState } from 'react';
+import React, { useEffect } from 'react';
+import { useNavigate } from 'react-router';
 
 import AuthIndicatorButton from './AuthIndicatorButton';
+import { useAuthState } from '../../lib/useAuthState';
 
-function AuthIndicator({ controller }) {
-  const [isSignedIn, setIsSignedIn] = useState<boolean>(false);
+function AuthIndicator() {
+  const { authenticated, controllerState } = useAuthState();
+  const navigate = useNavigate();
 
   useEffect(() => {
-    async function fetchSignedInStatus() {
-      const currentlySignedIn = await controller.isSignedIn();
-      setTimeout(() => setIsSignedIn(currentlySignedIn), 2000);
+    if (controllerState !== 'loading' && authenticated === false) {
+      navigate('/login');
     }
-
-    fetchSignedInStatus();
-  }, [controller]);
+  }, [authenticated, controllerState]);
 
   return (
-    <AuthIndicatorButton $buttonType="secondary" $isSignedIn={isSignedIn}>
-      {isSignedIn ? <p>signed in</p>
+    <AuthIndicatorButton $buttonType="secondary" $isSignedIn={authenticated && controllerState !== 'loading'}>
+      {authenticated ? <p>signed in</p>
         : <p>not signed in</p>}
     </AuthIndicatorButton>
   );