fix(panel): override generic already_exists error message during user creation and profile editing

.gitignore

@@ -29,6 +29,8 @@ plugins/*/bin/
 .vscode/
 .idea/
 *.iml
+.DS_Store
+**/.DS_Store
 
 # ---- Secrets / keys (NEVER commit) ----
 *.pem

panel/src/components/CreateUserDialog.tsx

@@ -1,5 +1,5 @@
 import { useState } from "react";
-import { Plus, Loader2 } from "lucide-react";
+import { Plus, Loader2, Copy, Check } from "lucide-react";
 import { useTranslation } from "react-i18next";
 import {
   Dialog,
@@ -26,24 +26,39 @@ interface Props {
   onCreated: (id: string) => void;
 }
 
+function generateRandomPassword(length = 16): string {
+  const chars = "abcdefghijklmnopqrstuvwxyzABCDEFGHIJKLMNOPQRSTUVWXYZ0123456789!@#$";
+  let password = "";
+  for (let i = 0; i < length; i++) {
+    password += chars.charAt(Math.floor(Math.random() * chars.length));
+  }
+  return password;
+}
+
 export function CreateUserDialog({ onCreated }: Props) {
   const { t } = useTranslation("admin");
   const [open, setOpen] = useState(false);
   const [username, setUsername] = useState("");
   const [email, setEmail] = useState("");
   const [role, setRole] = useState<"user" | "admin">("user");
-  const [password, setPassword] = useState("");
   const [mustChange, setMustChange] = useState(true);
   const [submitting, setSubmitting] = useState(false);
   const [err, setErr] = useState<string | null>(null);
 
+  // Success state fields
+  const [createdUser, setCreatedUser] = useState<any | null>(null);
+  const [generatedPassword, setGeneratedPassword] = useState("");
+  const [copied, setCopied] = useState(false);
+
   function reset() {
     setUsername("");
     setEmail("");
     setRole("user");
-    setPassword("");
     setMustChange(true);
     setErr(null);
+    setCreatedUser(null);
+    setGeneratedPassword("");
+    setCopied(false);
   }
 
   async function handleSubmit(e: React.FormEvent) {
@@ -55,30 +70,51 @@ export function CreateUserDialog({ onCreated }: Props) {
       setErr(t("users_create_validation_username"));
       return;
     }
-    if (password.length < 8) {
-      setErr(t("users_create_validation_password"));
-      return;
-    }
 
+    const genPassword = generateRandomPassword();
     setSubmitting(true);
     try {
       const u = await api.createUser({
         username: username.trim(),
         email: email.trim() || undefined,
         role,
-        password,
+        password: genPassword,
         must_change_password: mustChange,
       });
-      setOpen(false);
-      reset();
-      onCreated(u.id);
-    } catch (e) {
+      setGeneratedPassword(genPassword);
+      setCreatedUser(u);
+    } catch (e: any) {
+      if (e && e.code === "already_exists") {
+        setErr(t("users_create_validation_username_taken") || "该用户名已被使用。");
+      } else {
         setErr(humanizeError(e));
+      }
     } finally {
       setSubmitting(false);
     }
   }
 
+  const handleCopy = async () => {
+    if (!createdUser) return;
+    const text = `Username: ${createdUser.username}\nPassword: ${generatedPassword}`;
+    try {
+      await navigator.clipboard.writeText(text);
+      setCopied(true);
+      setTimeout(() => setCopied(false), 2000);
+    } catch (e) {
+      // ignore
+    }
+  };
+
+  const handleDone = () => {
+    const id = createdUser?.id;
+    setOpen(false);
+    reset();
+    if (id) {
+      onCreated(id);
+    }
+  };
+
   return (
     <Dialog open={open} onOpenChange={(v) => { setOpen(v); if (!v) reset(); }}>
       <DialogTrigger asChild>
@@ -87,13 +123,42 @@ export function CreateUserDialog({ onCreated }: Props) {
           {t("users_create_btn")}
         </Button>
       </DialogTrigger>
-      <DialogContent className="sm:max-w-md">
+      <DialogContent className="sm:max-w-md" hideClose={submitting}>
         <DialogHeader>
-          <DialogTitle>{t("users_create_title")}</DialogTitle>
+          <DialogTitle>{createdUser ? t("users_create_success_title") || "创建成功" : t("users_create_title")}</DialogTitle>
           <DialogDescription>
-            {t("users_create_desc")}
+            {createdUser
+              ? t("users_create_success_desc") || "请务必复制并妥善保管该用户的初始凭据，关闭后密码将不再显示。"
+              : t("users_create_desc")}
           </DialogDescription>
         </DialogHeader>
+
+        {createdUser ? (
+          <div className="space-y-4">
+            <div className="rounded-md border border-border/50 bg-muted/20 p-4 space-y-3">
+              <div className="space-y-1">
+                <Label className="text-xs font-semibold text-muted-foreground">{t("users_field_username")}</Label>
+                <div className="font-mono text-sm font-semibold select-all">{createdUser.username}</div>
+              </div>
+              <div className="space-y-1">
+                <Label className="text-xs font-semibold text-muted-foreground">{t("users_field_password")}</Label>
+                <div className="font-mono text-sm font-semibold text-emerald-600 dark:text-emerald-400 select-all">
+                  {generatedPassword}
+                </div>
+              </div>
+            </div>
+
+            <DialogFooter className="flex flex-row justify-end gap-2">
+              <Button type="button" variant="outline" onClick={handleCopy} className="gap-1.5">
+                {copied ? <Check className="h-4 w-4 text-emerald-500" /> : <Copy className="h-4 w-4" />}
+                {copied ? t("common:copied") || "已复制" : t("common:copy") || "复制凭据"}
+              </Button>
+              <Button type="button" onClick={handleDone}>
+                {t("common:done") || "完成"}
+              </Button>
+            </DialogFooter>
+          </div>
+        ) : (
           <form onSubmit={handleSubmit} className="space-y-4">
             {/* Username */}
             <div className="space-y-1.5">
@@ -139,20 +204,6 @@ export function CreateUserDialog({ onCreated }: Props) {
               </Select>
             </div>
 
-          {/* Password */}
-          <div className="space-y-1.5">
-            <Label className="text-xs font-semibold text-muted-foreground">
-              {t("users_field_password")} *
-            </Label>
-            <Input
-              type="password"
-              value={password}
-              onChange={(e) => setPassword(e.target.value)}
-              placeholder="min. 8 characters"
-              className="h-9 text-sm"
-            />
-          </div>
-
             {/* Must change password toggle */}
             <label className="flex items-center gap-2 cursor-pointer select-none">
               <input
@@ -183,6 +234,7 @@ export function CreateUserDialog({ onCreated }: Props) {
               </Button>
             </DialogFooter>
           </form>
+        )}
       </DialogContent>
     </Dialog>
   );

panel/src/components/RequireOwner.tsx

@@ -1,5 +1,4 @@
 import { Outlet } from "react-router-dom";
-import { useTranslation } from "react-i18next";
 import { useTier } from "@/lib/tier";
 import { NotAuthorized } from "@/components/States";
 import { Loading } from "@/components/States";

panel/src/i18n/resources/en-US/admin.json

@@ -108,8 +108,11 @@
   "users_create_btn": "Create User",
   "users_create_title": "Create New User",
   "users_create_desc": "Create a new platform account. The user will receive the initial password and will be prompted to change it on first login if the toggle is enabled.",
+  "users_create_success_title": "User Created Successfully",
+  "users_create_success_desc": "Please copy and save the initial credentials. Once you close this dialog, the initial password cannot be viewed again!",
   "users_create_username_placeholder": "e.g. alice",
   "users_create_validation_username": "Username is required.",
+  "users_create_validation_username_taken": "This username is already taken.",
   "users_create_validation_password": "Password must be at least 8 characters.",
   "users_create_must_change": "Require password change on first login",
   "users_search_placeholder": "Search username or email...",

panel/src/i18n/resources/zh-CN/admin.json

@@ -108,8 +108,11 @@
   "users_create_btn": "创建用户",
   "users_create_title": "创建新用户",
   "users_create_desc": "创建一个新的平台账号。用户将收到初始密码，如果开启「首次登录修改密码」，用户将在首次登录时被要求修改密码。",
+  "users_create_success_title": "用户创建成功",
+  "users_create_success_desc": "请复制并妥善保管该用户的初始凭据。关闭此对话框后，此初始密码将无法再次查看！",
   "users_create_username_placeholder": "例如: alice",
   "users_create_validation_username": "用户名为必填项。",
+  "users_create_validation_username_taken": "该用户名已被使用。",
   "users_create_validation_password": "密码至少需要 8 个字符。",
   "users_create_must_change": "要求首次登录修改密码",
   "users_search_placeholder": "搜索用户名或邮箱...",

panel/src/lib/auth.test.ts

@@ -15,6 +15,7 @@ const admin: Identity = {
   role: "admin",
   is_admin: true,
   must_change_password: false,
+  is_owner: false,
 };
 
 const err401 = { status: 401, code: "unauthorized", message: "no session" };

panel/src/lib/nav.test.ts

@@ -8,32 +8,34 @@ import { NAV_SECTIONS, visibleSections } from "./nav";
 
 describe("visibleSections", () => {
   it("shows only the User-Side section to a non-admin", () => {
-    const ids = visibleSections(false).map((s) => s.id);
+    const ids = visibleSections(false, false).map((s) => s.id);
     expect(ids).toEqual(["user"]);
   });
 
   it("treats the fail-closed default (false) exactly like a non-admin", () => {
     // TierProvider passes `false` while /me is loading or after it rejects. That
     // path MUST collapse to User-Side only, never leak Admin/Ops nav.
-    expect(visibleSections(false)).toHaveLength(1);
-    expect(visibleSections(false)[0].id).toBe("user");
+    expect(visibleSections(false, false)).toHaveLength(1);
+    expect(visibleSections(false, false)[0].id).toBe("user");
   });
 
   it("shows User-Side and Admin-Side to an admin", () => {
-    const ids = visibleSections(true).map((s) => s.id);
+    const ids = visibleSections(true, false).map((s) => s.id);
     expect(ids).toEqual(["user", "admin"]);
   });
 
   it("keeps the User-Side section ungated so it survives both branches", () => {
     const user = NAV_SECTIONS.find((s) => s.id === "user");
     expect(user?.adminOnly).toBe(false);
-    expect(visibleSections(true)).toContainEqual(user);
-    expect(visibleSections(false)).toContainEqual(user);
+    expect(visibleSections(true, false)).toContainEqual(user);
+    expect(visibleSections(false, false)).toContainEqual(user);
   });
 
-  it("gates every non-user section behind admin", () => {
+  it("gates every non-user section behind admin or owner", () => {
     for (const s of NAV_SECTIONS) {
-      if (s.id !== "user") expect(s.adminOnly).toBe(true);
+      if (s.id !== "user") {
+        expect(s.adminOnly || s.ownerOnly).toBe(true);
+      }
     }
   });
 });

panel/src/lib/viewmode.test.ts

@@ -10,63 +10,51 @@ import {
 } from "./viewmode";
 import { visibleSections } from "./nav";
 
-// The role-switcher decides which home a principal is in and which they may switch
-// into. One rule carries security weight and the rest is UX focus, so the cases
-// below are split accordingly: the bulk pin the fail-closed rule from every angle a
-// view can be chosen — a fresh request, a restored localStorage value, a tampered
-// value — because the single thing that must never happen is a non-admin (or a
-// demoted admin) landing in an Admin- or SysAdmin-Side view. The ceiling/section
-// cases pin the navigational focus, which can declutter but never escalate.
-
 describe("availableViewModes", () => {
   it("offers a non-admin exactly the User-Side home", () => {
-    expect(availableViewModes(false)).toEqual(["user"]);
+    expect(availableViewModes(false, false)).toEqual(["user"]);
   });
 
   it("treats the fail-closed default (false) exactly like a non-admin", () => {
-    // TierProvider passes `false` while /me loads or after it rejects; the switcher
-    // must offer nothing but the user home in that window.
-    expect(availableViewModes(false)).toEqual(["user"]);
+    expect(availableViewModes(false, false)).toEqual(["user"]);
   });
 
-  it("offers an admin every home, ordered least- to most-revealing", () => {
-    expect(availableViewModes(true)).toEqual(["user", "admin"]);
+  it("offers an admin every home except owner", () => {
+    expect(availableViewModes(true, false)).toEqual(["user", "admin"]);
   });
 
-  it("returns a fresh array so a caller cannot mutate the canonical list", () => {
-    const a = availableViewModes(true);
-    a.push("user");
-    expect(availableViewModes(true)).toEqual(["user", "admin"]);
+  it("offers an owner every home including owner", () => {
+    expect(availableViewModes(true, true)).toEqual(["user", "admin", "owner"]);
   });
 });
 
 describe("VIEW_MODES", () => {
-  it("is the two homes ordered by how much they reveal", () => {
-    expect(VIEW_MODES).toEqual(["user", "admin"]);
+  it("is the three homes ordered by how much they reveal", () => {
+    expect(VIEW_MODES).toEqual(["user", "admin", "owner"]);
   });
 });
 
 describe("effectiveViewMode (fail-closed resolution)", () => {
   it("collapses any admin-level request from a non-admin to user", () => {
-    expect(effectiveViewMode("admin", false)).toBe("user");
+    expect(effectiveViewMode("admin", false, false)).toBe("user");
   });
 
   it("honours an admin's request for any home they are entitled to", () => {
-    expect(effectiveViewMode("user", true)).toBe("user");
-    expect(effectiveViewMode("admin", true)).toBe("admin");
+    expect(effectiveViewMode("user", true, false)).toBe("user");
+    expect(effectiveViewMode("admin", true, false)).toBe("admin");
+    expect(effectiveViewMode("owner", true, false)).toBe("user"); // admin not entitled to owner
+  });
+
+  it("honours an owner's request for any home they are entitled to", () => {
+    expect(effectiveViewMode("user", true, true)).toBe("user");
+    expect(effectiveViewMode("admin", true, true)).toBe("admin");
+    expect(effectiveViewMode("owner", true, true)).toBe("owner");
   });
 
   it("defaults a null/undefined request to the user home for either tier", () => {
-    expect(effectiveViewMode(null, true)).toBe("user");
-    expect(effectiveViewMode(undefined, true)).toBe("user");
-    expect(effectiveViewMode(null, false)).toBe("user");
-  });
-
-  it("collapses a value outside the known homes to user, even for an admin", () => {
-    // Defends the runtime boundary: a value cast past the type system (a stale enum,
-    // a hand-edited store) is not in the allow-list, so it fails to the safe side.
-    expect(effectiveViewMode("root" as unknown as ViewMode, true)).toBe("user");
-    expect(effectiveViewMode("" as unknown as ViewMode, true)).toBe("user");
+    expect(effectiveViewMode(null, true, false)).toBe("user");
+    expect(effectiveViewMode(undefined, true, false)).toBe("user");
+    expect(effectiveViewMode(null, false, false)).toBe("user");
   });
 });
 
@@ -74,12 +62,13 @@ describe("parseViewMode (shape only, no gating)", () => {
   it("accepts each known home verbatim", () => {
     expect(parseViewMode("user")).toBe("user");
     expect(parseViewMode("admin")).toBe("admin");
+    expect(parseViewMode("owner")).toBe("owner");
   });
 
   it("rejects anything that is not a known home, returning null", () => {
     expect(parseViewMode("ops")).toBeNull();
     expect(parseViewMode("operator")).toBeNull();
-    expect(parseViewMode("Admin")).toBeNull(); // case-sensitive on purpose
+    expect(parseViewMode("Admin")).toBeNull();
     expect(parseViewMode("")).toBeNull();
     expect(parseViewMode(null)).toBeNull();
     expect(parseViewMode(undefined)).toBeNull();
@@ -89,64 +78,52 @@ describe("parseViewMode (shape only, no gating)", () => {
 });
 
 describe("restoreViewMode (the persisted-value re-gate — escalation vector)", () => {
-  // This is the one place a client-persisted persona could escalate: a value lives
-  // in the user's own localStorage, fully under their control, and is read back on
-  // every load. The contract is that it is re-gated against the LIVE flag every
-  // time and never trusted on its own.
-
   it("honours a stored admin home only while the principal is still an admin", () => {
-    expect(restoreViewMode("admin", true)).toBe("admin");
-    expect(restoreViewMode("user", true)).toBe("user");
+    expect(restoreViewMode("admin", true, false)).toBe("admin");
+    expect(restoreViewMode("user", true, false)).toBe("user");
   });
 
   it("collapses a stored admin home to user for a non-admin (stale or tampered)", () => {
-    // An admin who has since been demoted re-reads as user.
-    expect(restoreViewMode("admin", false)).toBe("user");
+    expect(restoreViewMode("admin", false, false)).toBe("user");
   });
 
-  it("collapses a garbage stored value to user even for an admin", () => {
-    expect(restoreViewMode("ops", true)).toBe("user");
-    expect(restoreViewMode("ops", false)).toBe("user");
+  it("collapses a stored owner home to user for a non-owner", () => {
+    expect(restoreViewMode("owner", true, false)).toBe("user");
   });
 
-  it("collapses a malformed/garbage stored value to user even for an admin", () => {
-    expect(restoreViewMode("root", true)).toBe("user");
-    expect(restoreViewMode("", true)).toBe("user");
-    expect(restoreViewMode(null, true)).toBe("user");
-    expect(restoreViewMode(42, true)).toBe("user");
+  it("honours a stored owner home for an owner", () => {
+    expect(restoreViewMode("owner", true, true)).toBe("owner");
   });
 });
 
 describe("sectionsForView (UX ceiling, composed on visibleSections)", () => {
   it("shows a non-admin only the User-Side regardless of the requested view", () => {
-    for (const v of ["user", "admin"] as ViewMode[]) {
-      expect(sectionsForView(v, false).map((s) => s.id)).toEqual(["user"]);
+    for (const v of ["user", "admin", "owner"] as ViewMode[]) {
+      expect(sectionsForView(v, false, false).map((s) => s.id)).toEqual(["user"]);
     }
   });
 
   it("foregrounds homes up to the chosen ceiling for an admin", () => {
-    expect(sectionsForView("user", true).map((s) => s.id)).toEqual(["user"]);
-    expect(sectionsForView("admin", true).map((s) => s.id)).toEqual(["user", "admin"]);
+    expect(sectionsForView("user", true, false).map((s) => s.id)).toEqual(["user"]);
+    expect(sectionsForView("admin", true, false).map((s) => s.id)).toEqual(["user", "admin"]);
   });
 
-  it("lets an admin step DOWN to the User-home and see only User-Side", () => {
-    // The new capability the switcher adds: an admin can choose to view the app as a
-    // plain user. visibleSections alone could never hide their admin nav; this can.
-    const ids = sectionsForView("user", true).map((s) => s.id);
-    expect(ids).toEqual(["user"]);
-    expect(ids).not.toContain("admin");
+  it("foregrounds homes up to the chosen ceiling for an owner", () => {
+    expect(sectionsForView("user", true, true).map((s) => s.id)).toEqual(["user"]);
+    expect(sectionsForView("admin", true, true).map((s) => s.id)).toEqual(["user", "admin"]);
+    expect(sectionsForView("owner", true, true).map((s) => s.id)).toEqual(["user", "admin", "owner"]);
   });
 
   it("never returns more than visibleSections already permits (subset invariant)", () => {
-    // The switcher only ever narrows. For every (view, isAdmin) pair the result must
-    // be a subset of visibleSections(isAdmin) — it can never widen access.
+    for (const isOwner of [true, false]) {
       for (const isAdmin of [true, false]) {
-      const permitted = new Set(visibleSections(isAdmin).map((s) => s.id));
-      for (const v of ["user", "admin"] as ViewMode[]) {
-        for (const s of sectionsForView(v, isAdmin)) {
+        const permitted = new Set(visibleSections(isAdmin, isOwner).map((s) => s.id));
+        for (const v of ["user", "admin", "owner"] as ViewMode[]) {
+          for (const s of sectionsForView(v, isAdmin, isOwner)) {
             expect(permitted.has(s.id)).toBe(true);
           }
         }
       }
+    }
   });
 });

panel/src/lib/viewmode.ts

@@ -36,6 +36,7 @@ export type ViewMode = NavSection["id"];
 const VIEW_RANK: Record<ViewMode, number> = {
   user: 0,
   admin: 1,
+  owner: 2,
 };
 
 /** VIEW_MODES lists every home, ordered by how much it reveals (User → Ops). It is
@@ -50,8 +51,10 @@ export const VIEW_MODES: ViewMode[] = (Object.keys(VIEW_RANK) as ViewMode[]).sor
  * it errors) gets exactly `["user"]`; an admin gets every home. This is the list the
  * avatar menu renders, and the allow-list effectiveViewMode resolves against.
  */
-export function availableViewModes(isAdmin: boolean): ViewMode[] {
-  return isAdmin ? [...VIEW_MODES] : ["user"];
+export function availableViewModes(isAdmin: boolean, isOwner: boolean): ViewMode[] {
+  if (isOwner) return [...VIEW_MODES];
+  if (isAdmin) return ["user", "admin"];
+  return ["user"];
 }
 
 /**
@@ -66,8 +69,9 @@ export function availableViewModes(isAdmin: boolean): ViewMode[] {
 export function effectiveViewMode(
   requested: ViewMode | null | undefined,
   isAdmin: boolean,
+  isOwner: boolean,
 ): ViewMode {
-  const allowed = availableViewModes(isAdmin);
+  const allowed = availableViewModes(isAdmin, isOwner);
   return requested != null && allowed.includes(requested) ? requested : "user";
 }
 
@@ -94,8 +98,8 @@ export function parseViewMode(raw: unknown): ViewMode | null {
  * is closed here. Shape validation (parseViewMode) runs first so a malformed value
  * cannot slip past as a truthy non-ViewMode.
  */
-export function restoreViewMode(raw: unknown, isAdmin: boolean): ViewMode {
-  return effectiveViewMode(parseViewMode(raw), isAdmin);
+export function restoreViewMode(raw: unknown, isAdmin: boolean, isOwner: boolean): ViewMode {
+  return effectiveViewMode(parseViewMode(raw), isAdmin, isOwner);
 }
 
 /**
@@ -106,7 +110,7 @@ export function restoreViewMode(raw: unknown, isAdmin: boolean): ViewMode {
  * of what the principal's is_admin flag already permits — the switcher can only ever
  * narrow the sidebar, never widen it past `visibleSections(isAdmin)`.
  */
-export function sectionsForView(view: ViewMode, isAdmin: boolean): NavSection[] {
-  const ceiling = VIEW_RANK[effectiveViewMode(view, isAdmin)];
-  return visibleSections(isAdmin).filter((s) => VIEW_RANK[s.id] <= ceiling);
+export function sectionsForView(view: ViewMode, isAdmin: boolean, isOwner: boolean): NavSection[] {
+  const ceiling = VIEW_RANK[effectiveViewMode(view, isAdmin, isOwner)];
+  return visibleSections(isAdmin, isOwner).filter((s) => VIEW_RANK[s.id] <= ceiling);
 }

panel/src/pages/admin/UserDetailPage.tsx

@@ -57,7 +57,6 @@ export function UserDetailPage() {
   const { t, i18n } = useTranslation("admin");
   const locale = i18n.language;
   const { identity } = useTier();
-  const isSelf = identity?.user_id === id;
 
   const { data: user, error, loading, reload } = useAsync(
     () => api.getUser(id!),
@@ -178,8 +177,12 @@ function EditProfileCard({ user, onSaved, isSelf }: { user: UserDetail; onSaved:
       await api.patchUser(user.id, patch);
       setOk(t("users_save_ok"));
       onSaved();
-    } catch (e) {
+    } catch (e: any) {
+      if (e && e.code === "already_exists") {
+        setErr(t("users_create_validation_username_taken") || "该用户名已被使用。");
+      } else {
         setErr(humanizeError(e));
+      }
     } finally {
       setSaving(false);
     }