From 0cbb92e5ffed1d922fd734eb9b8307a447002d41 Mon Sep 17 00:00:00 2001
From: Gabriel Sancho <gabriel.sancho13@gmail.com>
Date: Thu, 26 Mar 2026 20:38:24 -0300
Subject: [PATCH] feat(frontend): simplify entity modal fields and add explicit
 labels

---
 frontend/src/api/entitiesApi.ts     |   8 +-
 frontend/src/pages/EntitiesPage.tsx | 109 ++++++++++++++++------------
 2 files changed, 67 insertions(+), 50 deletions(-)

diff --git a/frontend/src/api/entitiesApi.ts b/frontend/src/api/entitiesApi.ts
index f51e361..a964e14 100644
--- a/frontend/src/api/entitiesApi.ts
+++ b/frontend/src/api/entitiesApi.ts
@@ -5,8 +5,8 @@ export interface VirtualEntityResponse {
   name: string
   email: string
   jobTitle: string
-  personality: string
-  scheduleCron: string
+  personality: string | null
+  scheduleCron: string | null
   contextWindowDays: number
   active: boolean
   createdAt: string
@@ -16,8 +16,8 @@ export interface VirtualEntityCreateDto {
   name: string
   email: string
   jobTitle: string
-  personality: string
-  scheduleCron: string
+  personality?: string
+  scheduleCron?: string
   contextWindowDays: number
 }
 
diff --git a/frontend/src/pages/EntitiesPage.tsx b/frontend/src/pages/EntitiesPage.tsx
index 1353eef..ca9c239 100644
--- a/frontend/src/pages/EntitiesPage.tsx
+++ b/frontend/src/pages/EntitiesPage.tsx
@@ -18,7 +18,6 @@ export default function EntitiesPage() {
     email: '',
     jobTitle: '',
     personality: '',
-    scheduleCron: '',
     contextWindowDays: 3,
   })
 
@@ -27,7 +26,7 @@ export default function EntitiesPage() {
     onSuccess: (createdEntity) => {
       queryClient.invalidateQueries({ queryKey: ['entities'] })
       setDialogOpen(false)
-      setForm({ name: '', email: '', jobTitle: '', personality: '', scheduleCron: '', contextWindowDays: 3 })
+      setForm({ name: '', email: '', jobTitle: '', personality: '', contextWindowDays: 3 })
       navigate(`/entities/${createdEntity.id}`)
     },
   })
@@ -93,50 +92,68 @@ export default function EntitiesPage() {
               }}
               className="space-y-3"
             >
-              <input
-                placeholder="Name"
-                value={form.name}
-                onChange={(e) => setForm({ ...form, name: e.target.value })}
-                className="block w-full rounded border border-slate-700 bg-slate-900 px-3 py-2 text-sm text-slate-100"
-                required
-              />
-              <input
-                placeholder="Email"
-                type="email"
-                value={form.email}
-                onChange={(e) => setForm({ ...form, email: e.target.value })}
-                className="block w-full rounded border border-slate-700 bg-slate-900 px-3 py-2 text-sm text-slate-100"
-                required
-              />
-              <input
-                placeholder="Job Title"
-                value={form.jobTitle}
-                onChange={(e) => setForm({ ...form, jobTitle: e.target.value })}
-                className="block w-full rounded border border-slate-700 bg-slate-900 px-3 py-2 text-sm text-slate-100"
-                required
-              />
-              <textarea
-                placeholder="Personality"
-                value={form.personality}
-                onChange={(e) => setForm({ ...form, personality: e.target.value })}
-                className="block w-full rounded border border-slate-700 bg-slate-900 px-3 py-2 text-sm text-slate-100"
-              />
-              <input
-                placeholder="Schedule Cron (e.g. 0 9 * * 1)"
-                value={form.scheduleCron}
-                onChange={(e) => setForm({ ...form, scheduleCron: e.target.value })}
-                className="block w-full rounded border border-slate-700 bg-slate-900 px-3 py-2 text-sm text-slate-100"
-                required
-              />
-              <input
-                type="number"
-                placeholder="Context Window Days"
-                value={form.contextWindowDays}
-                onChange={(e) => setForm({ ...form, contextWindowDays: Number(e.target.value) })}
-                className="block w-full rounded border border-slate-700 bg-slate-900 px-3 py-2 text-sm text-slate-100"
-                min={1}
-                required
-              />
+              <div>
+                <label htmlFor="entity-name" className="mb-1 block text-sm font-medium text-slate-200">
+                  Entity Name
+                </label>
+                <input
+                  id="entity-name"
+                  value={form.name}
+                  onChange={(e) => setForm({ ...form, name: e.target.value })}
+                  className="block w-full rounded border border-slate-700 bg-slate-900 px-3 py-2 text-sm text-slate-100"
+                  required
+                />
+              </div>
+              <div>
+                <label htmlFor="entity-email" className="mb-1 block text-sm font-medium text-slate-200">
+                  Sender Email
+                </label>
+                <input
+                  id="entity-email"
+                  type="email"
+                  value={form.email}
+                  onChange={(e) => setForm({ ...form, email: e.target.value })}
+                  className="block w-full rounded border border-slate-700 bg-slate-900 px-3 py-2 text-sm text-slate-100"
+                  required
+                />
+              </div>
+              <div>
+                <label htmlFor="entity-job-title" className="mb-1 block text-sm font-medium text-slate-200">
+                  Job Title
+                </label>
+                <input
+                  id="entity-job-title"
+                  value={form.jobTitle}
+                  onChange={(e) => setForm({ ...form, jobTitle: e.target.value })}
+                  className="block w-full rounded border border-slate-700 bg-slate-900 px-3 py-2 text-sm text-slate-100"
+                  required
+                />
+              </div>
+              <div>
+                <label htmlFor="entity-personality" className="mb-1 block text-sm font-medium text-slate-200">
+                  Personality Notes
+                </label>
+                <textarea
+                  id="entity-personality"
+                  value={form.personality}
+                  onChange={(e) => setForm({ ...form, personality: e.target.value })}
+                  className="block w-full rounded border border-slate-700 bg-slate-900 px-3 py-2 text-sm text-slate-100"
+                />
+              </div>
+              <div>
+                <label htmlFor="entity-context-window" className="mb-1 block text-sm font-medium text-slate-200">
+                  Default Email Context Window (days)
+                </label>
+                <input
+                  id="entity-context-window"
+                  type="number"
+                  value={form.contextWindowDays}
+                  onChange={(e) => setForm({ ...form, contextWindowDays: Number(e.target.value) })}
+                  className="block w-full rounded border border-slate-700 bg-slate-900 px-3 py-2 text-sm text-slate-100"
+                  min={1}
+                  required
+                />
+              </div>
               <div className="flex justify-end gap-2 pt-2">
                 <button
                   type="button"