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/activities/components/ActivityAssigneePicker.tsx

@@ -30,11 +30,11 @@ type UserForSelect = EntityForSelect & {
   entityType: Entity.User;
 };
 
-export function ActivityAssigneePicker({
+export const ActivityAssigneePicker = ({
   activity,
   onSubmit,
   onCancel,
-}: OwnProps) {
+}: OwnProps) => {
   const [relationPickerSearchFilter] = useRecoilScopedState(
     relationPickerSearchFilterScopedState,
   );
@@ -68,9 +68,9 @@ export function ActivityAssigneePicker({
     fragment: ACTIVITY_UPDATE_FRAGMENT,
   });
 
-  async function handleEntitySelected(
+  const handleEntitySelected = async (
     selectedUser: UserForSelect | null | undefined,
-  ) {
+  ) => {
     if (selectedUser) {
       const workspaceMemberAssignee = (
         await getWorkspaceMember({
@@ -108,7 +108,7 @@ export function ActivityAssigneePicker({
     }
 
     onSubmit?.();
-  }
+  };
 
   return (
     <SingleEntitySelect
@@ -119,4 +119,4 @@ export function ActivityAssigneePicker({
       selectedEntity={users.selectedEntities[0]}
     />
   );
-}
+};

front/src/modules/activities/components/ActivityBodyEditor.tsx

@@ -19,7 +19,7 @@ type OwnProps = {
   onChange?: (activityBody: string) => void;
 };
 
-export function ActivityBodyEditor({ activity, onChange }: OwnProps) {
+export const ActivityBodyEditor = ({ activity, onChange }: OwnProps) => {
   const [updateActivityMutation] = useUpdateActivityMutation();
 
   const client = useApolloClient();
@@ -37,7 +37,7 @@ export function ActivityBodyEditor({ activity, onChange }: OwnProps) {
   }, [body, onChange]);
 
   const debounceOnChange = useMemo(() => {
-    function onInternalChange(activityBody: string) {
+    const onInternalChange = (activityBody: string) => {
       setBody(activityBody);
       updateActivityMutation({
         variables: {
@@ -56,7 +56,7 @@ export function ActivityBodyEditor({ activity, onChange }: OwnProps) {
           },
         },
       });
-    }
+    };
 
     return debounce(onInternalChange, 200);
   }, [updateActivityMutation, activity.id, cachedActivity]);
@@ -74,4 +74,4 @@ export function ActivityBodyEditor({ activity, onChange }: OwnProps) {
       <BlockEditor editor={editor} />
     </StyledBlockNoteStyledContainer>
   );
-}
+};

front/src/modules/activities/components/ActivityComments.tsx

@@ -59,10 +59,10 @@ const StyledThreadCommentTitle = styled.div`
   text-transform: uppercase;
 `;
 
-export function ActivityComments({
+export const ActivityComments = ({
   activity,
   scrollableContainerRef,
-}: OwnProps) {
+}: OwnProps) => {
   const [createCommentMutation] = useCreateCommentMutation();
   const currentUser = useRecoilValue(currentUserState);
 
@@ -70,7 +70,7 @@ export function ActivityComments({
     return <></>;
   }
 
-  function handleSendComment(commentText: string) {
+  const handleSendComment = (commentText: string) => {
     if (!isNonEmptyString(commentText)) {
       return;
     }
@@ -91,16 +91,16 @@ export function ActivityComments({
       },
       awaitRefetchQueries: true,
     });
-  }
+  };
 
-  function handleFocus() {
+  const handleFocus = () => {
     const scrollableContainer = scrollableContainerRef.current;
 
     scrollableContainer?.scrollTo({
       top: scrollableContainer.scrollHeight,
       behavior: 'smooth',
     });
-  }
+  };
 
   return (
     <>
@@ -127,4 +127,4 @@ export function ActivityComments({
       </StyledCommentActionBar>
     </>
   );
-}
+};

front/src/modules/activities/components/ActivityCreateButton.tsx

@@ -8,21 +8,19 @@ type ActivityCreateButtonProps = {
   onActivityClick?: () => void;
 };
 
-export function ActivityCreateButton({
+export const ActivityCreateButton = ({
   onNoteClick,
   onTaskClick,
   onActivityClick,
-}: ActivityCreateButtonProps) {
-  return (
-    <ButtonGroup variant={'secondary'}>
-      <Button Icon={IconNotes} title="Note" onClick={onNoteClick} />
-      <Button Icon={IconCheckbox} title="Task" onClick={onTaskClick} />
-      <Button
-        Icon={IconTimelineEvent}
-        title="Activity"
-        soon={true}
-        onClick={onActivityClick}
-      />
-    </ButtonGroup>
-  );
-}
+}: ActivityCreateButtonProps) => (
+  <ButtonGroup variant={'secondary'}>
+    <Button Icon={IconNotes} title="Note" onClick={onNoteClick} />
+    <Button Icon={IconCheckbox} title="Task" onClick={onTaskClick} />
+    <Button
+      Icon={IconTimelineEvent}
+      title="Activity"
+      soon={true}
+      onClick={onActivityClick}
+    />
+  </ButtonGroup>
+);

front/src/modules/activities/components/ActivityEditor.tsx

@@ -79,11 +79,11 @@ type OwnProps = {
   autoFillTitle?: boolean;
 };
 
-export function ActivityEditor({
+export const ActivityEditor = ({
   activity,
   showComment = true,
   autoFillTitle = false,
-}: OwnProps) {
+}: OwnProps) => {
   const [hasUserManuallySetTitle, setHasUserManuallySetTitle] =
     useState<boolean>(false);
 
@@ -154,13 +154,13 @@ export function ActivityEditor({
 
   const debouncedUpdateTitle = debounce(updateTitle, 200);
 
-  function updateTitleFromBody(body: string) {
+  const updateTitleFromBody = (body: string) => {
     const parsedTitle = JSON.parse(body)[0]?.content[0]?.text;
     if (!hasUserManuallySetTitle && autoFillTitle) {
       setTitle(parsedTitle);
       debouncedUpdateTitle(parsedTitle);
     }
-  }
+  };
 
   if (!activity) {
     return <></>;
@@ -226,4 +226,4 @@ export function ActivityEditor({
       )}
     </StyledContainer>
   );
-}
+};

front/src/modules/activities/components/ActivityTargetChips.tsx

@@ -11,7 +11,7 @@ const StyledContainer = styled.div`
   gap: ${({ theme }) => theme.spacing(1)};
 `;
 
-export function ActivityTargetChips({
+export const ActivityTargetChips = ({
   targets,
 }: {
   targets?: Array<
@@ -20,7 +20,7 @@ export function ActivityTargetChips({
       company?: Pick<Company, 'id' | 'domainName' | 'name'> | null;
     }
   > | null;
-}) {
+}) => {
   if (!targets) {
     return null;
   }
@@ -52,4 +52,4 @@ export function ActivityTargetChips({
       })}
     </StyledContainer>
   );
-}
+};

front/src/modules/activities/components/ActivityTitle.tsx

@@ -52,32 +52,30 @@ type OwnProps = {
   onCompletionChange: (value: boolean) => void;
 };
 
-export function ActivityTitle({
+export const ActivityTitle = ({
   title,
   completed,
   type,
   onTitleChange,
   onCompletionChange,
-}: OwnProps) {
-  return (
-    <StyledContainer>
-      {type === ActivityType.Task && (
-        <StyledCheckboxContainer onClick={() => onCompletionChange(!completed)}>
-          <Checkbox
-            size={CheckboxSize.Large}
-            shape={CheckboxShape.Rounded}
-            checked={completed}
-          />
-        </StyledCheckboxContainer>
-      )}
-      <StyledEditableTitleInput
-        autoComplete="off"
-        autoFocus
-        placeholder={`${type} title`}
-        onChange={(event) => onTitleChange(event.target.value)}
-        value={title}
-        completed={completed}
-      />
-    </StyledContainer>
-  );
-}
+}: OwnProps) => (
+  <StyledContainer>
+    {type === ActivityType.Task && (
+      <StyledCheckboxContainer onClick={() => onCompletionChange(!completed)}>
+        <Checkbox
+          size={CheckboxSize.Large}
+          shape={CheckboxShape.Rounded}
+          checked={completed}
+        />
+      </StyledCheckboxContainer>
+    )}
+    <StyledEditableTitleInput
+      autoComplete="off"
+      autoFocus
+      placeholder={`${type} title`}
+      onChange={(event) => onTitleChange(event.target.value)}
+      value={title}
+      completed={completed}
+    />
+  </StyledContainer>
+);

front/src/modules/activities/components/ActivityTypeDropdown.tsx

@@ -13,7 +13,7 @@ type OwnProps = {
   activity: Pick<Activity, 'type'>;
 };
 
-export function ActivityTypeDropdown({ activity }: OwnProps) {
+export const ActivityTypeDropdown = ({ activity }: OwnProps) => {
   const theme = useTheme();
   return (
     <Chip
@@ -30,4 +30,4 @@ export function ActivityTypeDropdown({ activity }: OwnProps) {
       variant={ChipVariant.Highlighted}
     />
   );
-}
+};