frontend: convert login and register to homepage modals

- Remove register link from login form
- Redirect /login and /register to /?login=1 and /?register=1
- Open login/register as dialogs on homepage instead of separate pages

frontend/app/login/login-form.tsx

@@ -6,11 +6,18 @@ import { useSearchParams } from "next/navigation";
 import { Button } from "@/components/ui/button";
 import { Input } from "@/components/ui/input";
 import { Label } from "@/components/ui/label";
-import { Card, CardContent, CardHeader, CardTitle } from "@/components/ui/card";
 
-export function LoginForm({ hasKeycloak }: { hasKeycloak: boolean }) {
+export function LoginForm({
+  hasKeycloak,
+  callbackUrl: callbackUrlProp,
+  onSuccess,
+}: {
+  hasKeycloak: boolean;
+  callbackUrl?: string;
+  onSuccess?: () => void;
+}) {
   const searchParams = useSearchParams();
-  const callbackUrl = searchParams.get("callbackUrl") || "/dashboard";
+  const callbackUrl = callbackUrlProp ?? searchParams.get("callbackUrl") ?? "/dashboard";
   const [username, setUsername] = useState("");
   const [password, setPassword] = useState("");
   const [error, setError] = useState("");
@@ -29,6 +36,7 @@ export function LoginForm({ hasKeycloak }: { hasKeycloak: boolean }) {
     if (res?.error) {
       setError("登录失败，请检查用户名和密码");
     } else {
+      onSuccess?.();
       const redirectUrl = callbackUrl.startsWith("http")
         ? callbackUrl
         : window.location.origin + callbackUrl;
@@ -37,65 +45,53 @@ export function LoginForm({ hasKeycloak }: { hasKeycloak: boolean }) {
   }
 
   return (
-    <Card className="w-full max-w-md">
-      <CardHeader>
-        <CardTitle className="text-center">登录</CardTitle>
-      </CardHeader>
-      <CardContent className="space-y-4">
-        <form onSubmit={handleSubmit} className="space-y-4">
-          <div>
-            <Label htmlFor="username">用户名</Label>
-            <Input
-              id="username"
-              value={username}
-              onChange={(e) => setUsername(e.target.value)}
-              required
-            />
-          </div>
-          <div>
-            <Label htmlFor="password">密码</Label>
-            <Input
-              id="password"
-              type="password"
-              value={password}
-              onChange={(e) => setPassword(e.target.value)}
-              required
-            />
-          </div>
-          {error && <p className="text-sm text-red-500">{error}</p>}
-          <Button type="submit" className="w-full">
-            本地账号登录
-          </Button>
-        </form>
+    <div className="space-y-4">
+      <form onSubmit={handleSubmit} className="space-y-4">
+        <div>
+          <Label htmlFor="username">用户名</Label>
+          <Input
+            id="username"
+            value={username}
+            onChange={(e) => setUsername(e.target.value)}
+            required
+          />
+        </div>
+        <div>
+          <Label htmlFor="password">密码</Label>
+          <Input
+            id="password"
+            type="password"
+            value={password}
+            onChange={(e) => setPassword(e.target.value)}
+            required
+          />
+        </div>
+        {error && <p className="text-sm text-red-500">{error}</p>}
+        <Button type="submit" className="w-full">
+          本地账号登录
+        </Button>
+      </form>
 
-        {hasKeycloak && (
-          <>
-            <div className="relative">
-              <div className="absolute inset-0 flex items-center">
-                <span className="w-full border-t" />
-              </div>
-              <div className="relative flex justify-center text-xs uppercase">
-                <span className="bg-white px-2 text-gray-500">或者</span>
-              </div>
+      {hasKeycloak && (
+        <>
+          <div className="relative">
+            <div className="absolute inset-0 flex items-center">
+              <span className="w-full border-t" />
             </div>
+            <div className="relative flex justify-center text-xs uppercase">
+              <span className="bg-white px-2 text-gray-500">或者</span>
+            </div>
+          </div>
 
-            <Button
-              variant="outline"
-              className="w-full"
-              onClick={() => signIn("keycloak", { callbackUrl })}
-            >
-              Keycloak 登录
-            </Button>
-          </>
-        )}
-
-        <p className="text-center text-sm text-gray-500">
-          还没有账号？{" "}
-          <a href="/register" className="text-blue-600 hover:underline">
-            立即注册
-          </a>
-        </p>
-      </CardContent>
-    </Card>
+          <Button
+            variant="outline"
+            className="w-full"
+            onClick={() => signIn("keycloak", { callbackUrl })}
+          >
+            Keycloak 登录
+          </Button>
+        </>
+      )}
+    </div>
   );
 }