feat(auth): add password visibility toggle and remove the unused Organization field

Part 1 — show/hide password: an eye/eye-off button inside the login password input switches its type between password and text. It sits on the right (the input is LTR) with pr-10 clearance so dots never overlap the icon; type=button so a click cannot submit the form, aria-label Show/Hide password, aria-pressed + aria-controls, plus a Persian tooltip.

Part 2 — Organization field removed end-to-end after the audit proved it was a no-op: LoginPage input/state/payload spread (main + dev-mode admin login), api.ts payload type, backend LoginRequest.organization (declared but never forwarded to Casdoor — a bogus org value still logged in successfully), and the casdoor-auth.md flow diagram. The organization actually used remains CASDOOR_ORGANIZATION=inventory for /users/sync.

Verified: api + frontend images rebuilt and redeployed; login works with {username, password}; the served LoginPage chunk contains the toggle and zero org-field leftovers.
This commit is contained in:
2026-09-15 16:29:54 +03:30
parent e7f465f74f
commit 593c149478
4 changed files with 31 additions and 32 deletions
-1
View File
@@ -31,7 +31,6 @@ router = APIRouter(prefix="/auth", tags=["auth"])
class LoginRequest(BaseModel): class LoginRequest(BaseModel):
username: str username: str
password: str password: str
organization: str | None = None # optional override; defaults to CASDOOR_ORGANIZATION
@router.post("/login") @router.post("/login")
+1 -1
View File
@@ -35,7 +35,7 @@ to re-run).
## 2. Login flow (in-page, no redirect) ## 2. Login flow (in-page, no redirect)
``` ```
Browser ──► POST /api/v1/auth/login {username, password, organization?} Browser ──► POST /api/v1/auth/login {username, password}
│ │
▼ ▼
Backend ──► POST http://casdoor:8000/api/login/oauth/access_token Backend ──► POST http://casdoor:8000/api/login/oauth/access_token
-1
View File
@@ -1460,7 +1460,6 @@ export const apiV26 = {
login: async (body: { login: async (body: {
username: string; username: string;
password: string; password: string;
organization?: string;
}): Promise<{ access_token: string; expires_in: number | null; user: import("../store/auth").AuthUser }> => { }): Promise<{ access_token: string; expires_in: number | null; user: import("../store/auth").AuthUser }> => {
const res = await request<{ const res = await request<{
data: { data: {
+30 -29
View File
@@ -1,14 +1,14 @@
import { useEffect, useMemo, useState } from "react"; import { useEffect, useMemo, useState } from "react";
import { useNavigate } from "react-router-dom"; import { useNavigate } from "react-router-dom";
import { toast } from "sonner"; import { toast } from "sonner";
import { ClipboardList, Loader2, Lock, ShieldCheck, Wrench, X } from "lucide-react"; import { ClipboardList, Eye, EyeOff, Loader2, Lock, ShieldCheck, Wrench, X } from "lucide-react";
import { api, apiV26 } from "../../lib/api"; import { api, apiV26 } from "../../lib/api";
import { useAuthStore } from "../../store/auth"; import { useAuthStore } from "../../store/auth";
import type { Project } from "../../lib/types"; import type { Project } from "../../lib/types";
// ============================================================ // ============================================================
// ورود به سامانه — Casdoor درون‌صفحه‌ای (بدون ریدایرکت) // ورود به سامانه — Casdoor درون‌صفحه‌ای (بدون ریدایرکت)
// فرم اصلی: Username / Password / Organization (اختیاری) → // فرم اصلی: Username / Password →
// POST /api/v1/auth/login (بک‌اند با grant_type=password از // POST /api/v1/auth/login (بک‌اند با grant_type=password از
// Casdoor توکن می‌گیرد و نقش را از جدول users خودمان برمی‌گرداند) // Casdoor توکن می‌گیرد و نقش را از جدول users خودمان برمی‌گرداند)
// حالت توسعه (فقط ادمین — سوپر یوزر) — چرخه‌ی ۳ مرحله‌ای: // حالت توسعه (فقط ادمین — سوپر یوزر) — چرخه‌ی ۳ مرحله‌ای:
@@ -36,7 +36,7 @@ export function LoginPage() {
// ---- فرم اصلی (Casdoor) ---- // ---- فرم اصلی (Casdoor) ----
const [username, setUsername] = useState(""); const [username, setUsername] = useState("");
const [password, setPassword] = useState(""); const [password, setPassword] = useState("");
const [organization, setOrganization] = useState(""); const [showPassword, setShowPassword] = useState(false);
const [loading, setLoading] = useState(false); const [loading, setLoading] = useState(false);
// ---- پنل حالت توسعه (۳ مرحله) ---- // ---- پنل حالت توسعه (۳ مرحله) ----
@@ -71,7 +71,6 @@ export function LoginPage() {
const { access_token, user } = await apiV26.auth.login({ const { access_token, user } = await apiV26.auth.login({
username: username.trim(), username: username.trim(),
password, password,
...(organization.trim() ? { organization: organization.trim() } : {}),
}); });
if (!user.role) { if (!user.role) {
toast.error("نقش شما هنوز در سیستم تعیین نشده است — با مدیر سیستم تماس بگیرید"); toast.error("نقش شما هنوز در سیستم تعیین نشده است — با مدیر سیستم تماس بگیرید");
@@ -101,7 +100,6 @@ export function LoginPage() {
const { user: adminUser } = await apiV26.auth.login({ const { user: adminUser } = await apiV26.auth.login({
username: devAdminUser.trim(), username: devAdminUser.trim(),
password: devAdminPass, password: devAdminPass,
...(organization.trim() ? { organization: organization.trim() } : {}),
}); });
if (adminUser.role !== "admin") { if (adminUser.role !== "admin") {
toast.error("حالت توسعه فقط برای ادمین (سوپر یوزر) در دسترس است"); toast.error("حالت توسعه فقط برای ادمین (سوپر یوزر) در دسترس است");
@@ -298,30 +296,33 @@ export function LoginPage() {
<label className="mb-1 block text-[12px] font-semibold text-muted" htmlFor="login-password"> <label className="mb-1 block text-[12px] font-semibold text-muted" htmlFor="login-password">
رمز عبور رمز عبور
</label> </label>
<input <div className="relative">
id="login-password" <input
type="password" id="login-password"
autoComplete="current-password" type={showPassword ? "text" : "password"}
dir="ltr" autoComplete="current-password"
className="h-10 w-full rounded-lg border border-line bg-panel px-3 text-left text-sm shadow-sm placeholder:text-muted/60 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-accent/40" dir="ltr"
placeholder="••••••" className="h-10 w-full rounded-lg border border-line bg-panel px-3 pr-10 text-left text-sm shadow-sm placeholder:text-muted/60 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-accent/40"
value={password} placeholder="••••••"
onChange={(e) => setPassword(e.target.value)} value={password}
/> onChange={(e) => setPassword(e.target.value)}
</div> />
<div className="field"> <button
<label className="mb-1 block text-[12px] font-semibold text-muted" htmlFor="login-org"> type="button"
سازمان (اختیاری) onClick={() => setShowPassword((v) => !v)}
</label> aria-label={showPassword ? "Hide password" : "Show password"}
<input aria-pressed={showPassword}
id="login-org" aria-controls="login-password"
type="text" title={showPassword ? "پنهان کردن رمز" : "نمایش رمز"}
dir="ltr" className="absolute inset-y-0 right-0 flex cursor-pointer items-center rounded-lg px-3 text-muted transition-colors hover:text-ink focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-accent/40"
className="h-10 w-full rounded-lg border border-line bg-panel px-3 text-left text-sm shadow-sm placeholder:text-muted/60 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-accent/40" >
placeholder="inventory" {showPassword ? (
value={organization} <EyeOff className="h-4 w-4" aria-hidden="true" />
onChange={(e) => setOrganization(e.target.value)} ) : (
/> <Eye className="h-4 w-4" aria-hidden="true" />
)}
</button>
</div>
</div> </div>
<button <button
type="submit" type="submit"