console,environmentd: surface OIDC sign-in failures on the login page

* Add `OidcCallback` route component so IdP callback errors render
  instead of an indefinite loading spinner.
* Add `AuthError::OidcFailed` carrying the sanitized `OidcError::Display`
  in the 401 body, so environmentd token rejections can be surfaced to
  the user without leaking internal config.
* Wire the 401 interceptor to post a one-shot `{reason, detail}` message
  to `sessionStorage`; the login page renders it as an `Alert`

Author: leedqin

console/src/api/apiClient.ts

@@ -20,6 +20,7 @@ import {
 } from "~/config/AppConfig";
 import { ContextHolder } from "~/external-library-wrappers/frontegg";
 import { MzOidcUserManager } from "~/external-library-wrappers/oidc";
+import { formatLoginErrorForOIDC, readAuthErrorDetail } from "~/utils/oidcAuth";
 
 import { logoutAndRedirect } from "./materialize/auth";
 import {
@@ -177,9 +178,17 @@ export class SelfManagedApiClient
 
   #mzApiWithAuthRedirect = async (...req: Parameters<Fetch>) => {
     const response = await globalFetch(...req);
-    // If the user is not authenticated, we redirect to the login page.
     if (response.status === 401) {
-      await logoutAndRedirect({ apiClient: this });
+      const reason =
+        this.authMode === "Oidc"
+          ? formatLoginErrorForOIDC(req[0])
+          : "session_expired";
+      const detail =
+        reason === "auth_rejected"
+          ? await readAuthErrorDetail(response)
+          : undefined;
+      const message = reason ? { reason, detail } : undefined;
+      await logoutAndRedirect({ apiClient: this, message });
     }
     return response;
   };

console/src/api/materialize/auth.ts

@@ -8,6 +8,10 @@
 // by the Apache License, Version 2.0.
 
 import { NOT_SUPPORTED_MESSAGE } from "~/config/AppConfig";
+import {
+  LOGIN_REDIRECT_MESSAGE_KEY,
+  type LoginRedirectMessage,
+} from "~/platform/auth/constants";
 
 import { apiClient, type SelfManagedApiClient } from "../apiClient";
 
@@ -83,8 +87,20 @@ export async function logout(logoutParams: {
 
 export async function logoutAndRedirect(logoutParams: {
   apiClient: SelfManagedApiClient;
+  message?: LoginRedirectMessage;
 }) {
   logout(logoutParams);
+  if (logoutParams.message) {
+    try {
+      sessionStorage.setItem(
+        LOGIN_REDIRECT_MESSAGE_KEY,
+        JSON.stringify(logoutParams.message),
+      );
+    } catch {
+      // Storage unavailable (private browsing, quota). Fall through to a
+      // silent redirect.
+    }
+  }
   window.location.href = LOGIN_PATH;
 }
 

console/src/platform/UnauthenticatedRoutes.tsx

@@ -22,6 +22,7 @@ import { AuthenticatedRoutes } from "~/platform/AuthenticatedRoutes";
 import { SentryRoutes } from "~/sentry";
 
 import { Login } from "./auth/Login";
+import { OidcCallback } from "./auth/OidcCallback";
 
 const OidcAuthGuard = ({ children }: React.PropsWithChildren) => {
   const auth = useAuth();
@@ -47,7 +48,7 @@ const SelfManagedRoutes = ({
       {(appConfig.authMode === "Password" ||
         appConfig.authMode === "Sasl" ||
         isOidc) && <Route path={LOGIN_PATH} element={<Login />} />}
-      {isOidc && <Route path="/auth/callback" element={<LoadingScreen />} />}
+      {isOidc && <Route path="/auth/callback" element={<OidcCallback />} />}
       <Route
         path="*"
         element={

console/src/platform/auth/Login.tsx

@@ -36,6 +36,42 @@ import EyeClosedIcon from "~/svg/EyeClosedIcon";
 import EyeOpenIcon from "~/svg/EyeOpenIcon";
 import { MaterializeTheme } from "~/theme";
 
+import {
+  buildAuthRejectedMessage,
+  LOGIN_REASON_MESSAGES,
+  LOGIN_REDIRECT_MESSAGE_KEY,
+  type LoginRedirectMessage,
+} from "./constants";
+
+const isLoginRedirectMessage = (
+  value: unknown,
+): value is LoginRedirectMessage => {
+  if (typeof value !== "object" || value === null) return false;
+  const v = value as { reason?: unknown; detail?: unknown };
+  const validReason =
+    v.reason === "auth_rejected" || v.reason === "session_expired";
+  const validDetail = v.detail === undefined || typeof v.detail === "string";
+  return validReason && validDetail;
+};
+
+/** Reads and clears the one-shot message set by {@link logoutAndRedirect}. */
+const consumeLoginRedirectMessage = (): LoginRedirectMessage | null => {
+  let raw: string | null = null;
+  try {
+    raw = sessionStorage.getItem(LOGIN_REDIRECT_MESSAGE_KEY);
+    sessionStorage.removeItem(LOGIN_REDIRECT_MESSAGE_KEY);
+  } catch {
+    return null;
+  }
+  if (!raw) return null;
+  try {
+    const parsed: unknown = JSON.parse(raw);
+    return isLoginRedirectMessage(parsed) ? parsed : null;
+  } catch {
+    return null;
+  }
+};
+
 type LoginFormState = {
   username: string;
 
@@ -186,13 +222,32 @@ export const Login = () => {
   const isOidc =
     appConfig.mode === "self-managed" && appConfig.authMode === "Oidc";
 
+  // Consume once on mount so a manual refresh of the login page clears it.
+  const [redirectMessage] = useState(consumeLoginRedirectMessage);
+  const reasonMessage =
+    redirectMessage?.reason === "auth_rejected"
+      ? buildAuthRejectedMessage(redirectMessage.detail ?? null)
+      : redirectMessage
+        ? LOGIN_REASON_MESSAGES[redirectMessage.reason]
+        : null;
+
   return (
     <AuthLayout>
       <AuthContentContainer>
         <VStack alignItems="stretch" width="100%" mx="12">
           <HStack my={{ base: "8", lg: "0" }} paddingBottom="8">
             <MaterializeLogo height="12" />
           </HStack>
+          {reasonMessage && (
+            <Alert
+              variant={
+                redirectMessage?.reason === "auth_rejected" ? "error" : "info"
+              }
+              minWidth="100%"
+              message={reasonMessage}
+              mb="4"
+            />
+          )}
           <PasswordLoginForm />
           {isOidc && <SsoLoginLink />}
         </VStack>

console/src/platform/auth/OidcCallback.tsx

@@ -0,0 +1,53 @@
+// Copyright Materialize, Inc. and contributors. All rights reserved.
+//
+// Use of this software is governed by the Business Source License
+// included in the LICENSE file.
+//
+// As of the Change Date specified in that file, in accordance with
+// the Business Source License, use of this software will be governed
+// by the Apache License, Version 2.0.
+
+import { Heading, HStack, Text, VStack } from "@chakra-ui/react";
+import React from "react";
+import { Link as RouterLink } from "react-router-dom";
+
+import { LOGIN_PATH } from "~/api/materialize/auth";
+import Alert from "~/components/Alert";
+import LoadingScreen from "~/components/LoadingScreen";
+import { MaterializeLogo } from "~/components/MaterializeLogo";
+import { useAuth } from "~/external-library-wrappers/oidc";
+import { AuthContentContainer, AuthLayout } from "~/layouts/AuthLayout";
+
+// Surfaces OIDC callback errors (access_denied, state mismatch, etc.)
+export const OidcCallback = () => {
+  const auth = useAuth();
+
+  if (!auth.error) return <LoadingScreen />;
+
+  return (
+    <AuthLayout>
+      <AuthContentContainer>
+        <VStack alignItems="stretch" width="100%" mx="12">
+          <HStack my={{ base: "8", lg: "0" }} paddingBottom="8">
+            <MaterializeLogo height="12" />
+          </HStack>
+          <VStack alignItems="stretch" spacing="2" paddingBottom="6">
+            <Heading size="md">Sign-in failed</Heading>
+            <Text fontSize="sm">
+              We couldn&apos;t complete your sign-in with your identity
+              provider. If this keeps happening, confirm you&apos;ve been
+              granted access to Materialize.
+            </Text>
+          </VStack>
+          <Alert
+            variant="error"
+            message={auth.error.message || "Sign-in failed. Please try again."}
+            showButton
+            buttonText="Back to sign in"
+            buttonProps={{ as: RouterLink, to: LOGIN_PATH, replace: true }}
+          />
+        </VStack>
+      </AuthContentContainer>
+    </AuthLayout>
+  );
+};

console/src/platform/auth/constants.ts

@@ -0,0 +1,34 @@
+// Copyright Materialize, Inc. and contributors. All rights reserved.
+//
+// Use of this software is governed by the Business Source License
+// included in the LICENSE file.
+//
+// As of the Change Date specified in that file, in accordance with
+// the Business Source License, use of this software will be governed
+// by the Apache License, Version 2.0.
+
+// `sessionStorage` key used to pass a one-shot message across the redirect
+// that the login page reads and immediately clears.
+export const LOGIN_REDIRECT_MESSAGE_KEY = "mz.loginRedirectMessage";
+
+export type LoginReason = "auth_rejected" | "session_expired";
+
+export type LoginRedirectMessage = {
+  reason: LoginReason;
+  detail?: string;
+};
+
+const AUTH_REJECTED_SUFFIX =
+  " Please try again, or contact your administrator if this persists.";
+
+export const LOGIN_REASON_MESSAGES: Record<LoginReason, string> = {
+  auth_rejected: `Sign-in was rejected.${AUTH_REJECTED_SUFFIX}`,
+  session_expired: "Your previous session ended. Please sign in again.",
+};
+
+/** Embeds the sanitized server-side detail (e.g. "invalid audience") into the
+ * rejected-login copy. */
+export const buildAuthRejectedMessage = (detail: string | null): string => {
+  if (!detail) return LOGIN_REASON_MESSAGES.auth_rejected;
+  return `Sign-in was rejected: ${detail}.${AUTH_REJECTED_SUFFIX}`;
+};

console/src/utils/oidcAuth.ts

@@ -0,0 +1,35 @@
+// Copyright Materialize, Inc. and contributors. All rights reserved.
+//
+// Use of this software is governed by the Business Source License
+// included in the LICENSE file.
+//
+// As of the Change Date specified in that file, in accordance with
+// the Business Source License, use of this software will be governed
+// by the Apache License, Version 2.0.
+
+import { type LoginReason } from "~/platform/auth/constants";
+
+// Cap on the forwarded OIDC detail so a malformed 401 body can't bloat the URL.
+const MAX_AUTH_DETAIL_LENGTH = 200;
+
+const hasBearer = (input: Parameters<typeof fetch>[0]): boolean =>
+  input instanceof Request &&
+  (input.headers.get("Authorization")?.startsWith("Bearer ") ?? false);
+
+/** Reads the sanitized `OidcError::Display` environmentd returns for OIDC 401s. */
+export const readAuthErrorDetail = async (
+  response: Response,
+): Promise<string | undefined> => {
+  try {
+    const body = (await response.clone().text()).trim();
+    if (!body || body === "unauthorized") return undefined;
+    return body.slice(0, MAX_AUTH_DETAIL_LENGTH);
+  } catch {
+    return undefined;
+  }
+};
+
+// Returns `auth_rejected` only when a Bearer was sent.
+export const formatLoginErrorForOIDC = (
+  input: Parameters<typeof fetch>[0],
+): LoginReason | undefined => (hasBearer(input) ? "auth_rejected" : undefined);

src/environmentd/src/http.rs

@@ -854,26 +854,33 @@ pub(crate) enum AuthError {
     FailedToUpdateSession,
     #[error("invalid credentials")]
     InvalidCredentials,
+    /// Payload is `OidcError`'s sanitized `Display` (no expected-values leaks).
+    #[error("{0}")]
+    OidcFailed(String),
 }
 
 impl IntoResponse for AuthError {
     fn into_response(self) -> Response {
         warn!("HTTP request failed authentication: {}", self);
         let mut headers = HeaderMap::new();
-        match self {
+        // We omit most detail from the error message we send to the client, to
+        // avoid giving attackers unnecessary information. `OidcFailed` is the
+        // exception — its payload is a sanitized `OidcError::Display` that the
+        // console embeds in the login-page error.
+        let body = match &self {
             AuthError::MissingHttpAuthentication {
                 include_www_authenticate_header,
-            } if include_www_authenticate_header => {
+            } if *include_www_authenticate_header => {
                 headers.insert(
                     http::header::WWW_AUTHENTICATE,
                     HeaderValue::from_static("Basic realm=Materialize"),
                 );
+                "unauthorized".to_string()
             }
-            _ => {}
+            AuthError::OidcFailed(message) => message.clone(),
+            _ => "unauthorized".to_string(),
         };
-        // We omit most detail from the error message we send to the client, to
-        // avoid giving attackers unnecessary information.
-        (StatusCode::UNAUTHORIZED, headers, "unauthorized").into_response()
+        (StatusCode::UNAUTHORIZED, headers, body).into_response()
     }
 }
 
@@ -1241,11 +1248,10 @@ async fn auth(
         }
         Authenticator::Oidc(oidc) => match creds {
             Some(Credentials::Token { token }) => {
-                // Validate JWT token
                 let (mut claims, authenticated) = oidc
                     .authenticate(&token, None)
                     .await
-                    .map_err(|_| AuthError::InvalidCredentials)?;
+                    .map_err(|e| AuthError::OidcFailed(e.to_string()))?;
                 let name = std::mem::take(&mut claims.user);
                 (name, None, authenticated)
             }