mukeshs/twenty_crm
1
0
Fork 0
Code Issues Pull Requests Actions 1 Packages Projects Releases Wiki Activity

Change to using arrow functions (#1603)

Browse Source 
* Change to using arrow functions

Co-authored-by: v1b3m <vibenjamin6@gmail.com>
Co-authored-by: Matheus <matheus_benini@hotmail.com>

* Add lint rule

---------

Co-authored-by: v1b3m <vibenjamin6@gmail.com>
Co-authored-by: Matheus <matheus_benini@hotmail.com>
Co-authored-by: Charles Bochet <charles@twenty.com>
This commit is contained in:
gitstart-twenty
2023-09-16 02:41:10 +01:00
committed by GitHub
parent 549335054a
commit 00a3c8ca2b
575 changed files with 2848 additions and 3063 deletions
Download Patch File Download Diff File Expand all files Collapse all files

4
front/src/modules/ui/table/action-bar/components/EntityTableActionBar.tsx
View File

@ -5,8 +5,8 @@ import { ActionBar } from '@/ui/action-bar/components/ActionBar';
import { selectedRowIdsSelector } from '../../states/selectors/selectedRowIdsSelector';
export function EntityTableActionBar() {
export const EntityTableActionBar = () => {
const selectedRowIds = useRecoilValue(selectedRowIdsSelector);
return <ActionBar selectedIds={selectedRowIds} />;
}
};

4
front/src/modules/ui/table/components/CheckboxCell.tsx
View File

@ -17,7 +17,7 @@ const StyledContainer = styled.div`
justify-content: center;
`;
export function CheckboxCell() {
export const CheckboxCell = () => {
const setActionBarOpenState = useSetRecoilState(actionBarOpenState);
const { currentRowSelected, setCurrentRowSelected } = useCurrentRowSelected();
@ -31,4 +31,4 @@ export function CheckboxCell() {
<Checkbox checked={currentRowSelected} />
</StyledContainer>
);
}
};

4
front/src/modules/ui/table/components/ColumnHead.tsx
View File

@ -34,7 +34,7 @@ const StyledText = styled.span`
white-space: nowrap;
`;
export function ColumnHead({ viewName, ViewIcon }: OwnProps) {
export const ColumnHead = ({ viewName, ViewIcon }: OwnProps) => {
const theme = useTheme();
return (
<StyledTitle>
@ -44,4 +44,4 @@ export function ColumnHead({ viewName, ViewIcon }: OwnProps) {
<StyledText>{viewName}</StyledText>
</StyledTitle>
);
}
};

4
front/src/modules/ui/table/components/EntityTable.tsx
View File

@ -86,7 +86,7 @@ type OwnProps = {
updateEntityMutation: any;
};
export function EntityTable({ updateEntityMutation }: OwnProps) {
export const EntityTable = ({ updateEntityMutation }: OwnProps) => {
const tableBodyRef = useRef<HTMLDivElement>(null);
const setRowSelectedState = useSetRowSelectedState();
@ -141,4 +141,4 @@ export function EntityTable({ updateEntityMutation }: OwnProps) {
</StyledTableWithHeader>
</EntityUpdateMutationContext.Provider>
);
}
};

4
front/src/modules/ui/table/components/EntityTableBody.tsx
View File

@ -22,7 +22,7 @@ const StyledSpace = styled.td<SpaceProps>`
${({ bottom }) => bottom && `padding-bottom: ${bottom}px;`}
`;
export function EntityTableBody() {
export const EntityTableBody = () => {
const scrollWrapperRef = useScrollWrapperScopedRef();
const tableRowIds = useRecoilValue(tableRowIdsState);
@ -78,4 +78,4 @@ export function EntityTableBody() {
)}
</tbody>
);
}
};

8
front/src/modules/ui/table/components/EntityTableCell.tsx
View File

@ -10,13 +10,13 @@ import { ColumnIndexContext } from '../contexts/ColumnIndexContext';
import { GenericEditableCell } from '../editable-cell/components/GenericEditableCell';
import { useCurrentRowSelected } from '../hooks/useCurrentRowSelected';
export function EntityTableCell({ cellIndex }: { cellIndex: number }) {
export const EntityTableCell = ({ cellIndex }: { cellIndex: number }) => {
const setContextMenuPosition = useSetRecoilState(contextMenuPositionState);
const setContextMenuOpenState = useSetRecoilState(contextMenuIsOpenState);
const { setCurrentRowSelected } = useCurrentRowSelected();
function handleContextMenu(event: React.MouseEvent) {
const handleContextMenu = (event: React.MouseEvent) => {
event.preventDefault();
setCurrentRowSelected(true);
setContextMenuPosition({
@ -24,7 +24,7 @@ export function EntityTableCell({ cellIndex }: { cellIndex: number }) {
y: event.clientY,
});
setContextMenuOpenState(true);
}
};
const columnDefinition = useContext(ColumnContext);
@ -41,4 +41,4 @@ export function EntityTableCell({ cellIndex }: { cellIndex: number }) {
</ColumnIndexContext.Provider>
</RecoilScope>
);
}
};

6
front/src/modules/ui/table/components/EntityTableEffect.tsx
View File

@ -7,7 +7,7 @@ import { FilterDefinition } from '@/ui/view-bar/types/FilterDefinition';
import { SortDefinition } from '@/ui/view-bar/types/SortDefinition';
import { SortOrder } from '~/generated/graphql';
export function EntityTableEffect({
export const EntityTableEffect = ({
useGetRequest,
getRequestResultKey,
getRequestOptimisticEffectDefinition,
@ -34,7 +34,7 @@ export function EntityTableEffect({
sortDefinitionArray: SortDefinition[];
setActionBarEntries?: () => void;
setContextMenuEntries?: () => void;
}) {
}) => {
const setEntityTableData = useSetEntityTableData();
const { registerOptimisticEffect } = useOptimisticEffect();
@ -58,4 +58,4 @@ export function EntityTableEffect({
}, [setActionBarEntries, setContextMenuEntries]);
return <></>;
}
};

4
front/src/modules/ui/table/components/EntityTableHeader.tsx
View File

@ -70,7 +70,7 @@ const StyledEntityTableColumnMenu = styled(EntityTableColumnMenu)`
z-index: ${({ theme }) => theme.lastLayerZIndex};
`;
export function EntityTableHeader() {
export const EntityTableHeader = () => {
const [resizeFieldOffset, setResizeFieldOffset] = useRecoilState(
resizeFieldOffsetState,
);
@ -205,4 +205,4 @@ export function EntityTableHeader() {
</tr>
</thead>
);
}
};

2
front/src/modules/ui/table/components/EntityTableRow.tsx
View File

@ -23,7 +23,7 @@ type EntityTableRowProps = {
export const EntityTableRow = forwardRef<
HTMLTableRowElement,
EntityTableRowProps
>(function EntityTableRow({ rowId }, ref) {
>(({ rowId }, ref) => {
const visibleTableColumns = useRecoilScopedValue(
visibleTableColumnsScopedSelector,
TableRecoilScopeContext,

4
front/src/modules/ui/table/components/SelectAllCheckbox.tsx
View File

@ -19,9 +19,9 @@ export const SelectAllCheckbox = () => {
const checked = allRowsSelectedStatus === 'all';
const indeterminate = allRowsSelectedStatus === 'some';
function onChange() {
const onChange = () => {
selectAllRows();
}
};
return (
<StyledContainer>

4
front/src/modules/ui/table/context-menu/components/EntityTableContextMenu.tsx
View File

@ -5,7 +5,7 @@ import { ContextMenu } from '@/ui/context-menu/components/ContextMenu';
import { selectedRowIdsSelector } from '../../states/selectors/selectedRowIdsSelector';
export function EntityTableContextMenu() {
export const EntityTableContextMenu = () => {
const selectedRowIds = useRecoilValue(selectedRowIdsSelector);
return <ContextMenu selectedIds={selectedRowIds} />;
}
};

18
front/src/modules/ui/table/editable-cell/components/EditableCell.tsx
View File

@ -43,7 +43,7 @@ const DEFAULT_CELL_SCOPE: HotkeyScope = {
scope: TableHotkeyScope.CellEditMode,
};
export function EditableCell({
export const EditableCell = ({
editModeHorizontalAlign = 'left',
editModeVerticalPosition = 'over',
editModeContent,
@ -52,7 +52,7 @@ export function EditableCell({
transparent = false,
maxContentWidth,
useEditButton,
}: EditableCellProps) {
}: EditableCellProps) => {
const { isCurrentCellInEditMode } = useCurrentCellEditMode();
const [isHovered, setIsHovered] = useState(false);
@ -60,18 +60,18 @@ export function EditableCell({
const { openEditableCell } = useEditableCell();
function handlePenClick() {
const handlePenClick = () => {
setSoftFocusOnCurrentCell();
openEditableCell();
}
};
function handleContainerMouseEnter() {
const handleContainerMouseEnter = () => {
setIsHovered(true);
}
};
function handleContainerMouseLeave() {
const handleContainerMouseLeave = () => {
setIsHovered(false);
}
};
const showEditButton = useEditButton && isHovered && !isCurrentCellInEditMode;
@ -116,4 +116,4 @@ export function EditableCell({
</StyledCellBaseContainer>
</CellHotkeyScopeContext.Provider>
);
}
};

36
front/src/modules/ui/table/editable-cell/components/EditableCellDisplayContainer.tsx
View File

@ -36,28 +36,24 @@ const StyledEditableCellDisplayModeInnerContainer = styled.div`
width: 100%;
`;
export function EditableCellDisplayContainer({
export const EditableCellDisplayContainer = ({
children,
softFocus,
onClick,
scrollRef,
isHovered,
}: React.PropsWithChildren<EditableCellDisplayContainerProps>) {
return (
<StyledEditableCellDisplayModeOuterContainer
data-testid={
softFocus
? 'editable-cell-soft-focus-mode'
: 'editable-cell-display-mode'
}
onClick={onClick}
isHovered={isHovered}
softFocus={softFocus}
ref={scrollRef}
>
<StyledEditableCellDisplayModeInnerContainer>
{children}
</StyledEditableCellDisplayModeInnerContainer>
</StyledEditableCellDisplayModeOuterContainer>
);
}
}: React.PropsWithChildren<EditableCellDisplayContainerProps>) => (
<StyledEditableCellDisplayModeOuterContainer
data-testid={
softFocus ? 'editable-cell-soft-focus-mode' : 'editable-cell-display-mode'
}
onClick={onClick}
isHovered={isHovered}
softFocus={softFocus}
ref={scrollRef}
>
<StyledEditableCellDisplayModeInnerContainer>
{children}
</StyledEditableCellDisplayModeInnerContainer>
</StyledEditableCellDisplayModeOuterContainer>
);

10
front/src/modules/ui/table/editable-cell/components/EditableCellDisplayMode.tsx
View File

@ -3,22 +3,22 @@ import { useSetSoftFocusOnCurrentCell } from '../hooks/useSetSoftFocusOnCurrentC
import { EditableCellDisplayContainer } from './EditableCellDisplayContainer';
export function EditableCellDisplayMode({
export const EditableCellDisplayMode = ({
children,
isHovered,
}: React.PropsWithChildren<unknown> & { isHovered?: boolean }) {
}: React.PropsWithChildren<unknown> & { isHovered?: boolean }) => {
const setSoftFocusOnCurrentCell = useSetSoftFocusOnCurrentCell();
const { openEditableCell } = useEditableCell();
function handleClick() {
const handleClick = () => {
setSoftFocusOnCurrentCell();
openEditableCell();
}
};
return (
<EditableCellDisplayContainer isHovered={isHovered} onClick={handleClick}>
{children}
</EditableCellDisplayContainer>
);
}
};

24
front/src/modules/ui/table/editable-cell/components/EditableCellEditButton.tsx
View File

@ -13,17 +13,15 @@ type EditableCellEditButtonProps = {
onClick?: () => void;
};
export function EditableCellEditButton({
export const EditableCellEditButton = ({
onClick,
}: EditableCellEditButtonProps) {
return (
<StyledEditButtonContainer
initial={{ opacity: 0 }}
animate={{ opacity: 1 }}
transition={{ duration: 0.1 }}
whileHover={{ scale: 1.04 }}
>
<FloatingIconButton size="small" onClick={onClick} Icon={IconPencil} />
</StyledEditButtonContainer>
);
}
}: EditableCellEditButtonProps) => (
<StyledEditButtonContainer
initial={{ opacity: 0 }}
animate={{ opacity: 1 }}
transition={{ duration: 0.1 }}
whileHover={{ scale: 1.04 }}
>
<FloatingIconButton size="small" onClick={onClick} Icon={IconPencil} />
</StyledEditButtonContainer>
);

26
front/src/modules/ui/table/editable-cell/components/EditableCellEditMode.tsx
View File

@ -37,22 +37,20 @@ export type EditableCellEditModeProps = {
initialValue?: string;
};
export function EditableCellEditMode({
export const EditableCellEditMode = ({
editModeHorizontalAlign,
editModeVerticalPosition,
children,
transparent = false,
maxContentWidth,
}: EditableCellEditModeProps) {
return (
<StyledEditableCellEditModeContainer
maxContentWidth={maxContentWidth}
transparent={transparent}
data-testid="editable-cell-edit-mode-container"
editModeHorizontalAlign={editModeHorizontalAlign}
editModeVerticalPosition={editModeVerticalPosition}
>
{children}
</StyledEditableCellEditModeContainer>
);
}
}: EditableCellEditModeProps) => (
<StyledEditableCellEditModeContainer
maxContentWidth={maxContentWidth}
transparent={transparent}
data-testid="editable-cell-edit-mode-container"
editModeHorizontalAlign={editModeHorizontalAlign}
editModeVerticalPosition={editModeVerticalPosition}
>
{children}
</StyledEditableCellEditModeContainer>
);

12
front/src/modules/ui/table/editable-cell/components/EditableCellSoftFocusMode.tsx
View File

@ -10,7 +10,7 @@ import { EditableCellDisplayContainer } from './EditableCellDisplayContainer';
type OwnProps = PropsWithChildren<unknown>;
export function EditableCellSoftFocusMode({ children }: OwnProps) {
export const EditableCellSoftFocusMode = ({ children }: OwnProps) => {
const { openEditableCell } = useEditableCell();
const scrollRef = useRef<HTMLDivElement>(null);
@ -19,9 +19,9 @@ export function EditableCellSoftFocusMode({ children }: OwnProps) {
scrollRef.current?.scrollIntoView({ block: 'nearest' });
}, []);
function openEditMode() {
const openEditMode = () => {
openEditableCell();
}
};
useScopedHotkeys(
'enter',
@ -53,9 +53,9 @@ export function EditableCellSoftFocusMode({ children }: OwnProps) {
},
);
function handleClick() {
const handleClick = () => {
openEditMode();
}
};
return (
<EditableCellDisplayContainer
@ -66,4 +66,4 @@ export function EditableCellSoftFocusMode({ children }: OwnProps) {
{children}
</EditableCellDisplayContainer>
);
}
};

4
front/src/modules/ui/table/editable-cell/components/GenericEditableCell.tsx
View File

@ -30,7 +30,7 @@ type OwnProps = {
columnDefinition: ColumnDefinition<ViewFieldMetadata>;
};
export function GenericEditableCell({ columnDefinition }: OwnProps) {
export const GenericEditableCell = ({ columnDefinition }: OwnProps) => {
if (isViewFieldEmail(columnDefinition)) {
return <GenericEditableEmailCell columnDefinition={columnDefinition} />;
} else if (isViewFieldText(columnDefinition)) {
@ -65,4 +65,4 @@ export function GenericEditableCell({ columnDefinition }: OwnProps) {
);
return <></>;
}
}
};

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

@ -6,7 +6,7 @@ import { isCellInEditModeFamilyState } from '../../states/isCellInEditModeFamily
import { useCurrentCellPosition } from './useCurrentCellPosition';
export function useCurrentCellEditMode() {
export const useCurrentCellEditMode = () => {
const moveEditModeToCellPosition = useMoveEditModeToCellPosition();
const currentCellPosition = useCurrentCellPosition();
@ -20,4 +20,4 @@ export function useCurrentCellEditMode() {
}, [currentCellPosition, moveEditModeToCellPosition]);
return { isCurrentCellInEditMode, setCurrentCellInEditMode };
}
};

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

@ -4,7 +4,7 @@ import { ColumnIndexContext } from '../../contexts/ColumnIndexContext';
import { RowIndexContext } from '../../contexts/RowIndexContext';
import { CellPosition } from '../../types/CellPosition';
export function useCurrentCellPosition() {
export const useCurrentCellPosition = () => {
const currentRowNumber = useContext(RowIndexContext);
const currentColumnNumber = useContext(ColumnIndexContext);
@ -17,4 +17,4 @@ export function useCurrentCellPosition() {
);
return currentCellPosition;
}
};

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

@ -14,7 +14,7 @@ const DEFAULT_CELL_SCOPE: HotkeyScope = {
scope: TableHotkeyScope.CellEditMode,
};
export function useEditableCell() {
export const useEditableCell = () => {
const { setCurrentCellInEditMode } = useCurrentCellEditMode();
const setHotkeyScope = useSetHotkeyScope();
@ -24,13 +24,13 @@ export function useEditableCell() {
const customCellHotkeyScope = useContext(CellHotkeyScopeContext);
function closeEditableCell() {
const closeEditableCell = () => {
setDragSelectionStartEnabled(true);
closeCurrentCellInEditMode();
setHotkeyScope(TableHotkeyScope.TableSoftFocus);
}
};
function openEditableCell() {
const openEditableCell = () => {
setDragSelectionStartEnabled(false);
setCurrentCellInEditMode();
@ -42,10 +42,10 @@ export function useEditableCell() {
} else {
setHotkeyScope(DEFAULT_CELL_SCOPE.scope, DEFAULT_CELL_SCOPE.customScopes);
}
}
};
return {
closeEditableCell,
openEditableCell,
};
}
};

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

@ -4,7 +4,7 @@ import { isSoftFocusOnCellFamilyState } from '../../states/isSoftFocusOnCellFami
import { useCurrentCellPosition } from './useCurrentCellPosition';
export function useIsSoftFocusOnCurrentCell() {
export const useIsSoftFocusOnCurrentCell = () => {
const currentCellPosition = useCurrentCellPosition();
const isSoftFocusOnCell = useRecoilValue(
@ -12,4 +12,4 @@ export function useIsSoftFocusOnCurrentCell() {
);
return isSoftFocusOnCell;
}
};

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

@ -7,11 +7,11 @@ import { TableHotkeyScope } from '../../types/TableHotkeyScope';
import { useCurrentCellEditMode } from './useCurrentCellEditMode';
import { useEditableCell } from './useEditableCell';
export function useRegisterCloseCellHandlers(
export const useRegisterCloseCellHandlers = (
wrapperRef: React.RefObject<HTMLDivElement>,
onSubmit?: () => void,
onCancel?: () => void,
) {
) => {
const { closeEditableCell } = useEditableCell();
const { isCurrentCellInEditMode } = useCurrentCellEditMode();
@ -72,4 +72,4 @@ export function useRegisterCloseCellHandlers(
TableHotkeyScope.CellEditMode,
[closeEditableCell, onSubmit, moveRight],
);
}
};

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

@ -8,7 +8,7 @@ import { TableHotkeyScope } from '../../types/TableHotkeyScope';
import { useCurrentCellPosition } from './useCurrentCellPosition';
export function useSetSoftFocusOnCurrentCell() {
export const useSetSoftFocusOnCurrentCell = () => {
const setSoftFocusPosition = useSetSoftFocusPosition();
const currentCellPosition = useCurrentCellPosition();
@ -26,4 +26,4 @@ export function useSetSoftFocusOnCurrentCell() {
},
[setHotkeyScope, currentCellPosition, setSoftFocusPosition],
);
}
};

25
front/src/modules/ui/table/editable-cell/type/components/DoubleTextCellEdit.tsx
View File

@ -35,14 +35,14 @@ const StyledContainer = styled.div`
}
`;
export function DoubleTextCellEdit({
export const DoubleTextCellEdit = ({
firstValue,
secondValue,
firstValuePlaceholder,
secondValuePlaceholder,
onSubmit,
onCancel,
}: OwnProps) {
}: OwnProps) => {
const [firstInternalValue, setFirstInternalValue] = useState(firstValue);
const [secondInternalValue, setSecondInternalValue] = useState(secondValue);
@ -51,10 +51,13 @@ export function DoubleTextCellEdit({
setSecondInternalValue(secondValue);
}, [firstValue, secondValue]);
function handleOnChange(newFirstValue: string, newSecondValue: string): void {
const handleOnChange = (
newFirstValue: string,
newSecondValue: string,
): void => {
setFirstInternalValue(newFirstValue);
setSecondInternalValue(newSecondValue);
}
};
const [focusPosition, setFocusPosition] = useState<'left' | 'right'>('left');
@ -64,21 +67,21 @@ export function DoubleTextCellEdit({
const { closeEditableCell } = useEditableCell();
const { moveRight, moveLeft, moveDown } = useMoveSoftFocus();
function closeCell() {
const closeCell = () => {
setFocusPosition('left');
closeEditableCell();
}
};
function handleCancel() {
const handleCancel = () => {
setFirstInternalValue(firstValue);
setSecondInternalValue(secondValue);
onCancel?.();
}
};
function handleSubmit() {
const handleSubmit = () => {
onSubmit?.(firstInternalValue, secondInternalValue);
}
};
useScopedHotkeys(
Key.Enter,
@ -161,4 +164,4 @@ export function DoubleTextCellEdit({
/>
</StyledContainer>
);
}
};

8
front/src/modules/ui/table/editable-cell/type/components/GenericEditableBooleanCell.tsx
View File

@ -26,7 +26,7 @@ const StyledCellBaseContainer = styled.div`
width: 100%;
`;
export function GenericEditableBooleanCell({ columnDefinition }: OwnProps) {
export const GenericEditableBooleanCell = ({ columnDefinition }: OwnProps) => {
const currentRowEntityId = useCurrentRowEntityId();
const [fieldValue, setFieldValue] = useRecoilState<boolean>(
@ -38,7 +38,7 @@ export function GenericEditableBooleanCell({ columnDefinition }: OwnProps) {
const updateField = useUpdateEntityField();
function handleClick() {
const handleClick = () => {
const newValue = !fieldValue;
try {
@ -52,7 +52,7 @@ export function GenericEditableBooleanCell({ columnDefinition }: OwnProps) {
`In GenericEditableBooleanCellEditMode, Invalid value: ${newValue}, ${error}`,
);
}
}
};
return (
<StyledCellBaseContainer>
@ -61,4 +61,4 @@ export function GenericEditableBooleanCell({ columnDefinition }: OwnProps) {
</EditableCellDisplayContainer>
</StyledCellBaseContainer>
);
}
};

28
front/src/modules/ui/table/editable-cell/type/components/GenericEditableChipCell.tsx
View File

@ -12,21 +12,17 @@ type OwnProps = {
placeholder?: string;
};
export function GenericEditableChipCell({
export const GenericEditableChipCell = ({
columnDefinition,
editModeHorizontalAlign,
}: OwnProps) {
return (
<EditableCell
editModeHorizontalAlign={editModeHorizontalAlign}
editModeContent={
<GenericEditableChipCellEditMode columnDefinition={columnDefinition} />
}
nonEditModeContent={
<GenericEditableChipCellDisplayMode
columnDefinition={columnDefinition}
/>
}
></EditableCell>
);
}
}: OwnProps) => (
<EditableCell
editModeHorizontalAlign={editModeHorizontalAlign}
editModeContent={
<GenericEditableChipCellEditMode columnDefinition={columnDefinition} />
}
nonEditModeContent={
<GenericEditableChipCellDisplayMode columnDefinition={columnDefinition} />
}
></EditableCell>
);

6
front/src/modules/ui/table/editable-cell/type/components/GenericEditableChipCellDisplayMode.tsx
View File

@ -13,9 +13,9 @@ type OwnProps = {
columnDefinition: ColumnDefinition<ViewFieldChipMetadata>;
};
export function GenericEditableChipCellDisplayMode({
export const GenericEditableChipCellDisplayMode = ({
columnDefinition,
}: OwnProps) {
}: OwnProps) => {
const currentRowEntityId = useCurrentRowEntityId();
const content = useRecoilValue<any | null>(
@ -48,4 +48,4 @@ export function GenericEditableChipCellDisplayMode({
);
return <> </>;
}
}
};

10
front/src/modules/ui/table/editable-cell/type/components/GenericEditableChipCellEditMode.tsx
View File

@ -14,9 +14,9 @@ type OwnProps = {
columnDefinition: ColumnDefinition<ViewFieldChipMetadata>;
};
export function GenericEditableChipCellEditMode({
export const GenericEditableChipCellEditMode = ({
columnDefinition,
}: OwnProps) {
}: OwnProps) => {
const currentRowEntityId = useCurrentRowEntityId();
// TODO: we could use a hook that would return the field value with the right type
@ -29,7 +29,7 @@ export function GenericEditableChipCellEditMode({
const updateField = useUpdateEntityField();
function handleSubmit(newText: string) {
const handleSubmit = (newText: string) => {
if (newText === fieldValue) return;
setFieldValue(newText);
@ -37,7 +37,7 @@ export function GenericEditableChipCellEditMode({
if (currentRowEntityId && updateField) {
updateField(currentRowEntityId, columnDefinition, newText);
}
}
};
const {
handleEnter,
@ -62,4 +62,4 @@ export function GenericEditableChipCellEditMode({
hotkeyScope={TableHotkeyScope.CellEditMode}
/>
);
}
};

6
front/src/modules/ui/table/editable-cell/type/components/GenericEditableDateCell.tsx
View File

@ -15,10 +15,10 @@ type OwnProps = {
editModeHorizontalAlign?: 'left' | 'right';
};
export function GenericEditableDateCell({
export const GenericEditableDateCell = ({
columnDefinition,
editModeHorizontalAlign,
}: OwnProps) {
}: OwnProps) => {
const currentRowEntityId = useCurrentRowEntityId();
const fieldValue = useRecoilValue<string>(
@ -37,4 +37,4 @@ export function GenericEditableDateCell({
nonEditModeContent={<DateDisplay value={fieldValue} />}
></EditableCell>
);
}
};

10
front/src/modules/ui/table/editable-cell/type/components/GenericEditableDateCellEditMode.tsx
View File

@ -16,9 +16,9 @@ type OwnProps = {
columnDefinition: ColumnDefinition<ViewFieldDateMetadata>;
};
export function GenericEditableDateCellEditMode({
export const GenericEditableDateCellEditMode = ({
columnDefinition,
}: OwnProps) {
}: OwnProps) => {
const currentRowEntityId = useCurrentRowEntityId();
// TODO: we could use a hook that would return the field value with the right type
@ -32,7 +32,7 @@ export function GenericEditableDateCellEditMode({
const updateField = useUpdateEntityField();
// Wrap this into a hook
function handleSubmit(newDate: Nullable<Date>) {
const handleSubmit = (newDate: Nullable<Date>) => {
const fieldValueDate = fieldValue
? DateTime.fromISO(fieldValue).toJSDate()
: null;
@ -46,7 +46,7 @@ export function GenericEditableDateCellEditMode({
if (currentRowEntityId && updateField && newDateISO) {
updateField(currentRowEntityId, columnDefinition, newDateISO);
}
}
};
const { handleEnter, handleEscape, handleClickOutside } =
useCellInputEventHandlers({
@ -62,4 +62,4 @@ export function GenericEditableDateCellEditMode({
hotkeyScope={TableHotkeyScope.CellEditMode}
/>
);
}
};

6
front/src/modules/ui/table/editable-cell/type/components/GenericEditableDoubleTextCell.tsx
View File

@ -14,7 +14,9 @@ type OwnProps = {
columnDefinition: ColumnDefinition<ViewFieldDoubleTextMetadata>;
};
export function GenericEditableDoubleTextCell({ columnDefinition }: OwnProps) {
export const GenericEditableDoubleTextCell = ({
columnDefinition,
}: OwnProps) => {
const currentRowEntityId = useCurrentRowEntityId();
const firstValue = useRecoilValue<string>(
@ -43,4 +45,4 @@ export function GenericEditableDoubleTextCell({ columnDefinition }: OwnProps) {
nonEditModeContent={<TextDisplay text={displayName} />}
></EditableCell>
);
}
};

10
front/src/modules/ui/table/editable-cell/type/components/GenericEditableDoubleTextCellEditMode.tsx
View File

@ -13,9 +13,9 @@ type OwnProps = {
columnDefinition: ColumnDefinition<ViewFieldDoubleTextMetadata>;
};
export function GenericEditableDoubleTextCellEditMode({
export const GenericEditableDoubleTextCellEditMode = ({
columnDefinition,
}: OwnProps) {
}: OwnProps) => {
const currentRowEntityId = useCurrentRowEntityId();
// TODO: we could use a hook that would return the field value with the right type
@ -35,7 +35,7 @@ export function GenericEditableDoubleTextCellEditMode({
const updateField = useUpdateEntityField();
function handleSubmit(newFirstValue: string, newSecondValue: string) {
const handleSubmit = (newFirstValue: string, newSecondValue: string) => {
if (newFirstValue === firstValue && newSecondValue === secondValue) return;
setFirstValue(newFirstValue);
@ -47,7 +47,7 @@ export function GenericEditableDoubleTextCellEditMode({
secondValue: newSecondValue,
});
}
}
};
return (
<DoubleTextCellEdit
@ -58,4 +58,4 @@ export function GenericEditableDoubleTextCellEditMode({
onSubmit={handleSubmit}
/>
);
}
};

34
front/src/modules/ui/table/editable-cell/type/components/GenericEditableDoubleTextChipCell.tsx
View File

@ -11,22 +11,20 @@ type OwnProps = {
columnDefinition: ColumnDefinition<ViewFieldDoubleTextChipMetadata>;
};
export function GenericEditableDoubleTextChipCell({
export const GenericEditableDoubleTextChipCell = ({
columnDefinition,
}: OwnProps) {
return (
<EditableCell
editHotkeyScope={{ scope: TableHotkeyScope.CellDoubleTextInput }}
editModeContent={
<GenericEditableDoubleTextChipCellEditMode
columnDefinition={columnDefinition}
/>
}
nonEditModeContent={
<GenericEditableDoubleTextChipCellDisplayMode
columnDefinition={columnDefinition}
/>
}
></EditableCell>
);
}
}: OwnProps) => (
<EditableCell
editHotkeyScope={{ scope: TableHotkeyScope.CellDoubleTextInput }}
editModeContent={
<GenericEditableDoubleTextChipCellEditMode
columnDefinition={columnDefinition}
/>
}
nonEditModeContent={
<GenericEditableDoubleTextChipCellDisplayMode
columnDefinition={columnDefinition}
/>
}
></EditableCell>
);

6
front/src/modules/ui/table/editable-cell/type/components/GenericEditableDoubleTextChipCellDisplayMode.tsx
View File

@ -13,9 +13,9 @@ type OwnProps = {
columnDefinition: ColumnDefinition<ViewFieldDoubleTextChipMetadata>;
};
export function GenericEditableDoubleTextChipCellDisplayMode({
export const GenericEditableDoubleTextChipCellDisplayMode = ({
columnDefinition,
}: OwnProps) {
}: OwnProps) => {
const currentRowEntityId = useCurrentRowEntityId();
const [firstValue] = useRecoilState<string>(
@ -60,4 +60,4 @@ export function GenericEditableDoubleTextChipCellDisplayMode({
);
return <> </>;
}
}
};

10
front/src/modules/ui/table/editable-cell/type/components/GenericEditableDoubleTextChipCellEditMode.tsx
View File

@ -13,9 +13,9 @@ type OwnProps = {
columnDefinition: ColumnDefinition<ViewFieldDoubleTextChipMetadata>;
};
export function GenericEditableDoubleTextChipCellEditMode({
export const GenericEditableDoubleTextChipCellEditMode = ({
columnDefinition,
}: OwnProps) {
}: OwnProps) => {
const currentRowEntityId = useCurrentRowEntityId();
// TODO: we could use a hook that would return the field value with the right type
@ -35,7 +35,7 @@ export function GenericEditableDoubleTextChipCellEditMode({
const updateField = useUpdateEntityField();
function handleSubmit(newFirstValue: string, newSecondValue: string) {
const handleSubmit = (newFirstValue: string, newSecondValue: string) => {
const firstValueChanged = newFirstValue !== firstValue;
const secondValueChanged = newSecondValue !== secondValue;
@ -57,7 +57,7 @@ export function GenericEditableDoubleTextChipCellEditMode({
secondValue: secondValueChanged ? newSecondValue : secondValue,
});
}
}
};
return (
<DoubleTextCellEdit
@ -68,4 +68,4 @@ export function GenericEditableDoubleTextChipCellEditMode({
onSubmit={handleSubmit}
/>
);
}
};

6
front/src/modules/ui/table/editable-cell/type/components/GenericEditableEmailCell.tsx
View File

@ -15,10 +15,10 @@ type OwnProps = {
editModeHorizontalAlign?: 'left' | 'right';
};
export function GenericEditableEmailCell({
export const GenericEditableEmailCell = ({
columnDefinition,
editModeHorizontalAlign,
}: OwnProps) {
}: OwnProps) => {
const currentRowEntityId = useCurrentRowEntityId();
const fieldValue = useRecoilValue<string>(
@ -37,4 +37,4 @@ export function GenericEditableEmailCell({
nonEditModeContent={<EmailDisplay value={fieldValue} />}
></EditableCell>
);
}
};

10
front/src/modules/ui/table/editable-cell/type/components/GenericEditableEmailCellEditMode.tsx
View File

@ -14,9 +14,9 @@ type OwnProps = {
columnDefinition: ColumnDefinition<ViewFieldEmailMetadata>;
};
export function GenericEditableEmailCellEditMode({
export const GenericEditableEmailCellEditMode = ({
columnDefinition,
}: OwnProps) {
}: OwnProps) => {
const currentRowEntityId = useCurrentRowEntityId();
// TODO: we could use a hook that would return the field value with the right type
@ -29,7 +29,7 @@ export function GenericEditableEmailCellEditMode({
const updateField = useUpdateEntityField();
function handleSubmit(newEmail: string) {
const handleSubmit = (newEmail: string) => {
if (newEmail === fieldValue) return;
setFieldValue(newEmail);
@ -37,7 +37,7 @@ export function GenericEditableEmailCellEditMode({
if (currentRowEntityId && updateField) {
updateField(currentRowEntityId, columnDefinition, newEmail);
}
}
};
const {
handleEnter,
@ -62,4 +62,4 @@ export function GenericEditableEmailCellEditMode({
hotkeyScope={TableHotkeyScope.CellEditMode}
/>
);
}
};

6
front/src/modules/ui/table/editable-cell/type/components/GenericEditableMoneyCell.tsx
View File

@ -15,10 +15,10 @@ type OwnProps = {
editModeHorizontalAlign?: 'left' | 'right';
};
export function GenericEditableMoneyCell({
export const GenericEditableMoneyCell = ({
columnDefinition,
editModeHorizontalAlign,
}: OwnProps) {
}: OwnProps) => {
const currentRowEntityId = useCurrentRowEntityId();
const fieldValue = useRecoilValue<number>(
@ -37,4 +37,4 @@ export function GenericEditableMoneyCell({
nonEditModeContent={<MoneyDisplay value={fieldValue} />}
></EditableCell>
);
}
};

10
front/src/modules/ui/table/editable-cell/type/components/GenericEditableMoneyCellEditMode.tsx
View File

@ -14,9 +14,9 @@ type OwnProps = {
columnDefinition: ColumnDefinition<ViewFieldMoneyMetadata>;
};
export function GenericEditableMoneyCellEditMode({
export const GenericEditableMoneyCellEditMode = ({
columnDefinition,
}: OwnProps) {
}: OwnProps) => {
const currentRowEntityId = useCurrentRowEntityId();
const [fieldValue, setFieldValue] = useRecoilState<string>(
@ -29,7 +29,7 @@ export function GenericEditableMoneyCellEditMode({
const updateField = useUpdateEntityField();
// TODO: handle this logic in a number input
function handleSubmit(newText: string) {
const handleSubmit = (newText: string) => {
if (newText === fieldValue) return;
try {
@ -53,7 +53,7 @@ export function GenericEditableMoneyCellEditMode({
`In GenericEditableMoneyCellEditMode, Invalid number: ${newText}, ${error}`,
);
}
}
};
const {
handleEnter,
@ -78,4 +78,4 @@ export function GenericEditableMoneyCellEditMode({
hotkeyScope={TableHotkeyScope.CellEditMode}
/>
);
}
};

6
front/src/modules/ui/table/editable-cell/type/components/GenericEditableNumberCell.tsx
View File

@ -15,10 +15,10 @@ type OwnProps = {
editModeHorizontalAlign?: 'left' | 'right';
};
export function GenericEditableNumberCell({
export const GenericEditableNumberCell = ({
columnDefinition,
editModeHorizontalAlign,
}: OwnProps) {
}: OwnProps) => {
const currentRowEntityId = useCurrentRowEntityId();
const fieldValue = useRecoilValue<string>(
@ -39,4 +39,4 @@ export function GenericEditableNumberCell({
nonEditModeContent={<NumberDisplay value={fieldValue} />}
></EditableCell>
);
}
};

10
front/src/modules/ui/table/editable-cell/type/components/GenericEditableNumberCellEditMode.tsx
View File

@ -18,9 +18,9 @@ type OwnProps = {
columnDefinition: ColumnDefinition<ViewFieldNumberMetadata>;
};
export function GenericEditableNumberCellEditMode({
export const GenericEditableNumberCellEditMode = ({
columnDefinition,
}: OwnProps) {
}: OwnProps) => {
const currentRowEntityId = useCurrentRowEntityId();
// TODO: we could use a hook that would return the field value with the right type
@ -33,7 +33,7 @@ export function GenericEditableNumberCellEditMode({
const updateField = useUpdateEntityField();
function handleSubmit(newText: string) {
const handleSubmit = (newText: string) => {
if (newText === fieldValue) return;
try {
@ -73,7 +73,7 @@ export function GenericEditableNumberCellEditMode({
`In GenericEditableNumberCellEditMode, Invalid number: ${newText}, ${error}`,
);
}
}
};
const {
handleEnter,
@ -97,4 +97,4 @@ export function GenericEditableNumberCellEditMode({
hotkeyScope={TableHotkeyScope.CellEditMode}
/>
);
}
};

6
front/src/modules/ui/table/editable-cell/type/components/GenericEditablePhoneCell.tsx
View File

@ -15,10 +15,10 @@ type OwnProps = {
editModeHorizontalAlign?: 'left' | 'right';
};
export function GenericEditablePhoneCell({
export const GenericEditablePhoneCell = ({
columnDefinition,
editModeHorizontalAlign,
}: OwnProps) {
}: OwnProps) => {
const currentRowEntityId = useCurrentRowEntityId();
const fieldValue = useRecoilValue<string>(
@ -38,4 +38,4 @@ export function GenericEditablePhoneCell({
nonEditModeContent={<PhoneDisplay value={fieldValue} />}
></EditableCell>
);
}
};

10
front/src/modules/ui/table/editable-cell/type/components/GenericEditablePhoneCellEditMode.tsx
View File

@ -15,9 +15,9 @@ type OwnProps = {
columnDefinition: ColumnDefinition<ViewFieldPhoneMetadata>;
};
export function GenericEditablePhoneCellEditMode({
export const GenericEditablePhoneCellEditMode = ({
columnDefinition,
}: OwnProps) {
}: OwnProps) => {
const currentRowEntityId = useCurrentRowEntityId();
// TODO: we could use a hook that would return the field value with the right type
@ -30,7 +30,7 @@ export function GenericEditablePhoneCellEditMode({
const updateField = useUpdateEntityField();
function handleSubmit(newValue: string) {
const handleSubmit = (newValue: string) => {
if (!isPossiblePhoneNumber(newValue)) return;
if (newValue === fieldValue) return;
@ -40,7 +40,7 @@ export function GenericEditablePhoneCellEditMode({
if (currentRowEntityId && updateField) {
updateField(currentRowEntityId, columnDefinition, newValue);
}
}
};
const {
handleEnter,
@ -65,4 +65,4 @@ export function GenericEditablePhoneCellEditMode({
hotkeyScope={TableHotkeyScope.CellEditMode}
/>
);
}
};

42
front/src/modules/ui/table/editable-cell/type/components/GenericEditableRelationCell.tsx
View File

@ -13,28 +13,26 @@ type OwnProps = {
placeholder?: string;
};
export function GenericEditableRelationCell({
export const GenericEditableRelationCell = ({
columnDefinition,
editModeHorizontalAlign,
placeholder,
}: OwnProps) {
return (
<EditableCell
maxContentWidth={160}
editModeHorizontalAlign={editModeHorizontalAlign}
editHotkeyScope={{ scope: RelationPickerHotkeyScope.RelationPicker }}
editModeContent={
<GenericEditableRelationCellEditMode
columnDefinition={columnDefinition}
/>
}
nonEditModeContent={
<GenericEditableRelationCellDisplayMode
columnDefinition={columnDefinition}
editModeHorizontalAlign={editModeHorizontalAlign}
placeholder={placeholder}
/>
}
></EditableCell>
);
}
}: OwnProps) => (
<EditableCell
maxContentWidth={160}
editModeHorizontalAlign={editModeHorizontalAlign}
editHotkeyScope={{ scope: RelationPickerHotkeyScope.RelationPicker }}
editModeContent={
<GenericEditableRelationCellEditMode
columnDefinition={columnDefinition}
/>
}
nonEditModeContent={
<GenericEditableRelationCellDisplayMode
columnDefinition={columnDefinition}
editModeHorizontalAlign={editModeHorizontalAlign}
placeholder={placeholder}
/>
}
></EditableCell>
);

6
front/src/modules/ui/table/editable-cell/type/components/GenericEditableRelationCellDisplayMode.tsx
View File

@ -16,9 +16,9 @@ type OwnProps = {
placeholder?: string;
};
export function GenericEditableRelationCellDisplayMode({
export const GenericEditableRelationCellDisplayMode = ({
columnDefinition,
}: OwnProps) {
}: OwnProps) => {
const currentRowEntityId = useCurrentRowEntityId();
// TODO: type value with generic getter
@ -54,4 +54,4 @@ export function GenericEditableRelationCellDisplayMode({
);
return <> </>;
}
}
};

30
front/src/modules/ui/table/editable-cell/type/components/GenericEditableRelationCellEditMode.tsx
View File

@ -19,9 +19,9 @@ type OwnProps = {
columnDefinition: ColumnDefinition<ViewFieldRelationMetadata>;
};
export function GenericEditableRelationCellEditMode({
export const GenericEditableRelationCellEditMode = ({
columnDefinition,
}: OwnProps) {
}: OwnProps) => {
const currentRowEntityId = useCurrentRowEntityId();
const { closeEditableCell } = useEditableCell();
@ -34,28 +34,28 @@ export function GenericEditableRelationCellEditMode({
);
const updateEntityField = useUpdateEntityField();
function updateCachedPersonField(newFieldEntity: EntityForSelect | null) {
const updateCachedPersonField = (newFieldEntity: EntityForSelect | null) => {
setFieldValueEntity({
avatarUrl: newFieldEntity?.avatarUrl ?? '',
entityType: Entity.Company,
id: newFieldEntity?.id ?? '',
displayName: newFieldEntity?.name ?? '',
});
}
};
function updateCachedCompanyField(
const updateCachedCompanyField = (
newFieldEntity: CompanyPickerSelectedCompany | null,
) {
) => {
setFieldValueEntity({
id: newFieldEntity?.id ?? '',
name: newFieldEntity?.name ?? '',
domainName: newFieldEntity?.domainName ?? '',
});
}
};
function handleCompanySubmit(
const handleCompanySubmit = (
newFieldEntity: CompanyPickerSelectedCompany | null,
) {
) => {
if (
newFieldEntity?.id !== fieldValueEntity?.id &&
currentRowEntityId &&
@ -70,9 +70,9 @@ export function GenericEditableRelationCellEditMode({
}
closeEditableCell();
}
};
function handlePersonSubmit(newFieldEntity: EntityForSelect | null) {
const handlePersonSubmit = (newFieldEntity: EntityForSelect | null) => {
if (
newFieldEntity?.id !== fieldValueEntity?.id &&
currentRowEntityId &&
@ -83,11 +83,11 @@ export function GenericEditableRelationCellEditMode({
}
closeEditableCell();
}
};
function handleCancel() {
const handleCancel = () => {
closeEditableCell();
}
};
switch (columnDefinition.metadata.relationType) {
case Entity.Company: {
@ -117,4 +117,4 @@ export function GenericEditableRelationCellEditMode({
);
return <></>;
}
}
};

6
front/src/modules/ui/table/editable-cell/type/components/GenericEditableTextCell.tsx
View File

@ -15,10 +15,10 @@ type OwnProps = {
editModeHorizontalAlign?: 'left' | 'right';
};
export function GenericEditableTextCell({
export const GenericEditableTextCell = ({
columnDefinition,
editModeHorizontalAlign,
}: OwnProps) {
}: OwnProps) => {
const currentRowEntityId = useCurrentRowEntityId();
const fieldValue = useRecoilValue<string>(
@ -37,4 +37,4 @@ export function GenericEditableTextCell({
nonEditModeContent={<TextDisplay text={fieldValue} />}
></EditableCell>
);
}
};

10
front/src/modules/ui/table/editable-cell/type/components/GenericEditableTextCellEditMode.tsx
View File

@ -14,9 +14,9 @@ type OwnProps = {
columnDefinition: ColumnDefinition<ViewFieldTextMetadata>;
};
export function GenericEditableTextCellEditMode({
export const GenericEditableTextCellEditMode = ({
columnDefinition,
}: OwnProps) {
}: OwnProps) => {
const currentRowEntityId = useCurrentRowEntityId();
// TODO: we could use a hook that would return the field value with the right type
@ -29,7 +29,7 @@ export function GenericEditableTextCellEditMode({
const updateField = useUpdateEntityField();
function handleSubmit(newText: string) {
const handleSubmit = (newText: string) => {
if (newText === fieldValue) return;
setFieldValue(newText);
@ -37,7 +37,7 @@ export function GenericEditableTextCellEditMode({
if (currentRowEntityId && updateField) {
updateField(currentRowEntityId, columnDefinition, newText);
}
}
};
const {
handleEnter,
@ -62,4 +62,4 @@ export function GenericEditableTextCellEditMode({
hotkeyScope={TableHotkeyScope.CellEditMode}
/>
);
}
};

6
front/src/modules/ui/table/editable-cell/type/components/GenericEditableURLCell.tsx
View File

@ -16,10 +16,10 @@ type OwnProps = {
editModeHorizontalAlign?: 'left' | 'right';
};
export function GenericEditableURLCell({
export const GenericEditableURLCell = ({
columnDefinition,
editModeHorizontalAlign,
}: OwnProps) {
}: OwnProps) => {
const currentRowEntityId = useCurrentRowEntityId();
const fieldValue = useRecoilValue<string>(
@ -39,4 +39,4 @@ export function GenericEditableURLCell({
nonEditModeContent={<URLDisplay value={sanitizeURL(fieldValue)} />}
></EditableCell>
);
}
};

10
front/src/modules/ui/table/editable-cell/type/components/GenericEditableURLCellEditMode.tsx
View File

@ -15,7 +15,9 @@ type OwnProps = {
columnDefinition: ColumnDefinition<ViewFieldURLMetadata>;
};
export function GenericEditableURLCellEditMode({ columnDefinition }: OwnProps) {
export const GenericEditableURLCellEditMode = ({
columnDefinition,
}: OwnProps) => {
const currentRowEntityId = useCurrentRowEntityId();
// TODO: we could use a hook that would return the field value with the right type
@ -28,7 +30,7 @@ export function GenericEditableURLCellEditMode({ columnDefinition }: OwnProps) {
const updateField = useUpdateEntityField();
function handleSubmit(newText: string) {
const handleSubmit = (newText: string) => {
if (newText === fieldValue) return;
if (newText !== '' && !isURL(newText)) return;
@ -38,7 +40,7 @@ export function GenericEditableURLCellEditMode({ columnDefinition }: OwnProps) {
if (currentRowEntityId && updateField) {
updateField(currentRowEntityId, columnDefinition, newText);
}
}
};
const {
handleEnter,
@ -63,4 +65,4 @@ export function GenericEditableURLCellEditMode({ columnDefinition }: OwnProps) {
hotkeyScope={TableHotkeyScope.CellEditMode}
/>
);
}
};

6
front/src/modules/ui/table/hooks/useCellInputEventHandlers.ts
View File

@ -3,13 +3,13 @@ import { useEditableCell } from '../editable-cell/hooks/useEditableCell';
import { useMoveSoftFocus } from './useMoveSoftFocus';
export function useCellInputEventHandlers<T>({
export const useCellInputEventHandlers = <T>({
onSubmit,
onCancel,
}: {
onSubmit?: (newValue: T) => void;
onCancel?: () => void;
}) {
}) => {
const { closeEditableCell } = useEditableCell();
const { isCurrentCellInEditMode } = useCurrentCellEditMode();
const { moveRight, moveLeft, moveDown } = useMoveSoftFocus();
@ -44,4 +44,4 @@ export function useCellInputEventHandlers<T>({
moveLeft();
},
};
}
};

5
front/src/modules/ui/table/hooks/useClearCellInEditMode.ts
View File

@ -3,8 +3,8 @@ import { useRecoilCallback } from 'recoil';
import { currentCellInEditModePositionState } from '../states/currentCellInEditModePositionState';
import { isCellInEditModeFamilyState } from '../states/isCellInEditModeFamilyState';
export function useCloseCurrentCellInEditMode() {
return useRecoilCallback(({ set, snapshot }) => {
export const useCloseCurrentCellInEditMode = () =>
useRecoilCallback(({ set, snapshot }) => {
return async () => {
const currentCellInEditModePosition = await snapshot.getPromise(
currentCellInEditModePositionState,
@ -13,4 +13,3 @@ export function useCloseCurrentCellInEditMode() {
set(isCellInEditModeFamilyState(currentCellInEditModePosition), false);
};
}, []);
}

4
front/src/modules/ui/table/hooks/useCurrentEntityId.ts
View File

@ -2,8 +2,8 @@ import { useContext } from 'react';
import { RowIdContext } from '../contexts/RowIdContext';
export function useCurrentRowEntityId() {
export const useCurrentRowEntityId = () => {
const currentEntityId = useContext(RowIdContext);
return currentEntityId;
}
};

4
front/src/modules/ui/table/hooks/useCurrentRowSelected.ts
View File

@ -4,7 +4,7 @@ import { useRecoilCallback, useRecoilState } from 'recoil';
import { RowIdContext } from '../contexts/RowIdContext';
import { isRowSelectedFamilyState } from '../states/isRowSelectedFamilyState';
export function useCurrentRowSelected() {
export const useCurrentRowSelected = () => {
const currentRowId = useContext(RowIdContext);
const [isRowSelected] = useRecoilState(
@ -33,4 +33,4 @@ export function useCurrentRowSelected() {
currentRowSelected: isRowSelected,
setCurrentRowSelected,
};
}
};

5
front/src/modules/ui/table/hooks/useDisableSoftFocus.ts
View File

@ -4,8 +4,8 @@ import { isSoftFocusActiveState } from '../states/isSoftFocusActiveState';
import { isSoftFocusOnCellFamilyState } from '../states/isSoftFocusOnCellFamilyState';
import { softFocusPositionState } from '../states/softFocusPositionState';
export function useDisableSoftFocus() {
return useRecoilCallback(({ set, snapshot }) => {
export const useDisableSoftFocus = () =>
useRecoilCallback(({ set, snapshot }) => {
return () => {
const currentPosition = snapshot
.getLoadable(softFocusPositionState)
@ -16,4 +16,3 @@ export function useDisableSoftFocus() {
set(isSoftFocusOnCellFamilyState(currentPosition), false);
};
}, []);
}

4
front/src/modules/ui/table/hooks/useLeaveTableFocus.ts
View File

@ -8,7 +8,7 @@ import { TableHotkeyScope } from '../types/TableHotkeyScope';
import { useCloseCurrentCellInEditMode } from './useClearCellInEditMode';
import { useDisableSoftFocus } from './useDisableSoftFocus';
export function useLeaveTableFocus() {
export const useLeaveTableFocus = () => {
const disableSoftFocus = useDisableSoftFocus();
const closeCurrentCellInEditMode = useCloseCurrentCellInEditMode();
@ -36,4 +36,4 @@ export function useLeaveTableFocus() {
},
[closeCurrentCellInEditMode, disableSoftFocus],
);
}
};

4
front/src/modules/ui/table/hooks/useMapKeyboardToSoftFocus.ts
View File

@ -8,7 +8,7 @@ import { TableHotkeyScope } from '../types/TableHotkeyScope';
import { useDisableSoftFocus } from './useDisableSoftFocus';
import { useMoveSoftFocus } from './useMoveSoftFocus';
export function useMapKeyboardToSoftFocus() {
export const useMapKeyboardToSoftFocus = () => {
const { moveDown, moveLeft, moveRight, moveUp } = useMoveSoftFocus();
const disableSoftFocus = useDisableSoftFocus();
@ -59,4 +59,4 @@ export function useMapKeyboardToSoftFocus() {
TableHotkeyScope.TableSoftFocus,
[disableSoftFocus],
);
}
};

5
front/src/modules/ui/table/hooks/useMoveEditModeToCellPosition.ts
View File

@ -4,8 +4,8 @@ import { currentCellInEditModePositionState } from '../states/currentCellInEditM
import { isCellInEditModeFamilyState } from '../states/isCellInEditModeFamilyState';
import { CellPosition } from '../types/CellPosition';
export function useMoveEditModeToCellPosition() {
return useRecoilCallback(({ set, snapshot }) => {
export const useMoveEditModeToCellPosition = () =>
useRecoilCallback(({ set, snapshot }) => {
return (newPosition: CellPosition) => {
const currentCellInEditModePosition = snapshot
.getLoadable(currentCellInEditModePositionState)
@ -18,4 +18,3 @@ export function useMoveEditModeToCellPosition() {
set(isCellInEditModeFamilyState(newPosition), true);
};
}, []);
}

5
front/src/modules/ui/table/hooks/useMoveSoftFocus.ts
View File

@ -10,7 +10,8 @@ import { softFocusPositionState } from '../states/softFocusPositionState';
import { useSetSoftFocusPosition } from './useSetSoftFocusPosition';
// TODO: stories
export function useMoveSoftFocus() {
export const useMoveSoftFocus = () => {
const tableScopeId = useRecoilScopeId(TableRecoilScopeContext);
const setSoftFocusPosition = useSetSoftFocusPosition();
@ -155,4 +156,4 @@ export function useMoveSoftFocus() {
moveRight,
moveUp,
};
}
};

5
front/src/modules/ui/table/hooks/useResetTableRowSelection.ts
View File

@ -3,8 +3,8 @@ import { useRecoilCallback } from 'recoil';
import { isRowSelectedFamilyState } from '../states/isRowSelectedFamilyState';
import { tableRowIdsState } from '../states/tableRowIdsState';
export function useResetTableRowSelection() {
return useRecoilCallback(
export const useResetTableRowSelection = () =>
useRecoilCallback(
({ snapshot, set }) =>
() => {
const tableRowIds = snapshot
@ -17,4 +17,3 @@ export function useResetTableRowSelection() {
},
[],
);
}

4
front/src/modules/ui/table/hooks/useSelectAllRows.ts
View File

@ -4,7 +4,7 @@ import { isRowSelectedFamilyState } from '../states/isRowSelectedFamilyState';
import { allRowsSelectedStatusSelector } from '../states/selectors/allRowsSelectedStatusSelector';
import { tableRowIdsState } from '../states/tableRowIdsState';
export function useSelectAllRows() {
export const useSelectAllRows = () => {
const allRowsSelectedStatus = useRecoilValue(allRowsSelectedStatusSelector);
const selectAllRows = useRecoilCallback(
@ -38,4 +38,4 @@ export function useSelectAllRows() {
allRowsSelectedStatus,
selectAllRows,
};
}
};

4
front/src/modules/ui/table/hooks/useSetEntityTableData.ts
View File

@ -13,7 +13,7 @@ import { SortDefinition } from '@/ui/view-bar/types/SortDefinition';
import { isFetchingEntityTableDataState } from '../states/isFetchingEntityTableDataState';
import { numberOfTableRowsState } from '../states/numberOfTableRowsState';
export function useSetEntityTableData() {
export const useSetEntityTableData = () => {
const resetTableRowSelection = useResetTableRowSelection();
const tableContextScopeId = useRecoilScopeId(TableRecoilScopeContext);
@ -62,4 +62,4 @@ export function useSetEntityTableData() {
},
[resetTableRowSelection, tableContextScopeId],
);
}
};

5
front/src/modules/ui/table/hooks/useSetRowSelectedState.ts
View File

@ -2,8 +2,7 @@ import { useRecoilCallback } from 'recoil';
import { isRowSelectedFamilyState } from '../states/isRowSelectedFamilyState';
export function useSetRowSelectedState() {
return useRecoilCallback(({ set }) => (rowId: string, selected: boolean) => {
export const useSetRowSelectedState = () =>
useRecoilCallback(({ set }) => (rowId: string, selected: boolean) => {
set(isRowSelectedFamilyState(rowId), selected);
});
}

5
front/src/modules/ui/table/hooks/useSetSoftFocusPosition.ts
View File

@ -5,8 +5,8 @@ import { isSoftFocusOnCellFamilyState } from '../states/isSoftFocusOnCellFamilyS
import { softFocusPositionState } from '../states/softFocusPositionState';
import { CellPosition } from '../types/CellPosition';
export function useSetSoftFocusPosition() {
return useRecoilCallback(({ set, snapshot }) => {
export const useSetSoftFocusPosition = () =>
useRecoilCallback(({ set, snapshot }) => {
return (newPosition: CellPosition) => {
const currentPosition = snapshot
.getLoadable(softFocusPositionState)
@ -21,4 +21,3 @@ export function useSetSoftFocusPosition() {
set(isSoftFocusOnCellFamilyState(newPosition), true);
};
}, []);
}

10
front/src/modules/ui/table/hooks/useUpdateEntityField.ts
View File

@ -49,10 +49,10 @@ import type {
import { EntityUpdateMutationContext } from '../contexts/EntityUpdateMutationHookContext';
import type { ColumnDefinition } from '../types/ColumnDefinition';
export function useUpdateEntityField() {
export const useUpdateEntityField = () => {
const updateEntity = useContext(EntityUpdateMutationContext);
return function updateEntityField<
const updateEntityField = <
MetadataType extends ViewFieldMetadata,
ValueType extends MetadataType extends ViewFieldDoubleTextMetadata
? ViewFieldDoubleTextValue
@ -77,7 +77,7 @@ export function useUpdateEntityField() {
currentEntityId: string,
columnDefinition: ColumnDefinition<MetadataType>,
newFieldValue: ValueType | null,
) {
) => {
// TODO: improve type guards organization, maybe with a common typeguard for all view fields
// taking an object of options as parameter ?
//
@ -174,4 +174,6 @@ export function useUpdateEntityField() {
});
}
};
}
return updateEntityField;
};

5
front/src/modules/ui/table/hooks/useUpsertEntityTableItem.ts
View File

@ -2,8 +2,8 @@ import { useRecoilCallback } from 'recoil';
import { tableEntitiesFamilyState } from '@/ui/table/states/tableEntitiesFamilyState';
export function useUpsertEntityTableItem() {
return useRecoilCallback(
export const useUpsertEntityTableItem = () =>
useRecoilCallback(
({ set, snapshot }) =>
<T extends { id: string }>(entity: T) => {
const currentEntity = snapshot
@ -16,4 +16,3 @@ export function useUpsertEntityTableItem() {
},
[],
);
}

5
front/src/modules/ui/table/hooks/useUpsertEntityTableItems.ts
View File

@ -2,8 +2,8 @@ import { useRecoilCallback } from 'recoil';
import { tableEntitiesFamilyState } from '@/ui/table/states/tableEntitiesFamilyState';
export function useUpsertEntityTableItems() {
return useRecoilCallback(
export const useUpsertEntityTableItems = () =>
useRecoilCallback(
({ set, snapshot }) =>
<T extends { id: string }>(entities: T[]) => {
// Create a map of new entities for quick lookup.
@ -31,4 +31,3 @@ export function useUpsertEntityTableItems() {
},
[],
);
}

5
front/src/modules/ui/table/hooks/useUpsertTableRowId.ts
View File

@ -2,8 +2,8 @@ import { useRecoilCallback } from 'recoil';
import { tableRowIdsState } from '../states/tableRowIdsState';
export function useUpsertTableRowId() {
return useRecoilCallback(
export const useUpsertTableRowId = () =>
useRecoilCallback(
({ set, snapshot }) =>
(rowId: string) => {
const currentRowIds = snapshot
@ -14,4 +14,3 @@ export function useUpsertTableRowId() {
},
[],
);
}

5
front/src/modules/ui/table/hooks/useUpsertTableRowIds.ts
View File

@ -2,8 +2,8 @@ import { useRecoilCallback } from 'recoil';
import { tableRowIdsState } from '../states/tableRowIdsState';
export function useUpsertTableRowIds() {
return useRecoilCallback(
export const useUpsertTableRowIds = () =>
useRecoilCallback(
({ set, snapshot }) =>
(rowIds: string[]) => {
const currentRowIds = snapshot
@ -15,4 +15,3 @@ export function useUpsertTableRowIds() {
},
[],
);
}

6
front/src/modules/ui/table/options/components/TableOptionsDropdown.tsx
View File

@ -13,9 +13,9 @@ type TableOptionsDropdownProps = {
customHotkeyScope: HotkeyScope;
};
export function TableOptionsDropdown({
export const TableOptionsDropdown = ({
customHotkeyScope,
}: TableOptionsDropdownProps) {
}: TableOptionsDropdownProps) => {
const resetViewEditMode = useResetRecoilState(viewEditModeState);
return (
@ -27,4 +27,4 @@ export function TableOptionsDropdown({
onClickOutside={resetViewEditMode}
/>
);
}
};

4
front/src/modules/ui/table/options/components/TableOptionsDropdownButton.tsx
View File

@ -3,7 +3,7 @@ import { useDropdownButton } from '@/ui/dropdown/hooks/useDropdownButton';
import { TableOptionsDropdownId } from '../../constants/TableOptionsDropdownId';
export function TableOptionsDropdownButton() {
export const TableOptionsDropdownButton = () => {
const { isDropdownButtonOpen, toggleDropdownButton } = useDropdownButton({
dropdownId: TableOptionsDropdownId,
});
@ -16,4 +16,4 @@ export function TableOptionsDropdownButton() {
Options
</StyledHeaderDropdownButton>
);
}
};

4
front/src/modules/ui/table/options/components/TableOptionsDropdownContent.tsx
View File

@ -56,7 +56,7 @@ const StyledViewNameInput = styled.input`
}
`;
export function TableOptionsDropdownContent() {
export const TableOptionsDropdownContent = () => {
const scopeId = useRecoilScopeId(TableRecoilScopeContext);
const { onImport } = useContext(ViewBarContext);
@ -201,4 +201,4 @@ export function TableOptionsDropdownContent() {
)}
</StyledDropdownMenu>
);
}
};

8
front/src/modules/ui/table/table-header/components/TableHeader.tsx
View File

@ -18,7 +18,7 @@ import { canPersistTableColumnsScopedFamilySelector } from '../../states/selecto
import { tableColumnsScopedState } from '../../states/tableColumnsScopedState';
import { TableOptionsHotkeyScope } from '../../types/TableOptionsHotkeyScope';
export function TableHeader() {
export const TableHeader = () => {
const { onCurrentViewSubmit, ...viewBarContextProps } =
useContext(ViewBarContext);
const tableRecoilScopeId = useRecoilScopeId(TableRecoilScopeContext);
@ -54,13 +54,13 @@ export function TableHeader() {
[tableRecoilScopeId],
);
async function handleCurrentViewSubmit() {
const handleCurrentViewSubmit = async () => {
if (canPersistTableColumns) {
setSavedTableColumns(tableColumns);
}
await onCurrentViewSubmit?.();
}
};
return (
<RecoilScope CustomRecoilScopeContext={DropdownRecoilScopeContext}>
@ -84,4 +84,4 @@ export function TableHeader() {
</ViewBarContext.Provider>
</RecoilScope>
);
}
};