Enable the opening of email threads and calendar events from the timeline (#12873)

Fixes https://github.com/twentyhq/core-team-issues/issues/1123



https://github.com/user-attachments/assets/18a23d3f-c8c7-4c77-8b81-3685220343a5
This commit is contained in:
Raphaël Bosi
2025-06-25 18:07:03 +02:00
committed by GitHub
parent 1d13b087ed
commit 041f2dff4a
2 changed files with 34 additions and 5 deletions

View File

@ -4,6 +4,7 @@ import { isUndefined } from '@sniptt/guards';
import { CalendarEventNotSharedContent } from '@/activities/calendar/components/CalendarEventNotSharedContent';
import { CalendarEventParticipantsAvatarGroup } from '@/activities/calendar/components/CalendarEventParticipantsAvatarGroup';
import { CalendarEvent } from '@/activities/calendar/types/CalendarEvent';
import { useOpenCalendarEventInCommandMenu } from '@/command-menu/hooks/useOpenCalendarEventInCommandMenu';
import { CoreObjectNameSingular } from '@/object-metadata/types/CoreObjectNameSingular';
import { useFindOneRecord } from '@/object-record/hooks/useFindOneRecord';
import { useUpsertRecordsInStore } from '@/object-record/record-store/hooks/useUpsertRecordsInStore';
@ -18,8 +19,10 @@ import {
} from '~/utils/format/formatDate';
import { isUndefinedOrNull } from '~/utils/isUndefinedOrNull';
const StyledEventCardCalendarEventContainer = styled.div`
cursor: pointer;
const StyledEventCardCalendarEventContainer = styled.div<{
canOpen?: boolean;
}>`
cursor: ${({ canOpen }) => (canOpen ? 'pointer' : 'not-allowed')};
display: flex;
flex-direction: row;
gap: ${({ theme }) => theme.spacing(2)};
@ -92,6 +95,8 @@ export const EventCardCalendarEvent = ({
calendarEventId: string;
}) => {
const { upsertRecords } = useUpsertRecordsInStore();
const { openCalendarEventInCommandMenu } =
useOpenCalendarEventInCommandMenu();
const {
record: calendarEvent,
@ -159,8 +164,20 @@ export const EventCardCalendarEvent = ({
? formatToHumanReadableTime(endsAtDate, timeZone)
: null;
const canOpen =
calendarEvent.title !== FIELD_RESTRICTED_ADDITIONAL_PERMISSIONS_REQUIRED;
const handleClick = () => {
if (canOpen) {
openCalendarEventInCommandMenu(calendarEventId);
}
};
return (
<StyledEventCardCalendarEventContainer>
<StyledEventCardCalendarEventContainer
onClick={handleClick}
canOpen={canOpen}
>
<StyledCalendarEventDateCard>
<StyledCalendarEventDateCardMonth>
{startsAtMonth}

View File

@ -3,6 +3,7 @@ import styled from '@emotion/styled';
import { EmailThreadMessage } from '@/activities/emails/types/EmailThreadMessage';
import { EventCardMessageBodyNotShared } from '@/activities/timeline-activities/rows/message/components/EventCardMessageBodyNotShared';
import { EventCardMessageForbidden } from '@/activities/timeline-activities/rows/message/components/EventCardMessageForbidden';
import { useOpenEmailThreadInCommandMenu } from '@/command-menu/hooks/useOpenEmailThreadInCommandMenu';
import { CoreObjectNameSingular } from '@/object-metadata/types/CoreObjectNameSingular';
import { useFindOneRecord } from '@/object-record/hooks/useFindOneRecord';
import { useUpsertRecordsInStore } from '@/object-record/record-store/hooks/useUpsertRecordsInStore';
@ -11,7 +12,8 @@ import { FIELD_RESTRICTED_ADDITIONAL_PERMISSIONS_REQUIRED } from 'twenty-shared/
import { isDefined } from 'twenty-shared/utils';
import { OverflowingTextWithTooltip } from 'twenty-ui/display';
const StyledEventCardMessageContainer = styled.div`
const StyledEventCardMessageContainer = styled.div<{ canOpen?: boolean }>`
cursor: ${({ canOpen }) => (canOpen ? 'pointer' : 'not-allowed')};
display: flex;
flex-direction: column;
width: 380px;
@ -58,6 +60,7 @@ export const EventCardMessage = ({
authorFullName: string;
}) => {
const { upsertRecords } = useUpsertRecordsInStore();
const { openEmailThreadInCommandMenu } = useOpenEmailThreadInCommandMenu();
const {
record: message,
@ -122,8 +125,17 @@ export const EventCardMessage = ({
.filter((handle) => isDefined(handle) && handle !== '')
.join(', ');
const canOpen =
message.subject !== FIELD_RESTRICTED_ADDITIONAL_PERMISSIONS_REQUIRED;
const handleClick = () => {
if (canOpen && isDefined(message.messageThreadId)) {
openEmailThreadInCommandMenu(message.messageThreadId);
}
};
return (
<StyledEventCardMessageContainer>
<StyledEventCardMessageContainer canOpen={canOpen} onClick={handleClick}>
<StyledEmailContent>
<StyledEmailTop>
<StyledEmailTitle>