Add comment field to user profile in admin panel

- Prisma: User.comment String? column + migration
- UserContactEditor: comment shown in view mode, textarea in edit mode
- updateUserContact action: saves comment to DB

prisma/migrations/20260506100000_add_user_comment/migration.sql

@@ -0,0 +1,2 @@
+-- AlterTable
+ALTER TABLE "User" ADD COLUMN "comment" TEXT;

prisma/schema.prisma

@@ -23,6 +23,7 @@ model User {
   banned        Boolean?  @default(false)
   banReason     String?
   banExpires    DateTime?
+  comment       String?
   createdAt     DateTime  @default(now())
   updatedAt     DateTime  @updatedAt
 

src/app/admin/users/[userId]/actions.ts

@@ -43,7 +43,7 @@ export async function bulkGrantAccess(
 
 export async function updateUserContact(
   userId: string,
-  data: { name: string; email: string; phone: string; birthday: string }
+  data: { name: string; email: string; phone: string; birthday: string; comment: string }
 ) {
   await requireAdmin();
   await prisma.user.update({
@@ -53,6 +53,7 @@ export async function updateUserContact(
       email: data.email.trim() || undefined,
       phone: data.phone.trim() || null,
       birthday: data.birthday ? new Date(data.birthday) : null,
+      comment: data.comment.trim() || null,
     },
   });
   revalidatePath(`/admin/users/${userId}`);

src/app/admin/users/[userId]/page.tsx

@@ -68,6 +68,7 @@ export default async function UserPage({ params }: Props) {
             email={user.email}
             phone={user.phone ?? null}
             birthday={user.birthday ?? null}
+            comment={user.comment ?? null}
           />
         </div>
       </section>

src/components/admin/user-contact-editor.tsx

@@ -14,8 +14,10 @@ const inputStyle = {
 } as React.CSSProperties;
 
 const focusHandlers = {
-  onFocus: (e: React.FocusEvent<HTMLInputElement>) => (e.currentTarget.style.borderColor = "var(--foreground)"),
+  onFocus: (e: React.FocusEvent<HTMLInputElement | HTMLTextAreaElement>) =>
-  onBlur: (e: React.FocusEvent<HTMLInputElement>) => (e.currentTarget.style.borderColor = "var(--border)"),
+    (e.currentTarget.style.borderColor = "var(--foreground)"),
+  onBlur: (e: React.FocusEvent<HTMLInputElement | HTMLTextAreaElement>) =>
+    (e.currentTarget.style.borderColor = "var(--border)"),
 };
 
 interface Props {
@@ -24,9 +26,10 @@ interface Props {
   email: string;
   phone: string | null;
   birthday: Date | null;
+  comment: string | null;
 }
 
-export function UserContactEditor({ userId, name, email, phone, birthday }: Props) {
+export function UserContactEditor({ userId, name, email, phone, birthday, comment }: Props) {
   const [editing, setEditing] = useState(false);
   const [nameVal, setNameVal] = useState(name);
   const [emailVal, setEmailVal] = useState(email);
@@ -34,17 +37,25 @@ export function UserContactEditor({ userId, name, email, phone, birthday }: Prop
   const [birthdayVal, setBirthdayVal] = useState(
     birthday ? birthday.toISOString().slice(0, 10) : ""
   );
+  const [commentVal, setCommentVal] = useState(comment ?? "");
   const [pending, startTransition] = useTransition();
 
   function handleSave() {
     startTransition(async () => {
-      await updateUserContact(userId, { name: nameVal, email: emailVal, phone: phoneVal, birthday: birthdayVal });
+      await updateUserContact(userId, {
+        name: nameVal,
+        email: emailVal,
+        phone: phoneVal,
+        birthday: birthdayVal,
+        comment: commentVal,
+      });
       setEditing(false);
     });
   }
 
   if (!editing) {
     return (
+      <div className="space-y-3">
         <div className="flex items-start gap-6 flex-wrap">
           <div className="space-y-0.5">
             <p className="text-xs uppercase tracking-widest font-bold" style={{ color: "var(--muted-foreground)" }}>
@@ -71,6 +82,15 @@ export function UserContactEditor({ userId, name, email, phone, birthday }: Prop
             Изменить
           </button>
         </div>
+        {comment && (
+          <div className="space-y-0.5">
+            <p className="text-xs uppercase tracking-widest font-bold" style={{ color: "var(--muted-foreground)" }}>
+              Комментарий
+            </p>
+            <p className="text-sm whitespace-pre-wrap" style={{ color: "var(--foreground)" }}>{comment}</p>
+          </div>
+        )}
+      </div>
     );
   }
 
@@ -127,6 +147,20 @@ export function UserContactEditor({ userId, name, email, phone, birthday }: Prop
           />
         </div>
       </div>
+      <div className="space-y-1">
+        <label className="text-xs uppercase tracking-widest font-bold" style={{ color: "var(--muted-foreground)" }}>
+          Комментарий
+        </label>
+        <textarea
+          value={commentVal}
+          onChange={(e) => setCommentVal(e.target.value)}
+          rows={3}
+          placeholder="Заметки об этом пользователе..."
+          style={{ ...inputStyle, resize: "vertical" }}
+          onFocus={(e) => (e.currentTarget.style.borderColor = "var(--foreground)")}
+          onBlur={(e) => (e.currentTarget.style.borderColor = "var(--border)")}
+        />
+      </div>
       <div className="flex gap-2">
         <button
           type="button"