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

+ 1 - 4
apps/app/src/features/openai/client/components/AiAssistant/AiAssistantManagementModal/PageTreeSelectionTree.tsx

@@ -27,10 +27,7 @@ export const PageTreeSelectionTree = (props: Props): JSX.Element => {
   // Scroll container for virtualization
   const [scrollerElem, setScrollerElem] = useState<HTMLElement | null>(null);
 
-  const estimateTreeItemSize = useCallback(
-    () => treeItemWithCheckboxSize,
-    [],
-  );
+  const estimateTreeItemSize = useCallback(() => treeItemWithCheckboxSize, []);
 
   return (
     <div className="page-tree-container" ref={setScrollerElem}>

+ 7 - 5
apps/app/src/features/openai/client/components/AiAssistant/AiAssistantManagementModal/TreeItemWithCheckbox.tsx

@@ -33,8 +33,12 @@ const TreeItemCheckbox: FC<TreeItemToolProps> = ({ item }) => {
   return (
     // biome-ignore lint/a11y/useKeyWithClickEvents: click handler only prevents propagation
     // biome-ignore lint/a11y/noStaticElementInteractions: wrapper div to stop click propagation
-    <div onClick={handleClick} className="form-check form-switch d-flex align-items-center">
-      <input className="form-check-input"
+    <div
+      onClick={handleClick}
+      className="form-check form-switch d-flex align-items-center"
+    >
+      <input
+        className="form-check-input"
         type="checkbox"
         role="switch"
         aria-checked={checkboxProps.checked ?? false}
@@ -46,9 +50,7 @@ const TreeItemCheckbox: FC<TreeItemToolProps> = ({ item }) => {
   );
 };
 
-export const TreeItemWithCheckbox: FC<
-  TreeItemWithCheckboxProps
-> = (props) => {
+export const TreeItemWithCheckbox: FC<TreeItemWithCheckboxProps> = (props) => {
   return (
     <TreeItemLayout
       {...props}

+ 1 - 5
apps/app/src/features/page-tree/components/SimpleItemContent.tsx

@@ -37,11 +37,7 @@ export const SimpleItemContent = ({
           >
             warning
           </span>
-          <UncontrolledTooltip
-            placement="top"
-            target={spanId}
-            fade={false}
-          >
+          <UncontrolledTooltip placement="top" target={spanId} fade={false}>
             {t('tooltip.operation.attention.rename')}
           </UncontrolledTooltip>
         </>

+ 2 - 8
apps/app/src/features/page-tree/components/TreeItemLayout.tsx

@@ -1,11 +1,5 @@
-import type {
-  JSX,
-  MouseEvent,
-} from 'react';
-import {
-  useCallback,
-  useMemo,
-} from 'react';
+import type { JSX, MouseEvent } from 'react';
+import { useCallback, useMemo } from 'react';
 
 import type { TreeItemProps, TreeItemToolProps } from '../interfaces';
 import { SimpleItemContent } from './SimpleItemContent';

+ 1 - 4
apps/app/src/features/page-tree/components/TreeNameInput.tsx

@@ -12,7 +12,6 @@ import {
 import { CREATING_PAGE_VIRTUAL_ID } from '../constants/_inner';
 import type { TreeItemToolProps } from '../interfaces';
 
-
 type TreeNameInputProps = {
   /**
    * Props from headless-tree's getRenameInputProps()
@@ -83,9 +82,7 @@ const TreeNameInputSubstance: FC<TreeNameInputProps> = ({
  * Tree item name input component for rename/create mode
  * Wraps TreeNameInputSubstance with headless-tree's item props
  */
-export const TreeNameInput: FC<TreeItemToolProps> = ({
-  item,
-}) => {
+export const TreeNameInput: FC<TreeItemToolProps> = ({ item }) => {
   const { t } = useTranslation();
   const inputValidator = useInputValidator(ValidationTarget.PAGE);
 

+ 26 - 15
apps/app/src/features/page-tree/hooks/use-page-dnd.tsx

@@ -1,7 +1,11 @@
 import type { CSSProperties, FC, ReactNode } from 'react';
 import { useCallback, useMemo } from 'react';
 import { pagePathUtils } from '@growi/core/dist/utils';
-import type { DragTarget, ItemInstance, TreeInstance } from '@headless-tree/core';
+import type {
+  DragTarget,
+  ItemInstance,
+  TreeInstance,
+} from '@headless-tree/core';
 import { atom, useAtomValue, useSetAtom } from 'jotai';
 import { basename, join } from 'pathe';
 
@@ -82,7 +86,10 @@ type DragLineProps = {
  * Drag line indicator component
  */
 const DragLine: FC<DragLineProps> = ({ style, className }) => (
-  <div style={style} className={`${styles['tree-drag-line']} ${className ?? ''}`} />
+  <div
+    style={style}
+    className={`${styles['tree-drag-line']} ${className ?? ''}`}
+  />
 );
 
 export type UsePageDndResult = {
@@ -193,7 +200,8 @@ export const usePageDnd = (): UsePageDndResult => {
       if (targetItem == null) return { success: false, errorType: 'unknown' };
 
       const targetPage = targetItem.getItemData();
-      if (targetPage.path == null) return { success: false, errorType: 'unknown' };
+      if (targetPage.path == null)
+        return { success: false, errorType: 'unknown' };
 
       // Collect parent IDs for tree invalidation
       const parentIdsToInvalidate = new Set<string>();
@@ -220,11 +228,11 @@ export const usePageDnd = (): UsePageDndResult => {
             isRenameRedirect: false,
             updateMetadata: true,
           });
-        }
-        catch (err) {
-          const errorType: PageMoveErrorType = (err as { code?: string }).code === 'operation__blocked'
-            ? 'operation_blocked'
-            : 'unknown';
+        } catch (err) {
+          const errorType: PageMoveErrorType =
+            (err as { code?: string }).code === 'operation__blocked'
+              ? 'operation_blocked'
+              : 'unknown';
           return { success: false, errorType };
         }
       }
@@ -260,13 +268,16 @@ export const usePageDnd = (): UsePageDndResult => {
     [isEnabled],
   );
 
-  return useMemo(() => ({
-    canDrag,
-    canDrop,
-    onDrop,
-    isEnabled,
-    renderDragLine,
-  }), [canDrag, canDrop, onDrop, isEnabled, renderDragLine]);
+  return useMemo(
+    () => ({
+      canDrag,
+      canDrop,
+      onDrop,
+      isEnabled,
+      renderDragLine,
+    }),
+    [canDrag, canDrop, onDrop, isEnabled, renderDragLine],
+  );
 };
 
 /**

+ 24 - 8
apps/app/src/features/page-tree/hooks/use-placeholder-rename-effect.spec.tsx

@@ -28,7 +28,9 @@ const createMockItem = (
     setIsRenaming: (value: boolean) => {
       isRenaming = value;
     },
-  } as unknown as ItemInstance<IPageForItem> & { setIsRenaming: (value: boolean) => void };
+  } as unknown as ItemInstance<IPageForItem> & {
+    setIsRenaming: (value: boolean) => void;
+  };
 
   return item;
 };
@@ -36,7 +38,9 @@ const createMockItem = (
 describe('usePlaceholderRenameEffect', () => {
   describe('when item is a placeholder', () => {
     test('should call startRenaming when placeholder is not in renaming mode', () => {
-      const mockItem = createMockItem(CREATING_PAGE_VIRTUAL_ID, { isRenaming: false });
+      const mockItem = createMockItem(CREATING_PAGE_VIRTUAL_ID, {
+        isRenaming: false,
+      });
       const onCancelCreate = vi.fn();
 
       renderHook(() =>
@@ -51,7 +55,9 @@ describe('usePlaceholderRenameEffect', () => {
     });
 
     test('should not call startRenaming when placeholder is already in renaming mode', () => {
-      const mockItem = createMockItem(CREATING_PAGE_VIRTUAL_ID, { isRenaming: true });
+      const mockItem = createMockItem(CREATING_PAGE_VIRTUAL_ID, {
+        isRenaming: true,
+      });
       const onCancelCreate = vi.fn();
 
       renderHook(() =>
@@ -66,7 +72,9 @@ describe('usePlaceholderRenameEffect', () => {
     });
 
     test('should call onCancelCreate when renaming mode ends (ESC key simulation)', () => {
-      const mockItem = createMockItem(CREATING_PAGE_VIRTUAL_ID, { isRenaming: false });
+      const mockItem = createMockItem(CREATING_PAGE_VIRTUAL_ID, {
+        isRenaming: false,
+      });
       const onCancelCreate = vi.fn();
 
       const { rerender } = renderHook(() =>
@@ -95,7 +103,9 @@ describe('usePlaceholderRenameEffect', () => {
     });
 
     test('should not call onCancelCreate if renaming was never active', () => {
-      const mockItem = createMockItem(CREATING_PAGE_VIRTUAL_ID, { isRenaming: false });
+      const mockItem = createMockItem(CREATING_PAGE_VIRTUAL_ID, {
+        isRenaming: false,
+      });
       const onCancelCreate = vi.fn();
 
       // Mock startRenaming to NOT actually change isRenaming state
@@ -120,7 +130,9 @@ describe('usePlaceholderRenameEffect', () => {
     });
 
     test('should re-call startRenaming when isRenaming becomes false after rapid clicks', () => {
-      const mockItem = createMockItem(CREATING_PAGE_VIRTUAL_ID, { isRenaming: false });
+      const mockItem = createMockItem(CREATING_PAGE_VIRTUAL_ID, {
+        isRenaming: false,
+      });
       const onCancelCreate = vi.fn();
 
       const { rerender } = renderHook(() =>
@@ -189,7 +201,9 @@ describe('usePlaceholderRenameEffect', () => {
 
   describe('edge cases', () => {
     test('should handle multiple rerender cycles correctly', () => {
-      const mockItem = createMockItem(CREATING_PAGE_VIRTUAL_ID, { isRenaming: false });
+      const mockItem = createMockItem(CREATING_PAGE_VIRTUAL_ID, {
+        isRenaming: false,
+      });
       const onCancelCreate = vi.fn();
 
       const { rerender } = renderHook(() =>
@@ -220,7 +234,9 @@ describe('usePlaceholderRenameEffect', () => {
     });
 
     test('should not call onCancelCreate multiple times for the same cancel event', () => {
-      const mockItem = createMockItem(CREATING_PAGE_VIRTUAL_ID, { isRenaming: false });
+      const mockItem = createMockItem(CREATING_PAGE_VIRTUAL_ID, {
+        isRenaming: false,
+      });
       const onCancelCreate = vi.fn();
 
       const { rerender } = renderHook(() =>