clean up login page

src/components/DashboardLoginForm.tsx

@@ -17,17 +17,26 @@ import { cleanRedirect } from "@app/lib/cleanRedirect";
 import BrandingLogo from "@app/components/BrandingLogo";
 import { useTranslations } from "next-intl";
 import { useLicenseStatusContext } from "@app/hooks/useLicenseStatusContext";
+import Link from "next/link";
+import { Button } from "./ui/button";
+import { ArrowRight } from "lucide-react";
 
 type DashboardLoginFormProps = {
     redirect?: string;
     idps?: LoginFormIDP[];
     forceLogin?: boolean;
+    showOrgLogin?: boolean;
+    searchParams?: {
+        [key: string]: string | string[] | undefined;
+    };
 };
 
 export default function DashboardLoginForm({
     redirect,
     idps,
-    forceLogin
+    forceLogin,
+    showOrgLogin,
+    searchParams
 }: DashboardLoginFormProps) {
     const router = useRouter();
     const { env } = useEnvContext();
@@ -35,6 +44,9 @@ export default function DashboardLoginForm({
     const { isUnlocked } = useLicenseStatusContext();
 
     function getSubtitle() {
+        if (forceLogin) {
+            return t("loginRequiredForDevice");
+        }
         if (isUnlocked() && env.branding?.loginPage?.subtitleText) {
             return env.branding.loginPage.subtitleText;
         }
@@ -57,6 +69,22 @@ export default function DashboardLoginForm({
                 <div className="text-center space-y-1 pt-3">
                     <p className="text-muted-foreground">{getSubtitle()}</p>
                 </div>
+                {showOrgLogin && (
+                    <div className="space-y-2 mt-4">
+                        <Link
+                            href={`/auth/org${buildQueryString(searchParams || {})}`}
+                            className="underline"
+                        >
+                            <Button
+                                variant="secondary"
+                                className="w-full gap-2"
+                            >
+                                {t("orgAuthSignInToOrg")}
+                                <ArrowRight className="h-4 w-4" />
+                            </Button>
+                        </Link>
+                    </div>
+                )}
             </CardHeader>
             <CardContent className="pt-6">
                 <LoginForm
@@ -76,3 +104,20 @@ export default function DashboardLoginForm({
         </Card>
     );
 }
+
+function buildQueryString(searchParams: {
+    [key: string]: string | string[] | undefined;
+}): string {
+    const params = new URLSearchParams();
+    const redirect = searchParams.redirect;
+    const forceLogin = searchParams.forceLogin;
+
+    if (redirect && typeof redirect === "string") {
+        params.set("redirect", redirect);
+    }
+    if (forceLogin && typeof forceLogin === "string") {
+        params.set("forceLogin", forceLogin);
+    }
+    const queryString = params.toString();
+    return queryString ? `?${queryString}` : "";
+}

src/components/LoginForm.tsx

@@ -409,15 +409,6 @@ export default function LoginForm({
 
     return (
         <div className="space-y-4">
-            {forceLogin && (
-                <Alert variant="neutral">
-                    <AlertDescription className="flex items-center gap-2">
-                        <LockIcon className="w-4 h-4" />
-                        {t("loginRequiredForDevice")}
-                    </AlertDescription>
-                </Alert>
-            )}
-
             {showSecurityKeyPrompt && (
                 <Alert>
                     <FingerprintIcon className="w-5 h-5 mr-2" />