From b0ca3c6d5821d18d69c9faa637c660aac582d60d Mon Sep 17 00:00:00 2001
From: akumatus <akumatus@gmail.com>
Date: Wed, 20 Nov 2024 06:25:36 +0000
Subject: [PATCH] fix(core): linked doc named input box has excessive desire to
 select all (#8861)

Fix issue [AF-1706](https://linear.app/affine-design/issue/AF-1706).
---
 .../component/src/hooks/focus-and-select.ts   |  2 +-
 .../component/src/ui/input/row-input.tsx      | 23 +++++++++++--------
 .../specs/custom/spec-patchers.tsx            |  3 ++-
 3 files changed, 16 insertions(+), 12 deletions(-)

diff --git a/packages/frontend/component/src/hooks/focus-and-select.ts b/packages/frontend/component/src/hooks/focus-and-select.ts
index 6f3242e5c6..8dc2411ad9 100644
--- a/packages/frontend/component/src/hooks/focus-and-select.ts
+++ b/packages/frontend/component/src/hooks/focus-and-select.ts
@@ -21,7 +21,7 @@ export const useAutoFocus = <T extends HTMLElement = HTMLElement>(
 export const useAutoSelect = <T extends HTMLInputElement = HTMLInputElement>(
   autoSelect?: boolean
 ) => {
-  const ref = useAutoFocus<T>(autoSelect);
+  const ref = useRef<T | null>(null);
 
   useLayoutEffect(() => {
     if (ref.current && autoSelect) {
diff --git a/packages/frontend/component/src/ui/input/row-input.tsx b/packages/frontend/component/src/ui/input/row-input.tsx
index b3c2cea8fc..6b6da253ad 100644
--- a/packages/frontend/component/src/ui/input/row-input.tsx
+++ b/packages/frontend/component/src/ui/input/row-input.tsx
@@ -45,17 +45,20 @@ export const RowInput = forwardRef<HTMLInputElement, RowInputProps>(
     const focusRef = useAutoFocus<HTMLInputElement>(autoFocus);
     const selectRef = useAutoSelect<HTMLInputElement>(autoSelect);
 
-    const inputRef = (el: HTMLInputElement | null) => {
-      focusRef.current = el;
-      selectRef.current = el;
-      if (upstreamRef) {
-        if (typeof upstreamRef === 'function') {
-          upstreamRef(el);
-        } else {
-          upstreamRef.current = el;
+    const inputRef = useCallback(
+      (el: HTMLInputElement | null) => {
+        focusRef.current = el;
+        selectRef.current = el;
+        if (upstreamRef) {
+          if (typeof upstreamRef === 'function') {
+            upstreamRef(el);
+          } else {
+            upstreamRef.current = el;
+          }
         }
-      }
-    };
+      },
+      [focusRef, selectRef, upstreamRef]
+    );
 
     // use native blur event to get event after unmount
     // don't use useLayoutEffect here, because the cleanup function will be called before unmount
diff --git a/packages/frontend/core/src/components/blocksuite/block-suite-editor/specs/custom/spec-patchers.tsx b/packages/frontend/core/src/components/blocksuite/block-suite-editor/specs/custom/spec-patchers.tsx
index 580184947f..a8d9c7f082 100644
--- a/packages/frontend/core/src/components/blocksuite/block-suite-editor/specs/custom/spec-patchers.tsx
+++ b/packages/frontend/core/src/components/blocksuite/block-suite-editor/specs/custom/spec-patchers.tsx
@@ -169,10 +169,10 @@ export function patchNotificationService({
           <div>
             <span style={{ marginBottom: 12 }}>{toReactNode(message)}</span>
             <Input
+              autoSelect={true}
               placeholder={placeholder}
               defaultValue={value}
               onChange={e => (value = e)}
-              ref={input => input?.select()}
             />
           </div>
         );
@@ -190,6 +190,7 @@ export function patchNotificationService({
           onCancel: () => {
             resolve(null);
           },
+          autoFocusConfirm: false,
         });
         abort?.addEventListener('abort', () => {
           resolve(null);