diff --git a/.env.example b/.env.example index 4cbd157..0c31214 100644 --- a/.env.example +++ b/.env.example @@ -123,7 +123,26 @@ OTEL_SERVICE_NAME=mosaic-gateway # TELEGRAM_GATEWAY_URL=http://localhost:4000 -# ─── Authentik SSO (optional — set AUTHENTIK_CLIENT_ID to enable) ──────────── +# ─── SSO Providers (add credentials to enable) ─────────────────────────────── + +# --- Authentik (optional — set AUTHENTIK_CLIENT_ID to enable) --- # AUTHENTIK_ISSUER=https://auth.example.com/application/o/mosaic/ # AUTHENTIK_CLIENT_ID= # AUTHENTIK_CLIENT_SECRET= + +# --- WorkOS (optional — set WORKOS_CLIENT_ID to enable) --- +# WORKOS_ISSUER=https://your-company.authkit.app +# WORKOS_CLIENT_ID=client_... +# WORKOS_CLIENT_SECRET=sk_live_... + +# --- Keycloak (optional — set KEYCLOAK_CLIENT_ID to enable) --- +# KEYCLOAK_ISSUER=https://auth.example.com/realms/master +# Legacy alternative if you prefer to compose the issuer from separate vars: +# KEYCLOAK_URL=https://auth.example.com +# KEYCLOAK_REALM=master +# KEYCLOAK_CLIENT_ID=mosaic +# KEYCLOAK_CLIENT_SECRET= + +# Feature flags — set to true alongside provider credentials to show SSO buttons in the UI +# NEXT_PUBLIC_WORKOS_ENABLED=true +# NEXT_PUBLIC_KEYCLOAK_ENABLED=true diff --git a/apps/web/src/app/(auth)/login/page.tsx b/apps/web/src/app/(auth)/login/page.tsx index b01d04f..9dfd8d4 100644 --- a/apps/web/src/app/(auth)/login/page.tsx +++ b/apps/web/src/app/(auth)/login/page.tsx @@ -1,14 +1,17 @@ 'use client'; -import { useState } from 'react'; -import { useRouter } from 'next/navigation'; import Link from 'next/link'; +import { useRouter } from 'next/navigation'; +import { useState } from 'react'; import { signIn } from '@/lib/auth-client'; +import { getEnabledSsoProviders } from '@/lib/sso-providers'; export default function LoginPage(): React.ReactElement { const router = useRouter(); const [error, setError] = useState(null); const [loading, setLoading] = useState(false); + const ssoProviders = getEnabledSsoProviders(); + const hasSsoProviders = ssoProviders.length > 0; async function handleSubmit(e: React.FormEvent): Promise { e.preventDefault(); @@ -44,7 +47,26 @@ export default function LoginPage(): React.ReactElement { )} -
+ {hasSsoProviders && ( +
+ {ssoProviders.map((provider) => ( + + {provider.buttonLabel} + + ))} +
+
+ or +
+
+
+ )} + +