Perform OpenID authentication

remote_frontend/src/App.tsx

@@ -1,4 +1,5 @@
 import { ServerApi } from "./api/ServerApi";
+import { AuthRouteWidget } from "./routes/AuthRouteWidget";
 import { AsyncWidget } from "./widgets/AsyncWidget";
 
 export function App() {
@@ -8,7 +9,13 @@ export function App() {
       errMsg="Failed to load server configuration!"
       load={ServerApi.LoadConfig}
       loadingMessage="Loading server configuration..."
-      build={() => <>todo</>}
+      build={() => <AppInner />}
     />
   );
 }
+
+function AppInner(): React.ReactElement {
+  if (!ServerApi.Config.authenticated && !ServerApi.Config.disable_auth)
+    return <AuthRouteWidget />;
+  return <>todo authenticated</>;
+}

remote_frontend/src/api/AuthApi.ts

@@ -0,0 +1,28 @@
+import { APIClient } from "./ApiClient";
+
+export class AuthApi {
+  /**
+   * Start OpenID login
+   */
+  static async StartOpenIDLogin(): Promise<{ url: string }> {
+    return (
+      await APIClient.exec({
+        uri: "/auth/start_oidc",
+        method: "GET",
+      })
+    ).data;
+  }
+
+  /**
+   * Finish OpenID login
+   */
+  static async FinishOpenIDLogin(code: string, state: string): Promise<void> {
+    await APIClient.exec({
+      uri: "/auth/finish_oidc",
+      method: "POST",
+      jsonData: { code: code, state: state },
+    });
+
+    window.location.href = "/";
+  }
+}

remote_frontend/src/routes/AuthRouteWidget.tsx

@@ -0,0 +1,46 @@
+import { AuthApi } from "../api/AuthApi";
+import { AsyncWidget } from "../widgets/AsyncWidget";
+
+export function AuthRouteWidget(): React.ReactElement {
+  const params = new URL(document.location.toString()).searchParams;
+  const code = params.get("code");
+  const state = params.get("state");
+
+  // Initiate OpenID login
+  if (!code || !state) return <InitOpenIDAuth />;
+
+  // Finish OpenID login
+  return <FinishOpenIDAuth code={code} state={state} />;
+}
+
+function InitOpenIDAuth() {
+  const load = async () => {
+    const res = await AuthApi.StartOpenIDLogin();
+    window.location.href = res.url;
+  };
+
+  return (
+    <AsyncWidget
+      loadingMessage="Preparing OpenID authentication"
+      errMsg="Failed to initiate OpenID authentication!"
+      load={load}
+      loadKey={1}
+      build={() => <>ready for auth</>}
+    />
+  );
+}
+
+function FinishOpenIDAuth(p: { code: string; state: string }) {
+  const load = async () => {
+    await AuthApi.FinishOpenIDLogin(p.code, p.state);
+  };
+  return (
+    <AsyncWidget
+      loadingMessage="Finishing authentication..."
+      errMsg="Failed to finish OpenID authentication!"
+      loadKey={1}
+      load={load}
+      build={() => <>Auth successfully finished. App should restart now.</>}
+    />
+  );
+}