BuzzbeeSCD/ProjectE
1
0
Fork 0
Code Issues Pull Requests Actions 1 Packages Projects Releases Wiki Activity

fix: use uncontrolled input for note title to prevent focus leak to search field

Browse Source
This commit is contained in:
Hermes
2026-08-01 12:51:50 +00:00
parent ff2611ce18
commit 445f5e1257
2 changed files with 66 additions and 19 deletions
Download Patch File Download Diff File Expand all files Collapse all files
apps/web/src/routes/_app/notes.tsx
+10 -19
View File
@@ -53,10 +53,8 @@ function NotesPage() {
const queryClient = useQueryClient();
const [search, setSearch] = useState("");
const [selectedNote, setSelectedNote] = useState<Note | null>(null);
const [titleDraft, setTitleDraft] = useState("");
const [editorContent, setEditorContent] = useState("");
const saveTimerRef = useRef<ReturnType<typeof setTimeout> | null>(null);
const titleTimerRef = useRef<ReturnType<typeof setTimeout> | null>(null);
const [showBacklinks, setShowBacklinks] = useState(false);
const [showVersions, setShowVersions] = useState(false);
@@ -95,11 +93,9 @@ function NotesPage() {
try {
const detail = await api.get<Note>("/notes/" + note.id);
setSelectedNote(detail);
setTitleDraft(detail.title);
setEditorContent(detail.content || "");
} catch {
setSelectedNote(note);
setTitleDraft(note.title);
setEditorContent(note.content || "");
}
setShowBacklinks(false);
@@ -116,16 +112,6 @@ function NotesPage() {
}, 500);
}, [selectedNote, updateMutation]);
const handleTitleChange = (title: string) => {
setTitleDraft(title);
};
const handleTitleBlur = () => {
if (selectedNote && titleDraft !== selectedNote.title) {
updateMutation.mutate({ id: selectedNote.id, data: { title: titleDraft } });
setSelectedNote({ ...selectedNote, title: titleDraft });
}
};
return (
<div className="flex h-[calc(100vh-8rem)] -m-4 md:-m-6">
@@ -177,11 +163,16 @@ function NotesPage() {
{selectedNote ? (
<>
<div className="flex items-center gap-2 p-3 border-b">
<Input
value={titleDraft}
onChange={(e) => handleTitleChange(e.target.value)}
onBlur={handleTitleBlur}
className="text-lg font-semibold border-0 focus-visible:ring-0 px-0"
<input
key={selectedNote?.id || 'none'}
defaultValue={selectedNote?.title || ''}
onBlur={(e) => {
if (selectedNote && e.target.value !== selectedNote.title) {
updateMutation.mutate({ id: selectedNote.id, data: { title: e.target.value } });
setSelectedNote({ ...selectedNote, title: e.target.value });
}
}}
className="flex h-9 w-full rounded-md border-0 bg-transparent px-0 py-1 text-lg font-semibold text-base shadow-none transition-colors file:border-0 file:bg-transparent file:text-sm file:font-medium file:text-foreground placeholder:text-muted-foreground focus-visible:outline-none focus-visible:ring-0 disabled:cursor-not-allowed disabled:opacity-50"
/>
<div className="flex items-center gap-1 shrink-0">
<Button variant="ghost" size="icon" className="h-8 w-8" onClick={() => setShowBacklinks(!showBacklinks)} aria-label="Backlinks">
fix_notes.py
+56
View File
@@ -0,0 +1,56 @@
import sys
with open(sys.argv[1], 'r') as f:
content = f.read()
# Replace the title input section to use uncontrolled input with ref
old_title_section = ''' <div className="flex items-center gap-2 p-3 border-b">
<Input
value={titleDraft}
onChange={(e) => handleTitleChange(e.target.value)}
onBlur={handleTitleBlur}
className="text-lg font-semibold border-0 focus-visible:ring-0 px-0"
/>'''
new_title_section = ''' <div className="flex items-center gap-2 p-3 border-b">
<input
key={selectedNote?.id || 'none'}
defaultValue={selectedNote?.title || ''}
onBlur={(e) => {
if (selectedNote && e.target.value !== selectedNote.title) {
updateMutation.mutate({ id: selectedNote.id, data: { title: e.target.value } });
setSelectedNote({ ...selectedNote, title: e.target.value });
}
}}
className="flex h-9 w-full rounded-md border-0 bg-transparent px-0 py-1 text-lg font-semibold text-base shadow-none transition-colors file:border-0 file:bg-transparent file:text-sm file:font-medium file:text-foreground placeholder:text-muted-foreground focus-visible:outline-none focus-visible:ring-0 disabled:cursor-not-allowed disabled:opacity-50"
/>'''
content = content.replace(old_title_section, new_title_section, 1)
# Remove unused handleTitleChange and handleTitleBlur
old_handle = ''' const handleTitleChange = (title: string) => {
setTitleDraft(title);
};
const handleTitleBlur = () => {
if (selectedNote && titleDraft !== selectedNote.title) {
updateMutation.mutate({ id: selectedNote.id, data: { title: titleDraft } });
setSelectedNote({ ...selectedNote, title: titleDraft });
}
};
'''
content = content.replace(old_handle, '', 1)
# Remove unused titleDraft state
content = content.replace(' const [titleDraft, setTitleDraft] = useState("");\n', '', 1)
# Remove unused titleTimerRef
content = content.replace(' const titleTimerRef = useRef<ReturnType<typeof setTimeout> | null>(null);\n', '', 1)
# Remove setTitleDraft calls from selectNote
content = content.replace(' setTitleDraft(detail.title);\n', '', 1)
content = content.replace(' setTitleDraft(note.title);\n', '', 1)
with open(sys.argv[1], 'w') as f:
f.write(content)
print('Done')