Fix Authelia OIDC: send state (+ remove login redirect hint) (#9)

Auth.js OIDC defaults to PKCE-only, so no `state` was sent; Authelia
rejects that. Enable checks: pkce + state. Remove the public redirect
URI hint from the login page.

Co-authored-by: Cursor Agent <[email protected]>

src/app/login/page.tsx

@@ -6,16 +6,10 @@ import { LoginPageClient } from "@/components/LoginPageClient";
 export const dynamic = "force-dynamic";
 
 export default function LoginPage() {
-  const authUrl = (process.env.AUTH_URL || "").replace(/\/$/, "");
-  const callbackUrlHint = authUrl
-    ? `${authUrl}/api/auth/callback/oidc`
-    : "https://<your-host>/api/auth/callback/oidc";
-
   return (
     <LoginPageClient
       oidcEnabled={isOidcConfigured()}
       oidcName={process.env.AUTH_OIDC_NAME || "SSO"}
-      callbackUrlHint={callbackUrlHint}
     />
   );
 }

src/components/LoginPageClient.tsx

@@ -8,13 +8,11 @@ import { Suspense } from "react";
 type Props = {
   oidcEnabled: boolean;
   oidcName: string;
-  callbackUrlHint: string;
 };
 
 type AuthConfig = {
   oidcEnabled: boolean;
   oidcName: string;
-  callbackUrl: string;
 };
 
 function authErrorMessage(code: string | null): string | null {
@@ -36,7 +34,7 @@ function authErrorMessage(code: string | null): string | null {
   }
 }
 
-function LoginForm({ oidcEnabled, oidcName, callbackUrlHint }: Props) {
+function LoginForm({ oidcEnabled, oidcName }: Props) {
   const router = useRouter();
   const params = useSearchParams();
   const callbackUrl = params.get("callbackUrl") || "/";
@@ -62,7 +60,6 @@ function LoginForm({ oidcEnabled, oidcName, callbackUrlHint }: Props) {
 
   const showOidc = runtimeOidc?.oidcEnabled ?? oidcEnabled;
   const displayName = runtimeOidc?.oidcName || oidcName;
-  const redirectHint = runtimeOidc?.callbackUrl || callbackUrlHint;
 
   async function onSubmit(e: FormEvent) {
     e.preventDefault();
@@ -121,20 +118,13 @@ function LoginForm({ oidcEnabled, oidcName, callbackUrlHint }: Props) {
           {loading ? "Signing in…" : "Sign in"}
         </button>
         {showOidc && (
-          <>
+          <button
-            <button
+            type="button"
-              type="button"
+            className="btn btn-secondary"
-              className="btn btn-secondary"
+            onClick={() => signIn("oidc", { callbackUrl })}
-              onClick={() => signIn("oidc", { callbackUrl })}
+          >
-            >
+            Sign in with {displayName}
-              Sign in with {displayName}
+          </button>
-            </button>
-            <p className="muted" style={{ margin: 0, fontSize: "0.75rem" }}>
-              IdP redirect URI must be exactly:
-              <br />
-              <code className="mono">{redirectHint}</code>
-            </p>
-          </>
         )}
       </form>
     </div>

src/lib/auth/auth.ts

@@ -45,6 +45,8 @@ function buildProviders(): Provider[] {
       wellKnown: `${issuer}/.well-known/openid-configuration`,
       clientId: process.env.AUTH_OIDC_CLIENT_ID!,
       clientSecret: process.env.AUTH_OIDC_CLIENT_SECRET!,
+      // Auth.js OIDC defaults to PKCE-only; Authelia requires a strong `state`
+      checks: ["pkce", "state"],
       authorization: {
         params: {
           scope: "openid email profile",