Fix images in note rich text (#6550)

## Before
<img width="439" alt="Screenshot 2024-08-06 at 11 20 06"
src="https://github.com/user-attachments/assets/d2aa9411-cdf4-4457-8997-7cbecb8fe7e3">

## After
<img width="501" alt="Screenshot 2024-08-06 at 11 20 09"
src="https://github.com/user-attachments/assets/a5a68fff-1542-4b62-939c-50070f15b692">

packages/twenty-server/src/engine/api/graphql/workspace-query-runner/factories/query-result-getters/handlers/activity-query-result-getter.handler.ts

@@ -0,0 +1,57 @@
+import { QueryResultGetterHandlerInterface } from 'src/engine/api/graphql/workspace-query-runner/factories/query-result-getters/interfaces/query-result-getter-handler.interface';
+
+import { FileService } from 'src/engine/core-modules/file/services/file.service';
+import { NoteWorkspaceEntity } from 'src/modules/note/standard-objects/note.workspace-entity';
+import { TaskWorkspaceEntity } from 'src/modules/task/standard-objects/task.workspace-entity';
+
+type RichTextBlock = Record<string, any>;
+
+type RichTextBody = RichTextBlock[];
+
+export class ActivityQueryResultGetterHandler
+  implements QueryResultGetterHandlerInterface
+{
+  constructor(private readonly fileService: FileService) {}
+
+  async handle(
+    activity: TaskWorkspaceEntity | NoteWorkspaceEntity,
+    workspaceId: string,
+  ): Promise<TaskWorkspaceEntity | NoteWorkspaceEntity> {
+    if (!activity.id || !activity.body) {
+      return activity;
+    }
+
+    const body: RichTextBody = JSON.parse(activity.body);
+
+    const bodyWithSignedPayload = await Promise.all(
+      body.map(async (block: RichTextBlock) => {
+        if (block.type !== 'image' || !block.props.url) {
+          return block;
+        }
+
+        const imageProps = block.props;
+        const imageUrl = new URL(imageProps.url);
+
+        imageUrl.searchParams.delete('token');
+
+        const signedPayload = await this.fileService.encodeFileToken({
+          note_block_id: block.id,
+          workspace_id: workspaceId,
+        });
+
+        return {
+          ...block,
+          props: {
+            ...imageProps,
+            url: `${imageUrl.toString()}?token=${signedPayload}`,
+          },
+        };
+      }),
+    );
+
+    return {
+      ...activity,
+      body: JSON.stringify(bodyWithSignedPayload),
+    };
+  }
+}

packages/twenty-server/src/engine/api/graphql/workspace-query-runner/factories/query-result-getters/handlers/attachment-query-result-getter.handler.ts

@@ -1,13 +1,17 @@
 import { QueryResultGetterHandlerInterface } from 'src/engine/api/graphql/workspace-query-runner/factories/query-result-getters/interfaces/query-result-getter-handler.interface';
 
 import { FileService } from 'src/engine/core-modules/file/services/file.service';
+import { AttachmentWorkspaceEntity } from 'src/modules/attachment/standard-objects/attachment.workspace-entity';
 
 export class AttachmentQueryResultGetterHandler
   implements QueryResultGetterHandlerInterface
 {
   constructor(private readonly fileService: FileService) {}
 
-  async handle(attachment: any, workspaceId: string): Promise<any> {
+  async handle(
+    attachment: AttachmentWorkspaceEntity,
+    workspaceId: string,
+  ): Promise<AttachmentWorkspaceEntity> {
     if (!attachment.id || !attachment?.fullPath) {
       return attachment;
     }

packages/twenty-server/src/engine/api/graphql/workspace-query-runner/factories/query-result-getters/handlers/person-query-result-getter.handler.ts

@@ -11,7 +11,7 @@ export class PersonQueryResultGetterHandler
   async handle(
     person: PersonWorkspaceEntity,
     workspaceId: string,
-  ): Promise<any> {
+  ): Promise<PersonWorkspaceEntity> {
     if (!person.id || !person?.avatarUrl) {
       return person;
     }

packages/twenty-server/src/engine/api/graphql/workspace-query-runner/factories/query-result-getters/handlers/workspace-member-query-result-getter.handler.ts

@@ -11,7 +11,7 @@ export class WorkspaceMemberQueryResultGetterHandler
   async handle(
     workspaceMember: WorkspaceMemberWorkspaceEntity,
     workspaceId: string,
-  ): Promise<any> {
+  ): Promise<WorkspaceMemberWorkspaceEntity> {
     if (!workspaceMember.id || !workspaceMember?.avatarUrl) {
       return workspaceMember;
     }

packages/twenty-server/src/engine/api/graphql/workspace-query-runner/factories/query-result-getters/query-result-getters.factory.ts

@@ -3,6 +3,7 @@ import { Injectable } from '@nestjs/common';
 import { QueryResultGetterHandlerInterface } from 'src/engine/api/graphql/workspace-query-runner/factories/query-result-getters/interfaces/query-result-getter-handler.interface';
 import { ObjectMetadataInterface } from 'src/engine/metadata-modules/field-metadata/interfaces/object-metadata.interface';
 
+import { ActivityQueryResultGetterHandler } from 'src/engine/api/graphql/workspace-query-runner/factories/query-result-getters/handlers/activity-query-result-getter.handler';
 import { AttachmentQueryResultGetterHandler } from 'src/engine/api/graphql/workspace-query-runner/factories/query-result-getters/handlers/attachment-query-result-getter.handler';
 import { PersonQueryResultGetterHandler } from 'src/engine/api/graphql/workspace-query-runner/factories/query-result-getters/handlers/person-query-result-getter.handler';
 import { WorkspaceMemberQueryResultGetterHandler } from 'src/engine/api/graphql/workspace-query-runner/factories/query-result-getters/handlers/workspace-member-query-result-getter.handler';
@@ -24,6 +25,8 @@ export class QueryResultGettersFactory {
         'workspaceMember',
         new WorkspaceMemberQueryResultGetterHandler(this.fileService),
       ],
+      ['note', new ActivityQueryResultGetterHandler(this.fileService)],
+      ['task', new ActivityQueryResultGetterHandler(this.fileService)],
     ]);
   }
 

packages/twenty-server/src/engine/core-modules/file/file-upload/file-upload.module.ts

@@ -1,10 +1,12 @@
 import { Module } from '@nestjs/common';
 
-import { EnvironmentService } from 'src/engine/integrations/environment/environment.service';
 import { FileUploadResolver } from 'src/engine/core-modules/file/file-upload/resolvers/file-upload.resolver';
 import { FileUploadService } from 'src/engine/core-modules/file/file-upload/services/file-upload.service';
+import { FileModule } from 'src/engine/core-modules/file/file.module';
+import { EnvironmentService } from 'src/engine/integrations/environment/environment.service';
 
 @Module({
+  imports: [FileModule],
   providers: [FileUploadService, FileUploadResolver, EnvironmentService],
   exports: [FileUploadService, FileUploadResolver],
 })

packages/twenty-server/src/engine/core-modules/file/file-upload/services/file-upload.service.spec.ts

@@ -1,32 +0,0 @@
-import { Test, TestingModule } from '@nestjs/testing';
-
-import { EnvironmentService } from 'src/engine/integrations/environment/environment.service';
-import { FileStorageService } from 'src/engine/integrations/file-storage/file-storage.service';
-
-import { FileUploadService } from './file-upload.service';
-
-describe('FileUploadService', () => {
-  let service: FileUploadService;
-
-  beforeEach(async () => {
-    const module: TestingModule = await Test.createTestingModule({
-      providers: [
-        FileUploadService,
-        {
-          provide: FileStorageService,
-          useValue: {},
-        },
-        {
-          provide: EnvironmentService,
-          useValue: {},
-        },
-      ],
-    }).compile();
-
-    service = module.get<FileUploadService>(FileUploadService);
-  });
-
-  it('should be defined', () => {
-    expect(service).toBeDefined();
-  });
-});

packages/twenty-server/src/engine/core-modules/file/file-upload/services/file-upload.service.ts

@@ -8,12 +8,16 @@ import { v4 as uuidV4 } from 'uuid';
 import { FileFolder } from 'src/engine/core-modules/file/interfaces/file-folder.interface';
 
 import { settings } from 'src/engine/constants/settings';
+import { FileService } from 'src/engine/core-modules/file/services/file.service';
 import { FileStorageService } from 'src/engine/integrations/file-storage/file-storage.service';
 import { getCropSize } from 'src/utils/image';
 
 @Injectable()
 export class FileUploadService {
-  constructor(private readonly fileStorage: FileStorageService) {}
+  constructor(
+    private readonly fileStorage: FileStorageService,
+    private readonly fileService: FileService,
+  ) {}
 
   private async _uploadFile({
     file,
@@ -78,10 +82,14 @@ export class FileUploadService {
       folder,
     });
 
+    const signedPayload = await this.fileService.encodeFileToken({
+      workspace_id: workspaceId,
+    });
+
     return {
       id,
       mimeType,
-      path: `${fileFolder}/${name}`,
+      path: `${fileFolder}/${name}?token=${signedPayload}`,
     };
   }
 

packages/twenty-server/src/engine/core-modules/file/file.module.ts

@@ -1,6 +1,5 @@
 import { Module } from '@nestjs/common';
 
-import { FileUploadModule } from 'src/engine/core-modules/file/file-upload/file-upload.module';
 import { FilePathGuard } from 'src/engine/core-modules/file/guards/file-path-guard';
 import { JwtModule } from 'src/engine/core-modules/jwt/jwt.module';
 import { EnvironmentService } from 'src/engine/integrations/environment/environment.service';
@@ -9,7 +8,7 @@ import { FileController } from './controllers/file.controller';
 import { FileService } from './services/file.service';
 
 @Module({
-  imports: [FileUploadModule, JwtModule],
+  imports: [JwtModule],
   providers: [FileService, EnvironmentService, FilePathGuard],
   exports: [FileService],
   controllers: [FileController],