From 7d308a65e05c65d418eaf2aaa5caa9d300734692 Mon Sep 17 00:00:00 2001
From: Test <test@test.com>
Date: Tue, 7 Apr 2026 17:47:15 +0200
Subject: [PATCH] fix: hide title section for untitled drafts

---
 src/components/Editor.css        | 10 +++++-----
 src/components/Editor.test.tsx   | 27 +++++++++++++++++++++++++++
 src/components/EditorContent.tsx |  9 +++++++--
 3 files changed, 39 insertions(+), 7 deletions(-)

diff --git a/src/components/Editor.css b/src/components/Editor.css
index 7752e250..0aa275e3 100644
--- a/src/components/Editor.css
+++ b/src/components/Editor.css
@@ -361,13 +361,13 @@
   margin-top: 2px;
 }
 
-/* When TitleField is shown (no H1 in body), hide the first H1 heading in
-   BlockNote to avoid duplicate title display. When hasH1 is set, the
-   TitleField is hidden and the H1 in the editor serves as the title. */
-.title-section:not([data-has-h1]) ~ .editor__blocknote-container [data-node-type="blockContainer"]:first-child [data-content-type="heading"][data-level="1"] {
+/* When the legacy title UI is shown, hide the first H1 heading in BlockNote
+   to avoid duplicate title display. Otherwise the editor's H1 remains visible
+   and serves as the title surface. */
+.title-section[data-title-ui-visible] ~ .editor__blocknote-container [data-node-type="blockContainer"]:first-child [data-content-type="heading"][data-level="1"] {
   display: none;
 }
-.title-section:not([data-has-h1]) ~ .editor__blocknote-container [data-node-type="blockContainer"]:first-child:has([data-content-type="heading"][data-level="1"]) {
+.title-section[data-title-ui-visible] ~ .editor__blocknote-container [data-node-type="blockContainer"]:first-child:has([data-content-type="heading"][data-level="1"]) {
   display: none;
 }
 
diff --git a/src/components/Editor.test.tsx b/src/components/Editor.test.tsx
index 48eac86b..0bdd7736 100644
--- a/src/components/Editor.test.tsx
+++ b/src/components/Editor.test.tsx
@@ -182,6 +182,33 @@ describe('Editor', () => {
     expect(screen.getByTestId('blocknote-view')).toBeInTheDocument()
   })
 
+  it('hides the legacy title field for untitled draft notes', () => {
+    const draftEntry: VaultEntry = {
+      ...mockEntry,
+      path: '/vault/untitled-note-1700000000.md',
+      filename: 'untitled-note-1700000000.md',
+      title: 'Untitled Note 1700000000',
+      hasH1: false,
+    }
+    const draftTab = {
+      entry: draftEntry,
+      content: '---\ntype: Note\nstatus: Active\n---\n',
+    }
+
+    render(
+      <Editor
+        {...defaultProps}
+        tabs={[draftTab]}
+        activeTabPath={draftEntry.path}
+        entries={[draftEntry]}
+        getNoteStatus={() => 'unsaved'}
+      />
+    )
+
+    expect(screen.queryByTestId('title-field-input')).not.toBeInTheDocument()
+    expect(screen.getByTestId('blocknote-view')).toBeInTheDocument()
+  })
+
   it('renders diff toggle button when file is modified', () => {
     render(
       <Editor
diff --git a/src/components/EditorContent.tsx b/src/components/EditorContent.tsx
index 51beb8da..9ee3e751 100644
--- a/src/components/EditorContent.tsx
+++ b/src/components/EditorContent.tsx
@@ -157,6 +157,7 @@ export function EditorContent({
   activeTab, isLoadingNewTab, entries, editor,
   diffMode, diffContent, onToggleDiff,
   rawMode, onToggleRaw, onRawContentChange, onSave,
+  activeStatus,
   onNavigateWikilink, onEditorChange, vaultPath,
   rawLatestContentRef, onTitleChange,
   onSetNoteIcon, onRemoveNoteIcon,
@@ -173,6 +174,10 @@ export function EditorContent({
   const showEditor = !diffMode && !effectiveRawMode
   const entryIcon = activeTab?.entry.icon ?? null
   const emojiIcon = entryIcon && isEmoji(entryIcon) ? entryIcon : null
+  const isUntitledDraft = !!activeTab
+    && activeTab.entry.filename.startsWith('untitled-')
+    && (activeStatus === 'new' || activeStatus === 'unsaved' || activeStatus === 'pendingSave')
+  const showTitleSection = !hasH1 && !isUntitledDraft
 
   const titleSectionRef = useRef<HTMLDivElement | null>(null)
   const breadcrumbBarRef = useRef<HTMLDivElement | null>(null)
@@ -233,8 +238,8 @@ export function EditorContent({
       {showEditor && (
         <div className="editor-scroll-area" style={cssVars as React.CSSProperties}>
           <div className="editor-content-wrapper">
-            <div ref={titleSectionRef} className="title-section" data-has-h1={hasH1 || undefined}>
-              {!hasH1 && (
+            <div ref={titleSectionRef} className="title-section" data-title-ui-visible={showTitleSection || undefined}>
+              {showTitleSection && (
                 <>
                   {!emojiIcon && (
                     <div className="title-section__add-icon">