Add dueDate and assignee on notes (#988)

* Add dueDate and assignee on notes

* Fix tests

* Fix tests

front/src/modules/people/constants/peopleViewFields.tsx

@@ -33,6 +33,7 @@ export const peopleViewFields: ViewFieldDefinition<ViewFieldMetadata>[] = [
       secondValueFieldName: 'lastName',
       firstValuePlaceholder: 'First name',
       secondValuePlaceholder: 'Last name',
+      avatarUrlFieldName: 'avatarUrl',
       entityType: Entity.Person,
     },
   } satisfies ViewFieldDefinition<ViewFieldDoubleTextChipMetadata>,

front/src/modules/people/editable-field/components/PeopleCompanyEditableField.tsx

@@ -41,6 +41,7 @@ export function PeopleCompanyEditableField({ people }: OwnProps) {
             )
           }
           isDisplayModeContentEmpty={!people.company}
+          isDisplayModeFixHeight
         />
       </RecoilScope>
     </RecoilScope>

front/src/modules/people/editable-field/components/PeopleCompanyEditableFieldEditMode.tsx

@@ -1,3 +1,5 @@
+import styled from '@emotion/styled';
+
 import { useFilteredSearchCompanyQuery } from '@/companies/queries';
 import { useEditableField } from '@/ui/editable-field/hooks/useEditableField';
 import { useRecoilScopedState } from '@/ui/recoil-scope/hooks/useRecoilScopedState';
@@ -14,6 +16,12 @@ export type OwnProps = {
   people: Pick<Person, 'id'> & { company?: Pick<Company, 'id'> | null };
 };
 
+const StyledContainer = styled.div`
+  left: 0px;
+  position: absolute;
+  top: -8px;
+`;
+
 export function PeopleCompanyEditableFieldEditMode({ people }: OwnProps) {
   const { closeEditableField } = useEditableField();
 
@@ -51,14 +59,16 @@ export function PeopleCompanyEditableFieldEditMode({ people }: OwnProps) {
   }
 
   return (
-    <SingleEntitySelect
-      onEntitySelected={handleEntitySelected}
-      entities={{
-        entitiesToSelect: companies.entitiesToSelect,
-        selectedEntity: companies.selectedEntities[0],
-        loading: companies.loading,
-      }}
-      onCancel={handleCancel}
-    />
+    <StyledContainer>
+      <SingleEntitySelect
+        onEntitySelected={handleEntitySelected}
+        entities={{
+          entitiesToSelect: companies.entitiesToSelect,
+          selectedEntity: companies.selectedEntities[0],
+          loading: companies.loading,
+        }}
+        onCancel={handleCancel}
+      />
+    </StyledContainer>
   );
 }

front/src/modules/people/editable-field/components/PeopleFullNameEditableField.tsx

@@ -1,6 +1,5 @@
-import { useEffect, useState } from 'react';
+import { useState } from 'react';
 
-import { EditableField } from '@/ui/editable-field/components/EditableField';
 import { FieldContext } from '@/ui/editable-field/states/FieldContext';
 import { RecoilScope } from '@/ui/recoil-scope/components/RecoilScope';
 import { Person, useUpdateOnePersonMutation } from '~/generated/graphql';
@@ -21,56 +20,40 @@ export function PeopleFullNameEditableField({ people }: OwnProps) {
 
   const [updatePeople] = useUpdateOnePersonMutation();
 
-  useEffect(() => {
-    setInternalValueFirstName(people.firstName);
-    setInternalValueLastName(people.lastName);
-  }, [people.firstName, people.lastName]);
-
   async function handleChange(
     newValueFirstName: string,
     newValueLastName: string,
   ) {
     setInternalValueFirstName(newValueFirstName);
     setInternalValueLastName(newValueLastName);
+    handleSubmit(newValueFirstName, newValueLastName);
   }
 
-  async function handleSubmit() {
+  async function handleSubmit(
+    newValueFirstName: string,
+    newValueLastName: string,
+  ) {
     await updatePeople({
       variables: {
         where: {
           id: people.id,
         },
         data: {
-          firstName: internalValueFirstName ?? '',
-          lastName: internalValueLastName ?? '',
+          firstName: newValueFirstName ?? '',
+          lastName: newValueLastName ?? '',
         },
       },
     });
   }
 
-  async function handleCancel() {
-    setInternalValueFirstName(people.firstName);
-    setInternalValueLastName(people.lastName);
-  }
-
   return (
     <RecoilScope SpecificContext={FieldContext}>
-      <EditableField
-        onSubmit={handleSubmit}
-        onCancel={handleCancel}
-        editModeContent={
-          <InplaceInputDoubleText
-            firstValuePlaceholder={'First name'}
-            secondValuePlaceholder={'Last name'}
-            firstValue={internalValueFirstName ?? ''}
-            secondValue={internalValueLastName ?? ''}
-            onChange={handleChange}
-          />
-        }
-        displayModeContent={`${internalValueFirstName}  ${internalValueLastName}`}
-        isDisplayModeContentEmpty={
-          !(internalValueFirstName !== '') && !(internalValueLastName !== '')
-        }
+      <InplaceInputDoubleText
+        firstValuePlaceholder={'First name'}
+        secondValuePlaceholder={'Last name'}
+        firstValue={internalValueFirstName ?? ''}
+        secondValue={internalValueLastName ?? ''}
+        onChange={handleChange}
       />
     </RecoilScope>
   );