From 497d6979d01b772afefba595e2845e71fb169b06 Mon Sep 17 00:00:00 2001
From: Mary Kate Fain <mk@marykatefain.com>
Date: Sat, 28 Mar 2026 16:01:17 -0500
Subject: [PATCH] Fix custom profile tab form retaining fields from previous
 tab

The ProfileTabEditModal reset form state inside a handleOpenChange
callback, but Radix Dialog does not fire onOpenChange when opened
programmatically via the `open` prop. This meant that when a parent
component set `open={true}` (e.g. after clicking 'Add custom tab'),
the reset logic never ran and the form kept stale values from the
last edit session.

Replace the handleOpenChange reset with a useEffect that triggers
whenever `open` transitions to true, ensuring the form always
initializes from the current `tab` prop (or clean defaults for a
new tab).

Closes #196
---
 src/components/ProfileTabEditModal.tsx | 17 +++++++++--------
 1 file changed, 9 insertions(+), 8 deletions(-)

diff --git a/src/components/ProfileTabEditModal.tsx b/src/components/ProfileTabEditModal.tsx
index cc87053e..32774939 100644
--- a/src/components/ProfileTabEditModal.tsx
+++ b/src/components/ProfileTabEditModal.tsx
@@ -7,7 +7,7 @@
  * Streamlined for profile tabs: only Search Query, Author Scope (Me / Contacts / People / Global),
  * and multi-select Kind picker.
  */
-import { useState, useMemo, useCallback } from 'react';
+import { useState, useMemo, useCallback, useEffect } from 'react';
 import {
   Loader2, Check, Globe, Users, User, UserSearch,
 } from 'lucide-react';
@@ -156,18 +156,19 @@ export function ProfileTabEditModal({
     }
   }, []);
 
-  // Reset state when modal opens
-  const handleOpenChange = (o: boolean) => {
-    if (o) {
-      setLabel(tab?.label ?? '');
+  // Reset form state whenever the modal opens or the tab being edited changes.
+  // This runs as an effect rather than inside onOpenChange because the Dialog
+  // does not fire onOpenChange when opened programmatically via the `open` prop.
+  useEffect(() => {
+    if (open) {
       const f = tab ? tab.filter : { authors: [ownerPubkey] };
+      setLabel(tab?.label ?? '');
       setQuery(typeof f.search === 'string' ? f.search : '');
       setAuthorScope(filterToScope(f, ownerPubkey));
       setPeoplePubkeys(filterToPeoplePubkeys(f, ownerPubkey));
       setSelectedKinds(parseSelectedKinds(f));
     }
-    onOpenChange(o);
-  };
+  }, [open, tab, ownerPubkey]);
 
   const handleSave = async () => {
     if (!label.trim() || isPending) return;
@@ -190,7 +191,7 @@ export function ProfileTabEditModal({
   };
 
   return (
-    <Dialog open={open} onOpenChange={handleOpenChange}>
+    <Dialog open={open} onOpenChange={onOpenChange}>
       <DialogContent ref={dialogContentRef} className="max-w-sm max-h-[90dvh] overflow-y-auto">
         <PortalContainerProvider value={portalContainer}>
         <DialogHeader>