Route OIDC failures through shared auth error page

A dedicated personal-account page does not scale as more refusal
reasons appear. Redirect the OIDC callback to /auth/error with an
error code query parameter so the frontend can map codes to clear
user-facing messages.

Signed-off-by: Cursor Agent <cursoragent@cursor.com>

Co-authored-by: Bryan FRIMIN <bryan@frimin.fr>

apps/console/src/pages/iam/auth/AuthErrorPage.tsx

@@ -21,21 +21,46 @@
 import { usePageTitle } from "@probo/hooks";
 import { useTranslate } from "@probo/i18n";
 import { Button } from "@probo/ui";
+import { useSearchParams } from "react-router";
 
-export default function PersonalAccountNotAllowedPage() {
+type AuthErrorContent = {
+  title: string;
+  description: string;
+};
+
+function useAuthErrorContent(code: string | null): AuthErrorContent {
   const { __ } = useTranslate();
 
-  usePageTitle(__("Enterprise account required"));
+  switch (code) {
+    case "personal_account_not_allowed":
+      return {
+        title: __("Enterprise account required"),
+        description: __(
+          "Personal Google and Microsoft accounts cannot be used to sign in. Please use your work or school account instead.",
+        ),
+      };
+    default:
+      return {
+        title: __("Authentication failed"),
+        description: __(
+          "We could not complete your sign-in. Please try again.",
+        ),
+      };
+  }
+}
+
+export default function AuthErrorPage() {
+  const { __ } = useTranslate();
+  const [searchParams] = useSearchParams();
+  const content = useAuthErrorContent(searchParams.get("error"));
+
+  usePageTitle(content.title);
 
   return (
     <div className="space-y-6 w-full">
       <div className="space-y-2 text-center">
-        <h1 className="text-2xl font-bold">{__("Enterprise account required")}</h1>
-        <p className="text-txt-tertiary">
-          {__(
-            "Personal Google and Microsoft accounts cannot be used to sign in. Please use your work or school account instead.",
-          )}
-        </p>
+        <h1 className="text-2xl font-bold">{content.title}</h1>
+        <p className="text-txt-tertiary">{content.description}</p>
       </div>
       <Button className="w-full h-10" to="/auth/login">
         {__("Sign in")}

apps/console/src/routes.tsx

@@ -128,10 +128,8 @@ const routes = [
         Component: lazy(() => import("./pages/iam/auth/MagicLinkAlreadyUsedPage")),
       },
       {
-        path: "personal-account-not-allowed",
-        Component: lazy(
-          () => import("./pages/iam/auth/PersonalAccountNotAllowedPage"),
-        ),
+        path: "error",
+        Component: lazy(() => import("./pages/iam/auth/AuthErrorPage")),
       },
     ],
   },