From 91f21e149b5b54d5cd79c6c3a7708ecfb0b4d1cd Mon Sep 17 00:00:00 2001
From: Elian Doran <contact@eliandoran.me>
Date: Sat, 20 Sep 2025 11:46:23 +0300
Subject: [PATCH] chore(react/type_widget): bring back focusing after tab
 switch

---
 apps/client/src/widgets/NoteDetail.tsx              | 13 +++++++++++--
 apps/client/src/widgets/note_detail.ts.bak          | 11 -----------
 apps/client/src/widgets/type_widgets/code/Code.tsx  |  6 ++++++
 .../src/widgets/type_widgets_old/type_widget.ts     | 11 -----------
 4 files changed, 17 insertions(+), 24 deletions(-)

diff --git a/apps/client/src/widgets/NoteDetail.tsx b/apps/client/src/widgets/NoteDetail.tsx
index b351904b6..0ae5c15d2 100644
--- a/apps/client/src/widgets/NoteDetail.tsx
+++ b/apps/client/src/widgets/NoteDetail.tsx
@@ -1,8 +1,8 @@
 import { NoteType } from "@triliumnext/commons";
-import { useNoteContext } from "./react/hooks"
+import { useNoteContext, useTriliumEvent } from "./react/hooks"
 import FNote from "../entities/fnote";
 import protected_session_holder from "../services/protected_session_holder";
-import { useContext, useEffect, useMemo, useState } from "preact/hooks";
+import { useEffect, useState } from "preact/hooks";
 import NoteContext from "../components/note_context";
 import Empty from "./type_widgets/Empty";
 import { VNode } from "preact";
@@ -28,6 +28,7 @@ type ExtendedNoteType = Exclude<NoteType, "launcher" | "text" | "code"> | "empty
  *
  * Apart from that:
  * - It applies a full-height style depending on the content type (e.g. canvas notes).
+ * - Focuses the content when switching tabs.
  */
 export default function NoteDetail() {
     const { note, type, noteContext, parentComponent } = useNoteInfo();
@@ -43,6 +44,14 @@ export default function NoteDetail() {
     };
     useEffect(() => setCorrespondingWidget(getCorrespondingWidget(type, props)), [ note, viewScope, type ]);
 
+    // Automatically focus the editor.
+    useTriliumEvent("activeNoteChanged", () => {
+        // Restore focus to the editor when switching tabs, but only if the note tree is not already focused.
+        if (!document.activeElement?.classList.contains("fancytree-title")) {
+            parentComponent.triggerCommand("focusOnDetail", { ntxId });
+        }
+    });
+
     return (
         <div class={`note-detail ${isFullHeight ? "full-height" : ""}`}>
             {correspondingWidget || <p>Note detail goes here! {note?.title} of {type}</p>}
diff --git a/apps/client/src/widgets/note_detail.ts.bak b/apps/client/src/widgets/note_detail.ts.bak
index b85c7263d..c023217bd 100644
--- a/apps/client/src/widgets/note_detail.ts.bak
+++ b/apps/client/src/widgets/note_detail.ts.bak
@@ -138,17 +138,6 @@ export default class NoteDetailWidget extends NoteContextAwareWidget {
         return this.typeWidgets[this.type];
     }
 
-    async focusOnDetailEvent({ ntxId }: EventData<"focusOnDetail">) {
-        if (this.noteContext?.ntxId !== ntxId) {
-            return;
-        }
-
-        await this.refresh();
-        const widget = this.getTypeWidget();
-        await widget.initialized;
-        widget.focus();
-    }
-
     async beforeNoteSwitchEvent({ noteContext }: EventData<"beforeNoteSwitch">) {
         if (this.isNoteContext(noteContext.ntxId)) {
             await this.spacedUpdate.updateNowIfNecessary();
diff --git a/apps/client/src/widgets/type_widgets/code/Code.tsx b/apps/client/src/widgets/type_widgets/code/Code.tsx
index 731141f4a..0c9bb1559 100644
--- a/apps/client/src/widgets/type_widgets/code/Code.tsx
+++ b/apps/client/src/widgets/type_widgets/code/Code.tsx
@@ -138,6 +138,12 @@ function CodeEditor({ note, parentComponent, ntxId, containerRef: externalContai
         editor.focus();
     });
 
+    useTriliumEvent("focusOnDetail", ({ ntxId: eventNtxId }) => {
+        console.log("Focus on ", ntxId, eventNtxId)
+        if (eventNtxId !== ntxId) return;
+        codeEditorRef.current?.focus();
+    });
+
     return <CodeMirror
         {...editorProps}
         editorRef={codeEditorRef}
diff --git a/apps/client/src/widgets/type_widgets_old/type_widget.ts b/apps/client/src/widgets/type_widgets_old/type_widget.ts
index 7f72c8712..a5e66221e 100644
--- a/apps/client/src/widgets/type_widgets_old/type_widget.ts
+++ b/apps/client/src/widgets/type_widgets_old/type_widget.ts
@@ -69,17 +69,6 @@ export default abstract class TypeWidget extends NoteContextAwareWidget {
         }
     }
 
-    activeNoteChangedEvent() {
-        if (!this.isActiveNoteContext()) {
-            return;
-        }
-
-        // Restore focus to the editor when switching tabs, but only if the note tree is not already focused.
-        if (!document.activeElement?.classList.contains("fancytree-title")) {
-            this.focus();
-        }
-    }
-
     /**
      * {@inheritdoc}
      *