chunk csv file before preview (#11886)

closes https://github.com/twentyhq/twenty/issues/10971

packages/twenty-front/src/modules/activities/timeline-activities/rows/message/components/EventCardMessage.tsx

@@ -6,6 +6,7 @@ import { EventCardMessageForbidden } from '@/activities/timeline-activities/rows
 import { CoreObjectNameSingular } from '@/object-metadata/types/CoreObjectNameSingular';
 import { useFindOneRecord } from '@/object-record/hooks/useFindOneRecord';
 import { useUpsertRecordsInStore } from '@/object-record/record-store/hooks/useUpsertRecordsInStore';
+import { Trans } from '@lingui/react/macro';
 import { FIELD_RESTRICTED_ADDITIONAL_PERMISSIONS_REQUIRED } from 'twenty-shared/constants';
 import { isDefined } from 'twenty-shared/utils';
 import { OverflowingTextWithTooltip } from 'twenty-ui/display';
@@ -94,14 +95,26 @@ export const EventCardMessage = ({
     );
 
     if (shouldHandleNotFound) {
-      return <div>Message not found</div>;
+      return (
+        <div>
+          <Trans>Message not found</Trans>
+        </div>
+      );
     }
 
-    return <div>Error loading message</div>;
+    return (
+      <div>
+        <Trans>Error loading message</Trans>
+      </div>
+    );
   }
 
   if (loading || !isDefined(message)) {
-    return <div>Loading...</div>;
+    return (
+      <div>
+        <Trans>Loading...</Trans>
+      </div>
+    );
   }
 
   const messageParticipantHandles = message.messageParticipants
@@ -117,7 +130,7 @@ export const EventCardMessage = ({
             {message.subject !==
             FIELD_RESTRICTED_ADDITIONAL_PERMISSIONS_REQUIRED
               ? message.subject
-              : 'Subject not shared'}
+              : `Subject not shared`}
           </StyledEmailTitle>
           <StyledEmailParticipants>
             <OverflowingTextWithTooltip text={messageParticipantHandles} />

packages/twenty-front/src/modules/activities/timeline-activities/rows/message/components/EventCardMessageBodyNotShared.tsx

@@ -1,4 +1,5 @@
 import styled from '@emotion/styled';
+import { Trans } from '@lingui/react/macro';
 import { IconLock } from 'twenty-ui/display';
 
 const StyledEmailBodyNotSharedContainer = styled.div`
@@ -44,7 +45,9 @@ export const EventCardMessageBodyNotShared = ({
         <StyledEmailBodyNotSharedIconContainer>
           <IconLock />
         </StyledEmailBodyNotSharedIconContainer>
-        <span>Not shared by {notSharedByFullName}</span>
+        <span>
+          <Trans>Not shared by {notSharedByFullName}</Trans>
+        </span>
       </StyledEmailBodyNotShared>
     </StyledEmailBodyNotSharedContainer>
   );

packages/twenty-front/src/modules/activities/timeline-activities/rows/message/components/EventCardMessageForbidden.tsx

@@ -1,6 +1,6 @@
 import { EventCardMessageBodyNotShared } from '@/activities/timeline-activities/rows/message/components/EventCardMessageBodyNotShared';
 import styled from '@emotion/styled';
-
+import { Trans } from '@lingui/react/macro';
 const StyledEventCardMessageContainer = styled.div`
   display: flex;
   flex-direction: column;
@@ -32,7 +32,7 @@ export const EventCardMessageForbidden = ({
     <StyledEventCardMessageContainer>
       <StyledEmailContent>
         <StyledEmailTitle>
-          <span>Subject not shared</span>
+          <Trans>Subject not shared</Trans>
         </StyledEmailTitle>
         <EventCardMessageBodyNotShared
           notSharedByFullName={notSharedByFullName}

packages/twenty-front/src/modules/activities/timeline-activities/rows/message/components/__stories__/EventCardMessage.stories.tsx

@@ -4,7 +4,9 @@ import { HttpResponse, graphql } from 'msw';
 
 import { TimelineActivityContext } from '@/activities/timeline-activities/contexts/TimelineActivityContext';
 import { EventCardMessage } from '@/activities/timeline-activities/rows/message/components/EventCardMessage';
+import { FIELD_RESTRICTED_ADDITIONAL_PERMISSIONS_REQUIRED } from 'twenty-shared/constants';
 import { ComponentDecorator } from 'twenty-ui/testing';
+import { I18nFrontDecorator } from '~/testing/decorators/I18nFrontDecorator';
 import { ObjectMetadataItemsDecorator } from '~/testing/decorators/ObjectMetadataItemsDecorator';
 import { SnackBarDecorator } from '~/testing/decorators/SnackBarDecorator';
 
@@ -12,6 +14,7 @@ const meta: Meta<typeof EventCardMessage> = {
   title: 'Modules/TimelineActivities/Rows/Message/EventCardMessage',
   component: EventCardMessage,
   decorators: [
+    I18nFrontDecorator,
     ComponentDecorator,
     ObjectMetadataItemsDecorator,
     SnackBarDecorator,
@@ -66,21 +69,21 @@ export const NotShared: Story = {
   play: async ({ canvasElement }) => {
     const canvas = within(canvasElement);
 
-    await canvas.findByText('Subject not shared');
+    await canvas.findByText(`Subject not shared`);
   },
   parameters: {
     msw: {
       handlers: [
         graphql.query('FindOneMessage', () => {
           return HttpResponse.json({
-            errors: [
-              {
-                message: 'Forbidden',
-                extensions: {
-                  code: 'FORBIDDEN',
-                },
+            data: {
+              message: {
+                id: '1',
+                subject: FIELD_RESTRICTED_ADDITIONAL_PERMISSIONS_REQUIRED,
+                text: FIELD_RESTRICTED_ADDITIONAL_PERMISSIONS_REQUIRED,
+                messageParticipants: [],
               },
-            ],
+            },
           });
         }),
       ],