Support anonyomous logins

streamshub · Aug 9, 2024 · 82d5689 · 82d5689
1 parent 118eed4
commit 82d5689
Show file tree

Hide file tree

Showing 4 changed files with 51 additions and 37 deletions.
diff --git a/ui/api/kafka/actions.ts b/ui/api/kafka/actions.ts
@@ -41,7 +41,9 @@ export async function getKafkaClusters(): Promise<ClusterList[]> {
         Accept: "application/json",
         "Content-Type": "application/json",
       },
-      cache: "reload",
+      next: {
+        revalidate: 30,
+      },
     });
     const rawData = await res.json();
     log.trace(rawData, "getKafkaClusters response");

diff --git a/ui/app/[locale]/(public)/kafka/[kafkaId]/login/SignInPage.tsx b/ui/app/[locale]/(public)/kafka/[kafkaId]/login/SignInPage.tsx
@@ -3,6 +3,7 @@ import { ExternalLink } from "@/components/Navigation/ExternalLink";
 import { Link } from "@/navigation";
 import {
   Alert,
+  Button,
   LoginForm,
   LoginFormProps,
   LoginMainFooterBandItem,
@@ -46,7 +47,7 @@ export function SignInPage({
   callbackUrl,
   hasMultipleClusters,
 }: {
-  provider: "credentials" | "oauth-token";
+  provider: "credentials" | "oauth-token" | "anonymous";
   callbackUrl: string;
   hasMultipleClusters: boolean;
 }) {
@@ -83,26 +84,33 @@ export function SignInPage({
     </LoginMainFooterBandItem>
   );
 
-  const onSubmit: LoginFormProps["onSubmit"] = async (e) => {
-    e.preventDefault();
-    e.stopPropagation();
+  const doLogin = async () => {
     setIsSubmitting(true);
     setError(undefined);
-    const options =
-      provider === "credentials"
-        ? { username, password }
-        : { clientId: username, secret: password };
+    const options = {
+      credentials: { username, password },
+      "oauth-token": { clientId: username, secret: password },
+      anonymous: {},
+    }[provider];
     const res = await signIn(provider, {
       ...options,
       redirect: false,
     });
     if (res?.error) {
       const error = signinErrors[res.error] ?? signinErrors.default;
       setError(error);
+      setIsSubmitting(false);
     } else if (res?.ok) {
       window.location.href = callbackUrl;
+    } else {
+      setIsSubmitting(false);
     }
-    setIsSubmitting(false);
+  };
+
+  const onSubmit: LoginFormProps["onSubmit"] = (e) => {
+    e.preventDefault();
+    e.stopPropagation();
+    void doLogin();
   };
 
   const usernameLabel =
@@ -132,17 +140,22 @@ export function SignInPage({
       {error && isSubmitting === false && (
         <Alert variant={"danger"} isInline={true} title={error} />
       )}
-      <LoginForm
-        usernameLabel={usernameLabel}
-        passwordLabel={passwordLabel}
-        loginButtonLabel={t("login-in-page.login_button")}
-        usernameValue={username}
-        passwordValue={password}
-        onChangeUsername={handleUsernameChange}
-        onChangePassword={handlePasswordChange}
-        onSubmit={onSubmit}
-        isLoginButtonDisabled={isSubmitting}
-      />
+
+      {provider === "anonymous" ? (
+        <Button onClick={doLogin}>Click to login anonymously</Button>
+      ) : (
+        <LoginForm
+          usernameLabel={usernameLabel}
+          passwordLabel={passwordLabel}
+          loginButtonLabel={t("login-in-page.login_button")}
+          usernameValue={username}
+          passwordValue={password}
+          onChangeUsername={handleUsernameChange}
+          onChangePassword={handlePasswordChange}
+          onSubmit={onSubmit}
+          isLoginButtonDisabled={isSubmitting}
+        />
+      )}
     </LoginPage>
   );
 }
diff --git a/ui/app/[locale]/(public)/kafka/[kafkaId]/login/page.tsx b/ui/app/[locale]/(public)/kafka/[kafkaId]/login/page.tsx
@@ -15,21 +15,20 @@ export default async function SignIn({
   const cluster = clusters.find((c) => c.id === params.kafkaId);
   if (cluster) {
     const authMethod = cluster.meta.authentication;
-    if (authMethod && authMethod.method !== "anonymous") {
-      return (
-        <SignInPage
-          provider={
-            authMethod?.method === "basic" ? "credentials" : "oauth-token"
-          }
-          callbackUrl={
-            searchParams?.callbackUrl ?? `/kafka/${params.kafkaId}/overview`
-          }
-          hasMultipleClusters={clusters.length > 1}
-        />
-      );
-    } else {
-      return <>TODO</>;
-    }
+    const provider = {
+      basic: "credentials" as const,
+      oauth: "oauth-token" as const,
+      anonymous: "anonymous" as const,
+    }[authMethod?.method ?? "anonymous"];
+    return (
+      <SignInPage
+        provider={provider}
+        callbackUrl={
+          searchParams?.callbackUrl ?? `/kafka/${params.kafkaId}/overview`
+        }
+        hasMultipleClusters={clusters.length > 1}
+      />
+    );
   }
   return redirect("/");
 }
diff --git a/ui/app/api/auth/[...nextauth]/anonymous.ts b/ui/app/api/auth/[...nextauth]/anonymous.ts
@@ -4,7 +4,7 @@ import { Provider } from "next-auth/providers/index";
 
 export function makeAnonymous(): Provider {
   const provider = CredentialsProvider({
-    name: "Unauthenticated",
+    id: "anonymous",
     credentials: {},
     async authorize() {
       return { id: "1", name: "Anonymous", email: "[email protected]" };