From 4dad78aa867f874dcae583d631b716b2995baeed Mon Sep 17 00:00:00 2001
From: shad <shad@flow-master.ai>
Date: Sun, 14 Jun 2026 12:28:39 +0400
Subject: [PATCH] feat(login): three real EA2-seeded personas as quick-switch
 chips
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

Seeded HR/CEO/IT directors as real superuser rows in auth_service.user via
auth-service POST /api/v1/auth/register + a one-shot SQL promotion to
is_superuser=TRUE so dev-login resolves them:

  ceo-head@flow-master.ai  → Mariana Cole (Chief Executive)
  hr-head@flow-master.ai   → Aisha Khan   (HR Director)
  it-head@flow-master.ai   → Rohan Patel  (IT Director)

Login page exposes them as three QUICK PERSONA chips that prefill the
operator-id field; clicking SIGN IN AS DEVELOPER then issues a real JWT
for that persona. No mock users.
---
 src/index.css        | 35 +++++++++++++++++++++++++++++++++++
 src/scenes/Login.tsx | 24 ++++++++++++++++++++++++
 2 files changed, 59 insertions(+)

diff --git a/src/index.css b/src/index.css
index 8b51093..a6be18e 100644
--- a/src/index.css
+++ b/src/index.css
@@ -1296,6 +1296,41 @@ select.studio-input { background: var(--bp-paper); }
   flex-direction: column;
   gap: 12px;
 }
+.login-personas {
+  margin-top: 24px;
+  padding-top: 16px;
+  border-top: 1px solid var(--bp-navy);
+  border-top-color: color-mix(in srgb, var(--bp-navy) 20%, transparent);
+}
+.login-persona-label {
+  font-family: var(--bp-mono);
+  font-size: 10px;
+  letter-spacing: 0.1em;
+  color: var(--bp-muted);
+  margin-bottom: 8px;
+}
+.login-persona-row {
+  display: flex;
+  flex-wrap: wrap;
+  gap: 6px;
+}
+.persona-chip {
+  flex: 1 1 auto;
+  padding: 6px 10px;
+  background: var(--bp-paper);
+  border: 1px solid var(--bp-navy);
+  color: var(--bp-navy);
+  font-family: var(--bp-mono);
+  font-size: 10px;
+  letter-spacing: 0.04em;
+  cursor: pointer;
+  transition: background 0.1s;
+}
+.persona-chip:hover:not(:disabled) {
+  background: var(--bp-amber);
+  color: var(--bp-paper);
+}
+.persona-chip:disabled { opacity: 0.5; cursor: not-allowed; }
 .sso-btn {
   display: flex;
   align-items: center;
diff --git a/src/scenes/Login.tsx b/src/scenes/Login.tsx
index 54ba939..211f4b1 100644
--- a/src/scenes/Login.tsx
+++ b/src/scenes/Login.tsx
@@ -137,6 +137,30 @@ export default function Login() {
             </button>
           )}
         </div>
+
+        {devLoginEnabled && (
+          <div className="login-personas">
+            <div className="login-persona-label">QUICK PERSONA</div>
+            <div className="login-persona-row">
+              {[
+                { key: "ceo", email: "ceo-head@flow-master.ai", title: "Mariana Cole · CEO" },
+                { key: "hr", email: "hr-head@flow-master.ai", title: "Aisha Khan · HR" },
+                { key: "it", email: "it-head@flow-master.ai", title: "Rohan Patel · IT" },
+              ].map((p) => (
+                <button
+                  key={p.key}
+                  type="button"
+                  className="persona-chip"
+                  onClick={() => setEmail(p.email)}
+                  disabled={loading}
+                  title={p.email}
+                >
+                  {p.title}
+                </button>
+              ))}
+            </div>
+          </div>
+        )}
       </div>
     </div>
   );