Show Entity task/note tabs (#1282)

* - show task tab
- tab bar

* - add notes tab

* - fixed unused style

* - add button
- fixed company edit note test

* - fixed merge & dropdown

* - added Tests
- refactored directory structure activities
- moved Task/Note Pages to corresponding modules
- fixed TabList

* lint

front/src/pages/people/PersonShow.tsx

@@ -2,7 +2,6 @@ import { useParams } from 'react-router-dom';
 import { getOperationName } from '@apollo/client/utilities';
 import { useTheme } from '@emotion/react';
 
-import { Timeline } from '@/activities/timeline/components/Timeline';
 import { ActivityTargetableEntityType } from '@/activities/types/ActivityTargetableEntity';
 import { useFavorites } from '@/favorites/hooks/useFavorites';
 import { GET_PERSON } from '@/people/graphql/queries/getPerson';
@@ -14,9 +13,12 @@ import { EditableFieldMutationContext } from '@/ui/editable-field/contexts/Edita
 import { PropertyBox } from '@/ui/editable-field/property-box/components/PropertyBox';
 import { IconUser } from '@/ui/icon';
 import { WithTopBarContainer } from '@/ui/layout/components/WithTopBarContainer';
+import { ShowPageAddButton } from '@/ui/layout/show-page/components/ShowPageAddButton';
 import { ShowPageLeftContainer } from '@/ui/layout/show-page/components/ShowPageLeftContainer';
 import { ShowPageRightContainer } from '@/ui/layout/show-page/components/ShowPageRightContainer';
 import { ShowPageSummaryCard } from '@/ui/layout/show-page/components/ShowPageSummaryCard';
+import { ShowPageRecoilScopeContext } from '@/ui/layout/states/ShowPageRecoilScopeContext';
+import { RecoilScope } from '@/ui/utilities/recoil-scope/components/RecoilScope';
 import {
   useUpdateOnePersonMutation,
   useUploadPersonPictureMutation,
@@ -67,47 +69,60 @@ export function PersonShow() {
       hasBackButton
       isFavorite={isFavorite}
       onFavoriteButtonClick={handleFavoriteButtonClick}
+      extraButtons={[
+        <ShowPageAddButton
+          key="add"
+          entity={{
+            id: person.id,
+            type: ActivityTargetableEntityType.Person,
+          }}
+        />,
+      ]}
     >
-      <ShowPageContainer>
-        <ShowPageLeftContainer>
-          <ShowPageSummaryCard
-            id={person.id}
-            title={person.displayName ?? 'No name'}
-            logoOrAvatar={person.avatarUrl ?? undefined}
-            date={person.createdAt ?? ''}
-            renderTitleEditComponent={() =>
-              person ? <PeopleFullNameEditableField people={person} /> : <></>
-            }
-            onUploadPicture={onUploadPicture}
-          />
-          <PropertyBox extraPadding={true}>
-            <EditableFieldMutationContext.Provider
-              value={useUpdateOnePersonMutation}
-            >
-              <EditableFieldEntityIdContext.Provider value={person.id}>
-                {personShowFieldDefinition.map((fieldDefinition) => {
-                  return (
-                    <EditableFieldDefinitionContext.Provider
-                      value={fieldDefinition}
-                      key={fieldDefinition.id}
-                    >
-                      <GenericEditableField />
-                    </EditableFieldDefinitionContext.Provider>
-                  );
-                })}
-              </EditableFieldEntityIdContext.Provider>
-            </EditableFieldMutationContext.Provider>
-          </PropertyBox>
-        </ShowPageLeftContainer>
-        <ShowPageRightContainer>
-          <Timeline
+      <RecoilScope SpecificContext={ShowPageRecoilScopeContext}>
+        <ShowPageContainer>
+          <ShowPageLeftContainer>
+            <ShowPageSummaryCard
+              id={person.id}
+              title={person.displayName ?? 'No name'}
+              logoOrAvatar={person.avatarUrl ?? undefined}
+              date={person.createdAt ?? ''}
+              renderTitleEditComponent={() =>
+                person ? <PeopleFullNameEditableField people={person} /> : <></>
+              }
+              onUploadPicture={onUploadPicture}
+            />
+            <PropertyBox extraPadding={true}>
+              <EditableFieldMutationContext.Provider
+                value={useUpdateOnePersonMutation}
+              >
+                <EditableFieldEntityIdContext.Provider value={person.id}>
+                  {personShowFieldDefinition.map((fieldDefinition) => {
+                    return (
+                      <EditableFieldDefinitionContext.Provider
+                        value={fieldDefinition}
+                        key={fieldDefinition.id}
+                      >
+                        <GenericEditableField />
+                      </EditableFieldDefinitionContext.Provider>
+                    );
+                  })}
+                </EditableFieldEntityIdContext.Provider>
+              </EditableFieldMutationContext.Provider>
+            </PropertyBox>
+          </ShowPageLeftContainer>
+          <ShowPageRightContainer
             entity={{
               id: person.id ?? '',
               type: ActivityTargetableEntityType.Person,
             }}
+            timeline
+            tasks
+            notes
+            emails
           />
-        </ShowPageRightContainer>
-      </ShowPageContainer>
+        </ShowPageContainer>
+      </RecoilScope>
     </WithTopBarContainer>
   );
 }