Просмотр исходного кода

refactor: simplify renaming logic in usePlaceholderRenameEffect hook

Yuki Takei 4 месяцев назад
Родитель
Сommit
8c52350908

+ 0 - 1
apps/app/src/features/page-tree/hooks/use-page-create.tsx

@@ -38,7 +38,6 @@ const CreateButtonInner: FC<CreateButtonInnerProps> = ({
 
 
   const page = item.getItemData();
   const page = item.getItemData();
   const isUsersTopPage = pagePathUtils.isUsersTopPage(page.path ?? '');
   const isUsersTopPage = pagePathUtils.isUsersTopPage(page.path ?? '');
-
   if (isUsersTopPage) {
   if (isUsersTopPage) {
     return null;
     return null;
   }
   }

+ 9 - 7
apps/app/src/features/page-tree/hooks/use-placeholder-rename-effect.ts

@@ -30,28 +30,30 @@ export const usePlaceholderRenameEffect = ({
 
 
   // Track if renaming mode was ever activated for this placeholder
   // Track if renaming mode was ever activated for this placeholder
   const wasRenamingRef = useRef(false);
   const wasRenamingRef = useRef(false);
-  const isRenamingNow = item.isRenaming();
+  const isRenaming = item.isRenaming();
 
 
   // Start renaming mode on placeholder node to enable getRenameInputProps()
   // Start renaming mode on placeholder node to enable getRenameInputProps()
+  // Note: isRenaming is included in deps to ensure this effect re-runs
+  // when renaming state changes (e.g., after rapid clicks reset the state)
   useEffect(() => {
   useEffect(() => {
-    if (isPlaceholder && !item.isRenaming()) {
+    if (isPlaceholder && !isRenaming) {
       item.startRenaming();
       item.startRenaming();
     }
     }
-  }, [isPlaceholder, item]);
+  }, [isPlaceholder, item, isRenaming]);
 
 
   // Track when renaming becomes active
   // Track when renaming becomes active
   useEffect(() => {
   useEffect(() => {
-    if (isPlaceholder && isRenamingNow) {
+    if (isPlaceholder && isRenaming) {
       wasRenamingRef.current = true;
       wasRenamingRef.current = true;
     }
     }
-  }, [isPlaceholder, isRenamingNow]);
+  }, [isPlaceholder, isRenaming]);
 
 
   // Cancel creating when renaming mode ends on placeholder node (Esc key pressed)
   // Cancel creating when renaming mode ends on placeholder node (Esc key pressed)
   useEffect(() => {
   useEffect(() => {
     // Only cancel if renaming was previously active and is now inactive
     // Only cancel if renaming was previously active and is now inactive
-    if (isPlaceholder && wasRenamingRef.current && !isRenamingNow) {
+    if (isPlaceholder && wasRenamingRef.current && !isRenaming) {
       onCancelCreate();
       onCancelCreate();
       wasRenamingRef.current = false;
       wasRenamingRef.current = false;
     }
     }
-  }, [isPlaceholder, isRenamingNow, onCancelCreate]);
+  }, [isPlaceholder, isRenaming, onCancelCreate]);
 };
 };