From 6eff21f51eb232ea4c6f6c352ac2f0131d92c986 Mon Sep 17 00:00:00 2001
From: Anthony LC <anthony.le-courric@mail.numerique.gouv.fr>
Date: Thu, 29 Aug 2024 16:36:06 +0200
Subject: [PATCH] =?UTF-8?q?=E2=9C=A8(frontend)=20add=20upload=20to=20the?=
 =?UTF-8?q?=20doc=20editor?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

We can now upload images to the doc editor.
The image is uploaded to the server
and the URL is inserted into the editor.
---
 CHANGELOG.md                                  |   6 ++-
 .../assets/logo-suite-numerique.png           | Bin 0 -> 13584 bytes
 .../__tests__/app-impress/doc-editor.spec.ts  |  29 ++++++++++++++
 .../__tests__/app-impress/doc-export.spec.ts  |   5 +++
 src/frontend/apps/impress/.env                |   5 ++-
 src/frontend/apps/impress/src/core/conf.ts    |  15 ++++---
 .../apps/impress/src/custom-next.d.ts         |   1 +
 .../doc-editor/components/BlockNoteEditor.tsx |  37 ++++++++++++++++--
 8 files changed, 84 insertions(+), 14 deletions(-)
 create mode 100644 src/frontend/apps/e2e/__tests__/app-impress/assets/logo-suite-numerique.png

diff --git a/CHANGELOG.md b/CHANGELOG.md
index 76fa1e3a..b559d621 100644
--- a/CHANGELOG.md
+++ b/CHANGELOG.md
@@ -6,11 +6,13 @@ The format is based on [Keep a Changelog](https://keepachangelog.com/en/1.0.0),
 and this project adheres to
 [Semantic Versioning](https://semver.org/spec/v2.0.0.html).
 
+
+## [Unreleased]
+
 # Added
 
 - ✨Add image attachments with access control
-
-## [Unreleased]
+- ✨(frontend) Upload image to a document
 
 
 ## [1.2.1] - 2024-08-23
diff --git a/src/frontend/apps/e2e/__tests__/app-impress/assets/logo-suite-numerique.png b/src/frontend/apps/e2e/__tests__/app-impress/assets/logo-suite-numerique.png
new file mode 100644
index 0000000000000000000000000000000000000000..243c96629ee72f48f0083f4ba6bcea2653c1a9c3
GIT binary patch
literal 13584
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

literal 0
HcmV?d00001

diff --git a/src/frontend/apps/e2e/__tests__/app-impress/doc-editor.spec.ts b/src/frontend/apps/e2e/__tests__/app-impress/doc-editor.spec.ts
index 1bdde8a6..54c8f98a 100644
--- a/src/frontend/apps/e2e/__tests__/app-impress/doc-editor.spec.ts
+++ b/src/frontend/apps/e2e/__tests__/app-impress/doc-editor.spec.ts
@@ -1,3 +1,5 @@
+import path from 'path';
+
 import { expect, test } from '@playwright/test';
 
 import { createDoc, goToGridDoc, mockedDocument } from './common';
@@ -159,4 +161,31 @@ test.describe('Doc Editor', () => {
       page.getByText('Read only, you cannot edit this document.'),
     ).toBeVisible();
   });
+
+  test('it adds an image to the doc editor', async ({ page }) => {
+    await goToGridDoc(page);
+
+    const fileChooserPromise = page.waitForEvent('filechooser');
+
+    await page.locator('.bn-block-outer').last().fill('Hello World');
+
+    await page.keyboard.press('Enter');
+    await page.locator('.bn-block-outer').last().fill('/');
+    await page.getByText('Resizable image with caption').click();
+    await page.getByText('Upload image').click();
+
+    const fileChooser = await fileChooserPromise;
+    await fileChooser.setFiles(
+      path.join(__dirname, 'assets/logo-suite-numerique.png'),
+    );
+
+    const image = page.getByRole('img', { name: 'logo-suite-numerique.png' });
+
+    await expect(image).toBeVisible();
+
+    // Check src of image
+    expect(await image.getAttribute('src')).toMatch(
+      /http:\/\/localhost:8083\/media\/.*\/attachments\/.*.png/,
+    );
+  });
 });
diff --git a/src/frontend/apps/e2e/__tests__/app-impress/doc-export.spec.ts b/src/frontend/apps/e2e/__tests__/app-impress/doc-export.spec.ts
index 065f8488..9c9933a0 100644
--- a/src/frontend/apps/e2e/__tests__/app-impress/doc-export.spec.ts
+++ b/src/frontend/apps/e2e/__tests__/app-impress/doc-export.spec.ts
@@ -175,6 +175,11 @@ test.describe('Doc Export', () => {
         name: 'Image',
       })
       .click();
+    await page
+      .getByRole('tab', {
+        name: 'Embed',
+      })
+      .click();
     await page
       .getByPlaceholder('Enter URL')
       .fill('https://example.com/image.jpg');
diff --git a/src/frontend/apps/impress/.env b/src/frontend/apps/impress/.env
index 5c413314..9e631e42 100644
--- a/src/frontend/apps/impress/.env
+++ b/src/frontend/apps/impress/.env
@@ -1,3 +1,4 @@
-NEXT_PUBLIC_THEME=dsfr
-NEXT_PUBLIC_SIGNALING_URL=
 NEXT_PUBLIC_API_ORIGIN=
+NEXT_PUBLIC_MEDIA_URL=
+NEXT_PUBLIC_SIGNALING_URL=
+NEXT_PUBLIC_THEME=dsfr
\ No newline at end of file
diff --git a/src/frontend/apps/impress/src/core/conf.ts b/src/frontend/apps/impress/src/core/conf.ts
index dc778311..ba79a144 100644
--- a/src/frontend/apps/impress/src/core/conf.ts
+++ b/src/frontend/apps/impress/src/core/conf.ts
@@ -1,10 +1,13 @@
-export const baseApiUrl = (apiVersion: string = '1.0') => {
-  const origin =
-    process.env.NEXT_PUBLIC_API_ORIGIN ||
-    (typeof window !== 'undefined' ? window.location.origin : '');
+export const mediaUrl = () =>
+  process.env.NEXT_PUBLIC_MEDIA_URL ||
+  (typeof window !== 'undefined' ? window.location.origin : '');
 
-  return `${origin}/api/v${apiVersion}/`;
-};
+export const backendUrl = () =>
+  process.env.NEXT_PUBLIC_API_ORIGIN ||
+  (typeof window !== 'undefined' ? window.location.origin : '');
+
+export const baseApiUrl = (apiVersion: string = '1.0') =>
+  `${backendUrl()}/api/v${apiVersion}/`;
 
 export const signalingUrl = (docId: string) => {
   const base =
diff --git a/src/frontend/apps/impress/src/custom-next.d.ts b/src/frontend/apps/impress/src/custom-next.d.ts
index b8bbf9bf..064d02bc 100644
--- a/src/frontend/apps/impress/src/custom-next.d.ts
+++ b/src/frontend/apps/impress/src/custom-next.d.ts
@@ -20,6 +20,7 @@ declare module '*.svg?url' {
 namespace NodeJS {
   interface ProcessEnv {
     NEXT_PUBLIC_API_ORIGIN?: string;
+    NEXT_PUBLIC_MEDIA_URL?: string;
     NEXT_PUBLIC_SIGNALING_URL?: string;
     NEXT_PUBLIC_SW_DEACTIVATED?: string;
     NEXT_PUBLIC_THEME?: string;
diff --git a/src/frontend/apps/impress/src/features/docs/doc-editor/components/BlockNoteEditor.tsx b/src/frontend/apps/impress/src/features/docs/doc-editor/components/BlockNoteEditor.tsx
index b1447397..89c7ccda 100644
--- a/src/frontend/apps/impress/src/features/docs/doc-editor/components/BlockNoteEditor.tsx
+++ b/src/frontend/apps/impress/src/features/docs/doc-editor/components/BlockNoteEditor.tsx
@@ -2,14 +2,16 @@ import { BlockNoteEditor as BlockNoteEditorCore } from '@blocknote/core';
 import '@blocknote/core/fonts/inter.css';
 import { BlockNoteView } from '@blocknote/mantine';
 import '@blocknote/mantine/style.css';
-import React, { useEffect, useMemo } from 'react';
+import React, { useCallback, useEffect, useMemo } from 'react';
 import { WebrtcProvider } from 'y-webrtc';
 
-import { Box } from '@/components';
+import { Box, TextErrors } from '@/components';
+import { mediaUrl } from '@/core';
 import { useAuthStore } from '@/core/auth';
 import { Doc } from '@/features/docs/doc-management';
 import { Version } from '@/features/docs/doc-versioning/';
 
+import { useCreateDocAttachment } from '../api/useCreateDocUpload';
 import useSaveDoc from '../hook/useSaveDoc';
 import { useDocStore } from '../stores';
 import { randomColor } from '../utils';
@@ -56,8 +58,28 @@ export const BlockNoteContent = ({
   const { setStore, docsStore } = useDocStore();
   const canSave = doc.abilities.partial_update && !isVersion;
   useSaveDoc(doc.id, provider.doc, canSave);
-
   const storedEditor = docsStore?.[storeId]?.editor;
+  const {
+    mutateAsync: createDocAttachment,
+    isError: isErrorAttachment,
+    error: errorAttachment,
+  } = useCreateDocAttachment();
+
+  const uploadFile = useCallback(
+    async (file: File) => {
+      const body = new FormData();
+      body.append('file', file);
+
+      const ret = await createDocAttachment({
+        docId: doc.id,
+        body,
+      });
+
+      return `${mediaUrl()}${ret.file}`;
+    },
+    [createDocAttachment, doc.id],
+  );
+
   const editor = useMemo(() => {
     if (storedEditor) {
       return storedEditor;
@@ -72,8 +94,9 @@ export const BlockNoteContent = ({
           color: randomColor(),
         },
       },
+      uploadFile,
     });
-  }, [provider, storedEditor, userData?.email]);
+  }, [provider, storedEditor, uploadFile, userData?.email]);
 
   useEffect(() => {
     setStore(storeId, { editor });
@@ -90,6 +113,12 @@ export const BlockNoteContent = ({
         }
       `}
     >
+      {isErrorAttachment && (
+        <Box $margin={{ bottom: 'big' }}>
+          <TextErrors causes={errorAttachment.cause} />
+        </Box>
+      )}
+
       <BlockNoteView
         editor={editor}
         formattingToolbar={false}