GeneIT/geneit_app/src/App.tsx

import React from "react";
import { Route, Routes } from "react-router-dom";
import "./App.css";
import { AuthApi } from "./api/AuthApi";
import { DeleteAccountRoute } from "./routes/DeleteAccountRoute";
import { FamiliesListRoute } from "./routes/FamiliesListRoute";
import { NotFoundRoute } from "./routes/NotFound";
import { ProfileRoute } from "./routes/ProfileRoute";
import { LoginRoute } from "./routes/auth/LoginRoute";
import { NewAccountRoute } from "./routes/auth/NewAccountRoute";
import { OIDCCbRoute } from "./routes/auth/OIDCCbRoute";
import { PasswordForgottenRoute } from "./routes/auth/PasswordForgottenRoute";
import { ResetPasswordRoute } from "./routes/auth/ResetPasswordRoute";
import { FamilyHomeRoute } from "./routes/family/FamilyHomeRoute";
import { BaseAuthenticatedPage } from "./widgets/BaseAuthenticatedPage";
import { BaseFamilyRoute } from "./widgets/BaseFamilyRoute";
import { BaseLoginPage } from "./widgets/BaseLoginpage";
import { FamilyUsersListRoute } from "./routes/family/FamilyUsersListRoute";

interface AuthContext {
  signedIn: boolean;
  setSignedIn: (signedIn: boolean) => void;
}

const AuthContextK = React.createContext<AuthContext | null>(null);

/**
 * Core app
 */
export function App(): React.ReactElement {
  const [signedIn, setSignedIn] = React.useState(AuthApi.SignedIn);

  const context: AuthContext = {
    signedIn: signedIn,
    setSignedIn: (s) => setSignedIn(s),
  };

  return (
    <AuthContextK.Provider value={context}>
      <Routes>
        <Route path="delete_account" element={<DeleteAccountRoute />} />

        {signedIn ? (
          <Route path="*" element={<BaseAuthenticatedPage />}>
            <Route path="" element={<FamiliesListRoute />} />
            <Route path="profile" element={<ProfileRoute />} />
            <Route path="family/:familyId/*" element={<BaseFamilyRoute />}>
              <Route path="" element={<FamilyHomeRoute />} />
              <Route path="users" element={<FamilyUsersListRoute />} />
              <Route path="*" element={<NotFoundRoute />} />
            </Route>
            <Route path="*" element={<NotFoundRoute />} />
          </Route>
        ) : (
          <Route path="*" element={<BaseLoginPage />}>
            <Route path="" element={<LoginRoute />} />
            <Route path="oidc_cb" element={<OIDCCbRoute />} />
            <Route path="new-account" element={<NewAccountRoute />} />
            <Route
              path="password_forgotten"
              element={<PasswordForgottenRoute />}
            />
            <Route path="reset_password" element={<ResetPasswordRoute />} />
            <Route path="*" element={<NotFoundRoute />} />
          </Route>
        )}
      </Routes>
    </AuthContextK.Provider>
  );
}

export function useAuth(): AuthContext {
  return React.useContext(AuthContextK)!;
}