import { FunctionComponent } from "preact";
import { ErrorBoundary, lazy, LocationProvider, Route, Router, useLocation } from "preact-iso";
import "preact/debug";
import LoginPage from "./pages/login";
import { AppProvider } from "./providers/AuthProvider";

const HomePage: FunctionComponent = () => {
  const { route } = useLocation();
  route("/login");
  return <div>Redirecting to login...</div>;
};

export function App() {
  return (
    <AppProvider>
      <LocationProvider>
        <ErrorBoundary>
          <Router>
            <Route path="/" component={HomePage} />
            <Route path="/login" component={LoginPage} />
            <Route path="/profile/*" component={lazy(() => import("./pages/profile"))} />
            <Route default component={() => <h1>404</h1>} />
          </Router>
        </ErrorBoundary>
      </LocationProvider>
    </AppProvider>
  );
}