feat: add password change functionality and dependencies

2026-01-09 17:29:11 +07:00
parent bf6e09bb6f
commit 23cfb19459
8 changed files with 320 additions and 3 deletions
@@ -0,0 +1,79 @@
+"use client";
+
+import { useState } from "react";
+import { Card, Button, Input } from "@/shared/components";
+import { useRouter } from "next/navigation";
+
+export default function LoginPage() {
+  const [password, setPassword] = useState("");
+  const [error, setError] = useState("");
+  const [loading, setLoading] = useState(false);
+  const router = useRouter();
+
+  const handleLogin = async (e) => {
+    e.preventDefault();
+    setLoading(true);
+    setError("");
+
+    try {
+      const res = await fetch("/api/auth/login", {
+        method: "POST",
+        headers: { "Content-Type": "application/json" },
+        body: JSON.stringify({ password }),
+      });
+
+      if (res.ok) {
+        router.push("/dashboard");
+        router.refresh();
+      } else {
+        const data = await res.json();
+        setError(data.error || "Invalid password");
+      }
+    } catch (err) {
+      setError("An error occurred. Please try again.");
+    } finally {
+      setLoading(false);
+    }
+  };
+
+  return (
+    <div className="min-h-screen flex items-center justify-center bg-bg p-4">
+      <div className="w-full max-w-md">
+        <div className="text-center mb-8">
+          <h1 className="text-3xl font-bold text-primary mb-2">9Router</h1>
+          <p className="text-text-muted">Enter your password to access the dashboard</p>
+        </div>
+
+        <Card>
+          <form onSubmit={handleLogin} className="flex flex-col gap-4">
+            <div className="flex flex-col gap-2">
+              <label className="text-sm font-medium">Password</label>
+              <Input
+                type="password"
+                placeholder="Enter password"
+                value={password}
+                onChange={(e) => setPassword(e.target.value)}
+                required
+                autoFocus
+              />
+              {error && <p className="text-xs text-red-500">{error}</p>}
+            </div>
+
+            <Button
+              type="submit"
+              variant="primary"
+              className="w-full"
+              isLoading={loading}
+            >
+              Login
+            </Button>
+
+            <p className="text-xs text-center text-text-muted mt-2">
+              Default password is <code className="bg-sidebar px-1 rounded">123456</code>
+            </p>
+          </form>
+        </Card>
+      </div>
+    </div>
+  );
+}