Uniformize folder structure (#693)

* Uniformize folder structure

* Fix icons

* Fix icons

* Fix tests

* Fix tests

front/src/modules/ui/table/editable-cell/hooks/useCurrentCellEditMode.ts

@@ -0,0 +1,23 @@
+import { useCallback } from 'react';
+import { useRecoilState } from 'recoil';
+
+import { useMoveEditModeToCellPosition } from '../../hooks/useMoveEditModeToCellPosition';
+import { isCellInEditModeFamilyState } from '../../states/isCellInEditModeFamilyState';
+
+import { useCurrentCellPosition } from './useCurrentCellPosition';
+
+export function useCurrentCellEditMode() {
+  const moveEditModeToCellPosition = useMoveEditModeToCellPosition();
+
+  const currentCellPosition = useCurrentCellPosition();
+
+  const [isCurrentCellInEditMode] = useRecoilState(
+    isCellInEditModeFamilyState(currentCellPosition),
+  );
+
+  const setCurrentCellInEditMode = useCallback(() => {
+    moveEditModeToCellPosition(currentCellPosition);
+  }, [currentCellPosition, moveEditModeToCellPosition]);
+
+  return { isCurrentCellInEditMode, setCurrentCellInEditMode };
+}

front/src/modules/ui/table/editable-cell/hooks/useCurrentCellPosition.ts

@@ -0,0 +1,31 @@
+import { useMemo } from 'react';
+
+import { useRecoilScopedState } from '@/ui/recoil-scope/hooks/useRecoilScopedState';
+
+import { CellContext } from '../../states/CellContext';
+import { currentColumnNumberScopedState } from '../../states/currentColumnNumberScopedState';
+import { currentRowNumberScopedState } from '../../states/currentRowNumberScopedState';
+import { RowContext } from '../../states/RowContext';
+import { CellPosition } from '../../types/CellPosition';
+
+export function useCurrentCellPosition() {
+  const [currentRowNumber] = useRecoilScopedState(
+    currentRowNumberScopedState,
+    RowContext,
+  );
+
+  const [currentColumnNumber] = useRecoilScopedState(
+    currentColumnNumberScopedState,
+    CellContext,
+  );
+
+  const currentCellPosition: CellPosition = useMemo(
+    () => ({
+      column: currentColumnNumber,
+      row: currentRowNumber,
+    }),
+    [currentColumnNumber, currentRowNumber],
+  );
+
+  return currentCellPosition;
+}

front/src/modules/ui/table/editable-cell/hooks/useEditableCell.ts

@@ -0,0 +1,46 @@
+import { useRecoilCallback } from 'recoil';
+
+import { useSetHotkeyScope } from '@/ui/hotkey/hooks/useSetHotkeyScope';
+import { HotkeyScope } from '@/ui/hotkey/types/HotkeyScope';
+
+import { useCloseCurrentCellInEditMode } from '../../hooks/useClearCellInEditMode';
+import { isSomeInputInEditModeState } from '../../states/isSomeInputInEditModeState';
+import { TableHotkeyScope } from '../../types/TableHotkeyScope';
+
+import { useCurrentCellEditMode } from './useCurrentCellEditMode';
+
+export function useEditableCell() {
+  const { setCurrentCellInEditMode } = useCurrentCellEditMode();
+
+  const setHotkeyScope = useSetHotkeyScope();
+
+  const closeCurrentCellInEditMode = useCloseCurrentCellInEditMode();
+
+  function closeEditableCell() {
+    closeCurrentCellInEditMode();
+    setHotkeyScope(TableHotkeyScope.TableSoftFocus);
+  }
+
+  const openEditableCell = useRecoilCallback(
+    ({ snapshot, set }) =>
+      (HotkeyScope: HotkeyScope) => {
+        const isSomeInputInEditMode = snapshot
+          .getLoadable(isSomeInputInEditModeState)
+          .valueOrThrow();
+
+        if (!isSomeInputInEditMode) {
+          set(isSomeInputInEditModeState, true);
+
+          setCurrentCellInEditMode();
+
+          setHotkeyScope(HotkeyScope.scope);
+        }
+      },
+    [setCurrentCellInEditMode, setHotkeyScope],
+  );
+
+  return {
+    closeEditableCell,
+    openEditableCell,
+  };
+}

front/src/modules/ui/table/editable-cell/hooks/useIsSoftFocusOnCurrentCell.ts

@@ -0,0 +1,15 @@
+import { useRecoilValue } from 'recoil';
+
+import { isSoftFocusOnCellFamilyState } from '../../states/isSoftFocusOnCellFamilyState';
+
+import { useCurrentCellPosition } from './useCurrentCellPosition';
+
+export function useIsSoftFocusOnCurrentCell() {
+  const currentCellPosition = useCurrentCellPosition();
+
+  const isSoftFocusOnCell = useRecoilValue(
+    isSoftFocusOnCellFamilyState(currentCellPosition),
+  );
+
+  return isSoftFocusOnCell;
+}

front/src/modules/ui/table/editable-cell/hooks/useRegisterCloseCellHandlers.ts

@@ -0,0 +1,67 @@
+import { useListenClickOutsideArrayOfRef } from '@/ui/hooks/useListenClickOutsideArrayOfRef';
+import { useScopedHotkeys } from '@/ui/hotkey/hooks/useScopedHotkeys';
+
+import { useMoveSoftFocus } from '../../hooks/useMoveSoftFocus';
+import { TableHotkeyScope } from '../../types/TableHotkeyScope';
+
+import { useCurrentCellEditMode } from './useCurrentCellEditMode';
+import { useEditableCell } from './useEditableCell';
+
+export function useRegisterCloseCellHandlers(
+  wrapperRef: React.RefObject<HTMLDivElement>,
+  onSubmit?: () => void,
+  onCancel?: () => void,
+) {
+  const { closeEditableCell } = useEditableCell();
+  const { isCurrentCellInEditMode } = useCurrentCellEditMode();
+  useListenClickOutsideArrayOfRef([wrapperRef], () => {
+    if (isCurrentCellInEditMode) {
+      onSubmit?.();
+      closeEditableCell();
+    }
+  });
+  const { moveRight, moveLeft, moveDown } = useMoveSoftFocus();
+
+  useScopedHotkeys(
+    'enter',
+    () => {
+      onSubmit?.();
+      closeEditableCell();
+      moveDown();
+    },
+    TableHotkeyScope.CellEditMode,
+    [closeEditableCell, onSubmit, moveDown],
+  );
+
+  useScopedHotkeys(
+    'esc',
+    () => {
+      closeEditableCell();
+      onCancel?.();
+    },
+    TableHotkeyScope.CellEditMode,
+    [closeEditableCell, onCancel],
+  );
+
+  useScopedHotkeys(
+    'tab',
+    () => {
+      onSubmit?.();
+      closeEditableCell();
+      moveRight();
+    },
+    TableHotkeyScope.CellEditMode,
+    [closeEditableCell, onSubmit, moveRight],
+  );
+
+  useScopedHotkeys(
+    'shift+tab',
+    () => {
+      onSubmit?.();
+      closeEditableCell();
+      moveLeft();
+    },
+    TableHotkeyScope.CellEditMode,
+    [closeEditableCell, onSubmit, moveRight],
+  );
+}

front/src/modules/ui/table/editable-cell/hooks/useSetSoftFocusOnCurrentCell.ts

@@ -0,0 +1,50 @@
+import { useMemo } from 'react';
+import { useRecoilCallback } from 'recoil';
+
+import { useSetHotkeyScope } from '@/ui/hotkey/hooks/useSetHotkeyScope';
+import { useRecoilScopedState } from '@/ui/recoil-scope/hooks/useRecoilScopedState';
+
+import { useSetSoftFocusPosition } from '../../hooks/useSetSoftFocusPosition';
+import { CellContext } from '../../states/CellContext';
+import { currentColumnNumberScopedState } from '../../states/currentColumnNumberScopedState';
+import { currentRowNumberScopedState } from '../../states/currentRowNumberScopedState';
+import { isSoftFocusActiveState } from '../../states/isSoftFocusActiveState';
+import { RowContext } from '../../states/RowContext';
+import { CellPosition } from '../../types/CellPosition';
+import { TableHotkeyScope } from '../../types/TableHotkeyScope';
+
+export function useSetSoftFocusOnCurrentCell() {
+  const setSoftFocusPosition = useSetSoftFocusPosition();
+
+  const [currentRowNumber] = useRecoilScopedState(
+    currentRowNumberScopedState,
+    RowContext,
+  );
+
+  const [currentColumnNumber] = useRecoilScopedState(
+    currentColumnNumberScopedState,
+    CellContext,
+  );
+
+  const currentTablePosition: CellPosition = useMemo(
+    () => ({
+      column: currentColumnNumber,
+      row: currentRowNumber,
+    }),
+    [currentColumnNumber, currentRowNumber],
+  );
+
+  const setHotkeyScope = useSetHotkeyScope();
+
+  return useRecoilCallback(
+    ({ set }) =>
+      () => {
+        setSoftFocusPosition(currentTablePosition);
+
+        set(isSoftFocusActiveState, true);
+
+        setHotkeyScope(TableHotkeyScope.TableSoftFocus);
+      },
+    [setHotkeyScope, currentTablePosition, setSoftFocusPosition],
+  );
+}