From 62513ee22edd78978cae428502a12c3268e5f1d5 Mon Sep 17 00:00:00 2001
From: Justin Paul <justin@jpaul.me>
Date: Mon, 8 Jun 2026 21:29:27 -0400
Subject: [PATCH] Person page: make marriage-event spouse picker searchable
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

Adding a marriage/partnership event used a plain <select> for the spouse,
which is unusable on a large tree — you can't search, only scroll. Swap it
for the existing PersonCombobox (already used by the relationship form), which
filters by name as you type. No onCreate, so it still resolves to an existing
person id, which is what the partnership-event handler requires.

Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>
Signed-off-by: Justin Paul <justin@jpaul.me>
---
 .../app/trees/[id]/persons/[personId]/page.tsx   | 16 +++++-----------
 1 file changed, 5 insertions(+), 11 deletions(-)

diff --git a/frontend/app/trees/[id]/persons/[personId]/page.tsx b/frontend/app/trees/[id]/persons/[personId]/page.tsx
index 2278492..8c0bad2 100644
--- a/frontend/app/trees/[id]/persons/[personId]/page.tsx
+++ b/frontend/app/trees/[id]/persons/[personId]/page.tsx
@@ -1060,18 +1060,12 @@ export default function PersonDetailPage() {
             {isPartnershipType(evType) && (
               <label className="flex flex-col gap-1">
                 <span className="text-xs text-[var(--muted)]">Spouse / partner</span>
-                <select
-                  className={fieldCls}
+                <PersonCombobox
+                  people={others}
                   value={evSpouse}
-                  onChange={(e) => setEvSpouse(e.target.value)}
-                >
-                  <option value="">— choose —</option>
-                  {others.map((p) => (
-                    <option key={p.id} value={p.id}>
-                      {p.primary_name ?? "Unnamed"}
-                    </option>
-                  ))}
-                </select>
+                  onChange={setEvSpouse}
+                  placeholder="Search for a spouse…"
+                />
               </label>
             )}
             <label className="flex flex-col gap-1">
-- 
2.52.0