🔧(y-provider) increase Node.js memory limit

By default, Node.js has a memory limit of
around 512MB, which can lead to out-of-memory
errors when processing large documents.
This commit increases the memory limit to
2GB for the y-provider server, allowing
it to handle larger documents without crashing.

CHANGELOG.md

@@ -6,12 +6,58 @@ and this project adheres to
 
 ## [Unreleased]
 
+### Added
+
+- 🚸(frontend) hint min char search users #2064
+
+### Changed
+
+- 💄(frontend) improve comments highlights #1961
+- ♿️(frontend) improve BoxButton a11y and native button semantics #2103
+- ♿️(frontend) improve language picker accessibility #2069
+
+### Fixed
+
+- 🐛(y-provider) destroy Y.Doc instances after each convert request #2129
+
+## [v4.8.3] - 2026-03-23
+
+### Changed
+
+- ♿️(frontend) improve version history list accessibility #2033
+- ♿(frontend) focus skip link on headings and skip grid dropzone #1983
+- ♿️(frontend) add sr-only format to export download button #2088
+- ♿️(frontend) announce formatting shortcuts for screen readers #2070
+- ✨(frontend) add markdown copy icon for Copy as Markdown option #2096
+- ♻️(backend) skip saving in database a document when payload is empty #2062
+- ♻️(frontend) refacto Version modal to fit with the design system #2091
+- ⚡️(frontend) add debounce WebSocket reconnect #2104
+
+### Fixed
+
+- ♿️(frontend) fix more options menu feedback for screen readers #2071
+- ♿️(frontend) fix more options menu feedback for screen readers #2071
+- 💫(frontend) fix the help button to the bottom in tree #2073
+- ♿️(frontend) fix aria-labels for table of contents #2065
+- 🐛(backend) allow using search endpoint without refresh token enabled #2097
+- 🐛(frontend) fix close panel when click on subdoc #2094
+- 🐛(frontend) fix leftpanel button in doc version #9238
+- 🐛(y-provider) fix loop when no cookies #2101
+
 ## [v4.8.2] - 2026-03-19
 
+### Added
+
+- ✨(backend) add resource server api #1923
+- ✨(frontend) activate Find search #1834
+- ✨ handle searching on subdocuments #1834
+- ✨(backend) add search feature flags #1897
+
 ### Changed
 
 - ♿️(frontend) ensure doc title is h1 for accessibility #2006
 - ♿️(frontend) add nb accesses in share button aria-label #2017
+- ✨(backend) improve fallback logic on search endpoint #1834
 
 ### Fixed
 
@@ -25,6 +71,11 @@ and this project adheres to
 - 🐛(backend) stop using add_sibling method to create sandbox document #2084
 - 🐛(backend) duplicate a document as last-sibling #2084
 
+### Removed
+
+- 🔥(api) remove `documents/<document_id>/descendants/` endpoint #1834
+- 🔥(api) remove pagination on `documents/search/` endpoint #1834
+
 ## [v4.8.1] - 2026-03-17
 
 ### Added
@@ -41,7 +92,6 @@ and this project adheres to
 
 - ✨(backend) add a is_first_connection flag to the User model #1938
 - ✨(frontend) add onboarding modal with help menu button #1868
-- ✨(backend) add resource server api #1923
 
 ### Changed
 
@@ -127,16 +177,12 @@ and this project adheres to
 - ✨(frontend) Add stat for Crisp #1824
 - ✨(auth) add silent login #1690
 - 🔧(project) add DJANGO_EMAIL_URL_APP environment variable #1825
-- ✨(frontend) activate Find search #1834
-- ✨ handle searching on subdocuments #1834
-- ✨(backend) add search feature flags #1897
 
 ### Changed
 
 - ♿(frontend) improve accessibility:
   - ♿️(frontend) fix subdoc opening and emoji pick focus #1745
 - ✨(backend) add field for button label in email template #1817
-- ✨(backend) improve fallback logic on search endpoint #1834
 
 ### Fixed
 
@@ -1141,7 +1187,8 @@ and this project adheres to
 - ✨(frontend) Coming Soon page (#67)
 - 🚀 Impress, project to manage your documents easily and collaboratively.
 
-[unreleased]: https://github.com/suitenumerique/docs/compare/v4.8.2...main
+[unreleased]: https://github.com/suitenumerique/docs/compare/v4.8.3...main
+[v4.8.3]: https://github.com/suitenumerique/docs/releases/v4.8.3
 [v4.8.2]: https://github.com/suitenumerique/docs/releases/v4.8.2
 [v4.8.1]: https://github.com/suitenumerique/docs/releases/v4.8.1
 [v4.8.0]: https://github.com/suitenumerique/docs/releases/v4.8.0

env.d/development/common

@@ -61,8 +61,8 @@ OIDC_RS_AUDIENCE_CLAIM="client_id"  # The claim used to identify the audience
 OIDC_RS_ALLOWED_AUDIENCES=""
 
 # Store OIDC tokens in the session. Needed by search/ endpoint.
-OIDC_STORE_ACCESS_TOKEN=True
+# OIDC_STORE_ACCESS_TOKEN=True
-OIDC_STORE_REFRESH_TOKEN=True # Store the encrypted refresh token in the session.
+# OIDC_STORE_REFRESH_TOKEN=True # Store the encrypted refresh token in the session.
 
 # Must be a valid Fernet key (32 url-safe base64-encoded bytes)
 # To create one, use the bin/fernetkey command.

renovate.json

@@ -60,10 +60,13 @@
       "groupName": "ignored js dependencies",
       "matchManagers": ["npm"],
       "matchPackageNames": [
+        "@react-pdf/renderer",
         "fetch-mock",
         "node",
         "node-fetch",
         "react-resizable-panels",
+        "stylelint",
+        "stylelint-config-standard",
         "workbox-webpack-plugin"
       ]
     }

src/backend/core/api/serializers.py

@@ -300,6 +300,15 @@ class DocumentSerializer(ListDocumentSerializer):
 
         return file
 
+    def update(self, instance, validated_data):
+        """
+        When no data is sent on the update, skip making the update in the database and return
+        directly the instance unchanged.
+        """
+        if not validated_data:
+            return instance  # No data provided, skip the update
+        return super().update(instance, validated_data)
+
     def save(self, **kwargs):
         """
         Process the content field to extract attachment keys and update the document's

src/backend/core/api/utils.py

@@ -6,8 +6,10 @@ from abc import ABC, abstractmethod
 from django.conf import settings
 from django.core.cache import cache
 from django.core.files.storage import default_storage
+from django.utils.decorators import method_decorator
 
 import botocore
+from lasuite.oidc_login.decorators import refresh_oidc_access_token
 from rest_framework.throttling import BaseThrottle
 
 
@@ -91,6 +93,19 @@ def generate_s3_authorization_headers(key):
     return request
 
 
+def conditional_refresh_oidc_token(func):
+    """
+    Conditionally apply refresh_oidc_access_token decorator.
+
+    The decorator is only applied if OIDC_STORE_REFRESH_TOKEN is True, meaning
+    we can actually refresh something. Broader settings checks are done in settings.py.
+    """
+    if settings.OIDC_STORE_REFRESH_TOKEN:
+        return method_decorator(refresh_oidc_access_token)(func)
+
+    return func
+
+
 class AIBaseRateThrottle(BaseThrottle, ABC):
     """Base throttle class for AI-related rate limiting with backoff."""
 

src/backend/core/api/viewsets.py

@@ -25,7 +25,6 @@ from django.db.models.functions import Greatest, Left, Length
 from django.http import Http404, StreamingHttpResponse
 from django.urls import reverse
 from django.utils import timezone
-from django.utils.decorators import method_decorator
 from django.utils.functional import cached_property
 from django.utils.http import content_disposition_header
 from django.utils.text import capfirst, slugify
@@ -38,7 +37,6 @@ from botocore.exceptions import ClientError
 from csp.constants import NONE
 from csp.decorators import csp_update
 from lasuite.malware_detection import malware_detection
-from lasuite.oidc_login.decorators import refresh_oidc_access_token
 from lasuite.tools.email import get_domain_from_email
 from pydantic import ValidationError as PydanticValidationError
 from rest_framework import filters, status, viewsets
@@ -1415,7 +1413,7 @@ class DocumentViewSet(
         return duplicated_document
 
     @drf.decorators.action(detail=False, methods=["get"], url_path="search")
-    @method_decorator(refresh_oidc_access_token)
+    @utils.conditional_refresh_oidc_token
     def search(self, request, *args, **kwargs):
         """
         Returns an ordered list of documents best matching the search query parameter 'q'.
@@ -1426,7 +1424,6 @@ class DocumentViewSet(
         params = serializers.SearchDocumentSerializer(data=request.query_params)
         params.is_valid(raise_exception=True)
         search_type = self._get_search_type()
-
         if search_type == SearchType.TITLE:
             return self._title_search(request, params.validated_data, *args, **kwargs)
 

src/backend/core/tests/documents/test_api_documents_search.py

@@ -70,17 +70,20 @@ def test_api_documents_search_anonymous(search_query, indexer_settings):
 
 
 @mock.patch("core.api.viewsets.DocumentViewSet.list")
-def test_api_documents_search_fall_back_on_search_list(mock_list, indexer_settings):
+def test_api_documents_search_fall_back_on_search_list(mock_list, settings):
     """
     When indexer is not configured and no path is provided,
     should fall back on list method
     """
-    indexer_settings.SEARCH_URL = None
     assert get_document_indexer() is None
+    assert settings.OIDC_STORE_REFRESH_TOKEN is False
+    assert settings.OIDC_STORE_ACCESS_TOKEN is False
 
     user = factories.UserFactory()
     client = APIClient()
-    client.force_login(user)
+    client.force_login(
+        user, backend="core.authentication.backends.OIDCAuthenticationBackend"
+    )
 
     mocked_response = {
         "count": 0,
@@ -93,6 +96,8 @@ def test_api_documents_search_fall_back_on_search_list(mock_list, indexer_settin
     q = "alpha"
     response = client.get("/api/v1.0/documents/search/", data={"q": q})
 
+    assert response.status_code == 200
+
     assert mock_list.call_count == 1
     assert mock_list.call_args[0][0].GET.get("q") == q
     assert response.json() == mocked_response
@@ -100,18 +105,21 @@ def test_api_documents_search_fall_back_on_search_list(mock_list, indexer_settin
 
 @mock.patch("core.api.viewsets.DocumentViewSet._list_descendants")
 def test_api_documents_search_fallback_on_search_list_sub_docs(
-    mock_list_descendants, indexer_settings
+    mock_list_descendants, settings
 ):
     """
     When indexer is not configured and path parameter is provided,
     should call _list_descendants() method
     """
-    indexer_settings.SEARCH_URL = "http://find/api/v1.0/search"
+    assert get_document_indexer() is None
-    assert get_document_indexer() is not None
+    assert settings.OIDC_STORE_REFRESH_TOKEN is False
+    assert settings.OIDC_STORE_ACCESS_TOKEN is False
 
     user = factories.UserFactory()
     client = APIClient()
-    client.force_login(user)
+    client.force_login(
+        user, backend="core.authentication.backends.OIDCAuthenticationBackend"
+    )
 
     parent = factories.DocumentFactory(title="parent", users=[user])
 
@@ -128,9 +136,9 @@ def test_api_documents_search_fallback_on_search_list_sub_docs(
         "/api/v1.0/documents/search/", data={"q": q, "path": parent.path}
     )
 
-    assert mock_list_descendants.call_count == 1
+    mock_list_descendants.assert_called_with(
-    assert mock_list_descendants.call_args[0][0].GET.get("q") == q
+        mock.ANY, {"q": "alpha", "path": parent.path}
-    assert mock_list_descendants.call_args[0][0].GET.get("path") == parent.path
+    )
     assert response.json() == mocked_response
 
 
@@ -152,7 +160,9 @@ def test_api_documents_search_indexer_crashes(mock_title_search, indexer_setting
 
     user = factories.UserFactory()
     client = APIClient()
-    client.force_login(user)
+    client.force_login(
+        user, backend="core.authentication.backends.OIDCAuthenticationBackend"
+    )
 
     mocked_response = {
         "count": 0,
@@ -185,7 +195,9 @@ def test_api_documents_search_invalid_params(indexer_settings):
 
     user = factories.UserFactory()
     client = APIClient()
-    client.force_login(user)
+    client.force_login(
+        user, backend="core.authentication.backends.OIDCAuthenticationBackend"
+    )
 
     response = client.get("/api/v1.0/documents/search/")
 

src/backend/core/tests/documents/test_api_documents_update.py

@@ -1,8 +1,10 @@
 """
 Tests for Documents API endpoint in impress's core app: update
 """
+# pylint: disable=too-many-lines
 
 import random
+from unittest.mock import patch
 
 from django.contrib.auth.models import AnonymousUser
 from django.core.cache import cache
@@ -17,6 +19,25 @@ from core.tests.conftest import TEAM, USER, VIA
 
 pytestmark = pytest.mark.django_db
 
+# A valid Yjs document derived from YDOC_HELLO_WORLD_BASE64 with "Hello" replaced by "World",
+# used in PATCH tests to guarantee a real content change distinct from what DocumentFactory
+# produces.
+YDOC_UPDATED_CONTENT_BASE64 = (
+    "AR717vLVDgAHAQ5kb2N1bWVudC1zdG9yZQMKYmxvY2tHcm91cAcA9e7y1Q4AAw5ibG9ja0NvbnRh"
+    "aW5lcgcA9e7y1Q4BAwdoZWFkaW5nBwD17vLVDgIGBgD17vLVDgMGaXRhbGljAnt9hPXu8tUOBAVX"
+    "b3JsZIb17vLVDgkGaXRhbGljBG51bGwoAPXu8tUOAg10ZXh0QWxpZ25tZW50AXcEbGVmdCgA9e7y"
+    "1Q4CBWxldmVsAX0BKAD17vLVDgECaWQBdyQwNGQ2MjM0MS04MzI2LTQyMzYtYTA4My00ODdlMjZm"
+    "YWQyMzAoAPXu8tUOAQl0ZXh0Q29sb3IBdwdkZWZhdWx0KAD17vLVDgEPYmFja2dyb3VuZENvbG9y"
+    "AXcHZGVmYXVsdIf17vLVDgEDDmJsb2NrQ29udGFpbmVyBwD17vLVDhADDmJ1bGxldExpc3RJdGVt"
+    "BwD17vLVDhEGBAD17vLVDhIBd4b17vLVDhMEYm9sZAJ7fYT17vLVDhQCb3KG9e7y1Q4WBGJvbGQE"
+    "bnVsbIT17vLVDhcCbGQoAPXu8tUOEQ10ZXh0QWxpZ25tZW50AXcEbGVmdCgA9e7y1Q4QAmlkAXck"
+    "ZDM1MWUwNjgtM2U1NS00MjI2LThlYTUtYWJiMjYzMTk4ZTJhKAD17vLVDhAJdGV4dENvbG9yAXcH"
+    "ZGVmYXVsdCgA9e7y1Q4QD2JhY2tncm91bmRDb2xvcgF3B2RlZmF1bHSH9e7y1Q4QAw5ibG9ja0Nv"
+    "bnRhaW5lcgcA9e7y1Q4eAwlwYXJhZ3JhcGgoAPXu8tUOHw10ZXh0QWxpZ25tZW50AXcEbGVmdCgA"
+    "9e7y1Q4eAmlkAXckODk3MDBjMDctZTBlMS00ZmUwLWFjYTItODQ5MzIwOWE3ZTQyKAD17vLVDh4J"
+    "dGV4dENvbG9yAXcHZGVmYXVsdCgA9e7y1Q4eD2JhY2tncm91bmRDb2xvcgF3B2RlZmF1bHQA"
+)
+
 
 @pytest.mark.parametrize("via_parent", [True, False])
 @pytest.mark.parametrize(
@@ -330,6 +351,7 @@ def test_api_documents_update_authenticated_no_websocket(settings):
     ws_resp = responses.get(endpoint_url, json={"count": 0, "exists": False})
 
     assert cache.get(f"docs:no-websocket:{document.id}") is None
+    old_path = document.path
 
     response = client.put(
         f"/api/v1.0/documents/{document.id!s}/",
@@ -338,6 +360,8 @@ def test_api_documents_update_authenticated_no_websocket(settings):
     )
     assert response.status_code == 200
 
+    document.refresh_from_db()
+    assert document.path == old_path
     assert cache.get(f"docs:no-websocket:{document.id}") == session_key
     assert ws_resp.call_count == 1
 
@@ -446,6 +470,7 @@ def test_api_documents_update_user_connected_to_websocket(settings):
     ws_resp = responses.get(endpoint_url, json={"count": 3, "exists": True})
 
     assert cache.get(f"docs:no-websocket:{document.id}") is None
+    old_path = document.path
 
     response = client.put(
         f"/api/v1.0/documents/{document.id!s}/",
@@ -453,6 +478,9 @@ def test_api_documents_update_user_connected_to_websocket(settings):
         format="json",
     )
     assert response.status_code == 200
+
+    document.refresh_from_db()
+    assert document.path == old_path
     assert cache.get(f"docs:no-websocket:{document.id}") is None
     assert ws_resp.call_count == 1
 
@@ -486,6 +514,7 @@ def test_api_documents_update_websocket_server_unreachable_fallback_to_no_websoc
     ws_resp = responses.get(endpoint_url, status=500)
 
     assert cache.get(f"docs:no-websocket:{document.id}") is None
+    old_path = document.path
 
     response = client.put(
         f"/api/v1.0/documents/{document.id!s}/",
@@ -494,6 +523,8 @@ def test_api_documents_update_websocket_server_unreachable_fallback_to_no_websoc
     )
     assert response.status_code == 200
 
+    document.refresh_from_db()
+    assert document.path == old_path
     assert cache.get(f"docs:no-websocket:{document.id}") == session_key
     assert ws_resp.call_count == 1
 
@@ -605,6 +636,7 @@ def test_api_documents_update_force_websocket_param_to_true(settings):
     ws_resp = responses.get(endpoint_url, status=500)
 
     assert cache.get(f"docs:no-websocket:{document.id}") is None
+    old_path = document.path
 
     response = client.put(
         f"/api/v1.0/documents/{document.id!s}/",
@@ -613,6 +645,8 @@ def test_api_documents_update_force_websocket_param_to_true(settings):
     )
     assert response.status_code == 200
 
+    document.refresh_from_db()
+    assert document.path == old_path
     assert cache.get(f"docs:no-websocket:{document.id}") is None
     assert ws_resp.call_count == 0
 
@@ -643,6 +677,7 @@ def test_api_documents_update_feature_flag_disabled(settings):
     ws_resp = responses.get(endpoint_url, status=500)
 
     assert cache.get(f"docs:no-websocket:{document.id}") is None
+    old_path = document.path
 
     response = client.put(
         f"/api/v1.0/documents/{document.id!s}/",
@@ -651,6 +686,8 @@ def test_api_documents_update_feature_flag_disabled(settings):
     )
     assert response.status_code == 200
 
+    document.refresh_from_db()
+    assert document.path == old_path
     assert cache.get(f"docs:no-websocket:{document.id}") is None
     assert ws_resp.call_count == 0
 
@@ -716,3 +753,724 @@ def test_api_documents_update_invalid_content():
     )
     assert response.status_code == 400
     assert response.json() == {"content": ["Invalid base64 content."]}
+
+
+# =============================================================================
+# PATCH tests
+# =============================================================================
+
+
+@pytest.mark.parametrize("via_parent", [True, False])
+@pytest.mark.parametrize(
+    "reach, role",
+    [
+        ("restricted", "reader"),
+        ("restricted", "editor"),
+        ("authenticated", "reader"),
+        ("authenticated", "editor"),
+        ("public", "reader"),
+    ],
+)
+def test_api_documents_patch_anonymous_forbidden(reach, role, via_parent):
+    """
+    Anonymous users should not be allowed to patch a document when link
+    configuration does not allow it.
+    """
+    if via_parent:
+        grand_parent = factories.DocumentFactory(link_reach=reach, link_role=role)
+        parent = factories.DocumentFactory(parent=grand_parent, link_reach="restricted")
+        document = factories.DocumentFactory(parent=parent, link_reach="restricted")
+    else:
+        document = factories.DocumentFactory(link_reach=reach, link_role=role)
+
+    old_document_values = serializers.DocumentSerializer(instance=document).data
+    new_content = YDOC_UPDATED_CONTENT_BASE64
+
+    response = APIClient().patch(
+        f"/api/v1.0/documents/{document.id!s}/",
+        {"content": new_content},
+        format="json",
+    )
+    assert response.status_code == 401
+    assert response.json() == {
+        "detail": "Authentication credentials were not provided."
+    }
+
+    document.refresh_from_db()
+    assert serializers.DocumentSerializer(instance=document).data == old_document_values
+
+
+@pytest.mark.parametrize("via_parent", [True, False])
+@pytest.mark.parametrize(
+    "reach,role",
+    [
+        ("public", "reader"),
+        ("authenticated", "reader"),
+        ("restricted", "reader"),
+        ("restricted", "editor"),
+    ],
+)
+def test_api_documents_patch_authenticated_unrelated_forbidden(reach, role, via_parent):
+    """
+    Authenticated users should not be allowed to patch a document to which
+    they are not related if the link configuration does not allow it.
+    """
+    user = factories.UserFactory(with_owned_document=True)
+
+    client = APIClient()
+    client.force_login(user)
+
+    if via_parent:
+        grand_parent = factories.DocumentFactory(link_reach=reach, link_role=role)
+        parent = factories.DocumentFactory(parent=grand_parent, link_reach="restricted")
+        document = factories.DocumentFactory(parent=parent, link_reach="restricted")
+    else:
+        document = factories.DocumentFactory(link_reach=reach, link_role=role)
+
+    old_document_values = serializers.DocumentSerializer(instance=document).data
+    new_content = YDOC_UPDATED_CONTENT_BASE64
+
+    response = client.patch(
+        f"/api/v1.0/documents/{document.id!s}/",
+        {"content": new_content},
+        format="json",
+    )
+
+    assert response.status_code == 403
+    assert response.json() == {
+        "detail": "You do not have permission to perform this action."
+    }
+
+    document.refresh_from_db()
+    assert serializers.DocumentSerializer(instance=document).data == old_document_values
+
+
+@pytest.mark.parametrize("via_parent", [True, False])
+@pytest.mark.parametrize(
+    "is_authenticated,reach,role",
+    [
+        (False, "public", "editor"),
+        (True, "public", "editor"),
+        (True, "authenticated", "editor"),
+    ],
+)
+def test_api_documents_patch_anonymous_or_authenticated_unrelated(
+    is_authenticated, reach, role, via_parent
+):
+    """
+    Anonymous and authenticated users should be able to patch a document to which
+    they are not related if the link configuration allows it.
+    """
+    client = APIClient()
+
+    if is_authenticated:
+        user = factories.UserFactory(with_owned_document=True)
+        client.force_login(user)
+
+    if via_parent:
+        grand_parent = factories.DocumentFactory(link_reach=reach, link_role=role)
+        parent = factories.DocumentFactory(parent=grand_parent, link_reach="restricted")
+        document = factories.DocumentFactory(parent=parent, link_reach="restricted")
+    else:
+        document = factories.DocumentFactory(link_reach=reach, link_role=role)
+
+    old_document_values = serializers.DocumentSerializer(instance=document).data
+    old_path = document.path
+    new_content = YDOC_UPDATED_CONTENT_BASE64
+
+    response = client.patch(
+        f"/api/v1.0/documents/{document.id!s}/",
+        {"content": new_content, "websocket": True},
+        format="json",
+    )
+    assert response.status_code == 200
+
+    # Using document.refresh_from_db does not wirk because the content is in cache.
+    # Force reloading it by fetching the document in the database.
+    document = models.Document.objects.get(id=document.id)
+    assert document.path == old_path
+    assert document.content == new_content
+    document_values = serializers.DocumentSerializer(instance=document).data
+    for key in [
+        "id",
+        "title",
+        "link_reach",
+        "link_role",
+        "creator",
+        "depth",
+        "numchild",
+        "path",
+    ]:
+        assert document_values[key] == old_document_values[key]
+
+
+@pytest.mark.parametrize("via_parent", [True, False])
+@pytest.mark.parametrize("via", VIA)
+def test_api_documents_patch_authenticated_reader(via, via_parent, mock_user_teams):
+    """Users who are reader of a document should not be allowed to patch it."""
+    user = factories.UserFactory(with_owned_document=True)
+
+    client = APIClient()
+    client.force_login(user)
+
+    if via_parent:
+        grand_parent = factories.DocumentFactory(link_reach="restricted")
+        parent = factories.DocumentFactory(parent=grand_parent, link_reach="restricted")
+        document = factories.DocumentFactory(parent=parent, link_reach="restricted")
+        access_document = grand_parent
+    else:
+        document = factories.DocumentFactory(link_reach="restricted")
+        access_document = document
+
+    if via == USER:
+        factories.UserDocumentAccessFactory(
+            document=access_document, user=user, role="reader"
+        )
+    elif via == TEAM:
+        mock_user_teams.return_value = ["lasuite", "unknown"]
+        factories.TeamDocumentAccessFactory(
+            document=access_document, team="lasuite", role="reader"
+        )
+
+    old_document_values = serializers.DocumentSerializer(instance=document).data
+    new_content = YDOC_UPDATED_CONTENT_BASE64
+
+    response = client.patch(
+        f"/api/v1.0/documents/{document.id!s}/",
+        {"content": new_content},
+        format="json",
+    )
+
+    assert response.status_code == 403
+    assert response.json() == {
+        "detail": "You do not have permission to perform this action."
+    }
+
+    document.refresh_from_db()
+    assert serializers.DocumentSerializer(instance=document).data == old_document_values
+
+
+@pytest.mark.parametrize("via_parent", [True, False])
+@pytest.mark.parametrize("role", ["editor", "administrator", "owner"])
+@pytest.mark.parametrize("via", VIA)
+def test_api_documents_patch_authenticated_editor_administrator_or_owner(
+    via, role, via_parent, mock_user_teams
+):
+    """A user who is editor, administrator or owner of a document should be allowed to patch it."""
+    user = factories.UserFactory(with_owned_document=True)
+
+    client = APIClient()
+    client.force_login(user)
+
+    if via_parent:
+        grand_parent = factories.DocumentFactory(link_reach="restricted")
+        parent = factories.DocumentFactory(parent=grand_parent, link_reach="restricted")
+        document = factories.DocumentFactory(parent=parent, link_reach="restricted")
+        access_document = grand_parent
+    else:
+        document = factories.DocumentFactory(link_reach="restricted")
+        access_document = document
+
+    if via == USER:
+        factories.UserDocumentAccessFactory(
+            document=access_document, user=user, role=role
+        )
+    elif via == TEAM:
+        mock_user_teams.return_value = ["lasuite", "unknown"]
+        factories.TeamDocumentAccessFactory(
+            document=access_document, team="lasuite", role=role
+        )
+
+    old_document_values = serializers.DocumentSerializer(instance=document).data
+    old_path = document.path
+    new_content = YDOC_UPDATED_CONTENT_BASE64
+
+    response = client.patch(
+        f"/api/v1.0/documents/{document.id!s}/",
+        {"content": new_content, "websocket": True},
+        format="json",
+    )
+    assert response.status_code == 200
+
+    # Using document.refresh_from_db does not wirk because the content is in cache.
+    # Force reloading it by fetching the document in the database.
+    document = models.Document.objects.get(id=document.id)
+    assert document.path == old_path
+    assert document.content == new_content
+    document_values = serializers.DocumentSerializer(instance=document).data
+    for key in [
+        "id",
+        "title",
+        "link_reach",
+        "link_role",
+        "creator",
+        "depth",
+        "numchild",
+        "path",
+        "nb_accesses_ancestors",
+        "nb_accesses_direct",
+    ]:
+        assert document_values[key] == old_document_values[key]
+
+
+@responses.activate
+def test_api_documents_patch_authenticated_no_websocket(settings):
+    """
+    When a user patches the document, not connected to the websocket and is the first to update,
+    the document should be updated.
+    """
+    user = factories.UserFactory(with_owned_document=True)
+    client = APIClient()
+    client.force_login(user)
+    session_key = client.session.session_key
+
+    document = factories.DocumentFactory(users=[(user, "editor")])
+    new_content = YDOC_UPDATED_CONTENT_BASE64
+
+    settings.COLLABORATION_API_URL = "http://example.com/"
+    settings.COLLABORATION_SERVER_SECRET = "secret-token"
+    settings.COLLABORATION_WS_NOT_CONNECTED_READY_ONLY = True
+    endpoint_url = (
+        f"{settings.COLLABORATION_API_URL}get-connections/"
+        f"?room={document.id}&sessionKey={session_key}"
+    )
+    ws_resp = responses.get(endpoint_url, json={"count": 0, "exists": False})
+
+    assert cache.get(f"docs:no-websocket:{document.id}") is None
+    old_path = document.path
+
+    response = client.patch(
+        f"/api/v1.0/documents/{document.id!s}/",
+        {"content": new_content},
+        format="json",
+    )
+    assert response.status_code == 200
+
+    # Using document.refresh_from_db does not work because the content is cached.
+    # Force reloading it by fetching the document from the database.
+    document = models.Document.objects.get(id=document.id)
+    assert document.path == old_path
+    assert document.content == new_content
+    assert cache.get(f"docs:no-websocket:{document.id}") == session_key
+    assert ws_resp.call_count == 1
+
+
+@responses.activate
+def test_api_documents_patch_authenticated_no_websocket_user_already_editing(settings):
+    """
+    When a user patches the document, not connected to the websocket and is not the first to
+    update, the document should not be updated.
+    """
+    user = factories.UserFactory(with_owned_document=True)
+    client = APIClient()
+    client.force_login(user)
+    session_key = client.session.session_key
+
+    document = factories.DocumentFactory(users=[(user, "editor")])
+    new_content = YDOC_UPDATED_CONTENT_BASE64
+
+    settings.COLLABORATION_API_URL = "http://example.com/"
+    settings.COLLABORATION_SERVER_SECRET = "secret-token"
+    settings.COLLABORATION_WS_NOT_CONNECTED_READY_ONLY = True
+    endpoint_url = (
+        f"{settings.COLLABORATION_API_URL}get-connections/"
+        f"?room={document.id}&sessionKey={session_key}"
+    )
+    ws_resp = responses.get(endpoint_url, json={"count": 0, "exists": False})
+
+    cache.set(f"docs:no-websocket:{document.id}", "other_session_key")
+
+    response = client.patch(
+        f"/api/v1.0/documents/{document.id!s}/",
+        {"content": new_content},
+        format="json",
+    )
+    assert response.status_code == 403
+    assert response.json() == {"detail": "You are not allowed to edit this document."}
+
+    assert ws_resp.call_count == 1
+
+
+@responses.activate
+def test_api_documents_patch_no_websocket_other_user_connected_to_websocket(settings):
+    """
+    When a user patches the document, not connected to the websocket and another user is connected
+    to the websocket, the document should not be updated.
+    """
+    user = factories.UserFactory(with_owned_document=True)
+    client = APIClient()
+    client.force_login(user)
+    session_key = client.session.session_key
+
+    document = factories.DocumentFactory(users=[(user, "editor")])
+    new_content = YDOC_UPDATED_CONTENT_BASE64
+
+    settings.COLLABORATION_API_URL = "http://example.com/"
+    settings.COLLABORATION_SERVER_SECRET = "secret-token"
+    settings.COLLABORATION_WS_NOT_CONNECTED_READY_ONLY = True
+    endpoint_url = (
+        f"{settings.COLLABORATION_API_URL}get-connections/"
+        f"?room={document.id}&sessionKey={session_key}"
+    )
+    ws_resp = responses.get(endpoint_url, json={"count": 3, "exists": False})
+
+    assert cache.get(f"docs:no-websocket:{document.id}") is None
+
+    response = client.patch(
+        f"/api/v1.0/documents/{document.id!s}/",
+        {"content": new_content},
+        format="json",
+    )
+    assert response.status_code == 403
+    assert response.json() == {"detail": "You are not allowed to edit this document."}
+    assert cache.get(f"docs:no-websocket:{document.id}") is None
+    assert ws_resp.call_count == 1
+
+
+@responses.activate
+def test_api_documents_patch_user_connected_to_websocket(settings):
+    """
+    When a user patches the document while connected to the websocket, the document should be
+    updated.
+    """
+    user = factories.UserFactory(with_owned_document=True)
+    client = APIClient()
+    client.force_login(user)
+    session_key = client.session.session_key
+
+    document = factories.DocumentFactory(users=[(user, "editor")])
+    new_content = YDOC_UPDATED_CONTENT_BASE64
+
+    settings.COLLABORATION_API_URL = "http://example.com/"
+    settings.COLLABORATION_SERVER_SECRET = "secret-token"
+    settings.COLLABORATION_WS_NOT_CONNECTED_READY_ONLY = True
+    endpoint_url = (
+        f"{settings.COLLABORATION_API_URL}get-connections/"
+        f"?room={document.id}&sessionKey={session_key}"
+    )
+    ws_resp = responses.get(endpoint_url, json={"count": 3, "exists": True})
+
+    assert cache.get(f"docs:no-websocket:{document.id}") is None
+    old_path = document.path
+
+    response = client.patch(
+        f"/api/v1.0/documents/{document.id!s}/",
+        {"content": new_content},
+        format="json",
+    )
+    assert response.status_code == 200
+
+    # Using document.refresh_from_db does not wirk because the content is in cache.
+    # Force reloading it by fetching the document in the database.
+    document = models.Document.objects.get(id=document.id)
+    assert document.path == old_path
+    assert document.content == new_content
+    assert cache.get(f"docs:no-websocket:{document.id}") is None
+    assert ws_resp.call_count == 1
+
+
+@responses.activate
+def test_api_documents_patch_websocket_server_unreachable_fallback_to_no_websocket(
+    settings,
+):
+    """
+    When the websocket server is unreachable, the patch should be applied like if the user was
+    not connected to the websocket.
+    """
+    user = factories.UserFactory(with_owned_document=True)
+    client = APIClient()
+    client.force_login(user)
+    session_key = client.session.session_key
+
+    document = factories.DocumentFactory(users=[(user, "editor")])
+    new_content = YDOC_UPDATED_CONTENT_BASE64
+
+    settings.COLLABORATION_API_URL = "http://example.com/"
+    settings.COLLABORATION_SERVER_SECRET = "secret-token"
+    settings.COLLABORATION_WS_NOT_CONNECTED_READY_ONLY = True
+    endpoint_url = (
+        f"{settings.COLLABORATION_API_URL}get-connections/"
+        f"?room={document.id}&sessionKey={session_key}"
+    )
+    ws_resp = responses.get(endpoint_url, status=500)
+
+    assert cache.get(f"docs:no-websocket:{document.id}") is None
+    old_path = document.path
+
+    response = client.patch(
+        f"/api/v1.0/documents/{document.id!s}/",
+        {"content": new_content},
+        format="json",
+    )
+    assert response.status_code == 200
+
+    # Using document.refresh_from_db does not work because the content is cached.
+    # Force reloading it by fetching the document from the database.
+    document = models.Document.objects.get(id=document.id)
+    assert document.path == old_path
+    assert document.content == new_content
+    assert cache.get(f"docs:no-websocket:{document.id}") == session_key
+    assert ws_resp.call_count == 1
+
+
+@responses.activate
+def test_api_documents_patch_websocket_server_unreachable_fallback_to_no_websocket_other_users(
+    settings,
+):
+    """
+    When the websocket server is unreachable, the behavior falls back to no-websocket.
+    If another user is already editing, the patch must be denied.
+    """
+    user = factories.UserFactory(with_owned_document=True)
+    client = APIClient()
+    client.force_login(user)
+    session_key = client.session.session_key
+
+    document = factories.DocumentFactory(users=[(user, "editor")])
+    new_content = YDOC_UPDATED_CONTENT_BASE64
+
+    settings.COLLABORATION_API_URL = "http://example.com/"
+    settings.COLLABORATION_SERVER_SECRET = "secret-token"
+    settings.COLLABORATION_WS_NOT_CONNECTED_READY_ONLY = True
+    endpoint_url = (
+        f"{settings.COLLABORATION_API_URL}get-connections/"
+        f"?room={document.id}&sessionKey={session_key}"
+    )
+    ws_resp = responses.get(endpoint_url, status=500)
+
+    cache.set(f"docs:no-websocket:{document.id}", "other_session_key")
+
+    response = client.patch(
+        f"/api/v1.0/documents/{document.id!s}/",
+        {"content": new_content},
+        format="json",
+    )
+    assert response.status_code == 403
+
+    assert cache.get(f"docs:no-websocket:{document.id}") == "other_session_key"
+    assert ws_resp.call_count == 1
+
+
+@responses.activate
+def test_api_documents_patch_websocket_server_room_not_found_fallback_to_no_websocket_other_users(
+    settings,
+):
+    """
+    When the WebSocket server does not have the room created, the logic should fallback to
+    no-WebSocket. If another user is already editing, the patch must be denied.
+    """
+    user = factories.UserFactory(with_owned_document=True)
+    client = APIClient()
+    client.force_login(user)
+    session_key = client.session.session_key
+
+    document = factories.DocumentFactory(users=[(user, "editor")])
+    new_content = YDOC_UPDATED_CONTENT_BASE64
+
+    settings.COLLABORATION_API_URL = "http://example.com/"
+    settings.COLLABORATION_SERVER_SECRET = "secret-token"
+    settings.COLLABORATION_WS_NOT_CONNECTED_READY_ONLY = True
+    endpoint_url = (
+        f"{settings.COLLABORATION_API_URL}get-connections/"
+        f"?room={document.id}&sessionKey={session_key}"
+    )
+    ws_resp = responses.get(endpoint_url, status=404)
+
+    cache.set(f"docs:no-websocket:{document.id}", "other_session_key")
+
+    response = client.patch(
+        f"/api/v1.0/documents/{document.id!s}/",
+        {"content": new_content},
+        format="json",
+    )
+    assert response.status_code == 403
+
+    assert cache.get(f"docs:no-websocket:{document.id}") == "other_session_key"
+    assert ws_resp.call_count == 1
+
+
+@responses.activate
+def test_api_documents_patch_force_websocket_param_to_true(settings):
+    """
+    When the websocket parameter is set to true, the patch should be applied without any check.
+    """
+    user = factories.UserFactory(with_owned_document=True)
+    client = APIClient()
+    client.force_login(user)
+    session_key = client.session.session_key
+
+    document = factories.DocumentFactory(users=[(user, "editor")])
+    new_content = YDOC_UPDATED_CONTENT_BASE64
+
+    settings.COLLABORATION_API_URL = "http://example.com/"
+    settings.COLLABORATION_SERVER_SECRET = "secret-token"
+    endpoint_url = (
+        f"{settings.COLLABORATION_API_URL}get-connections/"
+        f"?room={document.id}&sessionKey={session_key}"
+    )
+    ws_resp = responses.get(endpoint_url, status=500)
+
+    assert cache.get(f"docs:no-websocket:{document.id}") is None
+    old_path = document.path
+
+    response = client.patch(
+        f"/api/v1.0/documents/{document.id!s}/",
+        {"content": new_content, "websocket": True},
+        format="json",
+    )
+    assert response.status_code == 200
+
+    # Using document.refresh_from_db does not work because the content is cached.
+    # Force reloading it by fetching the document from the database.
+    document = models.Document.objects.get(id=document.id)
+    assert document.path == old_path
+    assert document.content == new_content
+    assert cache.get(f"docs:no-websocket:{document.id}") is None
+    assert ws_resp.call_count == 0
+
+
+@responses.activate
+def test_api_documents_patch_feature_flag_disabled(settings):
+    """
+    When the feature flag is disabled, the patch should be applied without any check.
+    """
+    user = factories.UserFactory(with_owned_document=True)
+    client = APIClient()
+    client.force_login(user)
+    session_key = client.session.session_key
+
+    document = factories.DocumentFactory(users=[(user, "editor")])
+    new_content = YDOC_UPDATED_CONTENT_BASE64
+
+    settings.COLLABORATION_API_URL = "http://example.com/"
+    settings.COLLABORATION_SERVER_SECRET = "secret-token"
+    settings.COLLABORATION_WS_NOT_CONNECTED_READY_ONLY = False
+    endpoint_url = (
+        f"{settings.COLLABORATION_API_URL}get-connections/"
+        f"?room={document.id}&sessionKey={session_key}"
+    )
+    ws_resp = responses.get(endpoint_url, status=500)
+
+    assert cache.get(f"docs:no-websocket:{document.id}") is None
+    old_path = document.path
+
+    response = client.patch(
+        f"/api/v1.0/documents/{document.id!s}/",
+        {"content": new_content},
+        format="json",
+    )
+    assert response.status_code == 200
+
+    # Using document.refresh_from_db does not work because the content is cached.
+    # Force reloading it by fetching the document from the database.
+    document = models.Document.objects.get(id=document.id)
+    assert document.path == old_path
+    assert document.content == new_content
+    assert cache.get(f"docs:no-websocket:{document.id}") is None
+    assert ws_resp.call_count == 0
+
+
+@pytest.mark.parametrize("via", VIA)
+def test_api_documents_patch_administrator_or_owner_of_another(via, mock_user_teams):
+    """
+    Being administrator or owner of a document should not grant authorization to patch
+    another document.
+    """
+    user = factories.UserFactory(with_owned_document=True)
+
+    client = APIClient()
+    client.force_login(user)
+
+    document = factories.DocumentFactory()
+    if via == USER:
+        factories.UserDocumentAccessFactory(
+            document=document, user=user, role=random.choice(["administrator", "owner"])
+        )
+    elif via == TEAM:
+        mock_user_teams.return_value = ["lasuite", "unknown"]
+        factories.TeamDocumentAccessFactory(
+            document=document,
+            team="lasuite",
+            role=random.choice(["administrator", "owner"]),
+        )
+
+    other_document = factories.DocumentFactory(title="Old title", link_role="reader")
+    old_document_values = serializers.DocumentSerializer(instance=other_document).data
+    new_content = YDOC_UPDATED_CONTENT_BASE64
+
+    response = client.patch(
+        f"/api/v1.0/documents/{other_document.id!s}/",
+        {"content": new_content},
+        format="json",
+    )
+
+    assert response.status_code == 403
+
+    other_document.refresh_from_db()
+    assert (
+        serializers.DocumentSerializer(instance=other_document).data
+        == old_document_values
+    )
+
+
+def test_api_documents_patch_invalid_content():
+    """
+    Patching a document with a non base64 encoded content should raise a validation error.
+    """
+    user = factories.UserFactory(with_owned_document=True)
+    client = APIClient()
+    client.force_login(user)
+
+    document = factories.DocumentFactory(users=[[user, "owner"]])
+
+    response = client.patch(
+        f"/api/v1.0/documents/{document.id!s}/",
+        {"content": "invalid content"},
+        format="json",
+    )
+    assert response.status_code == 400
+    assert response.json() == {"content": ["Invalid base64 content."]}
+
+
+@responses.activate
+def test_api_documents_patch_empty_body(settings):
+    """
+    Test when data is empty the document should not be updated.
+    The `updated_at` property should not change asserting that no update in the database is made.
+    """
+    user = factories.UserFactory()
+
+    client = APIClient()
+    client.force_login(user)
+    session_key = client.session.session_key
+
+    document = factories.DocumentFactory(users=[(user, "owner")], creator=user)
+    document_updated_at = document.updated_at
+
+    settings.COLLABORATION_API_URL = "http://example.com/"
+    settings.COLLABORATION_SERVER_SECRET = "secret-token"
+    settings.COLLABORATION_WS_NOT_CONNECTED_READY_ONLY = True
+    endpoint_url = (
+        f"{settings.COLLABORATION_API_URL}get-connections/"
+        f"?room={document.id}&sessionKey={session_key}"
+    )
+    ws_resp = responses.get(endpoint_url, json={"count": 3, "exists": True})
+
+    assert cache.get(f"docs:no-websocket:{document.id}") is None
+
+    old_document_values = serializers.DocumentSerializer(instance=document).data
+
+    with patch("core.models.Document.save") as mock_document_save:
+        response = client.patch(
+            f"/api/v1.0/documents/{document.id!s}/",
+            content_type="application/json",
+        )
+    mock_document_save.assert_not_called()
+    assert response.status_code == 200
+
+    document = models.Document.objects.get(id=document.id)
+    new_document_values = serializers.DocumentSerializer(instance=document).data
+    assert new_document_values == old_document_values
+    assert document_updated_at == document.updated_at
+    assert cache.get(f"docs:no-websocket:{document.id}") is None
+    assert ws_resp.call_count == 1

src/backend/core/tests/test_api_utils_conditional_refresh_oidc_token.py

@@ -0,0 +1,32 @@
+"""module testing the conditional_refresh_oidc_token utils."""
+
+from unittest import mock
+
+from core.api import utils
+
+
+def test_refresh_oidc_access_token_storing_refresh_token_disabled(settings):
+    """The method_decorator must not be called when OIDC_STORE_REFRESH_TOKEN is False."""
+
+    settings.OIDC_STORE_REFRESH_TOKEN = False
+
+    callback = mock.MagicMock()
+
+    with mock.patch.object(utils, "method_decorator") as mock_method_decorator:
+        result = utils.conditional_refresh_oidc_token(callback)
+
+    mock_method_decorator.assert_not_called()
+    assert result == callback
+
+
+def test_refresh_oidc_access_token_storing_refresh_token_enabled(settings):
+    """The method_decorator must not be called when OIDC_STORE_REFRESH_TOKEN is False."""
+
+    settings.OIDC_STORE_REFRESH_TOKEN = True
+
+    callback = mock.MagicMock()
+
+    with mock.patch.object(utils, "method_decorator") as mock_method_decorator:
+        utils.conditional_refresh_oidc_token(callback)
+
+    mock_method_decorator.assert_called_with(utils.refresh_oidc_access_token)

src/backend/pyproject.toml

@@ -7,7 +7,7 @@ build-backend = "setuptools.build_meta"
 
 [project]
 name = "impress"
-version = "4.8.2"
+version = "4.8.3"
 authors = [{ "name" = "DINUM", "email" = "dev@mail.numerique.gouv.fr" }]
 classifiers = [
     "Development Status :: 5 - Production/Stable",

src/frontend/apps/e2e/__tests__/app-impress/doc-ai.spec.ts

@@ -3,7 +3,6 @@ import { expect, test } from '@playwright/test';
 
 import {
   createDoc,
-  getMenuItem,
   mockedDocument,
   overrideConfig,
   verifyDocName,
@@ -47,9 +46,9 @@ test.describe('Doc AI feature', () => {
 
       await page.locator('.bn-block-outer').last().fill('Anything');
       await page.getByText('Anything').selectText();
-      expect(
+      await expect(
-        await page.locator('button[data-test="convertMarkdown"]').count(),
+        page.locator('button[data-test="convertMarkdown"]'),
-      ).toBe(1);
+      ).toHaveCount(1);
       await expect(
         page.getByRole('button', { name: config.selector, exact: true }),
       ).toBeHidden();
@@ -179,18 +178,32 @@ test.describe('Doc AI feature', () => {
 
     await page.getByRole('button', { name: 'AI', exact: true }).click();
 
-    await expect(getMenuItem(page, 'Use as prompt')).toBeVisible();
+    await expect(
-    await expect(getMenuItem(page, 'Rephrase')).toBeVisible();
+      page.getByRole('menuitem', { name: 'Use as prompt' }),
-    await expect(getMenuItem(page, 'Summarize')).toBeVisible();
+    ).toBeVisible();
-    await expect(getMenuItem(page, 'Correct')).toBeVisible();
+    await expect(
-    await expect(getMenuItem(page, 'Language')).toBeVisible();
+      page.getByRole('menuitem', { name: 'Rephrase' }),
+    ).toBeVisible();
+    await expect(
+      page.getByRole('menuitem', { name: 'Summarize' }),
+    ).toBeVisible();
+    await expect(page.getByRole('menuitem', { name: 'Correct' })).toBeVisible();
+    await expect(
+      page.getByRole('menuitem', { name: 'Language' }),
+    ).toBeVisible();
 
-    await getMenuItem(page, 'Language').hover();
+    await page.getByRole('menuitem', { name: 'Language' }).hover();
-    await expect(getMenuItem(page, 'English', { exact: true })).toBeVisible();
+    await expect(
-    await expect(getMenuItem(page, 'French', { exact: true })).toBeVisible();
+      page.getByRole('menuitem', { name: 'English', exact: true }),
-    await expect(getMenuItem(page, 'German', { exact: true })).toBeVisible();
+    ).toBeVisible();
+    await expect(
+      page.getByRole('menuitem', { name: 'French', exact: true }),
+    ).toBeVisible();
+    await expect(
+      page.getByRole('menuitem', { name: 'German', exact: true }),
+    ).toBeVisible();
 
-    await getMenuItem(page, 'German', { exact: true }).click();
+    await page.getByRole('menuitem', { name: 'German', exact: true }).click();
 
     await expect(editor.getByText('Hallo Welt')).toBeVisible();
   });
@@ -256,15 +269,23 @@ test.describe('Doc AI feature', () => {
       await page.getByRole('button', { name: 'AI', exact: true }).click();
 
       if (ai_transform) {
-        await expect(getMenuItem(page, 'Use as prompt')).toBeVisible();
+        await expect(
+          page.getByRole('menuitem', { name: 'Use as prompt' }),
+        ).toBeVisible();
       } else {
-        await expect(getMenuItem(page, 'Use as prompt')).toBeHidden();
+        await expect(
+          page.getByRole('menuitem', { name: 'Use as prompt' }),
+        ).toBeHidden();
       }
 
       if (ai_translate) {
-        await expect(getMenuItem(page, 'Language')).toBeVisible();
+        await expect(
+          page.getByRole('menuitem', { name: 'Language' }),
+        ).toBeVisible();
       } else {
-        await expect(getMenuItem(page, 'Language')).toBeHidden();
+        await expect(
+          page.getByRole('menuitem', { name: 'Language' }),
+        ).toBeHidden();
       }
     });
   });

src/frontend/apps/e2e/__tests__/app-impress/doc-comments.spec.ts

@@ -3,7 +3,6 @@ import { expect, test } from '@playwright/test';
 import {
   closeHeaderMenu,
   createDoc,
-  getMenuItem,
   getOtherBrowserName,
   verifyDocName,
 } from './utils-common';
@@ -131,12 +130,13 @@ test.describe('Doc Comments', () => {
     await thread.getByRole('paragraph').first().fill('This is a comment');
     await thread.locator('[data-test="save"]').click();
     await expect(thread.getByText('This is a comment').first()).toBeHidden();
+    await expect(editor.getByText('Hello')).toHaveClass('bn-thread-mark');
 
-    // Check background color changed
     await expect(editor.getByText('Hello')).toHaveCSS(
       'background-color',
-      'rgba(237, 180, 0, 0.4)',
+      'color(srgb 0.882353 0.831373 0.717647 / 0.4)',
     );
+
     await editor.first().click();
     await editor.getByText('Hello').click();
 
@@ -151,7 +151,7 @@ test.describe('Doc Comments', () => {
     // Edit Comment
     await thread.getByText('This is a comment').first().hover();
     await thread.locator('[data-test="moreactions"]').first().click();
-    await getMenuItem(thread, 'Edit comment').click();
+    await thread.getByRole('menuitem', { name: 'Edit comment' }).click();
     const commentEditor = thread.getByText('This is a comment').first();
     await commentEditor.fill('This is an edited comment');
     const saveBtn = thread.locator('button[data-test="save"]').first();
@@ -176,7 +176,7 @@ test.describe('Doc Comments', () => {
     // Delete second comment
     await thread.getByText('This is a second comment').first().hover();
     await thread.locator('[data-test="moreactions"]').first().click();
-    await getMenuItem(thread, 'Delete comment').click();
+    await thread.getByRole('menuitem', { name: 'Delete comment' }).click();
     await expect(
       thread.getByText('This is a second comment').first(),
     ).toBeHidden();
@@ -185,6 +185,7 @@ test.describe('Doc Comments', () => {
     await thread.getByText('This is an edited comment').first().hover();
     await thread.locator('[data-test="resolve"]').click();
     await expect(thread).toBeHidden();
+
     await expect(editor.getByText('Hello')).toHaveCSS(
       'background-color',
       'rgba(0, 0, 0, 0)',
@@ -196,18 +197,21 @@ test.describe('Doc Comments', () => {
 
     await thread.getByRole('paragraph').first().fill('This is a new comment');
     await thread.locator('[data-test="save"]').click();
+    await expect(editor.getByText('Hello')).toHaveClass('bn-thread-mark');
 
     await expect(editor.getByText('Hello')).toHaveCSS(
       'background-color',
-      'rgba(237, 180, 0, 0.4)',
+      'color(srgb 0.882353 0.831373 0.717647 / 0.4)',
     );
+
     await editor.first().click();
     await editor.getByText('Hello').click();
 
     await thread.getByText('This is a new comment').first().hover();
     await thread.locator('[data-test="moreactions"]').first().click();
-    await getMenuItem(thread, 'Delete comment').click();
+    await thread.getByRole('menuitem', { name: 'Delete comment' }).click();
 
+    await expect(editor.getByText('Hello')).not.toHaveClass('bn-thread-mark');
     await expect(editor.getByText('Hello')).toHaveCSS(
       'background-color',
       'rgba(0, 0, 0, 0)',
@@ -263,7 +267,7 @@ test.describe('Doc Comments', () => {
 
     await expect(otherEditor.getByText('Hello')).toHaveCSS(
       'background-color',
-      'rgba(237, 180, 0, 0.4)',
+      'color(srgb 0.882353 0.831373 0.717647 / 0.4)',
     );
 
     // We change the role of the second user to reader
@@ -298,7 +302,7 @@ test.describe('Doc Comments', () => {
 
     await expect(otherEditor.getByText('Hello')).toHaveCSS(
       'background-color',
-      'rgba(237, 180, 0, 0.4)',
+      'color(srgb 0.882353 0.831373 0.717647 / 0.4)',
     );
     await otherEditor.getByText('Hello').click();
     await expect(
@@ -344,7 +348,7 @@ test.describe('Doc Comments', () => {
 
     await expect(editor1.getByText('Document One')).toHaveCSS(
       'background-color',
-      'rgba(237, 180, 0, 0.4)',
+      'color(srgb 0.882353 0.831373 0.717647 / 0.4)',
     );
 
     await editor1.getByText('Document One').click();

src/frontend/apps/e2e/__tests__/app-impress/doc-editor.spec.ts

@@ -5,7 +5,6 @@ import cs from 'convert-stream';
 
 import {
   createDoc,
-  getMenuItem,
   goToGridDoc,
   overrideConfig,
   verifyDocName,
@@ -148,20 +147,18 @@ test.describe('Doc Editor', () => {
     const wsClosePromise = webSocket.waitForEvent('close');
 
     await selectVisibility.click();
-    await getMenuItem(page, 'Connected').click();
+    await page.getByRole('menuitemradio', { name: 'Connected' }).click();
 
     // Assert that the doc reconnects to the ws
     const wsClose = await wsClosePromise;
     expect(wsClose.isClosed()).toBeTruthy();
 
     // Check the ws is connected again
-    webSocketPromise = page.waitForEvent('websocket', (webSocket) => {
+    webSocket = await page.waitForEvent('websocket', (webSocket) => {
       return webSocket
         .url()
         .includes('ws://localhost:4444/collaboration/ws/?room=');
     });
-
-    webSocket = await webSocketPromise;
     framesentPromise = webSocket.waitForEvent('framesent');
     framesent = await framesentPromise;
     expect(framesent.payload).not.toBeNull();
@@ -578,12 +575,10 @@ test.describe('Doc Editor', () => {
 
     await page.reload();
 
-    responseCanEditPromise = page.waitForResponse(
+    responseCanEdit = await page.waitForResponse(
       (response) =>
         response.url().includes(`/can-edit/`) && response.status() === 200,
     );
-
-    responseCanEdit = await responseCanEditPromise;
     expect(responseCanEdit.ok()).toBeTruthy();
 
     jsonCanEdit = (await responseCanEdit.json()) as { can_edit: boolean };
@@ -609,7 +604,7 @@ test.describe('Doc Editor', () => {
     await page.getByRole('button', { name: 'Share' }).click();
 
     await page.getByTestId('doc-access-mode').click();
-    await getMenuItem(page, 'Reading').click();
+    await page.getByRole('menuitemradio', { name: 'Reading' }).click();
 
     // Close the modal
     await page.getByRole('button', { name: 'close' }).first().click();

src/frontend/apps/e2e/__tests__/app-impress/doc-grid-move.spec.ts

@@ -3,7 +3,6 @@ import { expect, test } from '@playwright/test';
 import {
   createDoc,
   getGridRow,
-  getMenuItem,
   getOtherBrowserName,
   mockedListDocs,
   toggleHeaderMenu,
@@ -207,7 +206,7 @@ test.describe('Doc grid move', () => {
     const row = await getGridRow(page, titleDoc1);
     await row.getByText(`more_horiz`).click();
 
-    await getMenuItem(page, 'Move into a doc').click();
+    await page.getByRole('menuitem', { name: 'Move into a doc' }).click();
 
     await expect(
       page.getByRole('dialog').getByRole('heading', { name: 'Move' }),
@@ -295,7 +294,7 @@ test.describe('Doc grid move', () => {
     const row = await getGridRow(page, titleDoc1);
     await row.getByText(`more_horiz`).click();
 
-    await getMenuItem(page, 'Move into a doc').click();
+    await page.getByRole('menuitem', { name: 'Move into a doc' }).click();
 
     await expect(
       page.getByRole('dialog').getByRole('heading', { name: 'Move' }),
@@ -342,7 +341,9 @@ test.describe('Doc grid move', () => {
       `doc-share-access-request-row-${emailRequest}`,
     );
     await container.getByTestId('doc-role-dropdown').click();
-    await getMenuItem(otherPage, 'Administrator').click();
+    await otherPage
+      .getByRole('menuitemradio', { name: 'Administrator' })
+      .click();
     await container.getByRole('button', { name: 'Approve' }).click();
 
     await expect(otherPage.getByText('Access Requests')).toBeHidden();
@@ -353,7 +354,7 @@ test.describe('Doc grid move', () => {
     await page.reload();
     await row.getByText(`more_horiz`).click();
 
-    await getMenuItem(page, 'Move into a doc').click();
+    await page.getByRole('menuitem', { name: 'Move into a doc' }).click();
 
     await expect(
       page.getByRole('dialog').getByRole('heading', { name: 'Move' }),

src/frontend/apps/e2e/__tests__/app-impress/doc-grid.spec.ts

@@ -1,11 +1,6 @@
 import { expect, test } from '@playwright/test';
 
-import {
+import { createDoc, getGridRow, verifyDocName } from './utils-common';
-  createDoc,
-  getGridRow,
-  getMenuItem,
-  verifyDocName,
-} from './utils-common';
 import { addNewMember, connectOtherUserToDoc } from './utils-share';
 
 type SmallDoc = {
@@ -104,7 +99,7 @@ test.describe('Document grid item options', () => {
     const row = await getGridRow(page, docTitle);
     await row.getByText(`more_horiz`).click();
 
-    await getMenuItem(page, 'Share').click();
+    await page.getByRole('menuitem', { name: 'Share' }).click();
 
     await expect(
       page.getByRole('dialog').getByText('Share the document'),
@@ -120,7 +115,7 @@ test.describe('Document grid item options', () => {
 
     // Pin
     await row.getByText(`more_horiz`).click();
-    await getMenuItem(page, 'Pin').click();
+    await page.getByRole('menuitem', { name: 'Pin' }).click();
 
     // Check is pinned
     await expect(row.getByTestId('doc-pinned-icon')).toBeVisible();
@@ -147,7 +142,7 @@ test.describe('Document grid item options', () => {
     const row = await getGridRow(page, docTitle);
     await row.getByText(`more_horiz`).click();
 
-    await getMenuItem(page, 'Delete').click();
+    await page.getByRole('menuitem', { name: 'Delete' }).click();
 
     await expect(
       page.getByRole('heading', { name: 'Delete a doc' }),

src/frontend/apps/e2e/__tests__/app-impress/doc-header.spec.ts

@@ -3,7 +3,6 @@ import { expect, test } from '@playwright/test';
 import {
   createDoc,
   getGridRow,
-  getMenuItem,
   goToGridDoc,
   mockedDocument,
   verifyDocName,
@@ -79,7 +78,7 @@ test.describe('Doc Header', () => {
 
     await page.getByTestId('doc-visibility').click();
 
-    await getMenuItem(page, 'Public').click();
+    await page.getByRole('menuitemradio', { name: 'Public' }).click();
 
     await page.getByRole('button', { name: 'close' }).first().click();
 
@@ -153,8 +152,10 @@ test.describe('Doc Header', () => {
 
     const emojiPicker = page.locator('.--docs--doc-title').getByRole('button');
     const optionMenu = page.getByLabel('Open the document options');
-    const addEmojiMenuItem = getMenuItem(page, 'Add emoji');
+    const addEmojiMenuItem = page.getByRole('menuitem', { name: 'Add emoji' });
-    const removeEmojiMenuItem = getMenuItem(page, 'Remove emoji');
+    const removeEmojiMenuItem = page.getByRole('menuitem', {
+      name: 'Remove emoji',
+    });
 
     // Top parent should not have emoji picker
     await expect(emojiPicker).toBeHidden();
@@ -208,7 +209,7 @@ test.describe('Doc Header', () => {
     const [randomDoc] = await createDoc(page, 'doc-delete', browserName, 1);
 
     await page.getByLabel('Open the document options').click();
-    await getMenuItem(page, 'Delete document').click();
+    await page.getByRole('menuitem', { name: 'Delete document' }).click();
 
     await expect(
       page.getByRole('heading', { name: 'Delete a doc' }),
@@ -236,7 +237,7 @@ test.describe('Doc Header', () => {
         hasText: randomDoc,
       });
 
-    expect(await row.count()).toBe(0);
+    await expect(row).toHaveCount(0);
   });
 
   test('it checks the options available if administrator', async ({ page }) => {
@@ -270,10 +271,12 @@ test.describe('Doc Header', () => {
 
     await page.getByLabel('Open the document options').click();
 
-    await expect(getMenuItem(page, 'Delete document')).toBeDisabled();
+    await expect(
+      page.getByRole('menuitem', { name: 'Delete document' }),
+    ).toBeDisabled();
 
     // Click somewhere else to close the options
-    await page.click('body', { position: { x: 0, y: 0 } });
+    await page.locator('body').click({ position: { x: 0, y: 0 } });
 
     await page.getByRole('button', { name: 'Share' }).click();
 
@@ -293,7 +296,7 @@ test.describe('Doc Header', () => {
 
     await invitationRole.click();
 
-    await getMenuItem(page, 'Remove access').click();
+    await page.getByRole('menuitemradio', { name: 'Remove access' }).click();
     await expect(invitationCard).toBeHidden();
 
     const memberCard = shareModal.getByLabel('List members card');
@@ -305,7 +308,9 @@ test.describe('Doc Header', () => {
     await expect(roles).toBeVisible();
 
     await roles.click();
-    await expect(getMenuItem(page, 'Remove access')).toBeEnabled();
+    await expect(
+      page.getByRole('menuitemradio', { name: 'Remove access' }),
+    ).toBeEnabled();
   });
 
   test('it checks the options available if editor', async ({ page }) => {
@@ -345,10 +350,12 @@ test.describe('Doc Header', () => {
     ).toBeVisible();
     await page.getByLabel('Open the document options').click();
 
-    await expect(getMenuItem(page, 'Delete document')).toBeDisabled();
+    await expect(
+      page.getByRole('menuitem', { name: 'Delete document' }),
+    ).toBeDisabled();
 
     // Click somewhere else to close the options
-    await page.click('body', { position: { x: 0, y: 0 } });
+    await page.locator('body').click({ position: { x: 0, y: 0 } });
 
     await page.getByRole('button', { name: 'Share' }).click();
 
@@ -415,10 +422,12 @@ test.describe('Doc Header', () => {
     ).toBeVisible();
     await page.getByLabel('Open the document options').click();
 
-    await expect(getMenuItem(page, 'Delete document')).toBeDisabled();
+    await expect(
+      page.getByRole('menuitem', { name: 'Delete document' }),
+    ).toBeDisabled();
 
     // Click somewhere else to close the options
-    await page.click('body', { position: { x: 0, y: 0 } });
+    await page.locator('body').click({ position: { x: 0, y: 0 } });
 
     await page.getByRole('button', { name: 'Share' }).click();
 
@@ -473,8 +482,10 @@ test.describe('Doc Header', () => {
 
     // Copy content to clipboard
     await page.getByLabel('Open the document options').click();
-    await getMenuItem(page, 'Copy as Markdown').click();
+    await page.getByRole('menuitem', { name: 'Copy as Markdown' }).click();
-    await expect(page.getByText('Copied to clipboard')).toBeVisible();
+    await expect(
+      page.getByText('Copied as Markdown to clipboard'),
+    ).toBeVisible();
 
     // Test that clipboard is in Markdown format
     const handle = await page.evaluateHandle(() =>
@@ -535,7 +546,7 @@ test.describe('Doc Header', () => {
       .click();
 
     // Pin
-    await getMenuItem(page, 'Pin').click();
+    await page.getByRole('menuitem', { name: 'Pin' }).click();
     await page
       .getByRole('button', { name: 'Open the document options' })
       .click();
@@ -556,11 +567,11 @@ test.describe('Doc Header', () => {
       .click();
 
     // Unpin
-    await getMenuItem(page, 'Unpin').click();
+    await page.getByRole('menuitem', { name: 'Unpin' }).click();
     await page
       .getByRole('button', { name: 'Open the document options' })
       .click();
-    await expect(getMenuItem(page, 'Pin')).toBeVisible();
+    await expect(page.getByRole('menuitem', { name: 'Pin' })).toBeVisible();
 
     await page.goto('/');
 
@@ -578,7 +589,7 @@ test.describe('Doc Header', () => {
 
     await page.getByLabel('Open the document options').click();
 
-    await getMenuItem(page, 'Duplicate').click();
+    await page.getByRole('menuitem', { name: 'Duplicate' }).click();
     await expect(
       page.getByText('Document duplicated successfully!'),
     ).toBeVisible();
@@ -593,7 +604,7 @@ test.describe('Doc Header', () => {
     await expect(row.getByText(duplicateTitle)).toBeVisible();
 
     await row.getByText(`more_horiz`).click();
-    await getMenuItem(page, 'Duplicate').click();
+    await page.getByRole('menuitem', { name: 'Duplicate' }).click();
     const duplicateDuplicateTitle = 'Copy of ' + duplicateTitle;
     await page.getByText(duplicateDuplicateTitle).click();
     await expect(page.getByText('Hello Duplicated World')).toBeVisible();
@@ -626,7 +637,7 @@ test.describe('Doc Header', () => {
 
     const currentUrl = page.url();
 
-    await getMenuItem(page, 'Duplicate').click();
+    await page.getByRole('menuitem', { name: 'Duplicate' }).click();
 
     await expect(page).not.toHaveURL(new RegExp(currentUrl));
 
@@ -665,8 +676,10 @@ test.describe('Documents Header mobile', () => {
 
     await expect(page.getByRole('button', { name: 'Copy link' })).toBeHidden();
     await page.getByLabel('Open the document options').click();
-    await expect(getMenuItem(page, 'Copy link')).toBeVisible();
+    await expect(
-    await getMenuItem(page, 'Share').click();
+      page.getByRole('menuitem', { name: 'Copy link' }),
+    ).toBeVisible();
+    await page.getByRole('menuitem', { name: 'Share' }).click();
     await expect(page.getByRole('button', { name: 'Copy link' })).toBeVisible();
   });
 
@@ -689,7 +702,7 @@ test.describe('Documents Header mobile', () => {
     await goToGridDoc(page);
 
     await page.getByLabel('Open the document options').click();
-    await getMenuItem(page, 'Share').click();
+    await page.getByRole('menuitem', { name: 'Share' }).click();
 
     const shareModal = page.getByRole('dialog', {
       name: 'Share the document',

src/frontend/apps/e2e/__tests__/app-impress/doc-import.spec.ts

@@ -177,5 +177,5 @@ const dragAndDropFiles = async (
     return dt;
   }, filesData);
 
-  await page.dispatchEvent(selector, 'drop', { dataTransfer });
+  await page.locator(selector).dispatchEvent('drop', { dataTransfer });
 };

src/frontend/apps/e2e/__tests__/app-impress/doc-inherited-share.spec.ts

@@ -1,6 +1,6 @@
 import { expect, test } from '@playwright/test';
 
-import { createDoc, getMenuItem, verifyDocName } from './utils-common';
+import { createDoc, verifyDocName } from './utils-common';
 import { updateShareLink } from './utils-share';
 import { createRootSubPage } from './utils-sub-pages';
 
@@ -53,17 +53,19 @@ test.describe('Inherited share accesses', () => {
     await expect(docVisibilityCard.getByText('Reading')).toBeVisible();
 
     await docVisibilityCard.getByText('Reading').click();
-    await getMenuItem(page, 'Editing').click();
+    await page.getByRole('menuitemradio', { name: 'Editing' }).click();
 
     await expect(docVisibilityCard.getByText('Reading')).toBeHidden();
     await expect(docVisibilityCard.getByText('Editing')).toBeVisible();
 
     // Verify inherited link
     await docVisibilityCard.getByText('Connected').click();
-    await expect(getMenuItem(page, 'Private')).toBeDisabled();
+    await expect(
+      page.getByRole('menuitemradio', { name: 'Private' }),
+    ).toBeDisabled();
 
     // Update child link
-    await getMenuItem(page, 'Public').click();
+    await page.getByRole('menuitemradio', { name: 'Public' }).click();
 
     await expect(docVisibilityCard.getByText('Connected')).toBeHidden();
     await expect(

src/frontend/apps/e2e/__tests__/app-impress/doc-member-create.spec.ts

@@ -3,7 +3,6 @@ import { expect, test } from '@playwright/test';
 import {
   BROWSERS,
   createDoc,
-  getMenuItem,
   keyCloakSignIn,
   randomName,
   verifyDocName,
@@ -17,6 +16,41 @@ test.describe('Document create member', () => {
     await page.goto('/');
   });
 
+  test('it checks search hints', async ({ page, browserName }) => {
+    await createDoc(page, 'select-multi-users', browserName, 1);
+
+    await page.getByRole('button', { name: 'Share' }).click();
+
+    const shareModal = page.getByLabel('Share the document');
+    await expect(shareModal.getByText('Document owner')).toBeVisible();
+
+    const inputSearch = page.getByTestId('quick-search-input');
+    await inputSearch.fill('u');
+    await expect(shareModal.getByText('Document owner')).toBeHidden();
+    await expect(
+      shareModal.getByText('Type at least 3 characters to display user names'),
+    ).toBeVisible();
+    await inputSearch.fill('user');
+    await expect(
+      shareModal.getByText('Type at least 3 characters to display user names'),
+    ).toBeHidden();
+    await expect(shareModal.getByText('Choose a user')).toBeVisible();
+    await inputSearch.fill('anything');
+    await expect(shareModal.getByText('Choose a user')).toBeHidden();
+    await expect(
+      shareModal.getByText(
+        'No results. Type a full email address to invite someone.',
+      ),
+    ).toBeVisible();
+    await inputSearch.fill('anything@test.com');
+    await expect(
+      shareModal.getByText(
+        'No results. Type a full email address to invite someone.',
+      ),
+    ).toBeHidden();
+    await expect(shareModal.getByText('Choose the email')).toBeVisible();
+  });
+
   test('it selects 2 users and 1 invitation', async ({ page, browserName }) => {
     const inputFill = 'user.test';
     const responsePromise = page.waitForResponse(
@@ -76,13 +110,21 @@ test.describe('Document create member', () => {
 
     // Check roles are displayed
     await list.getByTestId('doc-role-dropdown').click();
-    await expect(getMenuItem(page, 'Reader')).toBeVisible();
+    await expect(
-    await expect(getMenuItem(page, 'Editor')).toBeVisible();
+      page.getByRole('menuitemradio', { name: 'Reader' }),
-    await expect(getMenuItem(page, 'Owner')).toBeVisible();
+    ).toBeVisible();
-    await expect(getMenuItem(page, 'Administrator')).toBeVisible();
+    await expect(
+      page.getByRole('menuitemradio', { name: 'Editor' }),
+    ).toBeVisible();
+    await expect(
+      page.getByRole('menuitemradio', { name: 'Owner' }),
+    ).toBeVisible();
+    await expect(
+      page.getByRole('menuitemradio', { name: 'Administrator' }),
+    ).toBeVisible();
 
     // Validate
-    await getMenuItem(page, 'Administrator').click();
+    await page.getByRole('menuitemradio', { name: 'Administrator' }).click();
     await page.getByTestId('doc-share-invite-button').click();
 
     // Check invitation added
@@ -128,7 +170,7 @@ test.describe('Document create member', () => {
     // Choose a role
     const container = page.getByTestId('doc-share-add-member-list');
     await container.getByTestId('doc-role-dropdown').click();
-    await getMenuItem(page, 'Owner').click();
+    await page.getByRole('menuitemradio', { name: 'Owner' }).click();
 
     const responsePromiseCreateInvitation = page.waitForResponse(
       (response) =>
@@ -146,7 +188,7 @@ test.describe('Document create member', () => {
 
     // Choose a role
     await container.getByTestId('doc-role-dropdown').click();
-    await getMenuItem(page, 'Owner').click();
+    await page.getByRole('menuitemradio', { name: 'Owner' }).click();
 
     const responsePromiseCreateInvitationFail = page.waitForResponse(
       (response) =>
@@ -183,7 +225,7 @@ test.describe('Document create member', () => {
     // Choose a role
     const container = page.getByTestId('doc-share-add-member-list');
     await container.getByTestId('doc-role-dropdown').click();
-    await getMenuItem(page, 'Administrator').click();
+    await page.getByRole('menuitemradio', { name: 'Administrator' }).click();
 
     const responsePromiseCreateInvitation = page.waitForResponse(
       (response) =>
@@ -210,13 +252,13 @@ test.describe('Document create member', () => {
     );
 
     await userInvitation.getByTestId('doc-role-dropdown').click();
-    await getMenuItem(page, 'Reader').click();
+    await page.getByRole('menuitemradio', { name: 'Reader' }).click();
 
     const responsePatchInvitation = await responsePromisePatchInvitation;
     expect(responsePatchInvitation.ok()).toBeTruthy();
 
     await userInvitation.getByTestId('doc-role-dropdown').click();
-    await getMenuItem(page, 'Remove access').click();
+    await page.getByRole('menuitemradio', { name: 'Remove access' }).click();
 
     await expect(userInvitation).toBeHidden();
   });
@@ -268,7 +310,7 @@ test.describe('Document create member', () => {
       `doc-share-access-request-row-${emailRequest}`,
     );
     await container.getByTestId('doc-role-dropdown').click();
-    await getMenuItem(page, 'Administrator').click();
+    await page.getByRole('menuitemradio', { name: 'Administrator' }).click();
     await container.getByRole('button', { name: 'Approve' }).click();
 
     await expect(page.getByText('Access Requests')).toBeHidden();

src/frontend/apps/e2e/__tests__/app-impress/doc-member-list.spec.ts

@@ -1,6 +1,6 @@
 import { expect, test } from '@playwright/test';
 
-import { createDoc, getMenuItem, verifyDocName } from './utils-common';
+import { createDoc, verifyDocName } from './utils-common';
 import { addNewMember } from './utils-share';
 
 test.beforeEach(async ({ page }) => {
@@ -160,7 +160,9 @@ test.describe('Document list members', () => {
       `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.`,
     );
     await expect(soloOwner).toBeVisible();
-    await expect(getMenuItem(page, 'Administrator')).toBeDisabled();
+    await expect(
+      page.getByRole('menuitemradio', { name: 'Administrator' }),
+    ).toBeDisabled();
 
     await list.click({
       force: true, // Force click to close the dropdown
@@ -183,18 +185,20 @@ test.describe('Document list members', () => {
     });
 
     await currentUserRole.click();
-    await getMenuItem(page, 'Administrator').click();
+    await page.getByRole('menuitemradio', { name: 'Administrator' }).click();
     await list.click();
     await expect(currentUserRole).toBeVisible();
 
     await newUserRoles.click();
-    await expect(getMenuItem(page, 'Owner')).toBeDisabled();
+    await expect(
+      page.getByRole('menuitemradio', { name: 'Owner' }),
+    ).toBeDisabled();
     await list.click({
       force: true, // Force click to close the dropdown
     });
 
     await currentUserRole.click();
-    await getMenuItem(page, 'Reader').click();
+    await page.getByRole('menuitemradio', { name: 'Reader' }).click();
     await list.click({
       force: true, // Force click to close the dropdown
     });
@@ -234,11 +238,11 @@ test.describe('Document list members', () => {
     await expect(userReader).toBeVisible();
 
     await userReaderRole.click();
-    await getMenuItem(page, 'Remove access').click();
+    await page.getByRole('menuitemradio', { name: 'Remove access' }).click();
     await expect(userReader).toBeHidden();
 
     await mySelfRole.click();
-    await getMenuItem(page, 'Remove access').click();
+    await page.getByRole('menuitemradio', { name: 'Remove access' }).click();
     await expect(
       page.getByText('Insufficient access rights to view the document.'),
     ).toBeVisible();

src/frontend/apps/e2e/__tests__/app-impress/doc-search.spec.ts

@@ -1,6 +1,6 @@
 import { expect, test } from '@playwright/test';
 
-import { createDoc, getMenuItem, verifyDocName } from './utils-common';
+import { createDoc, verifyDocName } from './utils-common';
 import { createRootSubPage } from './utils-sub-pages';
 
 test.beforeEach(async ({ page }) => {
@@ -29,7 +29,7 @@ test.describe('Document search', () => {
     await page.getByTestId('search-docs-button').click();
 
     await expect(
-      page.getByRole('img', { name: 'No active search' }),
+      page.getByLabel('Search modal').locator('img[alt=""]'),
     ).toBeVisible();
 
     await expect(
@@ -107,7 +107,7 @@ test.describe('Document search', () => {
 
     await searchButton.click();
     await expect(
-      page.getByRole('combobox', { name: 'Quick search input' }),
+      page.getByRole('combobox', { name: 'Search documents' }),
     ).toBeVisible();
     await expect(filters).toBeHidden();
 
@@ -120,7 +120,7 @@ test.describe('Document search', () => {
 
     await searchButton.click();
     await expect(
-      page.getByRole('combobox', { name: 'Quick search input' }),
+      page.getByRole('combobox', { name: 'Search documents' }),
     ).toBeVisible();
     await expect(filters).toBeHidden();
 
@@ -136,9 +136,13 @@ test.describe('Document search', () => {
 
     await filters.click();
     await filters.getByRole('button', { name: 'Current doc' }).click();
-    await expect(getMenuItem(page, 'All docs')).toBeVisible();
+    await expect(
-    await expect(getMenuItem(page, 'Current doc')).toBeVisible();
+      page.getByRole('menuitemcheckbox', { name: 'All docs' }),
-    await getMenuItem(page, 'All docs').click();
+    ).toBeVisible();
+    await expect(
+      page.getByRole('menuitemcheckbox', { name: 'Current doc' }),
+    ).toBeVisible();
+    await page.getByRole('menuitemcheckbox', { name: 'All docs' }).click();
 
     await expect(page.getByRole('button', { name: 'Reset' })).toBeVisible();
   });
@@ -164,9 +168,9 @@ test.describe('Document search', () => {
     const searchButton = page.getByTestId('search-docs-button');
 
     await searchButton.click();
-    await page.getByRole('combobox', { name: 'Quick search input' }).click();
+    await page.getByRole('combobox', { name: 'Search documents' }).click();
     await page
-      .getByRole('combobox', { name: 'Quick search input' })
+      .getByRole('combobox', { name: 'Search documents' })
       .fill('sub page search');
 
     // Expect to find the first and second docs in the results list
@@ -188,7 +192,7 @@ test.describe('Document search', () => {
     );
     await searchButton.click();
     await page
-      .getByRole('combobox', { name: 'Quick search input' })
+      .getByRole('combobox', { name: 'Search documents' })
       .fill('second');
 
     // Now there is a sub page - expect to have the focus on the current doc

src/frontend/apps/e2e/__tests__/app-impress/doc-table-content.spec.ts

@@ -19,7 +19,9 @@ test.describe('Doc Table Content', () => {
 
     await page.locator('.ProseMirror').click();
 
-    await expect(page.getByRole('button', { name: 'Summary' })).toBeHidden();
+    await expect(
+      page.getByRole('button', { name: 'Show the table of contents' }),
+    ).toBeHidden();
 
     await page.keyboard.type('# Level 1\n## Level 2\n### Level 3');
 

src/frontend/apps/e2e/__tests__/app-impress/doc-tree.spec.ts

@@ -3,7 +3,6 @@ import { expect, test } from '@playwright/test';
 import {
   createDoc,
   expectLoginPage,
-  getMenuItem,
   keyCloakSignIn,
   updateDocTitle,
   verifyDocName,
@@ -43,15 +42,12 @@ test.describe('Doc Tree', () => {
     await expect(secondSubPageItem).toBeVisible();
 
     // Check the position of the sub pages
-    const allSubPageItems = await docTree
+    const allSubPageItems = docTree.getByTestId(/^doc-sub-page-item/);
-      .getByTestId(/^doc-sub-page-item/)
+    await expect(allSubPageItems).toHaveCount(2);
-      .all();
-
-    expect(allSubPageItems.length).toBe(2);
 
     // Check that elements are in the correct order
-    await expect(allSubPageItems[0].getByText('first move')).toBeVisible();
+    await expect(allSubPageItems.nth(0).getByText('first move')).toBeVisible();
-    await expect(allSubPageItems[1].getByText('second move')).toBeVisible();
+    await expect(allSubPageItems.nth(1).getByText('second move')).toBeVisible();
 
     // Will move the first sub page to the second position
     const firstSubPageBoundingBox = await firstSubPageItem.boundingBox();
@@ -91,17 +87,15 @@ test.describe('Doc Tree', () => {
     await expect(secondSubPageItem).toBeVisible();
 
     // Check that elements are in the correct order
-    const allSubPageItemsAfterReload = await docTree
+    const allSubPageItemsAfterReload =
-      .getByTestId(/^doc-sub-page-item/)
+      docTree.getByTestId(/^doc-sub-page-item/);
-      .all();
+    await expect(allSubPageItemsAfterReload).toHaveCount(2);
-
-    expect(allSubPageItemsAfterReload.length).toBe(2);
 
     await expect(
-      allSubPageItemsAfterReload[0].getByText('second move'),
+      allSubPageItemsAfterReload.nth(0).getByText('second move'),
     ).toBeVisible();
     await expect(
-      allSubPageItemsAfterReload[1].getByText('first move'),
+      allSubPageItemsAfterReload.nth(1).getByText('first move'),
     ).toBeVisible();
   });
 
@@ -163,7 +157,7 @@ test.describe('Doc Tree', () => {
     );
     const currentUserRole = currentUser.getByTestId('doc-role-dropdown');
     await currentUserRole.click();
-    await getMenuItem(page, 'Administrator').click();
+    await page.getByRole('menuitemradio', { name: 'Administrator' }).click();
     await list.click();
 
     await page.getByRole('button', { name: 'Ok' }).click();
@@ -193,10 +187,9 @@ test.describe('Doc Tree', () => {
     const menu = child.getByText(`more_horiz`);
     await menu.click();
 
-    await expect(getMenuItem(page, 'Move to my docs')).toHaveAttribute(
+    await expect(
-      'aria-disabled',
+      page.getByRole('menuitem', { name: 'Move to my docs' }),
-      'true',
+    ).toHaveAttribute('aria-disabled', 'true');
-    );
   });
 
   test('keyboard navigation with Enter key opens documents', async ({
@@ -299,7 +292,7 @@ test.describe('Doc Tree', () => {
 
     await page.keyboard.press('Tab');
 
-    await expect(page.getByLabel('Open onboarding menu')).toBeFocused();
+    await expect(page.getByLabel('Open help menu')).toBeFocused();
 
     await page.keyboard.press('Tab');
 
@@ -309,7 +302,7 @@ test.describe('Doc Tree', () => {
 
     await page.keyboard.press('Shift+Tab');
 
-    await expect(page.getByLabel('Open onboarding menu')).toBeFocused();
+    await expect(page.getByLabel('Open help menu')).toBeFocused();
 
     await page.keyboard.press('Shift+Tab');
 
@@ -340,7 +333,9 @@ test.describe('Doc Tree', () => {
     await row.hover();
     const menu = row.getByText(`more_horiz`);
     await menu.click();
-    await expect(getMenuItem(page, 'Remove emoji')).toBeHidden();
+    await expect(
+      page.getByRole('menuitem', { name: 'Remove emoji' }),
+    ).toBeHidden();
 
     // Close the menu
     await page.keyboard.press('Escape');
@@ -360,7 +355,7 @@ test.describe('Doc Tree', () => {
     // Now remove the emoji using the new action
     await row.hover();
     await menu.click();
-    await getMenuItem(page, 'Remove emoji').click();
+    await page.getByRole('menuitem', { name: 'Remove emoji' }).click();
 
     await expect(row.getByText('😀')).toBeHidden();
     await expect(titleEmojiPicker).toBeHidden();
@@ -390,7 +385,7 @@ test.describe('Doc Tree: Inheritance', () => {
     const selectVisibility = page.getByTestId('doc-visibility');
     await selectVisibility.click();
 
-    await getMenuItem(page, 'Public').click();
+    await page.getByRole('menuitemradio', { name: 'Public' }).click();
 
     await expect(
       page.getByText('The document visibility has been updated.'),

src/frontend/apps/e2e/__tests__/app-impress/doc-version.spec.ts

@@ -2,7 +2,6 @@ import { expect, test } from '@playwright/test';
 
 import {
   createDoc,
-  getMenuItem,
   goToGridDoc,
   mockedDocument,
   verifyDocName,
@@ -21,11 +20,11 @@ test.describe('Doc Version', () => {
 
     // Initially, there is no version
     await page.getByLabel('Open the document options').click();
-    await getMenuItem(page, 'Version history').click();
+    await page.getByRole('menuitem', { name: 'Version history' }).click();
     await expect(page.getByText('History', { exact: true })).toBeVisible();
 
     const modal = page.getByRole('dialog', { name: 'Version history' });
-    const panel = modal.getByLabel('version list');
+    const panel = modal.getByLabel('Version list');
     await expect(panel).toBeVisible();
     await expect(modal.getByText('No versions')).toBeVisible();
 
@@ -75,14 +74,14 @@ test.describe('Doc Version', () => {
     ).toBeVisible();
 
     await page.getByLabel('Open the document options').click();
-    await getMenuItem(page, 'Version history').click();
+    await page.getByRole('menuitem', { name: 'Version history' }).click();
 
     await expect(panel).toBeVisible();
     await expect(page.getByText('History', { exact: true })).toBeVisible();
     await expect(page.getByRole('status')).toBeHidden();
-    const items = await panel.locator('.version-item').all();
+    const items = panel.locator('.version-item');
-    expect(items.length).toBe(2);
+    await expect(items).toHaveCount(2);
-    await items[1].click();
+    await items.nth(1).click();
 
     await expect(modal.getByText('Hello World')).toBeVisible();
     await expect(modal.getByText('It will create a version')).toBeHidden();
@@ -90,7 +89,7 @@ test.describe('Doc Version', () => {
       modal.locator('div[data-content-type="callout"]').first(),
     ).toBeHidden();
 
-    await items[0].click();
+    await items.nth(0).click();
 
     await expect(modal.getByText('Hello World')).toBeVisible();
     await expect(modal.getByText('It will create a version')).toBeVisible();
@@ -101,7 +100,7 @@ test.describe('Doc Version', () => {
       modal.getByText('It will create a second version'),
     ).toBeHidden();
 
-    await items[1].click();
+    await items.nth(1).click();
 
     await expect(modal.getByText('Hello World')).toBeVisible();
     await expect(modal.getByText('It will create a version')).toBeHidden();
@@ -125,7 +124,9 @@ test.describe('Doc Version', () => {
     await verifyDocName(page, 'Mocked document');
 
     await page.getByLabel('Open the document options').click();
-    await expect(getMenuItem(page, 'Version history')).toBeDisabled();
+    await expect(
+      page.getByRole('menuitem', { name: 'Version history' }),
+    ).toBeDisabled();
   });
 
   test('it restores the doc version', async ({ page, browserName }) => {
@@ -152,23 +153,28 @@ test.describe('Doc Version', () => {
     await expect(page.getByText('World')).toBeVisible();
 
     await page.getByLabel('Open the document options').click();
-    await getMenuItem(page, 'Version history').click();
+    await page.getByRole('menuitem', { name: 'Version history' }).click();
 
     const modal = page.getByRole('dialog', { name: 'Version history' });
-    const panel = modal.getByLabel('version list');
+    const panel = modal.getByLabel('Version list');
     await expect(panel).toBeVisible();
 
     await expect(page.getByText('History', { exact: true })).toBeVisible();
-    await panel.getByRole('button', { name: 'version item' }).click();
+    await panel.locator('.version-item').first().click();
 
     await expect(modal.getByText('World')).toBeHidden();
 
-    await page.getByRole('button', { name: 'Restore' }).click();
+    await page.getByRole('button', { name: 'Restore', exact: true }).click();
-    await expect(page.getByText('Your current document will')).toBeVisible();
+    await expect(
-    await page.getByText('If a member is editing, his').click();
+      page.getByText(
+        "The current document will be replaced, but you'll still find it in the version history.",
+      ),
+    ).toBeVisible();
 
     await page.getByLabel('Restore', { exact: true }).click();
 
+    await page.waitForTimeout(500);
+
     await expect(page.getByText('Hello')).toBeVisible();
     await expect(page.getByText('World')).toBeHidden();
   });

src/frontend/apps/e2e/__tests__/app-impress/doc-visibility.spec.ts

@@ -4,7 +4,6 @@ import {
   BROWSERS,
   createDoc,
   expectLoginPage,
-  getMenuItem,
   keyCloakSignIn,
   verifyDocName,
 } from './utils-common';
@@ -47,17 +46,21 @@ test.describe('Doc Visibility', () => {
 
     await expect(selectVisibility.getByText('Private')).toBeVisible();
 
-    await expect(getMenuItem(page, 'Read only')).toBeHidden();
+    await expect(
-    await expect(getMenuItem(page, 'Can read and edit')).toBeHidden();
+      page.getByRole('menuitemradio', { name: 'Read only' }),
+    ).toBeHidden();
+    await expect(
+      page.getByRole('menuitemradio', { name: 'Can read and edit' }),
+    ).toBeHidden();
 
     await selectVisibility.click();
-    await getMenuItem(page, 'Connected').click();
+    await page.getByRole('menuitemradio', { name: 'Connected' }).click();
 
     await expect(page.getByTestId('doc-access-mode')).toBeVisible();
 
     await selectVisibility.click();
 
-    await getMenuItem(page, 'Public').click();
+    await page.getByRole('menuitemradio', { name: 'Public' }).click();
 
     await expect(page.getByTestId('doc-access-mode')).toBeVisible();
   });
@@ -202,7 +205,7 @@ test.describe('Doc Visibility: Public', () => {
     const selectVisibility = page.getByTestId('doc-visibility');
     await selectVisibility.click();
 
-    await getMenuItem(page, 'Public').click();
+    await page.getByRole('menuitemradio', { name: 'Public' }).click();
 
     await expect(
       page.getByText('The document visibility has been updated.'),
@@ -210,7 +213,7 @@ test.describe('Doc Visibility: Public', () => {
 
     await expect(page.getByTestId('doc-access-mode')).toBeVisible();
     await page.getByTestId('doc-access-mode').click();
-    await getMenuItem(page, 'Reading').click();
+    await page.getByRole('menuitemradio', { name: 'Reading' }).click();
 
     await expect(
       page.getByText('The document visibility has been updated.').first(),
@@ -296,14 +299,14 @@ test.describe('Doc Visibility: Public', () => {
     const selectVisibility = page.getByTestId('doc-visibility');
     await selectVisibility.click();
 
-    await getMenuItem(page, 'Public').click();
+    await page.getByRole('menuitemradio', { name: 'Public' }).click();
 
     await expect(
       page.getByText('The document visibility has been updated.'),
     ).toBeVisible();
 
     await page.getByTestId('doc-access-mode').click();
-    await getMenuItem(page, 'Editing').click();
+    await page.getByRole('menuitemradio', { name: 'Editing' }).click();
 
     await expect(
       page.getByText('The document visibility has been updated.').first(),
@@ -387,7 +390,7 @@ test.describe('Doc Visibility: Authenticated', () => {
     await page.getByRole('button', { name: 'Share' }).click();
     const selectVisibility = page.getByTestId('doc-visibility');
     await selectVisibility.click();
-    await getMenuItem(page, 'Connected').click();
+    await page.getByRole('menuitemradio', { name: 'Connected' }).click();
 
     await expect(
       page.getByText('The document visibility has been updated.'),
@@ -435,7 +438,7 @@ test.describe('Doc Visibility: Authenticated', () => {
     await page.getByRole('button', { name: 'Share' }).click();
     const selectVisibility = page.getByTestId('doc-visibility');
     await selectVisibility.click();
-    await getMenuItem(page, 'Connected').click();
+    await page.getByRole('menuitemradio', { name: 'Connected' }).click();
 
     await expect(
       page.getByText('The document visibility has been updated.'),
@@ -533,7 +536,7 @@ test.describe('Doc Visibility: Authenticated', () => {
     await page.getByRole('button', { name: 'Share' }).click();
     const selectVisibility = page.getByTestId('doc-visibility');
     await selectVisibility.click();
-    await getMenuItem(page, 'Connected').click();
+    await page.getByRole('menuitemradio', { name: 'Connected' }).click();
 
     await expect(
       page.getByText('The document visibility has been updated.'),
@@ -541,7 +544,7 @@ test.describe('Doc Visibility: Authenticated', () => {
 
     const urlDoc = page.url();
     await page.getByTestId('doc-access-mode').click();
-    await getMenuItem(page, 'Editing').click();
+    await page.getByRole('menuitemradio', { name: 'Editing' }).click();
 
     await expect(
       page.getByText('The document visibility has been updated.').first(),

src/frontend/apps/e2e/__tests__/app-impress/footer.spec.ts

@@ -1,6 +1,6 @@
 import { expect, test } from '@playwright/test';
 
-import { getMenuItem, overrideConfig } from './utils-common';
+import { overrideConfig } from './utils-common';
 
 test.describe('Footer', () => {
   test.use({ storageState: { cookies: [], origins: [] } });
@@ -47,7 +47,7 @@ test.describe('Footer', () => {
     // Check the translation
     const header = page.locator('header').first();
     await header.getByRole('button').getByText('English').click();
-    await getMenuItem(page, 'Français').click();
+    await page.getByRole('menuitemradio', { name: 'Français' }).click();
 
     await expect(
       page.locator('footer').getByText('Mentions légales'),
@@ -131,7 +131,7 @@ test.describe('Footer', () => {
     // Check the translation
     const header = page.locator('header').first();
     await header.getByRole('button').getByText('English').click();
-    await getMenuItem(page, 'Français').click();
+    await page.getByRole('menuitemradio', { name: 'Français' }).click();
 
     await expect(
       page

src/frontend/apps/e2e/__tests__/app-impress/header.spec.ts

@@ -191,25 +191,27 @@ test.describe('Header: Override configuration', () => {
 });
 
 test.describe('Header: Skip to Content', () => {
-  test('it displays skip link on first TAB and focuses main content on click', async ({
+  test('it displays skip link on first TAB and focuses page heading on click', async ({
     page,
   }) => {
     await page.goto('/');
 
-    // Wait for skip button to be mounted (client-side only component)
+    // Wait for skip link to be mounted (client-side only component)
-    const skipButton = page.getByRole('button', { name: 'Go to content' });
+    const skipLink = page.getByRole('link', { name: 'Go to content' });
-    await skipButton.waitFor({ state: 'attached' });
+    await skipLink.waitFor({ state: 'attached' });
 
-    // First TAB shows the skip button
+    // First TAB shows the skip link
     await page.keyboard.press('Tab');
 
-    // The skip button should be visible and focused
+    // The skip link should be visible and focused
-    await expect(skipButton).toBeFocused();
+    await expect(skipLink).toBeFocused();
-    await expect(skipButton).toBeVisible();
+    await expect(skipLink).toBeVisible();
-
+    // Clicking moves focus to the page heading
-    // Clicking moves focus to the main content
+    await skipLink.click();
-    await skipButton.click();
+    const pageHeading = page.getByRole('heading', {
-    const mainContent = page.locator('main#mainContent');
+      name: 'All docs',
-    await expect(mainContent).toBeFocused();
+      level: 2,
+    });
+    await expect(pageHeading).toBeFocused();
   });
 });

src/frontend/apps/e2e/__tests__/app-impress/help.spec.ts

@@ -2,7 +2,6 @@ import { expect, test } from '@playwright/test';
 
 import {
   TestLanguage,
-  getMenuItem,
   overrideConfig,
   waitForLanguageSwitch,
 } from './utils-common';
@@ -27,7 +26,7 @@ test.describe('Help feature', () => {
       await expect(page.getByRole('button', { name: 'New doc' })).toBeVisible();
 
       await expect(
-        page.getByRole('button', { name: 'Open onboarding menu' }),
+        page.getByRole('button', { name: 'Open help menu' }),
       ).toBeHidden();
     });
 
@@ -43,9 +42,9 @@ test.describe('Help feature', () => {
         },
       });
 
-      await page.getByRole('button', { name: 'Open onboarding menu' }).click();
+      await page.getByRole('button', { name: 'Open help menu' }).click();
 
-      await getMenuItem(page, 'Onboarding').click();
+      await page.getByRole('menuitem', { name: 'Onboarding' }).click();
 
       const modal = page.getByTestId('onboarding-modal');
       await expect(modal).toBeVisible();
@@ -87,8 +86,8 @@ test.describe('Help feature', () => {
     });
 
     test('closes modal with Skip button', async ({ page }) => {
-      await page.getByRole('button', { name: 'Open onboarding menu' }).click();
+      await page.getByRole('button', { name: 'Open help menu' }).click();
-      await getMenuItem(page, 'Onboarding').click();
+      await page.getByRole('menuitem', { name: 'Onboarding' }).click();
 
       const modal = page.getByTestId('onboarding-modal');
       await expect(modal).toBeVisible();
@@ -107,11 +106,9 @@ test.describe('Help feature', () => {
       // switch to french
       await waitForLanguageSwitch(page, TestLanguage.French);
 
-      await page
+      await page.getByRole('button', { name: "Ouvrir le menu d'aide" }).click();
-        .getByRole('button', { name: "Ouvrir le menu d'embarquement" })
-        .click();
 
-      await getMenuItem(page, 'Premiers pas').click();
+      await page.getByRole('menuitem', { name: 'Premiers pas' }).click();
 
       const modal = page.getByLabel('Apprenez les principes fondamentaux');
 

src/frontend/apps/e2e/__tests__/app-impress/language.spec.ts

@@ -75,7 +75,7 @@ test.describe('Language', () => {
 
     await expect(page.locator('[role="menu"]')).toBeVisible();
 
-    const menuItems = page.locator('[role="menuitem"], [role="menuitemradio"]');
+    const menuItems = page.locator('[role="menuitemradio"]');
     await expect(menuItems.first()).toBeVisible();
 
     await menuItems.first().click();

src/frontend/apps/e2e/__tests__/app-impress/left-panel.spec.ts

@@ -1,6 +1,7 @@
 import { expect, test } from '@playwright/test';
 
 import { createDoc, goToGridDoc, verifyDocName } from './utils-common';
+import { createRootSubPage } from './utils-sub-pages';
 
 test.describe('Left panel desktop', () => {
   test.beforeEach(async ({ page }) => {
@@ -18,7 +19,7 @@ test.describe('Left panel desktop', () => {
     await expect(page.getByTestId('home-button')).toBeVisible();
   });
 
-  test('focuses main content after switching the docs filter', async ({
+  test('focuses page heading after switching the docs filter', async ({
     page,
   }) => {
     await page.goto('/');
@@ -28,8 +29,11 @@ test.describe('Left panel desktop', () => {
     await page.keyboard.press('Enter');
     await expect(page).toHaveURL(/target=my_docs/);
 
-    const mainContent = page.locator('main#mainContent');
+    const pageHeading = page.getByRole('heading', {
-    await expect(mainContent).toBeFocused();
+      name: 'My docs',
+      level: 2,
+    });
+    await expect(pageHeading).toBeFocused();
   });
 
   test('checks resize handle is present and functional on document page', async ({
@@ -118,6 +122,47 @@ test.describe('Left panel mobile', () => {
     await expect(logoutButton).toBeInViewport();
   });
 
+  test('checks panel closes when clicking on a subdoc', async ({
+    page,
+    browserName,
+  }) => {
+    const [docTitle] = await createDoc(
+      page,
+      'mobile-doc-test',
+      browserName,
+      1,
+      true,
+    );
+
+    const { name: docChild } = await createRootSubPage(
+      page,
+      browserName,
+      'mobile-doc-test-child',
+      true,
+    );
+
+    const { name: docChild2 } = await createRootSubPage(
+      page,
+      browserName,
+      'mobile-doc-test-child-2',
+      true,
+    );
+
+    const header = page.locator('header').first();
+    await header.getByLabel('Open the header menu').click();
+
+    await expect(page.getByTestId('left-panel-mobile')).toBeInViewport();
+
+    const docTree = page.getByTestId('doc-tree');
+    await expect(docTree.getByText(docTitle)).toBeVisible();
+    await expect(docTree.getByText(docChild)).toBeVisible();
+    await expect(docTree.getByText(docChild2)).toBeVisible();
+
+    await docTree.getByText(docChild).click();
+    await verifyDocName(page, docChild);
+    await expect(page.getByTestId('left-panel-mobile')).not.toBeInViewport();
+  });
+
   test('checks resize handle is not present on mobile', async ({ page }) => {
     await page.goto('/');
 

src/frontend/apps/e2e/__tests__/app-impress/utils-common.ts

@@ -3,16 +3,6 @@ import path from 'path';
 
 import { Locator, Page, TestInfo, expect } from '@playwright/test';
 
-/** Returns a locator for a menu item (handles both menuitem and menuitemradio roles) */
-export const getMenuItem = (
-  context: Page | Locator,
-  name: string,
-  options?: { exact?: boolean },
-): Locator =>
-  context
-    .getByRole('menuitem', { name, exact: options?.exact })
-    .or(context.getByRole('menuitemradio', { name, exact: options?.exact }));
-
 import theme_customization from '../../../../../backend/impress/configuration/theme/default.json';
 
 export type BrowserName = 'chromium' | 'firefox' | 'webkit';
@@ -392,12 +382,12 @@ export async function waitForLanguageSwitch(
 
   await languagePicker.click();
 
-  await getMenuItem(page, lang.label).click();
+  await page.getByRole('menuitemradio', { name: lang.label }).click();
 }
 
 export const clickInEditorMenu = async (page: Page, textButton: string) => {
   await page.getByRole('button', { name: 'Open the document options' }).click();
-  await getMenuItem(page, textButton).click();
+  await page.getByRole('menuitem', { name: textButton }).click();
 };
 
 export const clickInGridMenu = async (
@@ -408,7 +398,7 @@ export const clickInGridMenu = async (
   await row
     .getByRole('button', { name: /Open the menu of actions for the document/ })
     .click();
-  await getMenuItem(page, textButton).click();
+  await page.getByRole('menuitem', { name: textButton }).click();
 };
 
 export const writeReport = async (

src/frontend/apps/e2e/__tests__/app-impress/utils-share.ts

@@ -2,7 +2,6 @@ import { Page, chromium, expect } from '@playwright/test';
 
 import {
   BrowserName,
-  getMenuItem,
   getOtherBrowserName,
   keyCloakSignIn,
   verifyDocName,
@@ -40,7 +39,7 @@ export const addNewMember = async (
 
   // Choose a role
   await page.getByTestId('doc-role-dropdown').click();
-  await getMenuItem(page, role).click();
+  await page.getByRole('menuitemradio', { name: role }).click();
   await page.getByTestId('doc-share-invite-button').click();
 
   return users[index].email;
@@ -52,7 +51,7 @@ export const updateShareLink = async (
   linkRole?: LinkRole | null,
 ) => {
   await page.getByTestId('doc-visibility').click();
-  await getMenuItem(page, linkReach).click();
+  await page.getByRole('menuitemradio', { name: linkReach }).click();
 
   const visibilityUpdatedText = page
     .getByText('The document visibility has been updated')
@@ -62,7 +61,7 @@ export const updateShareLink = async (
 
   if (linkRole) {
     await page.getByTestId('doc-access-mode').click();
-    await getMenuItem(page, linkRole).click();
+    await page.getByRole('menuitemradio', { name: linkRole }).click();
     await expect(visibilityUpdatedText).toBeVisible();
   }
 };
@@ -77,7 +76,7 @@ export const updateRoleUser = async (
   const currentUser = list.getByTestId(`doc-share-member-row-${email}`);
   const currentUserRole = currentUser.getByTestId('doc-role-dropdown');
   await currentUserRole.click();
-  await getMenuItem(page, role).click();
+  await page.getByRole('menuitemradio', { name: role }).click();
   await list.click();
 };
 

src/frontend/apps/e2e/package.json

@@ -1,6 +1,6 @@
 {
   "name": "app-e2e",
-  "version": "4.8.2",
+  "version": "4.8.3",
   "repository": "https://github.com/suitenumerique/docs",
   "author": "DINUM",
   "license": "MIT",

src/frontend/apps/impress/package.json

@@ -1,6 +1,6 @@
 {
   "name": "app-impress",
-  "version": "4.8.2",
+  "version": "4.8.3",
   "repository": "https://github.com/suitenumerique/docs",
   "author": "DINUM",
   "license": "MIT",
@@ -23,7 +23,7 @@
   },
   "dependencies": {
     "@ag-media/react-pdf-table": "2.0.3",
-    "@ai-sdk/openai": "3.0.19",
+    "@ai-sdk/openai": "3.0.45",
     "@blocknote/code-block": "0.47.1",
     "@blocknote/core": "0.47.1",
     "@blocknote/mantine": "0.47.1",
@@ -38,20 +38,20 @@
     "@emoji-mart/data": "1.2.1",
     "@emoji-mart/react": "1.1.1",
     "@fontsource-variable/inter": "5.2.8",
-    "@fontsource-variable/material-symbols-outlined": "5.2.35",
+    "@fontsource-variable/material-symbols-outlined": "5.2.38",
     "@fontsource/material-icons": "5.2.7",
     "@gouvfr-lasuite/cunningham-react": "4.2.0",
     "@gouvfr-lasuite/integration": "1.0.3",
-    "@gouvfr-lasuite/ui-kit": "0.19.6",
+    "@gouvfr-lasuite/ui-kit": "0.19.10",
     "@hocuspocus/provider": "3.4.4",
-    "@mantine/core": "8.3.14",
+    "@mantine/core": "8.3.17",
-    "@mantine/hooks": "8.3.14",
+    "@mantine/hooks": "8.3.17",
     "@react-aria/live-announcer": "3.4.4",
     "@react-pdf/renderer": "4.3.1",
-    "@sentry/nextjs": "10.38.0",
+    "@sentry/nextjs": "10.43.0",
     "@tanstack/react-query": "5.90.21",
     "@tiptap/extensions": "*",
-    "ai": "6.0.49",
+    "ai": "6.0.128",
     "canvg": "4.0.3",
     "clsx": "2.1.1",
     "cmdk": "1.1.1",
@@ -59,28 +59,28 @@
     "emoji-datasource-apple": "16.0.0",
     "emoji-mart": "5.6.0",
     "emoji-regex": "10.6.0",
-    "i18next": "25.8.12",
+    "i18next": "25.8.18",
     "i18next-browser-languagedetector": "8.2.1",
     "idb": "8.0.3",
     "lodash": "4.17.23",
     "luxon": "3.7.2",
-    "next": "16.1.6",
+    "next": "16.1.7",
-    "posthog-js": "1.347.2",
+    "posthog-js": "1.360.2",
     "react": "*",
-    "react-aria-components": "1.15.1",
+    "react-aria-components": "1.16.0",
     "react-dom": "*",
     "react-dropzone": "15.0.0",
-    "react-i18next": "16.5.4",
+    "react-i18next": "16.5.8",
-    "react-intersection-observer": "10.0.2",
+    "react-intersection-observer": "10.0.3",
     "react-resizable-panels": "3.0.6",
     "react-select": "5.10.2",
-    "styled-components": "6.3.9",
+    "styled-components": "6.3.11",
     "use-debounce": "10.1.0",
     "uuid": "13.0.0",
     "y-protocols": "1.0.7",
     "yjs": "*",
-    "zod": "3.25.28",
+    "zod": "4.3.6",
-    "zustand": "5.0.11"
+    "zustand": "5.0.12"
   },
   "devDependencies": {
     "@svgr/webpack": "8.1.0",
@@ -89,26 +89,25 @@
     "@testing-library/jest-dom": "6.9.1",
     "@testing-library/react": "16.3.2",
     "@testing-library/user-event": "14.6.1",
-    "@types/lodash": "4.17.23",
+    "@types/lodash": "4.17.24",
     "@types/luxon": "3.7.1",
     "@types/node": "*",
     "@types/react": "*",
     "@types/react-dom": "*",
-    "@vitejs/plugin-react": "5.1.4",
+    "@vitejs/plugin-react": "6.0.1",
     "cross-env": "10.1.0",
     "dotenv": "17.3.1",
     "eslint-plugin-docs": "*",
     "fetch-mock": "9.11.0",
-    "jsdom": "28.1.0",
+    "jsdom": "29.0.0",
     "node-fetch": "2.7.0",
     "prettier": "3.8.1",
     "stylelint": "16.26.1",
     "stylelint-config-standard": "39.0.1",
     "stylelint-prettier": "5.0.3",
     "typescript": "*",
-    "vite-tsconfig-paths": "6.1.1",
+    "vitest": "4.1.0",
-    "vitest": "4.0.18",
+    "webpack": "5.105.4",
-    "webpack": "5.105.2",
     "workbox-webpack-plugin": "7.1.0"
   },
   "packageManager": "yarn@1.22.22"

src/frontend/apps/impress/src/assets/icons/ui-kit/markdown_copy.svg

@@ -0,0 +1,9 @@
+<svg
+  xmlns="http://www.w3.org/2000/svg"
+  viewBox="0 -960 960 960"
+  fill="currentColor"
+>
+  <path
+    d="M360-240q-33 0-56.5-23.5T280-320v-480q0-33 23.5-56.5T360-880h360q33 0 56.5 23.5T800-800v480q0 33-23.5 56.5T720-240H360Zm0-80h360v-480H360v480ZM200-80q-33 0-56.5-23.5T120-160v-560h80v560h440v80H200Zm210-360h60v-180h40v120h60v-120h40v180h60v-200q0-17-11.5-28.5T630-680H450q-17 0-28.5 11.5T410-640v200Zm-50 120v-480 480Z"
+  />
+</svg>

src/frontend/apps/impress/src/components/BoxButton.tsx

@@ -1,17 +1,17 @@
-import { forwardRef } from 'react';
+import { Ref, forwardRef } from 'react';
 import { css } from 'styled-components';
 
 import { Box, BoxType } from './Box';
 
-export type BoxButtonType = BoxType & {
+export type BoxButtonType = Omit<BoxType, 'ref'> & {
   disabled?: boolean;
+  ref?: Ref<HTMLButtonElement>;
 };
 
-/**
-
 /**
  * Styleless button that extends the Box component.
  * Good to wrap around SVGs or other elements that need to be clickable.
+ * Uses aria-disabled instead of native disabled to preserve keyboard focusability.
  * @param props - @see BoxType props
  * @param ref
  * @see Box
@@ -22,8 +22,8 @@ export type BoxButtonType = BoxType & {
  *  </BoxButton>
  * ```
  */
-const BoxButton = forwardRef<HTMLDivElement, BoxButtonType>(
+const BoxButton = forwardRef<HTMLButtonElement, BoxButtonType>(
-  ({ $css, ...props }, ref) => {
+  ({ $css, disabled, ...props }, ref) => {
     const theme = props.$theme || 'gray';
     const variation = props.$variation || 'primary';
 
@@ -31,16 +31,18 @@ const BoxButton = forwardRef<HTMLDivElement, BoxButtonType>(
       <Box
         ref={ref}
         as="button"
+        type="button"
         $background="none"
         $margin="none"
         $padding="none"
         $hasTransition
+        aria-disabled={disabled || undefined}
         $css={css`
-          cursor: ${props.disabled ? 'not-allowed' : 'pointer'};
+          cursor: ${disabled ? 'not-allowed' : 'pointer'};
           border: none;
           outline: none;
           font-family: inherit;
-          color: ${props.disabled &&
+          color: ${disabled &&
           `var(--c--contextuals--content--semantic--disabled--primary)`};
           &:focus-visible {
             transition: none;
@@ -53,11 +55,11 @@ const BoxButton = forwardRef<HTMLDivElement, BoxButtonType>(
         `}
         {...props}
         className={`--docs--box-button ${props.className || ''}`}
-        onClick={(event: React.MouseEvent<HTMLDivElement>) => {
+        onClick={(event: React.MouseEvent<HTMLButtonElement>) => {
-          if (props.disabled) {
+          if (disabled) {
             return;
           }
-          props.onClick?.(event);
+          props.onClick?.(event as unknown as React.MouseEvent<HTMLDivElement>);
         }}
       />
     );

src/frontend/apps/impress/src/components/SkipToContent.tsx

@@ -1,63 +1,33 @@
 import { Button } from '@gouvfr-lasuite/cunningham-react';
-import { useRouter } from 'next/router';
+import { useState } from 'react';
-import { useEffect, useState } from 'react';
 import { useTranslation } from 'react-i18next';
-import { css } from 'styled-components';
 
 import { Box } from '@/components';
 import { useCunninghamTheme } from '@/cunningham';
 import { MAIN_LAYOUT_ID } from '@/layouts/conf';
+import { focusMainContentStart } from '@/layouts/utils';
 
 export const SkipToContent = () => {
   const { t } = useTranslation();
-  const router = useRouter();
   const { spacingsTokens } = useCunninghamTheme();
   const [isVisible, setIsVisible] = useState(false);
 
-  // Reset focus after route change so first TAB goes to skip link
-  useEffect(() => {
-    const handleRouteChange = () => {
-      (document.activeElement as HTMLElement)?.blur();
-
-      document.body.setAttribute('tabindex', '-1');
-      document.body.focus({ preventScroll: true });
-
-      setTimeout(() => {
-        document.body.removeAttribute('tabindex');
-      }, 100);
-    };
-
-    router.events.on('routeChangeComplete', handleRouteChange);
-    return () => {
-      router.events.off('routeChangeComplete', handleRouteChange);
-    };
-  }, [router.events]);
-
   const handleClick = (e: React.MouseEvent) => {
     e.preventDefault();
-    const mainContent = document.getElementById(MAIN_LAYOUT_ID);
+    const focusTarget = focusMainContentStart();
-    if (mainContent) {
+
-      mainContent.focus();
+    if (focusTarget instanceof HTMLElement) {
-      mainContent.scrollIntoView({ behavior: 'smooth', block: 'start' });
+      focusTarget.scrollIntoView({ behavior: 'smooth', block: 'start' });
     }
   };
 
   return (
-    <Box
+    <Box>
-      $css={css`
-        .c__button--brand--primary.--docs--skip-to-content:focus-visible {
-          box-shadow:
-            0 0 0 1px var(--c--globals--colors--white-000),
-            0 0 0 4px var(--c--contextuals--border--semantic--brand--primary);
-          border-radius: var(--c--globals--spacings--st);
-        }
-      `}
-    >
       <Button
-        onClick={handleClick}
+        href={`#${MAIN_LAYOUT_ID}`}
-        type="button"
         color="brand"
         className="--docs--skip-to-content"
+        onClick={handleClick}
         onFocus={() => setIsVisible(true)}
         onBlur={() => setIsVisible(false)}
         style={{
@@ -65,7 +35,6 @@ export const SkipToContent = () => {
           pointerEvents: isVisible ? 'auto' : 'none',
           position: 'fixed',
           top: spacingsTokens['2xs'],
-          // padding header + logo(32px) + gap(3xs≈4px) + text "Docs"(≈70px) + 12px
           left: `calc(${spacingsTokens['base']} + 32px + ${spacingsTokens['3xs']} + 70px + 12px)`,
           zIndex: 9999,
           whiteSpace: 'nowrap',

src/frontend/apps/impress/src/components/dropdown-menu/DropdownMenu.tsx

@@ -26,6 +26,7 @@ import { useDropdownKeyboardNav } from './hook/useDropdownKeyboardNav';
 export type DropdownMenuOption = {
   icon?: ReactNode;
   label: string;
+  lang?: string;
   testId?: string;
   value?: string;
   callback?: () => void | Promise<unknown>;
@@ -69,7 +70,10 @@ export const DropdownMenu = ({
   const [isOpen, setIsOpen] = useState(opened ?? false);
   const [focusedIndex, setFocusedIndex] = useState(-1);
   const blockButtonRef = useRef<HTMLDivElement>(null);
-  const menuItemRefs = useRef<(HTMLDivElement | null)[]>([]);
+  const menuItemRefs = useRef<(HTMLButtonElement | null)[]>([]);
+  const isSingleSelectable = options.some(
+    (option) => option.isSelected !== undefined,
+  );
 
   const onOpenChange = useCallback(
     (isOpen: boolean) => {
@@ -110,10 +114,6 @@ export const DropdownMenu = ({
     [onOpenChange],
   );
 
-  const hasSelectable =
-    selectedValues !== undefined ||
-    options.some((option) => option.isSelected !== undefined);
-
   if (disabled) {
     return children;
   }
@@ -176,20 +176,25 @@ export const DropdownMenu = ({
           }
           const isDisabled = option.disabled !== undefined && option.disabled;
           const isFocused = index === focusedIndex;
-          const ariaChecked = hasSelectable
+          const isSelected =
-            ? option.isSelected ||
+            option.isSelected === true ||
-              selectedValues?.includes(option.value ?? '') ||
+            (selectedValues?.includes(option.value ?? '') ?? false);
-              false
+          const itemRole =
-            : undefined;
+            selectedValues !== undefined
+              ? 'menuitemcheckbox'
+              : isSingleSelectable
+                ? 'menuitemradio'
+                : 'menuitem';
+          const optionKey = option.value ?? option.testId ?? `option-${index}`;
 
           return (
-            <Fragment key={option.label}>
+            <Fragment key={optionKey}>
               <BoxButton
                 ref={(el) => {
                   menuItemRefs.current[index] = el;
                 }}
-                role={hasSelectable ? 'menuitemradio' : 'menuitem'}
+                role={itemRole}
-                aria-checked={ariaChecked}
+                aria-checked={itemRole === 'menuitem' ? undefined : isSelected}
                 data-testid={option.testId}
                 $direction="row"
                 disabled={isDisabled}
@@ -200,7 +205,6 @@ export const DropdownMenu = ({
                   triggerOption(option);
                 }}
                 onKeyDown={keyboardAction(() => triggerOption(option))}
-                key={option.label}
                 $align="center"
                 $justify="space-between"
                 $background="var(--c--contextuals--background--surface--primary)"
@@ -271,16 +275,16 @@ export const DropdownMenu = ({
                     <Box
                       $theme="neutral"
                       $variation={isDisabled ? 'tertiary' : 'primary'}
+                      aria-hidden="true"
                     >
                       {option.icon}
                     </Box>
                   )}
                   <Text $variation={isDisabled ? 'tertiary' : 'primary'}>
-                    {option.label}
+                    <span lang={option.lang}>{option.label}</span>
                   </Text>
                 </Box>
-                {(option.isSelected ||
+                {isSelected && (
-                  selectedValues?.includes(option.value ?? '')) && (
                   <Icon
                     iconName="check"
                     $size="20px"

src/frontend/apps/impress/src/components/dropdown-menu/__tests__/DropdownMenu.spec.tsx

@@ -58,7 +58,7 @@ describe('<DropdownMenu />', () => {
     expect(radios[2]).toHaveAttribute('aria-checked', 'false');
   });
 
-  test('renders menuitemradio role with aria-checked when selectedValues is provided', async () => {
+  test('renders menuitemcheckbox role with aria-checked when selectedValues is provided', async () => {
     const optionsWithValues: DropdownMenuOption[] = [
       { label: 'English', value: 'en', callback: vi.fn() },
       { label: 'Français', value: 'fr', callback: vi.fn() },
@@ -77,12 +77,12 @@ describe('<DropdownMenu />', () => {
       { wrapper: AppWrapper },
     );
 
-    const radios = screen.getAllByRole('menuitemradio');
+    const checkboxes = screen.getAllByRole('menuitemcheckbox');
-    expect(radios).toHaveLength(3);
+    expect(checkboxes).toHaveLength(3);
 
-    expect(radios[0]).toHaveAttribute('aria-checked', 'false');
+    expect(checkboxes[0]).toHaveAttribute('aria-checked', 'false');
-    expect(radios[1]).toHaveAttribute('aria-checked', 'true');
+    expect(checkboxes[1]).toHaveAttribute('aria-checked', 'true');
-    expect(radios[2]).toHaveAttribute('aria-checked', 'false');
+    expect(checkboxes[2]).toHaveAttribute('aria-checked', 'false');
   });
 
   test('trigger button has aria-haspopup and aria-expanded', async () => {

src/frontend/apps/impress/src/components/dropdown-menu/hook/useDropdownKeyboardNav.ts

@@ -6,7 +6,7 @@ type UseDropdownKeyboardNavProps = {
   isOpen: boolean;
   focusedIndex: number;
   options: DropdownMenuOption[];
-  menuItemRefs: RefObject<(HTMLDivElement | null)[]>;
+  menuItemRefs: RefObject<(HTMLButtonElement | null)[]>;
   setFocusedIndex: (index: number) => void;
   onOpenChange: (isOpen: boolean) => void;
 };

src/frontend/apps/impress/src/components/quick-search/QuickSearch.tsx

@@ -32,6 +32,7 @@ export type QuickSearchProps = {
   label?: string;
   placeholder?: string;
   groupKey?: string;
+  beforeList?: ReactNode;
 };
 
 export const QuickSearch = ({
@@ -41,6 +42,7 @@ export const QuickSearch = ({
   showInput = true,
   label,
   placeholder,
+  beforeList,
   children,
 }: PropsWithChildren<QuickSearchProps>) => {
   const ref = useRef<HTMLDivElement | null>(null);
@@ -76,6 +78,7 @@ export const QuickSearch = ({
               {inputContent}
             </QuickSearchInput>
           )}
+          {beforeList}
           <Command.List id={listId} aria-label={label} role="listbox">
             <Box>{children}</Box>
           </Command.List>

src/frontend/apps/impress/src/components/quick-search/QuickSearchInput.tsx

@@ -1,9 +1,10 @@
 import { Command } from 'cmdk';
-import { PropsWithChildren } from 'react';
+import { PropsWithChildren, useEffect, useRef } from 'react';
 import { useTranslation } from 'react-i18next';
 
 import { HorizontalSeparator } from '@/components';
 import { useCunninghamTheme } from '@/cunningham';
+import { useFocusStore } from '@/stores';
 
 import { Box } from '../Box';
 import { Icon } from '../Icon';
@@ -14,7 +15,6 @@ type QuickSearchInputProps = {
   placeholder?: string;
   withSeparator?: boolean;
   listId?: string;
-  isExpanded?: boolean;
 };
 export const QuickSearchInput = ({
   inputValue,
@@ -26,6 +26,12 @@ export const QuickSearchInput = ({
 }: PropsWithChildren<QuickSearchInputProps>) => {
   const { t } = useTranslation();
   const { spacingsTokens } = useCunninghamTheme();
+  const inputRef = useRef<HTMLInputElement>(null);
+  const addLastFocus = useFocusStore((state) => state.addLastFocus);
+
+  useEffect(() => {
+    addLastFocus(inputRef.current);
+  }, [addLastFocus]);
 
   if (children) {
     return (
@@ -42,11 +48,12 @@ export const QuickSearchInput = ({
         $direction="row"
         $align="center"
         className="quick-search-input"
-        $gap={spacingsTokens['2xs']}
+        $gap={spacingsTokens['xxs']}
         $padding={{ horizontal: 'base', vertical: 'xxs' }}
       >
         <Icon iconName="search" $variation="secondary" aria-hidden="true" />
         <Command.Input
+          ref={inputRef}
           autoFocus={true}
           aria-label={t('Quick search input')}
           aria-controls={listId}
@@ -55,6 +62,7 @@ export const QuickSearchInput = ({
           placeholder={placeholder ?? t('Search')}
           onValueChange={onFilter}
           maxLength={254}
+          minLength={6}
           data-testid="quick-search-input"
         />
       </Box>

src/frontend/apps/impress/src/components/quick-search/QuickSearchStyle.tsx

@@ -18,14 +18,15 @@ export const QuickSearchStyle = createGlobalStyle`
     [cmdk-input] {
       border: none;
       width: 100%;
-      font-size: 17px;
+      font-size: 16px;
       background: white;
       outline: none;
       color: var(--c--contextuals--content--semantic--neutral--primary);
       border-radius: var(--c--globals--spacings--0);
+      font-family: var(--c--globals--font--families--base);
 
       &::placeholder {
-        color: var(--c--globals--colors--gray-500);
+        color: var(--c--contextuals--content--semantic--neutral--tertiary);
       }
     }
 

src/frontend/apps/impress/src/features/docs/doc-editor/components/DocEditor.tsx

@@ -2,7 +2,7 @@ import clsx from 'clsx';
 import { useEffect, useState } from 'react';
 
 import { Box, Loading } from '@/components';
-import { DocHeader, FloatingBar } from '@/docs/doc-header/';
+import { DocHeader } from '@/docs/doc-header/';
 import {
   Doc,
   LinkReach,
@@ -35,7 +35,6 @@ export const DocEditorContainer = ({
 
   return (
     <>
-      {isDesktop && <FloatingBar />}
       <Box
         $maxWidth="868px"
         $width="100%"

src/frontend/apps/impress/src/features/docs/doc-editor/components/comments/styles.tsx

@@ -8,12 +8,37 @@ export const cssComments = (
   & .--docs--main-editor .ProseMirror {
     // Comments marks in the editor
     .bn-editor {
-      .bn-thread-mark:not([data-orphan='true']),
+      // Resets blocknote comments styles
-      .bn-thread-mark-selected:not([data-orphan='true']) {
+      .bn-thread-mark,
-        background: ${canSeeComment ? '#EDB40066' : 'transparent'};
+      .bn-thread-mark-selected {
-        color: var(--c--globals--colors--gray-700);
+        background-color: transparent;
       }
 
+      ${canSeeComment &&
+      css`
+        .bn-thread-mark:not([data-orphan='true']) {
+          background-color: color-mix(
+            in srgb,
+            var(--c--contextuals--background--palette--yellow--tertiary) 40%,
+            transparent
+          );
+          border-bottom: 2px solid
+            var(--c--contextuals--background--palette--yellow--secondary);
+
+          mix-blend-mode: multiply;
+
+          transition:
+            background-color var(--c--globals--transitions--duration),
+            border-bottom-color var(--c--globals--transitions--duration);
+
+          &:has(.bn-thread-mark-selected) {
+            background-color: var(
+              --c--contextuals--background--palette--yellow--tertiary
+            );
+          }
+        }
+      `}
+
       [data-show-selection] {
         color: HighlightText;
       }

src/frontend/apps/impress/src/features/docs/doc-editor/hook/useSaveDoc.tsx

@@ -3,7 +3,7 @@ import { useCallback, useEffect, useState } from 'react';
 import * as Y from 'yjs';
 
 import { useUpdateDoc } from '@/docs/doc-management/';
-import { KEY_LIST_DOC_VERSIONS } from '@/docs/doc-versioning';
+import { KEY_LIST_DOC_VERSIONS } from '@/docs/doc-versioning/api/useDocVersions';
 import { toBase64 } from '@/utils/string';
 import { isFirefox } from '@/utils/userAgent';
 

src/frontend/apps/impress/src/features/docs/doc-editor/hook/useShortcuts.tsx

@@ -1,11 +1,83 @@
-import { useEffect } from 'react';
+import { announce } from '@react-aria/live-announcer';
+import { useCallback, useEffect } from 'react';
+import { useTranslation } from 'react-i18next';
 
 import { DocsBlockNoteEditor } from '../types';
 
+const getFormattingShortcutLabel = (
+  event: KeyboardEvent,
+  t: (key: string) => string,
+): string | null => {
+  const isMod = event.ctrlKey || event.metaKey;
+  if (!isMod) {
+    return null;
+  }
+
+  if (event.altKey) {
+    switch (event.code) {
+      case 'Digit1':
+        return t('Heading 1 applied');
+      case 'Digit2':
+        return t('Heading 2 applied');
+      case 'Digit3':
+        return t('Heading 3 applied');
+      default:
+        return null;
+    }
+  }
+
+  if (event.shiftKey) {
+    switch (event.code) {
+      case 'Digit0':
+        return t('Paragraph applied');
+      case 'Digit6':
+        return t('Toggle list applied');
+      case 'Digit7':
+        return t('Numbered list applied');
+      case 'Digit8':
+        return t('Bulleted list applied');
+      case 'Digit9':
+        return t('Checklist applied');
+      case 'KeyC':
+        return t('Code block applied');
+      default:
+        return null;
+    }
+  }
+
+  return null;
+};
+
 export const useShortcuts = (
   editor: DocsBlockNoteEditor,
   el: HTMLDivElement | null,
 ) => {
+  const { t } = useTranslation();
+
+  const handleFormattingShortcut = useCallback(
+    (event: KeyboardEvent) => {
+      if (!editor?.isFocused()) {
+        return;
+      }
+
+      const label = getFormattingShortcutLabel(event, t);
+      if (label) {
+        setTimeout(() => {
+          announce(label, 'assertive');
+        }, 150);
+      }
+    },
+    [editor, t],
+  );
+
+  useEffect(() => {
+    el?.addEventListener('keydown', handleFormattingShortcut, true);
+
+    return () => {
+      el?.removeEventListener('keydown', handleFormattingShortcut, true);
+    };
+  }, [el, handleFormattingShortcut]);
+
   useEffect(() => {
     // Check if editor and its view are mounted
     if (!editor || !el) {

src/frontend/apps/impress/src/features/docs/doc-export/__tests__/ExportMIT.test.tsx

@@ -1,4 +1,9 @@
 import { afterAll, afterEach, describe, expect, it, vi } from 'vitest';
+
+vi.mock('@/docs/doc-export/components/ModalExport', () => ({
+  ModalExport: vi.fn(),
+}));
+
 const originalEnv = process.env.NEXT_PUBLIC_PUBLISH_AS_MIT;
 
 describe('useModuleExport', () => {
@@ -16,12 +21,12 @@ describe('useModuleExport', () => {
     const Export = await import('@/features/docs/doc-export/');
 
     expect(Export.default).toBeUndefined();
-  }, 15000);
+  });
 
   it('should load modules when NEXT_PUBLIC_PUBLISH_AS_MIT is false', async () => {
     process.env.NEXT_PUBLIC_PUBLISH_AS_MIT = 'false';
     const Export = await import('@/features/docs/doc-export/');
 
     expect(Export.default).toHaveProperty('ModalExport');
-  }, 15000);
+  });
 });

src/frontend/apps/impress/src/features/docs/doc-export/components/ModalExport.tsx

@@ -60,6 +60,23 @@ export const ModalExport = ({ onClose, doc }: ModalExportProps) => {
   const { untitledDocument } = useTrans();
   const mediaUrl = useMediaUrl();
 
+  const formatOptions = [
+    { label: t('PDF'), value: DocDownloadFormat.PDF },
+    { label: t('Docx'), value: DocDownloadFormat.DOCX },
+    { label: t('ODT'), value: DocDownloadFormat.ODT },
+    { label: t('HTML'), value: DocDownloadFormat.HTML },
+    { label: t('Print'), value: DocDownloadFormat.PRINT },
+  ];
+
+  const formatLabels = Object.fromEntries(
+    formatOptions.map((opt) => [opt.value, opt.label]),
+  );
+
+  const downloadButtonAriaLabel =
+    format === DocDownloadFormat.PRINT
+      ? t('Print')
+      : t('Download {{format}}', { format: formatLabels[format] });
+
   async function onSubmit() {
     if (!editor) {
       toast(t('The export failed'), VariantType.ERROR);
@@ -211,9 +228,7 @@ export const ModalExport = ({ onClose, doc }: ModalExportProps) => {
           </Button>
           <Button
             data-testid="doc-export-download-button"
-            aria-label={
+            aria-label={downloadButtonAriaLabel}
-              format === DocDownloadFormat.PRINT ? t('Print') : t('Download')
-            }
             variant="primary"
             fullWidth
             onClick={() => void onSubmit()}
@@ -260,13 +275,7 @@ export const ModalExport = ({ onClose, doc }: ModalExportProps) => {
           clearable={false}
           fullWidth
           label={t('Format')}
-          options={[
+          options={formatOptions}
-            { label: t('PDF'), value: DocDownloadFormat.PDF },
-            { label: t('Docx'), value: DocDownloadFormat.DOCX },
-            { label: t('ODT'), value: DocDownloadFormat.ODT },
-            { label: t('HTML'), value: DocDownloadFormat.HTML },
-            { label: t('Print'), value: DocDownloadFormat.PRINT },
-          ]}
           value={format}
           onChange={(options) =>
             setFormat(options.target.value as DocDownloadFormat)

src/frontend/apps/impress/src/features/docs/doc-header/__tests__/DocToolBoxLicence.spec.tsx

@@ -1,6 +1,4 @@
 import { render, screen } from '@testing-library/react';
-import userEvent from '@testing-library/user-event';
-import React from 'react';
 import { afterAll, beforeEach, describe, expect, vi } from 'vitest';
 
 import { AppWrapper } from '@/tests/utils';
@@ -40,17 +38,11 @@ describe('DocToolBox - Licence', () => {
     render(<DocToolBox doc={doc as any} />, {
       wrapper: AppWrapper,
     });
-    const optionsButton = await screen.findByLabelText('Export the document');
-    await userEvent.click(optionsButton);
 
-    // Wait for the export modal to be visible, then assert on its content text.
-    await screen.findByTestId('modal-export-title');
     expect(
-      screen.getByText(
+      await screen.findByLabelText('Export the document'),
-        'Export your document to print or download in .docx, .odt, .pdf or .html(zip) format.',
-      ),
     ).toBeInTheDocument();
-  }, 10000);
+  }, 15000);
 
   test('The export button is not rendered when MIT version is activated', async () => {
     process.env.NEXT_PUBLIC_PUBLISH_AS_MIT = 'true';
@@ -68,5 +60,5 @@ describe('DocToolBox - Licence', () => {
     expect(
       screen.queryByLabelText('Export the document'),
     ).not.toBeInTheDocument();
-  });
+  }, 15000);
 });

src/frontend/apps/impress/src/features/docs/doc-header/components/DocToolBox.tsx

@@ -1,9 +1,8 @@
 import { Button, useModal } from '@gouvfr-lasuite/cunningham-react';
 import { useTreeContext } from '@gouvfr-lasuite/ui-kit';
-import { useQueryClient } from '@tanstack/react-query';
 import dynamic from 'next/dynamic';
 import { useRouter } from 'next/router';
-import { useEffect, useState } from 'react';
+import { useState } from 'react';
 import { useTranslation } from 'react-i18next';
 import { css } from 'styled-components';
 
@@ -17,6 +16,7 @@ import GroupSVG from '@/assets/icons/ui-kit/group.svg';
 import HistorySVG from '@/assets/icons/ui-kit/history.svg';
 import KeepSVG from '@/assets/icons/ui-kit/keep.svg';
 import KeepOffSVG from '@/assets/icons/ui-kit/keep_off.svg';
+import MarkdownCopySVG from '@/assets/icons/ui-kit/markdown_copy.svg';
 import {
   Box,
   DropdownMenu,
@@ -38,7 +38,6 @@ import {
   useDocUtils,
   useDuplicateDoc,
 } from '@/docs/doc-management';
-import { KEY_LIST_DOC_VERSIONS } from '@/docs/doc-versioning';
 import { useFocusStore, useResponsiveStore } from '@/stores';
 
 import { useCopyCurrentEditorToClipboard } from '../hooks/useCopyCurrentEditorToClipboard';
@@ -87,7 +86,6 @@ interface DocToolBoxProps {
 export const DocToolBox = ({ doc }: DocToolBoxProps) => {
   const { t } = useTranslation();
   const treeContext = useTreeContext<Doc>();
-  const queryClient = useQueryClient();
   const router = useRouter();
   const { isChild, isTopRoot } = useDocUtils(doc);
 
@@ -113,16 +111,6 @@ export const DocToolBox = ({ doc }: DocToolBoxProps) => {
     listInvalidQueries: [KEY_LIST_DOC, KEY_DOC, KEY_LIST_FAVORITE_DOC],
   });
 
-  useEffect(() => {
-    if (selectHistoryModal.isOpen) {
-      return;
-    }
-
-    void queryClient.resetQueries({
-      queryKey: [KEY_LIST_DOC_VERSIONS],
-    });
-  }, [selectHistoryModal.isOpen, queryClient]);
-
   // Emoji Management
   const { emoji } = getEmojiAndTitle(doc.title ?? '');
   const { updateDocEmoji } = useDocTitleUpdate();
@@ -193,7 +181,7 @@ export const DocToolBox = ({ doc }: DocToolBoxProps) => {
     },
     {
       label: t('Copy as {{format}}', { format: 'Markdown' }),
-      icon: <ContentCopySVG width={24} height={24} />,
+      icon: <MarkdownCopySVG width={24} height={24} />,
       callback: () => {
         void copyCurrentEditorToClipboard('markdown');
       },

src/frontend/apps/impress/src/features/docs/doc-header/hooks/useCopyCurrentEditorToClipboard.tsx

@@ -4,7 +4,7 @@ import {
 } from '@gouvfr-lasuite/cunningham-react';
 import { useTranslation } from 'react-i18next';
 
-import { useEditorStore } from '../../doc-editor';
+import { useEditorStore } from '@/docs/doc-editor/stores/useEditorStore';
 
 export const useCopyCurrentEditorToClipboard = () => {
   const { editor } = useEditorStore();
@@ -13,20 +13,31 @@ export const useCopyCurrentEditorToClipboard = () => {
 
   return async (asFormat: 'html' | 'markdown') => {
     if (!editor) {
-      toast(t('Editor unavailable'), VariantType.ERROR, { duration: 3000 });
+      const message = t('Editor unavailable');
+      toast(message, VariantType.ERROR, { duration: 3000 });
       return;
     }
 
     try {
       const editorContentFormatted =
         asFormat === 'html'
-          ? await editor.blocksToHTMLLossy()
+          ? editor.blocksToHTMLLossy()
-          : await editor.blocksToMarkdownLossy();
+          : editor.blocksToMarkdownLossy();
       await navigator.clipboard.writeText(editorContentFormatted);
-      toast(t('Copied to clipboard'), VariantType.SUCCESS, { duration: 3000 });
+      const successMessage =
+        asFormat === 'markdown'
+          ? t('Copied as Markdown to clipboard')
+          : t('Copied to clipboard');
+
+      toast(successMessage, VariantType.SUCCESS, { duration: 3000 });
     } catch (error) {
       console.error(error);
-      toast(t('Failed to copy to clipboard'), VariantType.ERROR, {
+      const errorMessage =
+        asFormat === 'markdown'
+          ? t('Failed to copy as Markdown to clipboard')
+          : t('Failed to copy to clipboard');
+
+      toast(errorMessage, VariantType.ERROR, {
         duration: 3000,
       });
     }

src/frontend/apps/impress/src/features/docs/doc-management/api/useCreateFavoriteDoc.tsx

@@ -1,4 +1,6 @@
+import { announce } from '@react-aria/live-announcer';
 import { useMutation, useQueryClient } from '@tanstack/react-query';
+import { useTranslation } from 'react-i18next';
 
 import { APIError, errorCauses, fetchAPI } from '@/api';
 
@@ -29,6 +31,8 @@ export function useCreateFavoriteDoc({
   listInvalidQueries,
 }: CreateFavoriteDocProps) {
   const queryClient = useQueryClient();
+  const { t } = useTranslation();
+
   return useMutation<void, APIError, CreateFavoriteDocParams>({
     mutationFn: createFavoriteDoc,
     onSuccess: () => {
@@ -37,7 +41,15 @@ export function useCreateFavoriteDoc({
           queryKey: [queryKey],
         });
       });
+
+      const message = t('Document pinned successfully!');
+      announce(message, 'polite');
+
       onSuccess?.();
     },
+    onError: () => {
+      const message = t('Failed to pin the document.');
+      announce(message, 'assertive');
+    },
   });
 }

src/frontend/apps/impress/src/features/docs/doc-management/api/useDeleteFavoriteDoc.tsx

@@ -1,4 +1,6 @@
+import { announce } from '@react-aria/live-announcer';
 import { useMutation, useQueryClient } from '@tanstack/react-query';
+import { useTranslation } from 'react-i18next';
 
 import { APIError, errorCauses, fetchAPI } from '@/api';
 
@@ -29,6 +31,8 @@ export function useDeleteFavoriteDoc({
   listInvalidQueries,
 }: DeleteFavoriteDocProps) {
   const queryClient = useQueryClient();
+  const { t } = useTranslation();
+
   return useMutation<void, APIError, DeleteFavoriteDocParams>({
     mutationFn: deleteFavoriteDoc,
     onSuccess: () => {
@@ -37,7 +41,15 @@ export function useDeleteFavoriteDoc({
           queryKey: [queryKey],
         });
       });
+
+      const message = t('Document unpinned successfully!');
+      announce(message, 'polite');
+
       onSuccess?.();
     },
+    onError: () => {
+      const message = t('Failed to unpin the document.');
+      announce(message, 'assertive');
+    },
   });
 }

src/frontend/apps/impress/src/features/docs/doc-management/api/useDuplicateDoc.tsx

@@ -88,14 +88,16 @@ export function useDuplicateDoc(options?: DuplicateDocOptions) {
         queryKey: [KEY_LIST_DOC],
       });
 
-      toast(t('Document duplicated successfully!'), VariantType.SUCCESS, {
+      const message = t('Document duplicated successfully!');
+      toast(message, VariantType.SUCCESS, {
         duration: 3000,
       });
 
       void options?.onSuccess?.(data, variables, onMutateResult, context);
     },
     onError: (error, variables, onMutateResult, context) => {
-      toast(t('Failed to duplicate the document...'), VariantType.ERROR, {
+      const message = t('Failed to duplicate the document...');
+      toast(message, VariantType.ERROR, {
         duration: 3000,
       });
 

src/frontend/apps/impress/src/features/docs/doc-management/api/useUpdateDoc.tsx

@@ -44,7 +44,7 @@ export function useUpdateDoc(queryConfig?: UseUpdateDoc) {
     ...queryConfig,
     onSuccess: (data, variables, onMutateResult, context) => {
       queryConfig?.listInvalidQueries?.forEach((queryKey) => {
-        void queryClient.invalidateQueries({
+        void queryClient.resetQueries({
           queryKey: [queryKey],
         });
       });

src/frontend/apps/impress/src/features/docs/doc-management/components/DocIcon.tsx

@@ -44,7 +44,7 @@ export const DocIcon = ({
   const { t } = useTranslation();
   const { addLastFocus, restoreFocus } = useFocusStore();
 
-  const iconRef = useRef<HTMLDivElement>(null);
+  const iconRef = useRef<HTMLButtonElement>(null);
 
   const [openEmojiPicker, setOpenEmojiPicker] = useState<boolean>(false);
   const [pickerPosition, setPickerPosition] = useState<{

src/frontend/apps/impress/src/features/docs/doc-management/hooks/__tests__/useDocTitleUpdate.test.tsx

@@ -14,6 +14,11 @@ vi.mock('@/stores', () => ({
   }),
 }));
 
+vi.mock('@gouvfr-lasuite/ui-kit', async () => ({
+  ...(await vi.importActual('@gouvfr-lasuite/ui-kit')),
+  useTreeContext: () => null,
+}));
+
 describe('useDocTitleUpdate', () => {
   beforeEach(() => {
     vi.clearAllMocks();

src/frontend/apps/impress/src/features/docs/doc-management/stores/useProviderStore.tsx

@@ -30,6 +30,8 @@ const defaultValues = {
 
 type ExtendedCloseEvent = CloseEvent & { wasClean: boolean };
 
+let reconnectTimeout: ReturnType<typeof setTimeout> | undefined;
+
 export const useProviderStore = create<UseCollaborationStore>((set, get) => ({
   ...defaultValues,
   createProvider: (wsUrl, storeId, initialDoc) => {
@@ -48,7 +50,20 @@ export const useProviderStore = create<UseCollaborationStore>((set, get) => ({
       onDisconnect(data) {
         // Attempt to reconnect if the disconnection was clean (initiated by the client or server)
         if ((data.event as ExtendedCloseEvent).wasClean) {
-          void provider.connect();
+          if (data.event.reason === 'No cookies' && data.event.code === 4001) {
+            console.error(
+              'Disconnection due to missing cookies. Not attempting to reconnect.',
+            );
+            void provider.disconnect();
+            set({
+              isReady: true,
+              isConnected: false,
+            });
+            return;
+          }
+
+          clearTimeout(reconnectTimeout);
+          reconnectTimeout = setTimeout(() => void provider.connect(), 1000);
         }
       },
       onAuthenticationFailed() {
@@ -107,6 +122,7 @@ export const useProviderStore = create<UseCollaborationStore>((set, get) => ({
     return provider;
   },
   destroyProvider: () => {
+    clearTimeout(reconnectTimeout);
     const provider = get().provider;
     if (provider) {
       provider.destroy();

src/frontend/apps/impress/src/features/docs/doc-search/components/DocSearchContent.tsx

@@ -1,3 +1,4 @@
+import { announce } from '@react-aria/live-announcer';
 import { t } from 'i18next';
 import { useEffect, useState } from 'react';
 import { InView } from 'react-intersection-observer';
@@ -73,10 +74,12 @@ export const DocSearchContent = ({
       docs = docs.filter(filterResults);
     }
 
+    const elements = search || isSearchNotMandatory ? docs : [];
+
     setDocsData({
       groupName: docs.length > 0 ? groupName : '',
       groupKey: 'docs',
-      elements: search || isSearchNotMandatory ? docs : [],
+      elements,
       emptyString: t('No document found'),
       endActions: hasNextPage
         ? [
@@ -90,6 +93,13 @@ export const DocSearchContent = ({
           ]
         : [],
     });
+
+    if (search) {
+      announce(
+        t('{{count}} result(s) available', { count: elements.length }),
+        'polite',
+      );
+    }
   }, [
     search,
     data?.pages,

src/frontend/apps/impress/src/features/docs/doc-search/components/DocSearchFilters.tsx

@@ -58,7 +58,13 @@ export const DocSearchFilters = ({
         />
       </Box>
       {hasFilters && (
-        <Button color="brand" variant="tertiary" size="small" onClick={onReset}>
+        <Button
+          color="brand"
+          variant="tertiary"
+          size="small"
+          onClick={onReset}
+          aria-label={t('Reset search filters')}
+        >
           {t('Reset')}
         </Button>
       )}

src/frontend/apps/impress/src/features/docs/doc-search/components/DocSearchModal.tsx

@@ -14,7 +14,7 @@ import {
   DocSearchFiltersValues,
   DocSearchTarget,
 } from '@/docs/doc-search';
-import { useResponsiveStore } from '@/stores';
+import { useFocusStore, useResponsiveStore } from '@/stores';
 
 import EmptySearchIcon from '../assets/illustration-docs-empty.png';
 
@@ -36,6 +36,7 @@ const DocSearchModalGlobal = ({
 }: DocSearchModalGlobalProps) => {
   const { t } = useTranslation();
   const [loading, setLoading] = useState(false);
+  const restoreFocus = useFocusStore((state) => state.restoreFocus);
   const router = useRouter();
   const [search, setSearch] = useState('');
   const [filters, setFilters] = useState<DocSearchFiltersValues>(
@@ -51,6 +52,7 @@ const DocSearchModalGlobal = ({
 
   const handleResetFilters = () => {
     setFilters({});
+    restoreFocus();
   };
 
   return (
@@ -62,6 +64,7 @@ const DocSearchModalGlobal = ({
       aria-describedby="doc-search-modal-title"
     >
       <Box
+        aria-label={t('Search modal')}
         $direction="column"
         $justify="space-between"
         className="--docs--doc-search-modal"
@@ -85,21 +88,26 @@ const DocSearchModalGlobal = ({
           />
         </Box>
         <QuickSearch
+          label={t('Search documents')}
           placeholder={t('Type the name of a document')}
           loading={loading}
           onFilter={handleInputSearch}
+          beforeList={
+            showFilters ? (
+              <Box $padding={{ horizontal: '10px' }}>
+                <DocSearchFilters
+                  values={filters}
+                  onValuesChange={setFilters}
+                  onReset={handleResetFilters}
+                />
+              </Box>
+            ) : undefined
+          }
         >
           <Box
             $padding={{ horizontal: '10px', vertical: 'base' }}
             $height={isDesktop ? '500px' : 'calc(100vh - 68px - 1rem)'}
           >
-            {showFilters && (
-              <DocSearchFilters
-                values={filters}
-                onValuesChange={setFilters}
-                onReset={handleResetFilters}
-              />
-            )}
             {search.length === 0 && (
               <Box
                 $direction="column"
@@ -107,11 +115,7 @@ const DocSearchModalGlobal = ({
                 $align="center"
                 $justify="center"
               >
-                <Image
+                <Image width={320} src={EmptySearchIcon} alt="" />
-                  width={320}
-                  src={EmptySearchIcon}
-                  alt={t('No active search')}
-                />
               </Box>
             )}
             {search && (

src/frontend/apps/impress/src/features/docs/doc-share/components/DocShareAddMemberList.tsx

@@ -124,7 +124,8 @@ export const DocShareAddMemberList = ({
       $scope="surface"
       $theme="tertiary"
       $variation=""
-      $border="1px solid var(--c--contextuals--border--semantic--contextual--primary)"
+      $border="1px solid var(--c--contextuals--border--surface--primary)"
+      $margin={{ bottom: 'sm' }}
     >
       <Box
         $direction="row"

src/frontend/apps/impress/src/features/docs/doc-share/components/DocShareModal.tsx

@@ -289,7 +289,7 @@ export const DocShareModal = ({ doc, onClose, isRootDoc = true }: Props) => {
                     />
                   )}
                   {showMemberSection && isRootDoc && (
-                    <Box $padding={{ horizontal: 'base' }}>
+                    <Box $padding={{ horizontal: 'base', top: 'base' }}>
                       <QuickSearchGroupAccessRequest doc={doc} />
                       <QuickSearchGroupInvitation doc={doc} />
                       <QuickSearchGroupMember doc={doc} />
@@ -301,6 +301,7 @@ export const DocShareModal = ({ doc, onClose, isRootDoc = true }: Props) => {
                       searchUsersRawData={searchUsersQuery.data}
                       onSelect={onSelect}
                       userQuery={userQuery}
+                      minLength={API_USERS_SEARCH_QUERY_MIN_LENGTH}
                     />
                   )}
                 </QuickSearch>
@@ -321,14 +322,35 @@ interface QuickSearchInviteInputSectionProps {
   onSelect: (usr: User) => void;
   searchUsersRawData: User[] | undefined;
   userQuery: string;
+  minLength: number;
 }
 
 const QuickSearchInviteInputSection = ({
   onSelect,
   searchUsersRawData,
   userQuery,
+  minLength,
 }: QuickSearchInviteInputSectionProps) => {
   const { t } = useTranslation();
+  const hint = useMemo(() => {
+    if (userQuery.length < minLength) {
+      return t('Type at least {{minLength}} characters to display user names', {
+        minLength,
+      });
+    }
+    if (isValidEmail(userQuery)) {
+      return t('Choose the email');
+    }
+    if (!searchUsersRawData?.length) {
+      return t('No results. Type a full email address to invite someone.');
+    }
+
+    return t('Choose a user');
+  }, [minLength, searchUsersRawData?.length, t, userQuery]);
+
+  useEffect(() => {
+    announce(hint, 'polite');
+  }, [hint]);
 
   const searchUserData: QuickSearchData<User> = useMemo(() => {
     const users = searchUsersRawData || [];
@@ -347,7 +369,7 @@ const QuickSearchInviteInputSection = ({
     );
 
     return {
-      groupName: t('Search user result'),
+      groupName: hint,
       elements: users,
       endActions:
         isEmail && !hasEmailInUsers
@@ -359,12 +381,12 @@ const QuickSearchInviteInputSection = ({
             ]
           : undefined,
     };
-  }, [onSelect, searchUsersRawData, t, userQuery]);
+  }, [searchUsersRawData, userQuery, hint, onSelect]);
 
   return (
     <Box
       aria-label={t('List search user result card')}
-      $padding={{ horizontal: 'base', bottom: '3xs' }}
+      $padding={{ horizontal: 'base', bottom: '3xs', top: 'base' }}
     >
       <QuickSearchGroup
         group={searchUserData}

src/frontend/apps/impress/src/features/docs/doc-table-content/components/Heading.tsx

@@ -51,11 +51,13 @@ export const Heading = ({
 
         editor.setTextCursorPosition(headingId, 'end');
 
-        document.querySelector(`[data-id="${headingId}"]`)?.scrollIntoView({
+        document
-          behavior: 'smooth',
+          .querySelector<HTMLElement>(`[data-id="${headingId}"]`)
-          inline: 'start',
+          ?.scrollIntoView({
-          block: 'start',
+            behavior: 'smooth',
-        });
+            inline: 'start',
+            block: 'start',
+          });
       }}
       $radius="var(--c--globals--spacings--st)"
       $background={

src/frontend/apps/impress/src/features/docs/doc-table-content/components/TableContent.tsx

@@ -91,7 +91,7 @@ export const TableContent = () => {
             $height="100%"
             $justify="center"
             $align="center"
-            aria-label={t('Summary')}
+            aria-label={t('Show the table of contents')}
             aria-expanded={isOpen}
             aria-controls="toc-list"
             $css={css`
@@ -218,8 +218,8 @@ const TableContentOpened = ({
           onClick={onClose}
           $justify="center"
           $align="center"
-          aria-label={t('Summary')}
+          aria-label={t('Hide the table of contents')}
-          aria-expanded="true"
+          aria-expanded={true}
           aria-controls="toc-list"
           $css={css`
             transition: none !important;

src/frontend/apps/impress/src/features/docs/doc-tree/components/DocSubPageItem.tsx

@@ -96,7 +96,7 @@ export const DocSubPageItem = (props: TreeViewNodeProps<Doc>) => {
   const ariaLabel = docTitle;
   const isDisabled = !!doc.deleted_at;
   const actionsRef = useRef<HTMLDivElement>(null);
-  const buttonOptionRef = useRef<HTMLDivElement | null>(null);
+  const buttonOptionRef = useRef<HTMLButtonElement | null>(null);
 
   const handleKeyDown = (e: React.KeyboardEvent) => {
     const target = e.target as HTMLElement | null;

src/frontend/apps/impress/src/features/docs/doc-tree/components/DocTree.tsx

@@ -18,6 +18,7 @@ import {
   useMoveDoc,
   useTrans,
 } from '@/docs/doc-management';
+import { TreeSkeleton } from '@/features/skeletons/components/TreeSkeleton';
 
 import { CLASS_DOC_TITLE } from '../../doc-header';
 import { KEY_DOC_TREE, useDocTree } from '../api/useDocTree';
@@ -43,7 +44,7 @@ export const DocTree = ({ currentDoc }: DocTreeProps) => {
     treeContext?.treeData.selectedNode?.id === treeContext.root.id;
   const rootItemRef = useRef<HTMLDivElement>(null);
   const rootActionsRef = useRef<HTMLDivElement>(null);
-  const rootButtonOptionRef = useRef<HTMLDivElement | null>(null);
+  const rootButtonOptionRef = useRef<HTMLButtonElement | null>(null);
 
   const { t } = useTranslation();
 
@@ -257,7 +258,7 @@ export const DocTree = ({ currentDoc }: DocTreeProps) => {
   }, [currentDoc, treeContext]);
 
   if (!treeContext || !treeContext.root) {
-    return null;
+    return <TreeSkeleton />;
   }
 
   return (

src/frontend/apps/impress/src/features/docs/doc-tree/components/DocTreeItemActions.tsx

@@ -33,7 +33,7 @@ type DocTreeItemActionsProps = {
   onOpenChange?: (isOpen: boolean) => void;
   parentId?: string | null;
   actionsRef?: React.RefObject<HTMLDivElement | null>;
-  buttonOptionRef?: React.RefObject<HTMLDivElement | null>;
+  buttonOptionRef?: React.RefObject<HTMLButtonElement | null>;
 };
 
 export const DocTreeItemActions = ({
@@ -48,7 +48,7 @@ export const DocTreeItemActions = ({
 }: DocTreeItemActionsProps) => {
   const internalActionsRef = useRef<HTMLDivElement | null>(null);
   const targetActionsRef = actionsRef ?? internalActionsRef;
-  const internalButtonRef = useRef<HTMLDivElement | null>(null);
+  const internalButtonRef = useRef<HTMLButtonElement | null>(null);
   const targetButtonRef = buttonOptionRef ?? internalButtonRef;
   const router = useRouter();
   const { t } = useTranslation();

src/frontend/apps/impress/src/features/docs/doc-versioning/components/DocVersionEditor.tsx

@@ -4,9 +4,12 @@ import { useEffect, useState } from 'react';
 import * as Y from 'yjs';
 
 import { Box, Text, TextErrors } from '@/components';
-import { BlockNoteReader, DocEditorContainer } from '@/docs/doc-editor/';
+import { BlockNoteReader } from '@/docs/doc-editor/components/BlockNoteEditor';
+import { DocEditorContainer } from '@/docs/doc-editor/components/DocEditor';
 import { Doc, base64ToBlocknoteXmlFragment } from '@/docs/doc-management';
-import { Versions, useDocVersion } from '@/docs/doc-versioning/';
+
+import { useDocVersion } from '../api/useDocVersion';
+import { Versions } from '../types';
 
 import { DocVersionHeader } from './DocVersionHeader';
 

src/frontend/apps/impress/src/features/docs/doc-versioning/components/ModalConfirmationVersion.tsx

@@ -5,8 +5,8 @@ import {
   VariantType,
   useToastProvider,
 } from '@gouvfr-lasuite/cunningham-react';
-import { useRouter } from 'next/router';
 import { useTranslation } from 'react-i18next';
+import { createGlobalStyle } from 'styled-components';
 
 import { Box, Text } from '@/components';
 import {
@@ -21,15 +21,22 @@ import { KEY_LIST_DOC_VERSIONS } from '../api/useDocVersions';
 import { Versions } from '../types';
 import { revertUpdate } from '../utils';
 
-interface ModalConfirmationVersionProps {
+const ModalStyle = createGlobalStyle`
-  onClose: () => void;
+  .c__modal__title {
-  docId: Doc['id'];
+    margin-bottom: var(--c--globals--spacings--sm);
+  }
+`;
 
+interface ModalConfirmationVersionProps {
+  docId: Doc['id'];
+  onClose: () => void;
+  onSuccess: () => void;
   versionId: Versions['version_id'];
 }
 
 export const ModalConfirmationVersion = ({
   onClose,
+  onSuccess,
   docId,
   versionId,
 }: ModalConfirmationVersionProps) => {
@@ -39,14 +46,13 @@ export const ModalConfirmationVersion = ({
   });
   const { t } = useTranslation();
   const { toast } = useToastProvider();
-  const { push } = useRouter();
   const { provider } = useProviderStore();
   const { mutate: updateDoc } = useUpdateDoc({
     listInvalidQueries: [KEY_LIST_DOC_VERSIONS],
     onSuccess: () => {
       const onDisplaySuccess = () => {
         toast(t('Version restored successfully'), VariantType.SUCCESS);
-        void push(`/docs/${docId}`);
+        onSuccess();
       };
 
       if (!provider || !version?.content) {
@@ -64,6 +70,10 @@ export const ModalConfirmationVersion = ({
     },
   });
 
+  if (!version) {
+    return null;
+  }
+
   return (
     <Modal
       isOpen
@@ -102,7 +112,7 @@ export const ModalConfirmationVersion = ({
           </Button>
         </>
       }
-      size={ModalSize.SMALL}
+      size={ModalSize.MEDIUM}
       title={
         <Text
           as="h1"
@@ -111,17 +121,17 @@ export const ModalConfirmationVersion = ({
           $size="h6"
           $align="flex-start"
         >
-          {t('Warning')}
+          {t('Restoring an older version')}
         </Text>
       }
     >
+      <ModalStyle />
       <Box className="--docs--modal-confirmation-version">
         <Box>
-          <Text $variation="secondary" as="p">
+          <Text $variation="secondary" as="p" $margin="none">
-            {t('Your current document will revert to this version.')}
+            {t(
-          </Text>
+              "The current document will be replaced, but you'll still find it in the version history.",
-          <Text $variation="secondary" as="p">
+            )}
-            {t('If a member is editing, his works can be lost.')}
           </Text>
         </Box>
       </Box>

src/frontend/apps/impress/src/features/docs/doc-versioning/components/ModalSelectVersion.tsx

@@ -114,11 +114,12 @@ export const ModalSelectVersion = ({
             $height="calc(100vh - 2em - 12px)"
             $css={css`
               overflow-y: hidden;
-              border-left: 1px solid var(--c--globals--colors--gray-200);
+              border-left: 1px solid
+                var(--c--contextuals--border--surface--primary);
             `}
           >
             <Box
-              aria-label="version list"
+              aria-label={t('Version list')}
               $css={css`
                 overflow-y: auto;
                 flex: 1;
@@ -130,7 +131,8 @@ export const ModalSelectVersion = ({
                 $direction="row"
                 $align="center"
                 $css={css`
-                  border-bottom: 1px solid var(--c--globals--colors--gray-200);
+                  border-bottom: 1px solid
+                    var(--c--contextuals--border--surface--primary);
                 `}
                 $padding="sm"
               >
@@ -155,7 +157,8 @@ export const ModalSelectVersion = ({
               <Box
                 $padding="xs"
                 $css={css`
-                  border-top: 1px solid var(--c--globals--colors--gray-200);
+                  border-top: 1px solid
+                    var(--c--contextuals--border--surface--primary);
                 `}
               >
                 <Button
@@ -174,6 +177,9 @@ export const ModalSelectVersion = ({
         <ModalConfirmationVersion
           onClose={() => {
             restoreModal.close();
+          }}
+          onSuccess={() => {
+            restoreModal.close();
             onClose();
             setSelectedVersionId(undefined);
           }}

src/frontend/apps/impress/src/features/docs/doc-versioning/components/VersionItem.tsx

@@ -1,78 +1,38 @@
-import dynamic from 'next/dynamic';
+import { useTranslation } from 'react-i18next';
-import { useState } from 'react';
 
-import { Box, Text } from '@/components';
+import { BoxButton, Text } from '@/components';
 import { useCunninghamTheme } from '@/cunningham';
-import { Doc } from '@/docs/doc-management';
-
-import { Versions } from '../types';
-
-const ModalConfirmationVersion = dynamic(
-  () =>
-    import('./ModalConfirmationVersion').then((mod) => ({
-      default: mod.ModalConfirmationVersion,
-    })),
-  { ssr: false },
-);
 
 interface VersionItemProps {
-  docId: Doc['id'];
   text: string;
-
-  versionId?: Versions['version_id'];
   isActive: boolean;
+  onSelect?: () => void;
 }
 
-export const VersionItem = ({
+export const VersionItem = ({ text, isActive, onSelect }: VersionItemProps) => {
-  docId,
+  const { t } = useTranslation();
-  versionId,
+  const { spacingsTokens } = useCunninghamTheme();
-  text,
-
-  isActive,
-}: VersionItemProps) => {
-  const { colorsTokens, spacingsTokens } = useCunninghamTheme();
-
-  const [isModalVersionOpen, setIsModalVersionOpen] = useState(false);
 
   return (
-    <>
+    <BoxButton
-      <Box
+      aria-label={t('Restore version of {{date}}', { date: text })}
-        $width="100%"
+      aria-pressed={isActive}
-        as="li"
+      $width="100%"
-        $background={isActive ? colorsTokens['gray-100'] : 'transparent'}
+      $css={`
-        $radius={spacingsTokens['3xs']}
+        background: ${isActive ? 'var(--c--contextuals--background--semantic--overlay--primary)' : 'transparent'};
-        $css={`
+        &:focus-visible, &:hover {
-          cursor: pointer;
+          background: var(--c--contextuals--background--semantic--overlay--primary);
-
+        }
-          &:hover {
+      `}
-            background: ${colorsTokens['gray-100']};
+      className="version-item --docs--version-item"
-          }
+      onClick={onSelect}
-        `}
+      $radius={spacingsTokens['3xs']}
-        $hasTransition
+      $padding={{ vertical: 'm', horizontal: 'xs' }}
-        $minWidth="13rem"
+      $hasTransition
-        className="--docs--version-item"
+    >
-      >
+      <Text $weight="bold" $size="sm" $textAlign="left">
-        <Box
+        {text}
-          $padding={{ vertical: '0.7rem', horizontal: 'small' }}
+      </Text>
-          $align="center"
+    </BoxButton>
-          $direction="row"
-          $justify="space-between"
-          $width="100%"
-        >
-          <Box $direction="row" $gap="0.5rem" $align="center">
-            <Text $weight="bold" $size="sm">
-              {text}
-            </Text>
-          </Box>
-        </Box>
-      </Box>
-      {isModalVersionOpen && versionId && (
-        <ModalConfirmationVersion
-          onClose={() => setIsModalVersionOpen(false)}
-          docId={docId}
-          versionId={versionId}
-        />
-      )}
-    </>
   );
 };

src/frontend/apps/impress/src/features/docs/doc-versioning/components/VersionList.tsx

@@ -3,14 +3,7 @@ import { DateTime } from 'luxon';
 import { useTranslation } from 'react-i18next';
 
 import { APIError } from '@/api';
-import {
+import { Box, Icon, InfiniteScroll, Text, TextErrors } from '@/components';
-  Box,
-  BoxButton,
-  Icon,
-  InfiniteScroll,
-  Text,
-  TextErrors,
-} from '@/components';
 import { Doc } from '@/docs/doc-management';
 import { useDate } from '@/hooks';
 
@@ -23,7 +16,6 @@ interface VersionListStateProps {
   isLoading: boolean;
   error: APIError<unknown> | null;
   versions?: Versions[];
-  doc: Doc;
   selectedVersionId?: Versions['version_id'];
   onSelectVersion?: (versionId: Versions['version_id']) => void;
 }
@@ -31,13 +23,11 @@ interface VersionListStateProps {
 const VersionListState = ({
   onSelectVersion,
   selectedVersionId,
-
   isLoading,
   error,
   versions,
-  doc,
 }: VersionListStateProps) => {
-  const { formatDate } = useDate();
+  const { formatDateSpecial } = useDate();
 
   if (isLoading) {
     return (
@@ -48,24 +38,23 @@ const VersionListState = ({
   }
 
   return (
-    <Box $gap="10px" $padding="xs">
+    <Box $gap="xxs" $padding="xs">
-      {versions?.map((version) => (
+      {versions?.map((version) => {
-        <BoxButton
+        const formattedDate = formatDateSpecial(
-          aria-label="version item"
+          version.last_modified,
-          className="version-item"
+          'dd MMMM · HH:mm',
-          key={version.version_id}
+        );
-          onClick={() => {
+        const isSelected = version.version_id === selectedVersionId;
-            onSelectVersion?.(version.version_id);
+        return (
-          }}
+          <Box as="li" key={version.version_id} $css="list-style: none;">
-        >
+            <VersionItem
-          <VersionItem
+              text={formattedDate}
-            versionId={version.version_id}
+              isActive={isSelected}
-            text={formatDate(version.last_modified, DateTime.DATETIME_MED)}
+              onSelect={() => onSelectVersion?.(version.version_id)}
-            docId={doc.id}
+            />
-            isActive={version.version_id === selectedVersionId}
+          </Box>
-          />
+        );
-        </BoxButton>
+      })}
-      ))}
       {error && (
         <Box
           $justify="center"
@@ -97,6 +86,7 @@ export const VersionList = ({
   selectedVersionId,
 }: VersionListProps) => {
   const { t } = useTranslation();
+  const { formatDate } = useDate();
 
   const {
     data,
@@ -112,6 +102,12 @@ export const VersionList = ({
   const versions = data?.pages.reduce((acc, page) => {
     return acc.concat(page.versions);
   }, [] as Versions[]);
+  const selectedVersion = versions?.find(
+    (version) => version.version_id === selectedVersionId,
+  );
+  const selectedVersionDate = selectedVersion
+    ? formatDate(selectedVersion.last_modified, DateTime.DATETIME_MED)
+    : null;
 
   return (
     <Box
@@ -127,7 +123,7 @@ export const VersionList = ({
         as="ul"
         $padding="none"
         $margin={{ top: 'none' }}
-        role="listbox"
+        role="list"
       >
         {versions?.length === 0 && (
           <Box $align="center" $margin="large">
@@ -141,10 +137,14 @@ export const VersionList = ({
           isLoading={isLoading}
           error={error}
           versions={versions}
-          doc={doc}
           selectedVersionId={selectedVersionId}
         />
       </InfiniteScroll>
+      <Text className="sr-only" aria-live="polite">
+        {selectedVersionDate
+          ? t('Selected version {{date}}', { date: selectedVersionDate })
+          : ''}
+      </Text>
     </Box>
   );
 };

src/frontend/apps/impress/src/features/docs/doc-versioning/types.ts

@@ -1,4 +1,4 @@
-import { Doc } from '../doc-management';
+import { Doc } from '../doc-management/types';
 
 export interface APIListVersions {
   count: number;

src/frontend/apps/impress/src/features/docs/docs-grid/components/DocsGrid.tsx

@@ -116,7 +116,9 @@ export const DocsGrid = ({
         $padding={{
           bottom: 'md',
         }}
-        {...(withUpload ? getRootProps({ className: 'dropzone' }) : {})}
+        {...(withUpload
+          ? getRootProps({ className: 'dropzone', tabIndex: -1 })
+          : {})}
       >
         {withUpload && <input {...getInputProps()} />}
         <DocGridTitleBar

src/frontend/apps/impress/src/features/docs/docs-grid/components/DocsGridActions.tsx

@@ -19,7 +19,7 @@ import {
   useDuplicateDoc,
   useTrans,
 } from '@/docs/doc-management';
-import { MAIN_LAYOUT_ID } from '@/layouts/conf';
+import { focusMainContentStart } from '@/layouts/utils';
 import { useFocusStore } from '@/stores';
 
 import { DocMoveModal } from './DocMoveModal';
@@ -55,10 +55,9 @@ export const DocsGridActions = ({ doc }: DocsGridActionsProps) => {
 
   const { mutate: duplicateDoc } = useDuplicateDoc({
     onSuccess: () => {
-      const mainContent = document.getElementById(MAIN_LAYOUT_ID);
+      requestAnimationFrame(() => {
-      if (mainContent) {
+        focusMainContentStart({ preventScroll: true });
-        requestAnimationFrame(() => mainContent.focus());
+      });
-      }
     },
   });
 

src/frontend/apps/impress/src/features/docs/docs-grid/components/__tests__/DocsGridItemDate.test.tsx

@@ -1,4 +1,4 @@
-import { render, screen, waitFor } from '@testing-library/react';
+import { act, render, screen, waitFor } from '@testing-library/react';
 import fetchMock from 'fetch-mock';
 import i18next from 'i18next';
 import { DateTime } from 'luxon';
@@ -73,7 +73,9 @@ describe('DocsGridItemDate', () => {
   });
 
   it(`should render rendered the updated_at field in the correct language`, async () => {
-    await i18next.changeLanguage('fr');
+    await act(async () => {
+      await i18next.changeLanguage('fr');
+    });
 
     render(
       <DocsGridItemDate
@@ -90,7 +92,9 @@ describe('DocsGridItemDate', () => {
 
     expect(screen.getByText('il y a 5 jours')).toBeInTheDocument();
 
-    await i18next.changeLanguage('en');
+    await act(async () => {
+      await i18next.changeLanguage('en');
+    });
   });
 
   [

src/frontend/apps/impress/src/features/help/components/HelpMenu.tsx

@@ -60,7 +60,7 @@ export const HelpMenu = ({
         >
           <Box $direction="row" $align="center">
             <Button
-              aria-label={t('Open onboarding menu')}
+              aria-label={t('Open help menu')}
               color={colorButton || 'neutral'}
               variant="tertiary"
               iconPosition="left"

src/frontend/apps/impress/src/features/language/components/LanguagePicker.tsx

@@ -1,3 +1,4 @@
+import { announce } from '@react-aria/live-announcer';
 import { useMemo } from 'react';
 import { useTranslation } from 'react-i18next';
 import { css } from 'styled-components';
@@ -17,23 +18,35 @@ export const LanguagePicker = () => {
   const { changeLanguageSynchronized } = useSynchronizedLanguage();
   const language = i18n.language;
 
+  const toLangTag = (locale: string) => locale.replace('_', '-');
+
   // Compute options for dropdown
   const optionsPicker = useMemo(() => {
     const backendOptions = conf?.LANGUAGES ?? [[language, language]];
     return backendOptions.map(([backendLocale, backendLabel]) => {
       return {
         label: backendLabel,
+        lang: toLangTag(backendLocale),
+        value: backendLocale,
         isSelected: getMatchingLocales([backendLocale], [language]).length > 0,
-        callback: () => changeLanguageSynchronized(backendLocale, user),
+        callback: async () => {
+          await changeLanguageSynchronized(backendLocale, user);
+          announce(
+            t('Language changed to {{language}}', {
+              language: backendLabel,
+              defaultValue: `Language changed to ${backendLabel}`,
+            }),
+            'polite',
+          );
+        },
       };
     });
-  }, [changeLanguageSynchronized, conf?.LANGUAGES, language, user]);
+  }, [changeLanguageSynchronized, conf?.LANGUAGES, language, t, user]);
 
   // Extract current language label for display
-  const currentLanguageLabel =
+  const [currentLanguageCode, currentLanguageLabel] = conf?.LANGUAGES.find(
-    conf?.LANGUAGES.find(
+    ([code]) => getMatchingLocales([code], [language]).length > 0,
-      ([code]) => getMatchingLocales([code], [language]).length > 0,
+  ) ?? [language, language];
-    )?.[1] || language;
 
   return (
     <DropdownMenu
@@ -65,7 +78,9 @@ export const LanguagePicker = () => {
         $align="center"
       >
         <Icon iconName="translate" $color="inherit" $size="xl" />
-        {currentLanguageLabel}
+        <span lang={toLangTag(currentLanguageCode)}>
+          {currentLanguageLabel}
+        </span>
       </Box>
     </DropdownMenu>
   );

src/frontend/apps/impress/src/features/left-panel/components/LeftPanel.tsx

@@ -1,3 +1,5 @@
+import { usePathname } from 'next/navigation';
+import { useEffect } from 'react';
 import { useTranslation } from 'react-i18next';
 import { createGlobalStyle, css } from 'styled-components';
 
@@ -23,11 +25,15 @@ const MobileLeftPanelStyle = createGlobalStyle`
 
 export const LeftPanel = () => {
   const { isDesktop } = useResponsiveStore();
-  const { t } = useTranslation();
+  if (isDesktop) {
+    return <LeftPanelDesktop />;
+  }
 
-  const { spacingsTokens } = useCunninghamTheme();
+  return <LeftPanelMobile />;
-  const { isPanelOpen, isPanelOpenMobile } = useLeftPanelStore();
+};
-  const isPanelOpenState = isDesktop ? isPanelOpen : isPanelOpenMobile;
+
+export const LeftPanelDesktop = () => {
+  const { t } = useTranslation();
   const { data: config } = useConfig();
   /**
    * The onboarding can be disable, so we need to check if it's enabled before displaying the help menu.
@@ -36,42 +42,51 @@ export const LeftPanel = () => {
    */
   const showHelpMenu = config?.theme_customization?.onboarding?.enabled;
 
-  if (isDesktop) {
+  return (
-    return (
+    <Box
+      data-testid="left-panel-desktop"
+      $css={css`
+        height: calc(100vh - ${HEADER_HEIGHT}px);
+        width: 100%;
+        overflow: hidden;
+        background-color: var(--c--contextuals--background--surface--primary);
+      `}
+      className="--docs--left-panel-desktop"
+      as="nav"
+      aria-label={t('Document sections')}
+    >
       <Box
-        data-testid="left-panel-desktop"
         $css={css`
-          height: calc(100vh - ${HEADER_HEIGHT}px);
+          flex: 0 0 auto;
-          width: 100%;
-          overflow: hidden;
-          background-color: var(--c--contextuals--background--surface--primary);
         `}
-        className="--docs--left-panel-desktop"
-        as="nav"
-        aria-label={t('Document sections')}
       >
-        <Box
+        <LeftPanelHeader />
-          $css={css`
-            flex: 0 0 auto;
-          `}
-        >
-          <LeftPanelHeader />
-        </Box>
-        <LeftPanelContent />
-        {showHelpMenu && (
-          <SeparatedSection showSeparator={false}>
-            <Box $padding={{ horizontal: 'sm' }} $justify="flex-start">
-              <HelpMenu />
-            </Box>
-          </SeparatedSection>
-        )}
       </Box>
-    );
+      <LeftPanelContent />
-  }
+      {showHelpMenu && (
+        <SeparatedSection showSeparator={false}>
+          <Box $padding={{ horizontal: 'sm' }} $justify="flex-start">
+            <HelpMenu />
+          </Box>
+        </SeparatedSection>
+      )}
+    </Box>
+  );
+};
+
+const LeftPanelMobile = () => {
+  const { t } = useTranslation();
+  const { spacingsTokens } = useCunninghamTheme();
+  const { closePanel, isPanelOpenMobile } = useLeftPanelStore();
+  const pathname = usePathname();
+
+  useEffect(() => {
+    closePanel({ type: 'mobile' });
+  }, [pathname, closePanel]);
 
   return (
     <>
-      {isPanelOpenState && <MobileLeftPanelStyle />}
+      {isPanelOpenMobile && <MobileLeftPanelStyle />}
       <Box
         $hasTransition
         $height="100vh"
@@ -81,7 +96,7 @@ export const LeftPanel = () => {
           height: calc(100dvh - 52px);
           border-right: 1px solid var(--c--globals--colors--gray-200);
           position: fixed;
-          transform: translateX(${isPanelOpenState ? '0' : '-100dvw'});
+          transform: translateX(${isPanelOpenMobile ? '0' : '-100dvw'});
           background-color: var(--c--contextuals--background--surface--primary);
           overflow-y: auto;
           overflow-x: hidden;

src/frontend/apps/impress/src/features/left-panel/components/LeftPanelCollapseButton.tsx

@@ -18,8 +18,46 @@ export const LeftPanelCollapseButton = () => {
   const { isPanelOpen, togglePanel } = useLeftPanelStore();
   const { currentDoc } = useDocStore();
   const [isDocTitleVisible, setIsDocTitleVisible] = useState(true);
+  const [isDocTitleInDom, setIsDocTitleInDom] = useState(true);
 
+  /**
+   * CLASS_DOC_TITLE is not every time in the DOM when
+   * this component is rendered, we need to observe the DOM
+   * to know when it is added, then we can observe
+   * its visibility.
+   */
   useEffect(() => {
+    setIsDocTitleInDom(false);
+
+    const docTitleEl = document.querySelector(`.${CLASS_DOC_TITLE}`);
+    if (docTitleEl) {
+      setIsDocTitleInDom(true);
+      return;
+    }
+
+    const mutationObserver = new MutationObserver(() => {
+      if (document.querySelector(`.${CLASS_DOC_TITLE}`)) {
+        mutationObserver.disconnect();
+        setIsDocTitleInDom(true);
+      }
+    });
+
+    mutationObserver.observe(document.body, { childList: true, subtree: true });
+
+    return () => {
+      mutationObserver.disconnect();
+    };
+  }, [currentDoc?.id]);
+
+  /**
+   * When the doc title is in the DOM, we observe its
+   * visibility to show or hide the collapse button accordingly
+   */
+  useEffect(() => {
+    if (!isDocTitleInDom) {
+      return;
+    }
+
     const mainContent = document.getElementById(MAIN_LAYOUT_ID);
     const docTitleEl = document.querySelector(`.${CLASS_DOC_TITLE}`);
 
@@ -43,7 +81,7 @@ export const LeftPanelCollapseButton = () => {
       observer.disconnect();
       setIsDocTitleVisible(true);
     };
-  }, [currentDoc?.id]);
+  }, [isDocTitleInDom]);
 
   const { untitledDocument } = useTrans();
 

src/frontend/apps/impress/src/features/left-panel/components/LeftPanelContent.tsx

@@ -2,7 +2,6 @@ import { useRouter } from 'next/router';
 import { css } from 'styled-components';
 
 import { Box, SeparatedSection } from '@/components';
-import { useDocStore } from '@/docs/doc-management';
 
 import { LeftPanelTargetFilters } from './LefPanelTargetFilters';
 import { LeftPanelDocContent } from './LeftPanelDocContent';
@@ -12,33 +11,35 @@ export const LeftPanelContent = () => {
   const router = useRouter();
   const isHome = router.pathname === '/';
   const isDoc = router.pathname === '/docs/[id]';
-  const { currentDoc } = useDocStore();
 
-  return (
+  if (isHome) {
-    <>
+    return (
-      {isHome && (
+      <>
-        <>
+        <Box
-          <Box
+          $width="100%"
-            $width="100%"
+          $css={css`
-            $css={css`
+            flex: 0 0 auto;
-              flex: 0 0 auto;
+          `}
-            `}
+          className="--docs--home-left-panel-content"
-            className="--docs--home-left-panel-content"
+        >
-          >
+          <SeparatedSection showSeparator={false}>
-            <SeparatedSection showSeparator={false}>
+            <LeftPanelTargetFilters />
-              <LeftPanelTargetFilters />
+          </SeparatedSection>
-            </SeparatedSection>
+        </Box>
-          </Box>
+        <Box
-          <Box
+          $flex={1}
-            $flex={1}
+          $width="100%"
-            $width="100%"
+          $css="overflow-y: auto; overflow-x: hidden;"
-            $css="overflow-y: auto; overflow-x: hidden;"
+        >
-          >
+          <LeftPanelFavorites />
-            <LeftPanelFavorites />
+        </Box>
-          </Box>
+      </>
-        </>
+    );
-      )}
+  }
-      {isDoc && currentDoc && <LeftPanelDocContent doc={currentDoc} />}
+
-    </>
+  if (isDoc) {
-  );
+    return <LeftPanelDocContent />;
+  }
+
+  return null;
 };

src/frontend/apps/impress/src/features/left-panel/components/LeftPanelDocContent.tsx

@@ -1,15 +1,13 @@
 import { useTreeContext } from '@gouvfr-lasuite/ui-kit';
 
 import { Box } from '@/components';
-import { Doc } from '@/docs/doc-management';
+import { Doc, useDocStore } from '@/docs/doc-management';
 import { DocTree } from '@/docs/doc-tree/';
+import { TreeSkeleton } from '@/features/skeletons/components/TreeSkeleton';
 
-export const LeftPanelDocContent = ({ doc }: { doc: Doc }) => {
+export const LeftPanelDocContent = () => {
   const tree = useTreeContext<Doc>();
-
+  const { currentDoc } = useDocStore();
-  if (!tree) {
-    return null;
-  }
 
   return (
     <Box
@@ -18,7 +16,11 @@ export const LeftPanelDocContent = ({ doc }: { doc: Doc }) => {
       $css="width: 100%; overflow-y: auto; overflow-x: hidden;"
       className="--docs--left-panel-doc-content"
     >
-      <DocTree currentDoc={doc} />
+      {tree && currentDoc ? (
+        <DocTree currentDoc={currentDoc} />
+      ) : (
+        <TreeSkeleton />
+      )}
     </Box>
   );
 };

src/frontend/apps/impress/src/features/service-worker/__tests__/DocsDB.test.tsx

@@ -1,12 +1,7 @@
-import { afterEach, describe, expect, it, vi } from 'vitest';
+import { describe, expect, it, vi } from 'vitest';
-
-vi.mock('@/../package.json', () => ({
-  default: { version: '0.0.0' },
-}));
 
 describe('DocsDB', () => {
-  afterEach(() => {
+  beforeEach(() => {
-    vi.clearAllMocks();
     vi.resetModules();
   });
 
@@ -20,17 +15,16 @@ describe('DocsDB', () => {
     { version: '3.0.0', expected: 3000000 },
     { version: '10.20.30', expected: 10020030 },
   ].forEach(({ version, expected }) => {
-    it(`correctly computes version for ${version}`, () => {
+    it(`correctly computes version for ${version}`, async () => {
       vi.doMock('@/../package.json', () => ({
         default: { version },
       }));
 
-      return vi.importActual('../DocsDB').then((module: any) => {
+      const module = await import('../DocsDB');
-        const result = module.getCurrentVersion();
+      const result = (module as any).getCurrentVersion();
-        expect(result).toBe(expected);
+      expect(result).toBe(expected);
-        expect(result).toBeGreaterThan(previousExpected);
+      expect(result).toBeGreaterThan(previousExpected);
-        previousExpected = result;
+      previousExpected = result;
-      });
     });
   });
 });

src/frontend/apps/impress/src/features/skeletons/components/DocEditorSkeleton.tsx

@@ -1,69 +1,12 @@
-import { css, keyframes } from 'styled-components';
+import { Box } from '@/components';
-
-import { Box, BoxType } from '@/components';
 import { useCunninghamTheme } from '@/cunningham';
 import { useResponsiveStore } from '@/stores';
 
-const shimmer = keyframes`
+import { SkeletonCircle, SkeletonLine } from './SkeletionUI';
-  0% {
-    background-position: -1000px 0;
-  }
-  100% {
-    background-position: 1000px 0;
-  }
-`;
-
-type SkeletonLineProps = Partial<BoxType>;
-
-type SkeletonCircleProps = Partial<BoxType>;
 
 export const DocEditorSkeleton = () => {
   const { isDesktop } = useResponsiveStore();
-  const { spacingsTokens, colorsTokens } = useCunninghamTheme();
+  const { spacingsTokens } = useCunninghamTheme();
-
-  const SkeletonLine = ({ $css, ...props }: SkeletonLineProps) => {
-    return (
-      <Box
-        $width="100%"
-        $height="16px"
-        $css={css`
-          background: linear-gradient(
-            90deg,
-            ${colorsTokens['black-050']} 0%,
-            ${colorsTokens['black-100']} 50%,
-            ${colorsTokens['black-050']} 100%
-          );
-          background-size: 1000px 100%;
-          animation: ${shimmer} 2s infinite linear;
-          border-radius: 4px;
-          ${$css}
-        `}
-        {...props}
-      />
-    );
-  };
-
-  const SkeletonCircle = ({ $css, ...props }: SkeletonCircleProps) => {
-    return (
-      <Box
-        $width="32px"
-        $height="32px"
-        $css={css`
-          background: linear-gradient(
-            90deg,
-            ${colorsTokens['black-050']} 0%,
-            ${colorsTokens['black-100']} 50%,
-            ${colorsTokens['black-050']} 100%
-          );
-          background-size: 1000px 100%;
-          animation: ${shimmer} 2s infinite linear;
-          border-radius: 50%;
-          ${$css}
-        `}
-        {...props}
-      />
-    );
-  };
 
   return (
     <>

src/frontend/apps/impress/src/features/skeletons/components/SkeletionUI.tsx

@@ -0,0 +1,65 @@
+import { css, keyframes } from 'styled-components';
+
+import { Box, BoxType } from '@/components/Box';
+import { useCunninghamTheme } from '@/cunningham/useCunninghamTheme';
+
+const shimmer = keyframes`
+  0% {
+    background-position: -1000px 0;
+  }
+  100% {
+    background-position: 1000px 0;
+  }
+`;
+
+type SkeletonLineProps = Partial<BoxType>;
+
+type SkeletonCircleProps = Partial<BoxType>;
+
+export const SkeletonLine = ({ $css, ...props }: SkeletonLineProps) => {
+  const { colorsTokens } = useCunninghamTheme();
+
+  return (
+    <Box
+      $width="100%"
+      $height="16px"
+      $css={css`
+        background: linear-gradient(
+          90deg,
+          ${colorsTokens['black-050']} 0%,
+          ${colorsTokens['black-100']} 50%,
+          ${colorsTokens['black-050']} 100%
+        );
+        background-size: 1000px 100%;
+        animation: ${shimmer} 2s infinite linear;
+        border-radius: 4px;
+        ${$css}
+      `}
+      {...props}
+    />
+  );
+};
+
+export const SkeletonCircle = ({ $css, ...props }: SkeletonCircleProps) => {
+  const { colorsTokens } = useCunninghamTheme();
+
+  return (
+    <Box
+      $width="32px"
+      $height="32px"
+      $css={css`
+        background: linear-gradient(
+          90deg,
+          ${colorsTokens['black-050']} 0%,
+          ${colorsTokens['black-100']} 50%,
+          ${colorsTokens['black-050']} 100%
+        );
+        background-size: 1000px 100%;
+        animation: ${shimmer} 2s infinite linear;
+        border-radius: 50%;
+        ${$css}
+      `}
+      {...props}
+    />
+  );
+};

src/frontend/apps/impress/src/features/skeletons/components/TreeSkeleton.tsx

@@ -0,0 +1,30 @@
+import { Box } from '@/components';
+
+import { SkeletonLine } from './SkeletionUI';
+
+export const TreeSkeleton = () => {
+  return (
+    <Box className="--docs--tree-skeleton">
+      <SkeletonLine
+        $width="92%"
+        $height="40px"
+        $margin={{ left: 'sm', top: 'sm' }}
+      />
+      <SkeletonLine
+        $width="92%"
+        $height="30px"
+        $margin={{ left: 'sm', top: 'sm' }}
+      />
+      <SkeletonLine
+        $width="92%"
+        $height="30px"
+        $margin={{ left: 'sm', top: 'sm' }}
+      />
+      <SkeletonLine
+        $width="92%"
+        $height="30px"
+        $margin={{ left: 'sm', top: 'sm' }}
+      />
+    </Box>
+  );
+};

src/frontend/apps/impress/src/hooks/useClipboard.tsx

@@ -2,7 +2,6 @@ import {
   VariantType,
   useToastProvider,
 } from '@gouvfr-lasuite/cunningham-react';
-import { announce } from '@react-aria/live-announcer';
 import { useCallback } from 'react';
 import { useTranslation } from 'react-i18next';
 
@@ -19,14 +18,12 @@ export const useClipboard = () => {
           toast(message, VariantType.SUCCESS, {
             duration: 3000,
           });
-          announce(message, 'polite');
         })
         .catch(() => {
           const message = errorMessage ?? t('Failed to copy to clipboard');
           toast(message, VariantType.ERROR, {
             duration: 3000,
           });
-          announce(message, 'assertive');
         });
     },
     [t, toast],

src/frontend/apps/impress/src/hooks/useDate.tsx

@@ -21,6 +21,10 @@ export const useDate = () => {
       .toLocaleString(format);
   };
 
+  const formatDateSpecial = (date: string, format: string): string => {
+    return DateTime.fromISO(date).setLocale(i18n.language).toFormat(format);
+  };
+
   const relativeDate = (date: string): string => {
     const dateToCompare = DateTime.fromISO(date);
 
@@ -45,5 +49,5 @@ export const useDate = () => {
       ),
     );
 
-  return { formatDate, relativeDate, calculateDaysLeft };
+  return { formatDate, formatDateSpecial, relativeDate, calculateDaysLeft };
 };

src/frontend/apps/impress/src/hooks/useRouteChangeCompleteFocus.tsx

@@ -1,7 +1,10 @@
 import { useRouter } from 'next/router';
 import { useEffect, useRef } from 'react';
 
-import { MAIN_LAYOUT_ID } from '@/layouts/conf';
+import {
+  focusMainContentStart,
+  getMainContentFocusTarget,
+} from '@/layouts/utils';
 
 export const useRouteChangeCompleteFocus = () => {
   const router = useRouter();
@@ -25,27 +28,24 @@ export const useRouteChangeCompleteFocus = () => {
       lastCompletedPathRef.current = normalizedUrl;
 
       requestAnimationFrame(() => {
-        const mainContent =
+        const focusTarget = getMainContentFocusTarget();
-          document.getElementById(MAIN_LAYOUT_ID) ??
-          document.getElementsByTagName('main')[0];
 
-        if (!mainContent) {
+        if (!focusTarget) {
           return;
         }
 
-        const firstHeading = mainContent.querySelector('h1, h2, h3');
         const prefersReducedMotion = window.matchMedia(
           '(prefers-reduced-motion: reduce)',
         ).matches;
 
         if (isKeyboardNavigationRef.current) {
-          (mainContent as HTMLElement | null)?.focus({ preventScroll: true });
+          focusMainContentStart({ preventScroll: true });
           isKeyboardNavigationRef.current = false;
         }
         if (router.pathname === '/docs/[id]') {
           return;
         }
-        (firstHeading ?? mainContent)?.scrollIntoView({
+        focusTarget.scrollIntoView({
           behavior: prefersReducedMotion ? 'auto' : 'smooth',
           block: 'start',
         });

src/frontend/apps/impress/src/i18n/translations.json

@@ -905,7 +905,7 @@
       "Open Source": "Open Source",
       "Open document {{title}}": "Ouvrir le document {{title}}",
       "Open document: {{title}}": "Ouvrir le document : {{title}}",
-      "Open onboarding menu": "Ouvrir le menu d'embarquement",
+      "Open help menu": "Ouvrir le menu d'aide",
       "Open root document": "Ouvrir le document racine",
       "Open the document options": "Ouvrir les options du document",
       "Open the menu of actions for the document: {{title}}": "Ouvrir le menu des actions du document : {{title}}",

src/frontend/apps/impress/src/layouts/MainLayout.tsx

@@ -3,7 +3,6 @@ import { useTranslation } from 'react-i18next';
 import { css } from 'styled-components';
 
 import { Box } from '@/components';
-import { useCunninghamTheme } from '@/cunningham';
 import { Header } from '@/features/header';
 import { HEADER_HEIGHT } from '@/features/header/conf';
 import { LeftPanel, ResizableLeftPanel } from '@/features/left-panel';
@@ -94,7 +93,6 @@ const MainContent = ({
   const { isDesktop } = useResponsiveStore();
 
   const { t } = useTranslation();
-  const { colorsTokens } = useCunninghamTheme();
   const currentBackgroundColor = !isDesktop ? 'white' : backgroundColor;
 
   return (
@@ -103,7 +101,6 @@ const MainContent = ({
       role="main"
       aria-label={t('Main content')}
       id={MAIN_LAYOUT_ID}
-      tabIndex={-1}
       $align="center"
       $flex={1}
       $width="100%"
@@ -120,14 +117,6 @@ const MainContent = ({
       $css={css`
         overflow-y: auto;
         overflow-x: clip;
-        &:focus-visible::after {
-          content: '';
-          position: absolute;
-          inset: 0;
-          border: 3px solid ${colorsTokens['brand-400']};
-          pointer-events: none;
-          z-index: 2001;
-        }
       `}
     >
       <Skeleton>

src/frontend/apps/impress/src/layouts/utils.ts

@@ -0,0 +1,37 @@
+import { MAIN_LAYOUT_ID } from './conf';
+
+export const getMainContentElement = (): HTMLElement | null =>
+  document.getElementById(MAIN_LAYOUT_ID) ??
+  document.getElementsByTagName('main')[0] ??
+  null;
+
+export const getMainContentFocusTarget = (): HTMLElement | null => {
+  const mainContent = getMainContentElement();
+
+  if (!mainContent) {
+    return null;
+  }
+
+  const firstHeading =
+    mainContent.querySelector('h1') ?? mainContent.querySelector('h2');
+
+  return firstHeading instanceof HTMLElement ? firstHeading : mainContent;
+};
+
+export const focusMainContentStart = (
+  options?: FocusOptions,
+): HTMLElement | null => {
+  const focusTarget = getMainContentFocusTarget();
+
+  if (!focusTarget) {
+    return null;
+  }
+
+  if (!focusTarget.hasAttribute('tabindex')) {
+    focusTarget.setAttribute('tabindex', '-1');
+  }
+
+  focusTarget.focus(options);
+
+  return focusTarget;
+};

src/frontend/apps/impress/src/pages/docs/[id]/index.tsx

@@ -19,6 +19,7 @@ import {
   useTrans,
 } from '@/docs/doc-management/';
 import { KEY_AUTH, setAuthUrl, useAuth } from '@/features/auth';
+import { FloatingBar } from '@/features/docs/doc-header/components/FloatingBar';
 import { getDocChildren, subPageToTree } from '@/features/docs/doc-tree/';
 import { DocEditorSkeleton, useSkeletonStore } from '@/features/skeletons';
 import { MainLayout } from '@/layouts';
@@ -60,6 +61,7 @@ export function DocLayout() {
         }}
       >
         <MainLayout enableResizablePanel={true}>
+          <FloatingBar />
           <DocPage id={id} />
         </MainLayout>
       </TreeProvider>

src/frontend/apps/impress/vitest.config.ts

@@ -1,16 +1,9 @@
 /// <reference types="vitest" />
 import react from '@vitejs/plugin-react';
-import tsconfigPaths from 'vite-tsconfig-paths';
 import { defineConfig } from 'vitest/config';
 
 export default defineConfig({
-  plugins: [
+  plugins: [react()],
-    react(),
-    tsconfigPaths({
-      root: '.',
-      projects: ['./tsconfig.json'],
-    }),
-  ],
   test: {
     globals: true,
     environment: 'jsdom',
@@ -22,4 +15,7 @@ export default defineConfig({
   define: {
     'process.env.NODE_ENV': 'test',
   },
+  resolve: {
+    tsconfigPaths: true,
+  },
 });

src/frontend/package.json

@@ -1,6 +1,6 @@
 {
   "name": "impress",
-  "version": "4.8.2",
+  "version": "4.8.3",
   "private": true,
   "repository": "https://github.com/suitenumerique/docs",
   "author": "DINUM",
@@ -32,17 +32,17 @@
   },
   "resolutions": {
     "@tiptap/extensions": "3.19.0",
-    "@types/node": "24.10.13",
+    "@types/node": "24.12.0",
     "@types/react": "19.2.14",
     "@types/react-dom": "19.2.3",
-    "eslint": "10.0.1",
+    "eslint": "10.0.3",
     "glob": "13.0.6",
     "prosemirror-view": "1.41.6",
     "react": "19.2.4",
     "react-dom": "19.2.4",
     "typescript": "5.9.3",
-    "wrap-ansi": "9.0.2",
+    "wrap-ansi": "10.0.0",
-    "yjs": "13.6.29"
+    "yjs": "13.6.30"
   },
   "packageManager": "yarn@1.22.22"
 }

src/frontend/packages/eslint-plugin-docs/base.js

@@ -2,7 +2,7 @@ const js = require('@eslint/js');
 const nextPlugin = require('@next/eslint-plugin-next');
 const tanstackQuery = require('@tanstack/eslint-plugin-query');
 const { defineConfig } = require('eslint/config');
-const importPlugin = require('eslint-plugin-import');
+const importPlugin = require('eslint-plugin-import-x');
 const jsxA11y = require('eslint-plugin-jsx-a11y');
 const prettier = require('eslint-plugin-prettier');
 const react = require('eslint-plugin-react');

src/frontend/packages/eslint-plugin-docs/package.json

@@ -1,6 +1,6 @@
 {
   "name": "eslint-plugin-docs",
-  "version": "4.8.2",
+  "version": "4.8.3",
   "repository": "https://github.com/suitenumerique/docs",
   "author": "DINUM",
   "license": "MIT",
@@ -18,22 +18,22 @@
   },
   "dependencies": {
     "@eslint/js": "10.0.1",
-    "@next/eslint-plugin-next": "16.1.6",
+    "@next/eslint-plugin-next": "16.1.7",
     "@tanstack/eslint-plugin-query": "5.91.4",
-    "@typescript-eslint/eslint-plugin": "8.56.0",
+    "@typescript-eslint/eslint-plugin": "8.57.1",
-    "@typescript-eslint/parser": "8.56.0",
+    "@typescript-eslint/parser": "8.57.1",
-    "@typescript-eslint/utils": "8.56.0",
+    "@typescript-eslint/utils": "8.57.1",
-    "@vitest/eslint-plugin": "1.6.9",
+    "@vitest/eslint-plugin": "1.6.12",
-    "eslint-config-next": "16.1.6",
+    "eslint-config-next": "16.1.7",
     "eslint-config-prettier": "10.1.8",
-    "eslint-plugin-import": "2.32.0",
+    "eslint-plugin-import-x": "4.16.2",
     "eslint-plugin-jest": "29.15.0",
     "eslint-plugin-jsx-a11y": "6.10.2",
-    "eslint-plugin-playwright": "2.5.1",
+    "eslint-plugin-playwright": "2.10.0",
     "eslint-plugin-prettier": "5.5.5",
     "eslint-plugin-react": "7.37.5",
-    "eslint-plugin-react-hooks": "5.2.0",
+    "eslint-plugin-react-hooks": "7.0.1",
-    "eslint-plugin-testing-library": "7.15.4",
+    "eslint-plugin-testing-library": "7.16.0",
     "prettier": "3.8.1"
   },
   "packageManager": "yarn@1.22.22"

src/frontend/packages/i18n/package.json

@@ -1,6 +1,6 @@
 {
   "name": "packages-i18n",
-  "version": "4.8.2",
+  "version": "4.8.3",
   "repository": "https://github.com/suitenumerique/docs",
   "author": "DINUM",
   "license": "MIT",
@@ -19,8 +19,8 @@
     "@types/node": "*",
     "eslint-plugin-docs": "*",
     "eslint-plugin-import": "2.32.0",
-    "i18next-parser": "9.3.0",
+    "i18next-parser": "9.4.0",
-    "jest": "30.2.0",
+    "jest": "30.3.0",
     "ts-jest": "29.4.6",
     "typescript": "*",
     "yargs": "18.0.0"