Change to using arrow functions (#1603)

* 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>

front/src/modules/ui/table/components/CheckboxCell.tsx

@@ -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>
   );
-}
+};

front/src/modules/ui/table/components/ColumnHead.tsx

@@ -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>
   );
-}
+};

front/src/modules/ui/table/components/EntityTable.tsx

@@ -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>
   );
-}
+};

front/src/modules/ui/table/components/EntityTableBody.tsx

@@ -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>
   );
-}
+};

front/src/modules/ui/table/components/EntityTableCell.tsx

@@ -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>
   );
-}
+};

front/src/modules/ui/table/components/EntityTableEffect.tsx

@@ -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 <></>;
-}
+};

front/src/modules/ui/table/components/EntityTableHeader.tsx

@@ -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>
   );
-}
+};

front/src/modules/ui/table/components/EntityTableRow.tsx

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

front/src/modules/ui/table/components/SelectAllCheckbox.tsx

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