MVP-1: helpdesk core with dashboard, Telegram channel, customer portal

Next.js 16 + Drizzle/SQLite (matching ~/project-claude conventions), SSE-based
realtime updates, admin dashboard with status columns, ticket thread view,
Telegram long-polling integration (inbound + outbound), token-based customer
portal, Docker Compose packaging.

Co-Authored-By: Claude Sonnet 5 <noreply@anthropic.com>
Claude-Session: https://claude.ai/code/session_01QcXH24ky6zjk2UyK5oZUPH

src/app/(auth)/login/page.tsx

@@ -0,0 +1,96 @@
+"use client";
+
+import { useState } from "react";
+import { useRouter } from "next/navigation";
+import { motion } from "framer-motion";
+import { Ticket, LogIn } from "lucide-react";
+
+export default function LoginPage() {
+  const router = useRouter();
+  const [email, setEmail] = useState("");
+  const [password, setPassword] = useState("");
+  const [error, setError] = useState<string | null>(null);
+  const [loading, setLoading] = useState(false);
+
+  async function handleSubmit(e: React.FormEvent) {
+    e.preventDefault();
+    setLoading(true);
+    setError(null);
+
+    const res = await fetch("/api/auth/login", {
+      method: "POST",
+      headers: { "Content-Type": "application/json" },
+      body: JSON.stringify({ email, password }),
+    });
+
+    if (!res.ok) {
+      const data = await res.json().catch(() => null);
+      setError(data?.error ?? "Не удалось войти");
+      setLoading(false);
+      return;
+    }
+
+    router.push("/dashboard");
+    router.refresh();
+  }
+
+  return (
+    <main className="flex min-h-screen items-center justify-center bg-bg px-4">
+      <motion.form
+        onSubmit={handleSubmit}
+        initial={{ opacity: 0, y: 12 }}
+        animate={{ opacity: 1, y: 0 }}
+        transition={{ duration: 0.35, ease: "easeOut" }}
+        className="card w-full max-w-sm p-8"
+      >
+        <div className="mb-6 flex items-center gap-2">
+          <div className="flex h-9 w-9 items-center justify-center rounded-md bg-accent text-white">
+            <Ticket size={18} strokeWidth={2.5} />
+          </div>
+          <span className="text-lg font-bold tracking-tight">top-tickets</span>
+        </div>
+
+        <h1 className="mb-1 text-xl font-semibold">Вход для агентов</h1>
+        <p className="mb-6 text-sm text-text-muted">Войдите, чтобы открыть дашборд заявок.</p>
+
+        <label className="mb-3 block text-sm">
+          <span className="mb-1 block font-medium text-text-muted">Email</span>
+          <input
+            type="email"
+            required
+            value={email}
+            onChange={(e) => setEmail(e.target.value)}
+            className="w-full rounded-md border border-border bg-surface px-3 py-2 outline-none focus:border-accent"
+            autoFocus
+          />
+        </label>
+
+        <label className="mb-5 block text-sm">
+          <span className="mb-1 block font-medium text-text-muted">Пароль</span>
+          <input
+            type="password"
+            required
+            value={password}
+            onChange={(e) => setPassword(e.target.value)}
+            className="w-full rounded-md border border-border bg-surface px-3 py-2 outline-none focus:border-accent"
+          />
+        </label>
+
+        {error && (
+          <motion.p
+            initial={{ opacity: 0 }}
+            animate={{ opacity: 1 }}
+            className="mb-4 rounded-md bg-danger-soft px-3 py-2 text-sm text-danger-soft-text"
+          >
+            {error}
+          </motion.p>
+        )}
+
+        <button type="submit" disabled={loading} className="btn btn-primary w-full justify-center">
+          <LogIn size={16} />
+          {loading ? "Входим…" : "Войти"}
+        </button>
+      </motion.form>
+    </main>
+  );
+}