Uniformize folder structure (#693)

* Uniformize folder structure * Fix icons * Fix icons * Fix tests * Fix tests
2023-07-16 14:29:28 -07:00
parent 900ec5572f
commit 6ced8434bd
462 changed files with 931 additions and 960 deletions
--- a/front/src/modules/ui/board/card-field/components/BoardCardEditableFieldEditMode.tsx
+++ b/front/src/modules/ui/board/card-field/components/BoardCardEditableFieldEditMode.tsx
@ -0,0 +1,78 @@
+import { ReactElement, useRef } from 'react';
+import styled from '@emotion/styled';
+
+import { useListenClickOutsideArrayOfRef } from '@/ui/hooks/useListenClickOutsideArrayOfRef';
+import { useScopedHotkeys } from '@/ui/hotkey/hooks/useScopedHotkeys';
+import { overlayBackground } from '@/ui/themes/effects';
+
+import { BoardCardFieldHotkeyScope } from '../types/BoardCardFieldHotkeyScope';
+
+export const BoardCardFieldEditModeContainer = styled.div<
+  Omit<OwnProps, 'onExit'>
+>`
+  align-items: center;
+  border: 1px solid ${({ theme }) => theme.border.color.light};
+  border-radius: ${({ theme }) => theme.border.radius.sm};
+  display: flex;
+  left: ${(props) =>
+    props.editModeHorizontalAlign === 'right' ? 'auto' : '0'};
+  margin-left: -2px;
+  min-height: 100%;
+  min-width: calc(100% + 20px);
+  position: absolute;
+
+  right: ${(props) =>
+    props.editModeHorizontalAlign === 'right' ? '0' : 'auto'};
+  top: ${(props) => (props.editModeVerticalPosition === 'over' ? '0' : '100%')};
+  z-index: 1;
+  ${overlayBackground}
+`;
+
+type OwnProps = {
+  children: ReactElement;
+  editModeHorizontalAlign?: 'left' | 'right';
+  editModeVerticalPosition?: 'over' | 'below';
+  onExit: () => void;
+};
+
+export function BoardCardEditableFieldEditMode({
+  editModeHorizontalAlign,
+  editModeVerticalPosition,
+  children,
+  onExit,
+}: OwnProps) {
+  const wrapperRef = useRef(null);
+
+  useListenClickOutsideArrayOfRef([wrapperRef], () => {
+    onExit();
+  });
+
+  useScopedHotkeys(
+    'enter',
+    () => {
+      onExit();
+    },
+    BoardCardFieldHotkeyScope.BoardCardFieldEditMode,
+    [onExit],
+  );
+
+  useScopedHotkeys(
+    'esc',
+    () => {
+      onExit();
+    },
+    BoardCardFieldHotkeyScope.BoardCardFieldEditMode,
+    [onExit],
+  );
+
+  return (
+    <BoardCardFieldEditModeContainer
+      data-testid="editable-cell-edit-mode-container"
+      ref={wrapperRef}
+      editModeHorizontalAlign={editModeHorizontalAlign}
+      editModeVerticalPosition={editModeVerticalPosition}
+    >
+      {children}
+    </BoardCardFieldEditModeContainer>
+  );
+}