🌐(frontend) add localization to editor

🚚(frontend) rename feature summary to table of content
We rename the feature summary to table of content to better reflect the feature purpose.
2026-05-07 07:32:33 +02:00 · 2024-10-21 10:48:18 +02:00 · 2024-09-17 15:06:37 +02:00 · 2024-09-17 15:06:37 +02:00 · 2024-09-17 15:06:37 +02:00 · 2024-09-16 14:30:29 +02:00
32 changed files with 12600 additions and 13665 deletions
--- a/.github/workflows/impress.yml
+++ b/.github/workflows/impress.yml
@@ -9,52 +9,52 @@ on:
      - "*"

 jobs:
-  # lint-git:
-  #   runs-on: ubuntu-latest
-  #   if: github.event_name == 'pull_request' # Makes sense only for pull requests
-  #   steps:
-  #     - name: Checkout repository
-  #       uses: actions/checkout@v2
-  #       with:
-  #         fetch-depth: 0
-  #     - name: show
-  #       run: git log
-  #     - name: Enforce absence of print statements in code
-  #       run: |
-  #         ! git diff origin/${{ github.event.pull_request.base.ref }}..HEAD -- . ':(exclude)**/impress.yml' | grep "print("
-  #     - name: Check absence of fixup commits
-  #       run: |
-  #         ! git log | grep 'fixup!'
-  #     - name: Install gitlint
-  #       run: pip install --user requests gitlint
-  #     - name: Lint commit messages added to main
-  #       run: ~/.local/bin/gitlint --commits origin/${{ github.event.pull_request.base.ref }}..HEAD
+  lint-git:
+    runs-on: ubuntu-latest
+    if: github.event_name == 'pull_request' # Makes sense only for pull requests
+    steps:
+      - name: Checkout repository
+        uses: actions/checkout@v2
+        with:
+          fetch-depth: 0
+      - name: show
+        run: git log
+      - name: Enforce absence of print statements in code
+        run: |
+          ! git diff origin/${{ github.event.pull_request.base.ref }}..HEAD -- . ':(exclude)**/impress.yml' | grep "print("
+      - name: Check absence of fixup commits
+        run: |
+          ! git log | grep 'fixup!'
+      - name: Install gitlint
+        run: pip install --user requests gitlint
+      - name: Lint commit messages added to main
+        run: ~/.local/bin/gitlint --commits origin/${{ github.event.pull_request.base.ref }}..HEAD

-  # check-changelog:
-  #   runs-on: ubuntu-latest
-  #   if: |
-  #     contains(github.event.pull_request.labels.*.name, 'noChangeLog') == false &&
-  #     github.event_name == 'pull_request'
-  #   steps:
-  #     - name: Checkout repository
-  #       uses: actions/checkout@v3
-  #       with:
-  #         fetch-depth: 50
-  #     - name: Check that the CHANGELOG has been modified in the current branch
-  #       run: git diff --name-only ${{ github.event.pull_request.base.sha }} ${{ github.event.after }} | grep 'CHANGELOG.md'
+  check-changelog:
+    runs-on: ubuntu-latest
+    if: |
+      contains(github.event.pull_request.labels.*.name, 'noChangeLog') == false &&
+      github.event_name == 'pull_request'
+    steps:
+      - name: Checkout repository
+        uses: actions/checkout@v3
+        with:
+          fetch-depth: 50
+      - name: Check that the CHANGELOG has been modified in the current branch
+        run: git diff --name-only ${{ github.event.pull_request.base.sha }} ${{ github.event.after }} | grep 'CHANGELOG.md'

-  # lint-changelog:
-  #   runs-on: ubuntu-latest
-  #   steps:
-  #     - name: Checkout repository
-  #       uses: actions/checkout@v2
-  #     - name: Check CHANGELOG max line length
-  #       run: |
-  #         max_line_length=$(cat CHANGELOG.md | grep -Ev "^\[.*\]: https://github.com" | wc -L)
-  #         if [ $max_line_length -ge 80 ]; then
-  #           echo "ERROR: CHANGELOG has lines longer than 80 characters."
-  #           exit 1
-  #         fi
+  lint-changelog:
+    runs-on: ubuntu-latest
+    steps:
+      - name: Checkout repository
+        uses: actions/checkout@v2
+      - name: Check CHANGELOG max line length
+        run: |
+          max_line_length=$(cat CHANGELOG.md | grep -Ev "^\[.*\]: https://github.com" | wc -L)
+          if [ $max_line_length -ge 80 ]; then
+            echo "ERROR: CHANGELOG has lines longer than 80 characters."
+            exit 1
+          fi

  build-mails:
    runs-on: ubuntu-latest
@@ -96,112 +96,112 @@ jobs:
          path: "src/backend/core/templates/mail"
          key: mail-templates-${{ hashFiles('src/mail/mjml') }}

-  # lint-back:
-  #   runs-on: ubuntu-latest
-  #   defaults:
-  #     run:
-  #       working-directory: src/backend
-  #   steps:
-  #     - name: Checkout repository
-  #       uses: actions/checkout@v2
-  #     - name: Install Python
-  #       uses: actions/setup-python@v3
-  #       with:
-  #         python-version: "3.10"
-  #     - name: Install development dependencies
-  #       run: pip install --user .[dev]
-  #     - name: Check code formatting with ruff
-  #       run: ~/.local/bin/ruff format . --diff
-  #     - name: Lint code with ruff
-  #       run: ~/.local/bin/ruff check .
-  #     - name: Lint code with pylint
-  #       run: ~/.local/bin/pylint .
+  lint-back:
+    runs-on: ubuntu-latest
+    defaults:
+      run:
+        working-directory: src/backend
+    steps:
+      - name: Checkout repository
+        uses: actions/checkout@v2
+      - name: Install Python
+        uses: actions/setup-python@v3
+        with:
+          python-version: "3.10"
+      - name: Install development dependencies
+        run: pip install --user .[dev]
+      - name: Check code formatting with ruff
+        run: ~/.local/bin/ruff format . --diff
+      - name: Lint code with ruff
+        run: ~/.local/bin/ruff check .
+      - name: Lint code with pylint
+        run: ~/.local/bin/pylint .

-  # test-back:
-  #   runs-on: ubuntu-latest
-  #   needs: build-mails
+  test-back:
+    runs-on: ubuntu-latest
+    needs: build-mails

-  #   defaults:
-  #     run:
-  #       working-directory: src/backend
+    defaults:
+      run:
+        working-directory: src/backend

-  #   services:
-  #     postgres:
-  #       image: postgres:16
-  #       env:
-  #         POSTGRES_DB: impress
-  #         POSTGRES_USER: dinum
-  #         POSTGRES_PASSWORD: pass
-  #       ports:
-  #         - 5432:5432
-  #       # needed because the postgres container does not provide a healthcheck
-  #       options: --health-cmd pg_isready --health-interval 10s --health-timeout 5s --health-retries 5
+    services:
+      postgres:
+        image: postgres:16
+        env:
+          POSTGRES_DB: impress
+          POSTGRES_USER: dinum
+          POSTGRES_PASSWORD: pass
+        ports:
+          - 5432:5432
+        # needed because the postgres container does not provide a healthcheck
+        options: --health-cmd pg_isready --health-interval 10s --health-timeout 5s --health-retries 5

-  #   env:
-  #     DJANGO_CONFIGURATION: Test
-  #     DJANGO_SETTINGS_MODULE: impress.settings
-  #     DJANGO_SECRET_KEY: ThisIsAnExampleKeyForTestPurposeOnly
-  #     OIDC_OP_JWKS_ENDPOINT: /endpoint-for-test-purpose-only
-  #     DB_HOST: localhost
-  #     DB_NAME: impress
-  #     DB_USER: dinum
-  #     DB_PASSWORD: pass
-  #     DB_PORT: 5432
-  #     STORAGES_STATICFILES_BACKEND: django.contrib.staticfiles.storage.StaticFilesStorage
-  #     AWS_S3_ENDPOINT_URL: http://localhost:9000
-  #     AWS_S3_ACCESS_KEY_ID: impress
-  #     AWS_S3_SECRET_ACCESS_KEY: password
+    env:
+      DJANGO_CONFIGURATION: Test
+      DJANGO_SETTINGS_MODULE: impress.settings
+      DJANGO_SECRET_KEY: ThisIsAnExampleKeyForTestPurposeOnly
+      OIDC_OP_JWKS_ENDPOINT: /endpoint-for-test-purpose-only
+      DB_HOST: localhost
+      DB_NAME: impress
+      DB_USER: dinum
+      DB_PASSWORD: pass
+      DB_PORT: 5432
+      STORAGES_STATICFILES_BACKEND: django.contrib.staticfiles.storage.StaticFilesStorage
+      AWS_S3_ENDPOINT_URL: http://localhost:9000
+      AWS_S3_ACCESS_KEY_ID: impress
+      AWS_S3_SECRET_ACCESS_KEY: password

-  #   steps:
-  #     - name: Checkout repository
-  #       uses: actions/checkout@v4
+    steps:
+      - name: Checkout repository
+        uses: actions/checkout@v4

-  #     - name: Create writable /data
-  #       run: |
-  #         sudo mkdir -p /data/media && \
-  #         sudo mkdir -p /data/static
+      - name: Create writable /data
+        run: |
+          sudo mkdir -p /data/media && \
+          sudo mkdir -p /data/static

-  #     - name: Restore the mail templates
-  #       uses: actions/cache@v4
-  #       id: mail-templates
-  #       with:
-  #         path: "src/backend/core/templates/mail"
-  #         key: mail-templates-${{ hashFiles('src/mail/mjml') }}
+      - name: Restore the mail templates
+        uses: actions/cache@v4
+        id: mail-templates
+        with:
+          path: "src/backend/core/templates/mail"
+          key: mail-templates-${{ hashFiles('src/mail/mjml') }}

-  #     - name: Start Minio
-  #       run: |
-  #         docker pull minio/minio
-  #         docker run -d --name minio \
-  #           -p 9000:9000 \
-  #           -e "MINIO_ACCESS_KEY=impress" \
-  #           -e "MINIO_SECRET_KEY=password" \
-  #           -v /data/media:/data \
-  #           minio/minio server --console-address :9001 /data
+      - name: Start Minio
+        run: |
+          docker pull minio/minio
+          docker run -d --name minio \
+            -p 9000:9000 \
+            -e "MINIO_ACCESS_KEY=impress" \
+            -e "MINIO_SECRET_KEY=password" \
+            -v /data/media:/data \
+            minio/minio server --console-address :9001 /data

-  #     - name: Configure MinIO
-  #       run: |
-  #         MINIO=$(docker ps | grep minio/minio | sed -E 's/.*\s+([a-zA-Z0-9_-]+)$/\1/')
-  #         docker exec ${MINIO} sh -c \
-  #           "mc alias set impress http://localhost:9000 impress password && \
-  #           mc alias ls && \
-  #           mc mb impress/impress-media-storage && \
-  #           mc version enable impress/impress-media-storage"
+      - name: Configure MinIO
+        run: |
+          MINIO=$(docker ps | grep minio/minio | sed -E 's/.*\s+([a-zA-Z0-9_-]+)$/\1/')
+          docker exec ${MINIO} sh -c \
+            "mc alias set impress http://localhost:9000 impress password && \
+            mc alias ls && \
+            mc mb impress/impress-media-storage && \
+            mc version enable impress/impress-media-storage"

-  #     - name: Install Python
-  #       uses: actions/setup-python@v3
-  #       with:
-  #         python-version: "3.10"
+      - name: Install Python
+        uses: actions/setup-python@v3
+        with:
+          python-version: "3.10"

-  #     - name: Install development dependencies
-  #       run: pip install --user .[dev]
+      - name: Install development dependencies
+        run: pip install --user .[dev]

-  #     - name: Install gettext (required to compile messages)
-  #       run: |
-  #         sudo apt-get update
-  #         sudo apt-get install -y gettext pandoc
+      - name: Install gettext (required to compile messages)
+        run: |
+          sudo apt-get update
+          sudo apt-get install -y gettext pandoc

-  #     - name: Generate a MO file from strings extracted from the project
-  #       run: python manage.py compilemessages
+      - name: Generate a MO file from strings extracted from the project
+        run: python manage.py compilemessages

-  #     - name: Run tests
-  #       run: ~/.local/bin/pytest -n 2
+      - name: Run tests
+        run: ~/.local/bin/pytest -n 2
--- a/CHANGELOG.md
+++ b/CHANGELOG.md
@@ -14,12 +14,14 @@ and this project adheres to
 - ✨Add link public/authenticated/restricted access with read/editor roles #234
 - ✨(frontend) add copy link button #235
 - 🛂(frontend) access public docs without being logged #235
+- 🌐(frontend) add localization to editor #268

 ## Changed

 - ♻️ Allow null titles on documents for easier creation #234
 - 🛂(backend) stop to list public doc to everyone #234
 - 🚚(frontend) change visibility in share modal #235
+- ⚡️(frontend) Improve summary #244

 ## Fixed

--- a/src/backend/core/api/serializers.py
+++ b/src/backend/core/api/serializers.py
@@ -16,8 +16,8 @@ class UserSerializer(serializers.ModelSerializer):

    class Meta:
        model = models.User
-        fields = ["id", "sub", "email"]
-        read_only_fields = ["id", "sub", "email"]
+        fields = ["id", "email"]
+        read_only_fields = ["id", "email"]


 class BaseAccessSerializer(serializers.ModelSerializer):
--- a/src/frontend/apps/e2e/tests/app-impress/doc-summary.spec.ts
+++ b/src/frontend/apps/e2e/tests/app-impress/doc-summary.spec.ts
@@ -1,64 +0,0 @@
-import { expect, test } from '@playwright/test';
-
-import { createDoc } from './common';
-
-test.beforeEach(async ({ page }) => {
-  await page.goto('/');
-});
-
-test.describe('Doc Summary', () => {
-  test('it checks the doc summary', async ({ page, browserName }) => {
-    const [randomDoc] = await createDoc(page, 'doc-summary', browserName, 1);
-
-    await expect(page.locator('h2').getByText(randomDoc)).toBeVisible();
-
-    await page.getByLabel('Open the document options').click();
-    await page
-      .getByRole('button', {
-        name: 'Summary',
-      })
-      .click();
-
-    const panel = page.getByLabel('Document panel');
-    const editor = page.locator('.ProseMirror');
-
-    await editor.locator('.bn-block-outer').last().fill('/');
-    await page.getByText('Heading 1').click();
-    await page.keyboard.type('Hello World');
-
-    await page.locator('.bn-block-outer').last().click();
-
-    // Create space to fill the viewport
-    for (let i = 0; i < 6; i++) {
-      await page.keyboard.press('Enter');
-    }
-
-    await editor.locator('.bn-block-outer').last().fill('/');
-    await page.getByText('Heading 2').click();
-    await page.keyboard.type('Super World');
-
-    await page.locator('.bn-block-outer').last().click();
-
-    // Create space to fill the viewport
-    for (let i = 0; i < 4; i++) {
-      await page.keyboard.press('Enter');
-    }
-
-    await editor.locator('.bn-block-outer').last().fill('/');
-    await page.getByText('Heading 3').click();
-    await page.keyboard.type('Another World');
-
-    await expect(panel.getByText('Hello World')).toBeVisible();
-    await expect(panel.getByText('Super World')).toBeVisible();
-
-    await panel.getByText('Another World').click();
-
-    await expect(editor.getByText('Hello World')).not.toBeInViewport();
-
-    await panel.getByText('Back to top').click();
-    await expect(editor.getByText('Hello World')).toBeInViewport();
-
-    await panel.getByText('Go to bottom').click();
-    await expect(editor.getByText('Hello World')).not.toBeInViewport();
-  });
-});
--- a/src/frontend/apps/e2e/tests/app-impress/doc-table-content.spec.ts
+++ b/src/frontend/apps/e2e/tests/app-impress/doc-table-content.spec.ts
@@ -0,0 +1,93 @@
+import { expect, test } from '@playwright/test';
+
+import { createDoc } from './common';
+
+test.beforeEach(async ({ page }) => {
+  await page.goto('/');
+});
+
+test.describe('Doc Table Content', () => {
+  test('it checks the doc table content', async ({ page, browserName }) => {
+    const [randomDoc] = await createDoc(
+      page,
+      'doc-table-content',
+      browserName,
+      1,
+    );
+
+    await expect(page.locator('h2').getByText(randomDoc)).toBeVisible();
+
+    await page.getByLabel('Open the document options').click();
+    await page
+      .getByRole('button', {
+        name: 'Table of content',
+      })
+      .click();
+
+    const panel = page.getByLabel('Document panel');
+    const editor = page.locator('.ProseMirror');
+
+    await editor.locator('.bn-block-outer').last().fill('/');
+    await page.getByText('Heading 1').click();
+    await page.keyboard.type('Hello World');
+
+    await page.locator('.bn-block-outer').last().click();
+
+    // Create space to fill the viewport
+    for (let i = 0; i < 5; i++) {
+      await page.keyboard.press('Enter');
+    }
+
+    await editor.locator('.bn-block-outer').last().fill('/');
+    await page.getByText('Heading 2').click();
+    await page.keyboard.type('Super World');
+
+    await page.locator('.bn-block-outer').last().click();
+
+    // Create space to fill the viewport
+    for (let i = 0; i < 5; i++) {
+      await page.keyboard.press('Enter');
+    }
+
+    await editor.locator('.bn-block-outer').last().fill('/');
+    await page.getByText('Heading 3').click();
+    await page.keyboard.type('Another World');
+
+    const hello = panel.getByText('Hello World');
+    const superW = panel.getByText('Super World');
+    const another = panel.getByText('Another World');
+
+    await expect(hello).toBeVisible();
+    await expect(hello).toHaveCSS('font-size', '19.2px');
+    await expect(hello).toHaveAttribute('aria-selected', 'true');
+
+    await expect(superW).toBeVisible();
+    await expect(superW).toHaveCSS('font-size', '16px');
+    await expect(superW).toHaveAttribute('aria-selected', 'false');
+
+    await expect(another).toBeVisible();
+    await expect(another).toHaveCSS('font-size', '12.8px');
+    await expect(another).toHaveAttribute('aria-selected', 'false');
+
+    await hello.click();
+
+    await expect(editor.getByText('Hello World')).toBeInViewport();
+    await expect(hello).toHaveAttribute('aria-selected', 'true');
+    await expect(superW).toHaveAttribute('aria-selected', 'false');
+
+    await another.click();
+
+    await expect(editor.getByText('Hello World')).not.toBeInViewport();
+    await expect(hello).toHaveAttribute('aria-selected', 'false');
+    await expect(superW).toHaveAttribute('aria-selected', 'true');
+
+    await panel.getByText('Back to top').click();
+    await expect(editor.getByText('Hello World')).toBeInViewport();
+    await expect(hello).toHaveAttribute('aria-selected', 'true');
+    await expect(superW).toHaveAttribute('aria-selected', 'false');
+
+    await panel.getByText('Go to bottom').click();
+    await expect(editor.getByText('Hello World')).not.toBeInViewport();
+    await expect(superW).toHaveAttribute('aria-selected', 'true');
+  });
+});
--- a/src/frontend/apps/e2e/package.json
+++ b/src/frontend/apps/e2e/package.json
@@ -12,7 +12,7 @@
    "test:ui::chromium": "yarn test:ui --project=chromium"
  },
  "devDependencies": {
-    "@playwright/test": "1.47.0",
+    "@playwright/test": "1.47.1",
    "@types/node": "*",
    "@types/pdf-parse": "1.1.4",
    "eslint-config-impress": "*",
--- a/src/frontend/apps/impress/package.json
+++ b/src/frontend/apps/impress/package.json
@@ -21,37 +21,34 @@
    "@gouvfr-lasuite/integration": "1.0.2",
    "@hocuspocus/provider": "2.13.5",
    "@openfun/cunningham-react": "2.9.4",
-    "@socialgouv/e2esdk-client": "1.0.0-beta.28",
-    "@socialgouv/e2esdk-devtools": "1.0.0-beta.38",
-    "@socialgouv/e2esdk-react": "1.0.0-beta.28",
-    "@tanstack/react-query": "5.55.4",
+    "@tanstack/react-query": "5.56.2",
    "i18next": "23.15.1",
    "idb": "8.0.0",
    "lodash": "4.17.21",
    "luxon": "3.5.0",
-    "next": "14.2.9",
+    "next": "14.2.11",
    "react": "*",
    "react-aria-components": "1.3.3",
    "react-dom": "*",
-    "react-i18next": "15.0.1",
+    "react-i18next": "15.0.2",
    "react-select": "5.8.0",
    "styled-components": "6.1.13",
-    "y-protocols": "1.0.6",
    "yjs": "*",
+    "y-protocols": "1.0.6",
    "zustand": "4.5.5"
  },
  "devDependencies": {
    "@svgr/webpack": "8.1.0",
-    "@tanstack/react-query-devtools": "5.55.4",
+    "@tanstack/react-query-devtools": "5.56.2",
    "@testing-library/dom": "10.4.0",
    "@testing-library/jest-dom": "6.5.0",
    "@testing-library/react": "16.0.1",
    "@testing-library/user-event": "14.5.2",
-    "@types/jest": "29.5.12",
+    "@types/jest": "29.5.13",
    "@types/lodash": "4.17.7",
    "@types/luxon": "3.4.2",
    "@types/node": "*",
-    "@types/react": "18.3.5",
+    "@types/react": "18.3.6",
    "@types/react-dom": "*",
    "cross-env": "*",
    "dotenv": "16.4.5",
--- a/src/frontend/apps/impress/src/components/Panel.tsx
+++ b/src/frontend/apps/impress/src/components/Panel.tsx
@@ -5,7 +5,7 @@ import { Box, Card, IconBG, Text } from '@/components';
 import { useCunninghamTheme } from '@/cunningham';

 interface PanelProps {
-  title: string;
+  title?: string;
  setIsPanelOpen: (isOpen: boolean) => void;
 }

@@ -53,11 +53,14 @@ export const Panel = ({
      {...closedOverridingStyles}
    >
      <Box
-        $overflow="hidden"
+        $overflow="inherit"
+        $position="sticky"
        $css={`
+          top: 0;
          opacity: ${isOpen ? '1' : '0'};
          transition: ${transition};
        `}
+        $maxHeight="100%"
      >
        <Box
          $padding={{ all: 'small' }}
@@ -90,9 +93,11 @@ export const Panel = ({
            }}
            $radius="2px"
          />
-          <Text $weight="bold" $size="l" $theme="primary">
-            {title}
-          </Text>
+          {title && (
+            <Text $weight="bold" $size="l" $theme="primary">
+              {title}
+            </Text>
+          )}
        </Box>
        {children}
      </Box>
--- a/src/frontend/apps/impress/src/core/AppProvider.tsx
+++ b/src/frontend/apps/impress/src/core/AppProvider.tsx
@@ -1,7 +1,5 @@
 import { CunninghamProvider } from '@openfun/cunningham-react';
 import { QueryClient, QueryClientProvider } from '@tanstack/react-query';
-import { E2ESDKClientProvider } from '@socialgouv/e2esdk-react';
-import { e2esdkClient } from './auth/useAuthStore';

 import { useCunninghamTheme } from '@/cunningham';
 import '@/i18n/initI18n';
@@ -29,9 +27,7 @@ export function AppProvider({ children }: { children: React.ReactNode }) {
  return (
    <QueryClientProvider client={queryClient}>
      <CunninghamProvider theme={theme}>
-        <E2ESDKClientProvider client={e2esdkClient}>
-          <Auth>{children}</Auth>
-        </E2ESDKClientProvider>
+        <Auth>{children}</Auth>
      </CunninghamProvider>
    </QueryClientProvider>
  );
--- a/src/frontend/apps/impress/src/core/auth/api/types.ts
+++ b/src/frontend/apps/impress/src/core/auth/api/types.ts
@@ -2,12 +2,10 @@
 * Represents user retrieved from the API.
 * @interface User
 * @property {string} id - The id of the user.
- * @property {string} sub - The `sub` field of OIDC
 * @property {string} email - The email of the user.
 * @property {string} name - The name of the user.
 */
 export interface User {
  id: string;
-  sub: string;
  email: string;
 }
--- a/src/frontend/apps/impress/src/core/auth/useAuthStore.tsx
+++ b/src/frontend/apps/impress/src/core/auth/useAuthStore.tsx
@@ -5,31 +5,18 @@ import { baseApiUrl } from '@/core/conf';
 import { User, getMe } from './api';
 import { PATH_AUTH_LOCAL_STORAGE } from './conf';

-import { Client, PublicUserIdentity } from '@socialgouv/e2esdk-client';
-import { identity } from 'lodash';
-
-export const e2esdkClient = new Client({
-  // Point it to where your server is listening
-  serverURL: 'https://app-a5a1b445-32e0-4cf4-a478-821a48f86ccf.cleverapps.io',
-  // Pass the signature public key you configured for the server
-  serverSignaturePublicKey: 'ayfva9SUh0mfgmifUtxcdLp4HriHJiqefEKnvYgY4qM',
-});
-
 interface AuthStore {
  initiated: boolean;
  authenticated: boolean;
-  readyForEncryption: boolean;
  initAuth: () => void;
  logout: () => void;
  login: () => void;
-  endToEndData?: PublicUserIdentity;
  userData?: User;
 }

 const initialState = {
  initiated: false,
  authenticated: false,
-  readyForEncryption: false,
  userData: undefined,
 };

@@ -37,51 +24,22 @@ export const useAuthStore = create<AuthStore>((set) => ({
  initiated: initialState.initiated,
  authenticated: initialState.authenticated,
  userData: initialState.userData,
-  readyForEncryption: initialState.readyForEncryption,

  initAuth: () => {
    getMe()
-      .then(
-        (data: User) => {
-          // If a path is stored in the local storage, we redirect to it
-          const path_auth = localStorage.getItem(PATH_AUTH_LOCAL_STORAGE);
-          if (path_auth) {
-            localStorage.removeItem(PATH_AUTH_LOCAL_STORAGE);
-            window.location.replace(path_auth);
-            return;
-          }
+      .then((data: User) => {
+        // If a path is stored in the local storage, we redirect to it
+        const path_auth = localStorage.getItem(PATH_AUTH_LOCAL_STORAGE);
+        if (path_auth) {
+          localStorage.removeItem(PATH_AUTH_LOCAL_STORAGE);
+          window.location.replace(path_auth);
+          return;
+        }

-          set({ authenticated: true, userData: data });
-          return e2esdkClient
-            .signup(data.sub)
-            .then(() => data)
-            .catch(() => data);
-        },
-        () => {},
-      )
-      .then(
-        (data) => {
-          set({ readyForEncryption: true });
-          if (data) {
-            return e2esdkClient.login(data.sub);
-          }
-        },
-        (e) => {
-          throw e;
-          //if (data) {
-          // return e2esdkClient.login(data.sub);
-          //}
-          //fail
-        },
-      )
-      .then((publicIdentity: PublicUserIdentity | null | undefined) => {
-        if (!publicIdentity) throw Error('exploding');
-        console.log('publicIdentity', publicIdentity);
-        set({ endToEndData: publicIdentity });
+        set({ authenticated: true, userData: data });
      })
      .catch(() => {})
      .finally(() => {
-        console.log('finally');
        set({ initiated: true });
      });
  },
--- 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
@@ -1,4 +1,7 @@
-import { Block, BlockNoteEditor as BlockNoteEditorCore } from '@blocknote/core';
+import {
+  BlockNoteEditor as BlockNoteEditorCore,
+  locales,
+} from '@blocknote/core';
 import '@blocknote/core/fonts/inter.css';
 import { BlockNoteView } from '@blocknote/mantine';
 import '@blocknote/mantine/style.css';
@@ -17,7 +20,8 @@ import { useDocStore } from '../stores';
 import { randomColor } from '../utils';

 import { BlockNoteToolbar } from './BlockNoteToolbar';
-import { useE2ESDKClient } from '@socialgouv/e2esdk-react';
+
+import { useTranslation } from 'react-i18next';

 const cssEditor = `
  &, & > .bn-container, & .ProseMirror {
@@ -72,8 +76,7 @@ export const BlockNoteContent = ({
  const { userData } = useAuthStore();
  const { setStore, docsStore } = useDocStore();
  const canSave = doc.abilities.partial_update && !isVersion;
-
-  const e2eClient = useE2ESDKClient();
+  useSaveDoc(doc.id, provider.document, canSave);
  const storedEditor = docsStore?.[storeId]?.editor;
  const {
    mutateAsync: createDocAttachment,
@@ -96,44 +99,37 @@ export const BlockNoteContent = ({
    [createDocAttachment, doc.id],
  );

+  const { t, i18n } = useTranslation();
+  const lang = i18n.language;
+
+  const resetStore = () => {
+    setStore(storeId, { editor: undefined });
+  };
+
+  // Invalidate the stored editor when the language changes
+  useEffect(() => {
+    resetStore();
+    // eslint-disable-next-line react-hooks/exhaustive-deps
+  }, [lang]);
+
  const editor = useMemo(() => {
    if (storedEditor) {
      return storedEditor;
    }

-    // TODO decrypt doc.content
-    //localStorage.getItem('KEY');
-
-    const docId = 'uuid-du-doc';
-    const purpose = `doc:${docId}`;
-    const key = e2eClient.findKeyByPurpose(purpose);
-    if (!key) {
-      alert('probleme de key');
-      //  return;
-    } else {
-      const decryptedMessage = e2eClient.decrypt(
-        doc.content,
-        key.keychainFingerprint,
-      );
-
-      console.log('decryptedMessage', decryptedMessage);
-    }
-
    return BlockNoteEditorCore.create({
-      // collaboration: {
-      //   provider,
-      //   fragment: provider.document.getXmlFragment('document-store'),
-      //   user: {
-      //     name: userData?.email || 'Anonymous',
-      //     color: randomColor(),
-      //   },
-      // },
+      collaboration: {
+        provider,
+        fragment: provider.document.getXmlFragment('document-store'),
+        user: {
+          name: userData?.email || 'Anonymous',
+          color: randomColor(),
+        },
+      },
+      dictionary: locales[lang as keyof typeof locales],
      uploadFile,
-      initialContent: JSON.parse(doc.content),
    });
-  }, [doc.content, storedEditor, uploadFile]);
-
-  useSaveDoc(doc.id, provider.document, canSave, editor);
+  }, [provider, storedEditor, uploadFile, userData?.email, lang]);

  useEffect(() => {
    setStore(storeId, { editor });
--- a/src/frontend/apps/impress/src/features/docs/doc-editor/components/BlockNoteToolbar.tsx
+++ b/src/frontend/apps/impress/src/features/docs/doc-editor/components/BlockNoteToolbar.tsx
@@ -15,6 +15,7 @@ import {
 } from '@blocknote/react';
 import { forEach, isArray } from 'lodash';
 import React, { useMemo } from 'react';
+import { useTranslation } from 'react-i18next';

 export const BlockNoteToolbar = () => {
  return (
@@ -93,6 +94,7 @@ export function MarkdownButton() {
  const editor = useBlockNoteEditor();
  const Components = useComponentsContext();
  const selectedBlocks = useSelectedBlocks(editor);
+  const { t } = useTranslation();

  const handleConvertMarkdown = () => {
    const blocks = editor.getSelection()?.blocks;
@@ -126,7 +128,7 @@ export function MarkdownButton() {

  return (
    <Components.FormattingToolbar.Button
-      mainTooltip="Convert Markdown"
+      mainTooltip={t('Convert Markdown')}
      onClick={handleConvertMarkdown}
    >
      M
--- a/src/frontend/apps/impress/src/features/docs/doc-editor/components/DocEditor.tsx
+++ b/src/frontend/apps/impress/src/features/docs/doc-editor/components/DocEditor.tsx
@@ -9,7 +9,7 @@ import { Panel } from '@/components/Panel';
 import { useCunninghamTheme } from '@/cunningham';
 import { DocHeader } from '@/features/docs/doc-header';
 import { Doc } from '@/features/docs/doc-management';
-import { Summary, useDocSummaryStore } from '@/features/docs/doc-summary';
+import { TableContent } from '@/features/docs/doc-table-content';
 import {
  VersionList,
  Versions,
@@ -28,8 +28,6 @@ export const DocEditor = ({ doc }: DocEditorProps) => {
    query: { versionId },
  } = useRouter();
  const { isPanelVersionOpen, setIsPanelVersionOpen } = useDocVersionStore();
-  const { isPanelSummaryOpen, setIsPanelSummaryOpen } = useDocSummaryStore();
-
  const { t } = useTranslation();

  const isVersion = versionId && typeof versionId === 'string';
@@ -72,11 +70,7 @@ export const DocEditor = ({ doc }: DocEditorProps) => {
            <VersionList doc={doc} />
          </Panel>
        )}
-        {isPanelSummaryOpen && (
-          <Panel title={t('SUMMARY')} setIsPanelOpen={setIsPanelSummaryOpen}>
-            <Summary doc={doc} />
-          </Panel>
-        )}
+        <TableContent doc={doc} />
      </Box>
    </>
  );
--- a/src/frontend/apps/impress/src/features/docs/doc-editor/hook/useSaveDoc.tsx
+++ b/src/frontend/apps/impress/src/features/docs/doc-editor/hook/useSaveDoc.tsx
@@ -1,4 +1,3 @@
-import { BlockNoteEditor } from '@blocknote/core';
 import { useRouter } from 'next/router';
 import { useCallback, useEffect, useRef, useState } from 'react';
 import * as Y from 'yjs';
@@ -7,18 +6,11 @@ import { useUpdateDoc } from '@/features/docs/doc-management/';
 import { KEY_LIST_DOC_VERSIONS } from '@/features/docs/doc-versioning';

 import { toBase64 } from '../utils';
-import { useE2ESDKClient } from '@socialgouv/e2esdk-react';

-const useSaveDoc = (
-  docId: string,
-  doc: Y.Doc,
-  canSave: boolean,
-  editor: BlockNoteEditor,
-) => {
+const useSaveDoc = (docId: string, doc: Y.Doc, canSave: boolean) => {
  const { mutate: updateDoc } = useUpdateDoc({
    listInvalideQueries: [KEY_LIST_DOC_VERSIONS],
  });
-  const e2eClient = useE2ESDKClient();
  const [initialDoc, setInitialDoc] = useState<string>(
    toBase64(Y.encodeStateAsUpdate(doc)),
  );
@@ -64,32 +56,14 @@ const useSaveDoc = (
  }, [canSave, hasChanged]);

  const saveDoc = useCallback(() => {
-    const newDoc = JSON.stringify(editor.document);
-    //const newDoc = toBase64(Y.encodeStateAsUpdate(doc));
-
-    // TODO encode the content
-
-    const docId = 'uuid-du-doc';
-    const purpose = `doc:${docId}`;
-    const key = e2eClient.findKeyByPurpose(purpose);
-    if (!key) {
-      alert('probleme de key');
-      return;
-    }
-
-    const encrypted = e2eClient.encrypt(newDoc, key.keychainFingerprint);
-
-    console.log('encrypted', encrypted);
-
-    // todo
-
+    const newDoc = toBase64(Y.encodeStateAsUpdate(doc));
    setInitialDoc(newDoc);

    updateDoc({
      id: docId,
      content: newDoc,
    });
-  }, [docId, editor?.document, updateDoc]);
+  }, [doc, docId, updateDoc]);

  const timeout = useRef<NodeJS.Timeout>();
  const router = useRouter();
--- a/src/frontend/apps/impress/src/features/docs/doc-editor/stores/useDocStore.tsx
+++ b/src/frontend/apps/impress/src/features/docs/doc-editor/stores/useDocStore.tsx
@@ -26,9 +26,9 @@ export const useDocStore = create<UseDocStore>((set, get) => ({
      guid: storeId,
    });

-    // if (initialDoc) {
-    //   Y.applyUpdate(doc, Buffer.from(initialDoc, 'base64'));
-    // }
+    if (initialDoc) {
+      Y.applyUpdate(doc, Buffer.from(initialDoc, 'base64'));
+    }

    const provider = new HocuspocusProvider({
      url: providerUrl(storeId),
--- a/src/frontend/apps/impress/src/features/docs/doc-header/components/DocToolBox.tsx
+++ b/src/frontend/apps/impress/src/features/docs/doc-header/components/DocToolBox.tsx
@@ -9,7 +9,7 @@ import {
  ModalShare,
  ModalUpdateDoc,
 } from '@/features/docs/doc-management';
-import { useDocSummaryStore } from '@/features/docs/doc-summary';
+import { useDocTableContentStore } from '@/features/docs/doc-table-content';
 import { useDocVersionStore } from '@/features/docs/doc-versioning';

 import { ModalPDF } from './ModalExport';
@@ -26,7 +26,7 @@ export const DocToolBox = ({ doc }: DocToolBoxProps) => {
  const [isModalPDFOpen, setIsModalPDFOpen] = useState(false);
  const [isDropOpen, setIsDropOpen] = useState(false);
  const { setIsPanelVersionOpen } = useDocVersionStore();
-  const { setIsPanelSummaryOpen } = useDocSummaryStore();
+  const { setIsPanelTableContentOpen } = useDocTableContentStore();

  return (
    <Box
@@ -83,7 +83,7 @@ export const DocToolBox = ({ doc }: DocToolBoxProps) => {
          )}
          <Button
            onClick={() => {
-              setIsPanelSummaryOpen(true);
+              setIsPanelTableContentOpen(true);
              setIsPanelVersionOpen(false);
              setIsDropOpen(false);
            }}
@@ -91,7 +91,7 @@ export const DocToolBox = ({ doc }: DocToolBoxProps) => {
            icon={<span className="material-icons">summarize</span>}
            size="small"
          >
-            <Text $theme="primary">{t('Summary')}</Text>
+            <Text $theme="primary">{t('Table of content')}</Text>
          </Button>
          <Button
            onClick={() => {
--- a/src/frontend/apps/impress/src/features/docs/doc-summary/components/Summary.tsx
+++ b/src/frontend/apps/impress/src/features/docs/doc-summary/components/Summary.tsx
@@ -1,104 +0,0 @@
-import React, { useCallback, useEffect, useState } from 'react';
-import { useTranslation } from 'react-i18next';
-
-import { Box, BoxButton, Text } from '@/components';
-
-import { useDocStore } from '../../doc-editor';
-import { Doc } from '../../doc-management';
-import { useDocSummaryStore } from '../stores';
-
-interface SummaryProps {
-  doc: Doc;
-}
-
-export const Summary = ({ doc }: SummaryProps) => {
-  const { docsStore } = useDocStore();
-  const { t } = useTranslation();
-
-  const editor = docsStore?.[doc.id]?.editor;
-  const headingFiltering = useCallback(
-    () => editor?.document.filter((block) => block.type === 'heading'),
-    [editor?.document],
-  );
-
-  const [headings, setHeadings] = useState(headingFiltering());
-  const { setIsPanelSummaryOpen } = useDocSummaryStore();
-
-  useEffect(() => {
-    return () => {
-      setIsPanelSummaryOpen(false);
-    };
-  }, [setIsPanelSummaryOpen]);
-
-  if (!editor) {
-    return null;
-  }
-
-  editor.onEditorContentChange(() => {
-    setHeadings(headingFiltering());
-  });
-
-  return (
-    <Box $overflow="auto" $padding="small">
-      {headings?.map((heading) => (
-        <BoxButton
-          key={heading.id}
-          onClick={() => {
-            editor.focus();
-            editor?.setTextCursorPosition(heading.id, 'end');
-            document
-              .querySelector(`[data-id="${heading.id}"]`)
-              ?.scrollIntoView({
-                behavior: 'smooth',
-                block: 'start',
-              });
-          }}
-          style={{ textAlign: 'left' }}
-        >
-          <Text $theme="primary" $padding={{ vertical: 'xtiny' }}>
-            {heading.content?.[0]?.type === 'text' && heading.content?.[0]?.text
-              ? `- ${heading.content[0].text}`
-              : ''}
-          </Text>
-        </BoxButton>
-      ))}
-      <Box
-        $height="1px"
-        $width="auto"
-        $background="#e5e5e5"
-        $margin={{ vertical: 'small' }}
-        $css="flex: none;"
-      />
-      <BoxButton
-        onClick={() => {
-          editor.focus();
-          document.querySelector(`.bn-editor`)?.scrollIntoView({
-            behavior: 'smooth',
-            block: 'start',
-          });
-        }}
-      >
-        <Text $theme="primary" $padding={{ vertical: 'xtiny' }}>
-          {t('Back to top')}
-        </Text>
-      </BoxButton>
-      <BoxButton
-        onClick={() => {
-          editor.focus();
-          document
-            .querySelector(
-              `.bn-editor > .bn-block-group > .bn-block-outer:last-child`,
-            )
-            ?.scrollIntoView({
-              behavior: 'smooth',
-              block: 'start',
-            });
-        }}
-      >
-        <Text $theme="primary" $padding={{ vertical: 'xtiny' }}>
-          {t('Go to bottom')}
-        </Text>
-      </BoxButton>
-    </Box>
-  );
-};
--- a/src/frontend/apps/impress/src/features/docs/doc-summary/components/index.ts
+++ b/src/frontend/apps/impress/src/features/docs/doc-summary/components/index.ts
@@ -1 +0,0 @@
-export * from './Summary';
--- a/src/frontend/apps/impress/src/features/docs/doc-summary/stores/index.ts
+++ b/src/frontend/apps/impress/src/features/docs/doc-summary/stores/index.ts
@@ -1 +0,0 @@
-export * from './useDocSummaryStore';
--- a/src/frontend/apps/impress/src/features/docs/doc-summary/stores/useDocSummaryStore.tsx
+++ b/src/frontend/apps/impress/src/features/docs/doc-summary/stores/useDocSummaryStore.tsx
@@ -1,13 +0,0 @@
-import { create } from 'zustand';
-
-export interface UseDocSummaryStore {
-  isPanelSummaryOpen: boolean;
-  setIsPanelSummaryOpen: (isOpen: boolean) => void;
-}
-
-export const useDocSummaryStore = create<UseDocSummaryStore>((set) => ({
-  isPanelSummaryOpen: false,
-  setIsPanelSummaryOpen: (isPanelSummaryOpen) => {
-    set(() => ({ isPanelSummaryOpen }));
-  },
-}));
--- a/src/frontend/apps/impress/src/features/docs/doc-table-content/components/Heading.tsx
+++ b/src/frontend/apps/impress/src/features/docs/doc-table-content/components/Heading.tsx
@@ -0,0 +1,66 @@
+import { BlockNoteEditor } from '@blocknote/core';
+import { useState } from 'react';
+
+import { BoxButton, Text } from '@/components';
+import { useCunninghamTheme } from '@/cunningham';
+
+const sizeMap: { [key: number]: string } = {
+  1: '1.2rem',
+  2: '1rem',
+  3: '0.8rem',
+};
+
+export type HeadingsHighlight = {
+  headingId: string;
+  isVisible: boolean;
+}[];
+
+interface HeadingProps {
+  editor: BlockNoteEditor;
+  level: number;
+  text: string;
+  headingId: string;
+  isHighlight: boolean;
+}
+
+export const Heading = ({
+  headingId,
+  editor,
+  isHighlight,
+  level,
+  text,
+}: HeadingProps) => {
+  const [isHover, setIsHover] = useState(isHighlight);
+  const { colorsTokens } = useCunninghamTheme();
+
+  return (
+    <BoxButton
+      key={headingId}
+      onMouseOver={() => setIsHover(true)}
+      onMouseLeave={() => setIsHover(false)}
+      onClick={() => {
+        editor.focus();
+        editor.setTextCursorPosition(headingId, 'end');
+        document.querySelector(`[data-id="${headingId}"]`)?.scrollIntoView({
+          behavior: 'smooth',
+          block: 'start',
+        });
+      }}
+    >
+      <Text
+        $theme="primary"
+        $padding={{ vertical: 'xtiny', left: 'tiny' }}
+        $size={sizeMap[level]}
+        $hasTransition
+        $css={
+          isHover || isHighlight
+            ? `box-shadow: -2px 0px 0px ${colorsTokens()[isHighlight ? 'primary-500' : 'primary-400']};`
+            : ''
+        }
+        aria-selected={isHighlight}
+      >
+        {text}
+      </Text>
+    </BoxButton>
+  );
+};
--- a/src/frontend/apps/impress/src/features/docs/doc-table-content/components/TableContent.tsx
+++ b/src/frontend/apps/impress/src/features/docs/doc-table-content/components/TableContent.tsx
@@ -0,0 +1,180 @@
+import React, { useCallback, useEffect, useState } from 'react';
+import { useTranslation } from 'react-i18next';
+
+import { Box, BoxButton, Text } from '@/components';
+import { Panel } from '@/components/Panel';
+import { useDocStore } from '@/features/docs/doc-editor';
+import { Doc } from '@/features/docs/doc-management';
+
+import { useDocTableContentStore } from '../stores';
+
+import { Heading } from './Heading';
+
+type HeadingBlock = {
+  id: string;
+  type: string;
+  text: string;
+  content: HeadingBlock[];
+  props: {
+    level: number;
+  };
+};
+
+interface TableContentProps {
+  doc: Doc;
+}
+
+export const TableContent = ({ doc }: TableContentProps) => {
+  const { docsStore } = useDocStore();
+  const { t } = useTranslation();
+
+  const editor = docsStore?.[doc.id]?.editor;
+  const headingFiltering = useCallback(
+    () =>
+      editor?.document.filter(
+        (block) => block.type === 'heading',
+      ) as unknown as HeadingBlock[],
+    [editor?.document],
+  );
+
+  const [headings, setHeadings] = useState<HeadingBlock[]>();
+  const { setIsPanelTableContentOpen, isPanelTableContentOpen } =
+    useDocTableContentStore();
+  const [hasBeenClose, setHasBeenClose] = useState(false);
+  const setClosePanel = () => {
+    setHasBeenClose(true);
+    setIsPanelTableContentOpen(false);
+  };
+
+  const [headingIdHighlight, setHeadingIdHighlight] = useState<string>();
+
+  // Open the panel if there are more than 1 heading
+  useEffect(() => {
+    if (headings?.length && headings.length > 1 && !hasBeenClose) {
+      setIsPanelTableContentOpen(true);
+    }
+  }, [setIsPanelTableContentOpen, headings, hasBeenClose]);
+
+  // Close the panel unmount
+  useEffect(() => {
+    return () => {
+      setIsPanelTableContentOpen(false);
+    };
+  }, [setIsPanelTableContentOpen]);
+
+  // To highlight the first heading in the viewport
+  useEffect(() => {
+    const handleScroll = () => {
+      if (!headings) {
+        return;
+      }
+
+      for (const heading of headings) {
+        const elHeading = document.body.querySelector(
+          `.bn-block-outer[data-id="${heading.id}"]`,
+        );
+
+        if (!elHeading) {
+          return;
+        }
+
+        const rect = elHeading.getBoundingClientRect();
+        const isVisible =
+          rect.top + rect.height >= 1 &&
+          rect.bottom <=
+            (window.innerHeight || document.documentElement.clientHeight);
+
+        if (isVisible) {
+          setHeadingIdHighlight(heading.id);
+          break;
+        }
+      }
+    };
+
+    window.addEventListener('scroll', () => {
+      setTimeout(() => {
+        handleScroll();
+      }, 300);
+    });
+
+    handleScroll();
+
+    return () => {
+      window.removeEventListener('scroll', handleScroll);
+    };
+  }, [headings, setHeadingIdHighlight]);
+
+  if (!editor) {
+    return null;
+  }
+
+  // Update the headings when the editor content changes
+  editor?.onEditorContentChange(() => {
+    setHeadings(headingFiltering());
+  });
+
+  if (!isPanelTableContentOpen) {
+    return null;
+  }
+
+  return (
+    <Panel setIsPanelOpen={setClosePanel}>
+      <Box $padding="small" $maxHeight="95%">
+        <Box $overflow="auto">
+          {headings?.map((heading) => {
+            const content = heading.content?.[0];
+            const text = content?.type === 'text' ? content.text : '';
+
+            return (
+              <Heading
+                editor={editor}
+                headingId={heading.id}
+                level={heading.props.level}
+                text={text}
+                key={heading.id}
+                isHighlight={headingIdHighlight === heading.id}
+              />
+            );
+          })}
+        </Box>
+        <Box
+          $height="1px"
+          $width="auto"
+          $background="#e5e5e5"
+          $margin={{ vertical: 'small' }}
+          $css="flex: none;"
+        />
+        <BoxButton
+          onClick={() => {
+            editor.focus();
+            document.querySelector(`.bn-editor`)?.scrollIntoView({
+              behavior: 'smooth',
+              block: 'start',
+            });
+          }}
+        >
+          <Text $theme="primary" $padding={{ vertical: 'xtiny' }}>
+            {t('Back to top')}
+          </Text>
+        </BoxButton>
+        <BoxButton
+          onClick={() => {
+            editor.focus();
+            document
+              .querySelector(
+                `.bn-editor > .bn-block-group > .bn-block-outer:last-child`,
+              )
+              ?.scrollIntoView({
+                behavior: 'smooth',
+                block: 'start',
+              });
+          }}
+        >
+          <Text $theme="primary" $padding={{ vertical: 'xtiny' }}>
+            {t('Go to bottom')}
+          </Text>
+        </BoxButton>
+      </Box>
+    </Panel>
+  );
+};
--- a/src/frontend/apps/impress/src/features/docs/doc-table-content/components/index.ts
+++ b/src/frontend/apps/impress/src/features/docs/doc-table-content/components/index.ts
@@ -0,0 +1 @@
+export * from './TableContent';
--- a/src/frontend/apps/impress/src/features/docs/doc-table-content/index.ts
+++ b/src/frontend/apps/impress/src/features/docs/doc-table-content/index.ts
--- a/src/frontend/apps/impress/src/features/docs/doc-table-content/stores/index.ts
+++ b/src/frontend/apps/impress/src/features/docs/doc-table-content/stores/index.ts
@@ -0,0 +1 @@
+export * from './useDocTableContentStore';
--- a/src/frontend/apps/impress/src/features/docs/doc-table-content/stores/useDocTableContentStore.tsx
+++ b/src/frontend/apps/impress/src/features/docs/doc-table-content/stores/useDocTableContentStore.tsx
@@ -0,0 +1,15 @@
+import { create } from 'zustand';
+
+export interface UseDocTableContentStore {
+  isPanelTableContentOpen: boolean;
+  setIsPanelTableContentOpen: (isOpen: boolean) => void;
+}
+
+export const useDocTableContentStore = create<UseDocTableContentStore>(
+  (set) => ({
+    isPanelTableContentOpen: false,
+    setIsPanelTableContentOpen: (isPanelTableContentOpen) => {
+      set(() => ({ isPanelTableContentOpen }));
+    },
+  }),
+);
--- a/src/frontend/apps/impress/src/i18n/translations.json
+++ b/src/frontend/apps/impress/src/i18n/translations.json
@@ -125,7 +125,7 @@
      "Validate the modification": "Valider les modifications",
      "Version restored successfully": "Version restaurée avec succès",
      "We didn't find a mail matching, try to be more accurate": "Nous n'avons pas trouvé de correspondance par mail, essayez d'être plus précis",
-      "We simply comply with the law, which states that certain audience measurement tools, properly configured to respect privacy, are exempt from prior authorization.": "Nous nous conformons simplement à la loi, qui stipule que certains outils de mesure d’audience, correctement configurés pour respecter la vie privée, sont exemptés de toute autorisation préalable.",
+      "We simply comply with the law, which states that certain audience measurement tools, properly configured to respect privacy, are exempt from prior authorization.": "Nous nous conformons simplement à la loi, qui stipule que certains outils de mesure d'audience, correctement configurés pour respecter la vie privée, sont exemptés de toute autorisation préalable.",
      "We try to respond within 2 working days.": "Nous essayons de répondre dans les 2 jours ouvrables.",
      "You are the sole owner of this group, make another member the group owner before you can change your own role or be removed from your document.": "Vous êtes le seul propriétaire de ce groupe, faites d'un autre membre le propriétaire du groupe, avant de pouvoir modifier votre propre rôle ou vous supprimer du document.",
      "You can oppose the tracking of your browsing on this website.": "Vous pouvez vous opposer au suivi de votre navigation sur ce site.",
@@ -140,7 +140,8 @@
      "accessibility-dinum-services": "<strong>DINUM</strong> s'engage à rendre accessibles ses services numériques, conformément à l'article 47 de la loi n° 2005-102 du 11 février 2005.",
      "accessibility-form-defenseurdesdroits": "Écrire un message au<1>Défenseur des droits</1>",
      "accessibility-not-audit": "<strong>docs.numerique.gouv.fr</strong> n'est pas en conformité avec le RGAA 4.1. Le site n'a <strong>pas encore été audité.</strong>",
-      "you have reported to the website manager a lack of accessibility that prevents you from accessing content or one of the services of the portal and you have not received a satisfactory response.": "vous avez signalé au responsable du site internet un défaut d'accessibilité qui vous empêche d'accéder à un contenu ou à un des services du portail et vous n'avez pas obtenu de réponse satisfaisante."
+      "you have reported to the website manager a lack of accessibility that prevents you from accessing content or one of the services of the portal and you have not received a satisfactory response.": "vous avez signalé au responsable du site internet un défaut d'accessibilité qui vous empêche d'accéder à un contenu ou à un des services du portail et vous n'avez pas obtenu de réponse satisfaisante.",
+      "Convert Markdown": "Convertir Markdown"
    }
  }
 }
--- a/src/frontend/packages/eslint-config-impress/package.json
+++ b/src/frontend/packages/eslint-config-impress/package.json
@@ -6,19 +6,19 @@
    "lint": "eslint --ext .js ."
  },
  "dependencies": {
-    "@next/eslint-plugin-next": "14.2.9",
-    "@tanstack/eslint-plugin-query": "5.53.0",
+    "@next/eslint-plugin-next": "14.2.11",
+    "@tanstack/eslint-plugin-query": "5.56.1",
    "@typescript-eslint/eslint-plugin": "*",
    "@typescript-eslint/parser": "*",
    "eslint": "*",
-    "eslint-config-next": "14.2.9",
+    "eslint-config-next": "14.2.11",
    "eslint-config-prettier": "9.1.0",
    "eslint-plugin-import": "2.30.0",
    "eslint-plugin-jest": "28.8.3",
    "eslint-plugin-jsx-a11y": "6.10.0",
    "eslint-plugin-playwright": "1.6.2",
    "eslint-plugin-prettier": "5.2.1",
-    "eslint-plugin-react": "7.35.2",
+    "eslint-plugin-react": "7.36.1",
    "eslint-plugin-testing-library": "6.3.0",
    "prettier": "3.3.3"
  }
--- a/src/frontend/packages/i18n/package.json
+++ b/src/frontend/packages/i18n/package.json
@@ -11,7 +11,7 @@
    "test": "jest"
  },
  "dependencies": {
-    "@types/jest": "29.5.12",
+    "@types/jest": "29.5.13",
    "@types/node": "*",
    "eslint-config-impress": "*",
    "eslint-plugin-import": "2.30.0",
--- a/src/frontend/yarn.lock
+++ b/src/frontend/yarn.lock
--- a/src/helm/env.d/dev/values.impress.yaml.gotmpl
+++ b/src/helm/env.d/dev/values.impress.yaml.gotmpl
@@ -72,7 +72,8 @@ frontend:
  envVars:
    PORT: 8080
    NEXT_PUBLIC_API_ORIGIN: https://impress.127.0.0.1.nip.io
-    NEXT_PUBLIC_SIGNALING_URL: wss://impress.127.0.0.1.nip.io/ws
+    NEXT_PUBLIC_Y_PROVIDER_URL: wss://impress.127.0.0.1.nip.io/ws
+    NEXT_PUBLIC_MEDIA_URL: https://impress.127.0.0.1.nip.io

  replicas: 1
  command:
Author	SHA1	Message	Date
Arnaud Robin	d3868235f1	🌐(frontend) add localization to editor	2024-10-21 10:48:18 +02:00
Anthony LC	5bd78b8068	🚚(frontend) rename feature summary to table of content We rename the feature summary to table of content to better reflect the feature purpose.	2024-09-17 15:06:37 +02:00
Anthony LC	ed39c01608	♻️(frontent) improve summary feature - Change Summary to Table of content - No dash before the title - Change font-size depend the type of heading - If more than 2 headings the panel is open by default - improve sticky - highligth the title where you are in the page	2024-09-17 15:06:37 +02:00
Anthony LC	748ebc8f26	🔧(helm) change conf helm dev Some frontend env vars were added on the frontend side, we need to add them to the dev helm chart.	2024-09-17 15:06:37 +02:00
renovate[bot]	03262878c4	⬆️(dependencies) update js dependencies	2024-09-16 14:30:29 +02:00