From 20d06b3c0ff081a35ccf943ace6f9ddf80111746 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Rapha=C3=ABl=20Bosi?=
 <71827178+bosiraphael@users.noreply.github.com>
Date: Sat, 21 Sep 2024 00:35:39 +0200
Subject: [PATCH] 7182 person avatar is not the same color in emails and
 calendar (#7185)

Fixes #7182 and displayName in calendar
---
 .../calendar/components/CalendarEventRow.tsx           |  2 +-
 .../emails/components/EmailThreadPreview.tsx           | 10 +++++++++-
 .../calendar/timeline-calendar-event.service.ts        |  2 ++
 3 files changed, 12 insertions(+), 2 deletions(-)

diff --git a/packages/twenty-front/src/modules/activities/calendar/components/CalendarEventRow.tsx b/packages/twenty-front/src/modules/activities/calendar/components/CalendarEventRow.tsx
index a246ff432..cb9548f8b 100644
--- a/packages/twenty-front/src/modules/activities/calendar/components/CalendarEventRow.tsx
+++ b/packages/twenty-front/src/modules/activities/calendar/components/CalendarEventRow.tsx
@@ -176,7 +176,7 @@ export const CalendarEventRow = ({
                   : participant.displayName
               }
               placeholderColorSeed={
-                participant.workspaceMemberId ?? participant.personId
+                participant.workspaceMemberId || participant.personId
               }
               type="rounded"
             />
diff --git a/packages/twenty-front/src/modules/activities/emails/components/EmailThreadPreview.tsx b/packages/twenty-front/src/modules/activities/emails/components/EmailThreadPreview.tsx
index e381b1bac..bb7f8c140 100644
--- a/packages/twenty-front/src/modules/activities/emails/components/EmailThreadPreview.tsx
+++ b/packages/twenty-front/src/modules/activities/emails/components/EmailThreadPreview.tsx
@@ -1,5 +1,5 @@
-import { useRef } from 'react';
 import styled from '@emotion/styled';
+import { useRef } from 'react';
 import { useRecoilCallback } from 'recoil';
 import { Avatar, GRAY_SCALE } from 'twenty-ui';
 
@@ -155,12 +155,20 @@ export const EmailThreadPreview = ({
           <Avatar
             avatarUrl={thread?.firstParticipant?.avatarUrl}
             placeholder={thread.firstParticipant.displayName}
+            placeholderColorSeed={
+              thread.firstParticipant.workspaceMemberId ||
+              thread.firstParticipant.personId
+            }
             type="rounded"
           />
           {thread?.lastTwoParticipants?.[0] && (
             <StyledAvatar
               avatarUrl={thread.lastTwoParticipants[0].avatarUrl}
               placeholder={thread.lastTwoParticipants[0].displayName}
+              placeholderColorSeed={
+                thread.lastTwoParticipants[0].workspaceMemberId ||
+                thread.lastTwoParticipants[0].personId
+              }
               type="rounded"
             />
           )}
diff --git a/packages/twenty-server/src/engine/core-modules/calendar/timeline-calendar-event.service.ts b/packages/twenty-server/src/engine/core-modules/calendar/timeline-calendar-event.service.ts
index a12c745fc..c26c03959 100644
--- a/packages/twenty-server/src/engine/core-modules/calendar/timeline-calendar-event.service.ts
+++ b/packages/twenty-server/src/engine/core-modules/calendar/timeline-calendar-event.service.ts
@@ -93,6 +93,8 @@ export class TimelineCalendarEventService {
             participant.person?.name?.lastName ||
             participant.workspaceMember?.name.firstName ||
             participant.workspaceMember?.name.lastName ||
+            participant.displayName ||
+            participant.handle ||
             '',
           avatarUrl:
             participant.person?.avatarUrl ||