✨(backend) annotate number of accesses on documents

The new UI will display the number of accesses on each document. /!\ Once team accesses will be used, this will not represent the number of people with access anymore and will have to be improved by computing the number of people in each team.
✨(backend) allow users to mark/unmark documents as favorite
2024-11-16 00:32:01 +01:00 · 2024-11-16 00:32:01 +01:00 · 2024-11-16 00:32:01 +01:00 · 2024-11-15 10:33:56 +01:00 · 2024-11-14 17:36:11 +01:00 · 2024-11-14 17:36:11 +01:00
49 changed files with 2823 additions and 2219 deletions
@@ -11,17 +11,25 @@ and this project adheres to

 ## Added

+- ✨(backend) annotate number of accesses on documents in list view #411
+- ✨(backend) allow users to mark/unmark documents as favorite #411
 - 🌐(frontend) Add German translation #255
+- ✨(frontend) Add a broadcast store #387
+

 ## Changed

+- ⚡️(backend) optimize number of queries on document list view #411
 - 🚸(backend) improve users similarity search and sort results #391
 - 🌐(backend) add german translation #259
+- ♻️(frontend) simplify stores #402
+- ✨(frontend) update $css Box props type to add styled components RuleSet #423

 ## Fixed

 - 🦺(backend) add comma to sub regex #408
 - 🐛(editor) collaborative user tag hidden when read only #385
+- 🐛(frontend) user have view access when revoked #387


 ## [1.7.0] - 2024-10-24
@@ -137,32 +137,65 @@ class BaseResourceSerializer(serializers.ModelSerializer):
        return {}


-class DocumentSerializer(BaseResourceSerializer):
-    """Serialize documents."""
+class ListDocumentSerializer(BaseResourceSerializer):
+    """Serialize documents with limited fields for display in lists."""

-    content = serializers.CharField(required=False)
-    accesses = DocumentAccessSerializer(many=True, read_only=True)
+    is_favorite = serializers.BooleanField(read_only=True)
+    nb_accesses = serializers.IntegerField(read_only=True)

    class Meta:
        model = models.Document
        fields = [
            "id",
-            "content",
-            "title",
-            "accesses",
            "abilities",
+            "content",
+            "created_at",
+            "is_favorite",
            "link_role",
            "link_reach",
-            "created_at",
+            "nb_accesses",
+            "title",
            "updated_at",
        ]
        read_only_fields = [
            "id",
-            "accesses",
            "abilities",
+            "created_at",
+            "is_favorite",
            "link_role",
            "link_reach",
+            "nb_accesses",
+            "updated_at",
+        ]
+
+
+class DocumentSerializer(ListDocumentSerializer):
+    """Serialize documents with all fields for display in detail views."""
+
+    content = serializers.CharField(required=False)
+
+    class Meta:
+        model = models.Document
+        fields = [
+            "id",
+            "abilities",
+            "content",
            "created_at",
+            "is_favorite",
+            "link_role",
+            "link_reach",
+            "nb_accesses",
+            "title",
+            "updated_at",
+        ]
+        read_only_fields = [
+            "id",
+            "abilities",
+            "created_at",
+            "is_avorite",
+            "link_role",
+            "link_reach",
+            "nb_accesses",
            "updated_at",
        ]

@@ -10,10 +10,13 @@ from django.contrib.postgres.search import TrigramSimilarity
 from django.core.exceptions import ValidationError
 from django.core.files.storage import default_storage
 from django.db.models import (
+    Count,
+    Exists,
    Min,
    OuterRef,
    Q,
    Subquery,
+    Value,
 )
 from django.http import Http404

@@ -191,42 +194,6 @@ class UserViewSet(
        )


-class ResourceViewsetMixin:
-    """Mixin with methods common to all resource viewsets that are managed with accesses."""
-
-    filter_backends = [filters.OrderingFilter]
-    ordering_fields = ["created_at", "updated_at", "title"]
-    ordering = ["-created_at"]
-
-    def get_queryset(self):
-        """Custom queryset to get user related resources."""
-        queryset = super().get_queryset()
-        user = self.request.user
-
-        if not user.is_authenticated:
-            return queryset
-
-        user_roles_query = (
-            self.access_model_class.objects.filter(
-                Q(user=user) | Q(team__in=user.teams),
-                **{self.resource_field_name: OuterRef("pk")},
-            )
-            .values(self.resource_field_name)
-            .annotate(roles_array=ArrayAgg("role"))
-            .values("roles_array")
-        )
-        return queryset.annotate(user_roles=Subquery(user_roles_query)).distinct()
-
-    def perform_create(self, serializer):
-        """Set the current user as owner of the newly created object."""
-        obj = serializer.save()
-        self.access_model_class.objects.create(
-            user=self.request.user,
-            role=models.RoleChoices.OWNER,
-            **{self.resource_field_name: obj},
-        )
-
-
 class ResourceAccessViewsetMixin:
    """Mixin with methods common to all access viewsets."""

@@ -336,7 +303,6 @@ class DocumentMetadata(metadata.SimpleMetadata):


 class DocumentViewSet(
-    ResourceViewsetMixin,
    mixins.CreateModelMixin,
    mixins.DestroyModelMixin,
    mixins.UpdateModelMixin,
@@ -344,20 +310,59 @@ class DocumentViewSet(
 ):
    """Document ViewSet"""

+    filter_backends = [filters.OrderingFilter]
+    metadata_class = DocumentMetadata
+    ordering = ["-updated_at"]
+    ordering_fields = ["created_at", "is_favorite", "updated_at", "title"]
    permission_classes = [
        permissions.AccessPermission,
    ]
-    serializer_class = serializers.DocumentSerializer
-    access_model_class = models.DocumentAccess
-    resource_field_name = "document"
    queryset = models.Document.objects.all()
-    ordering = ["-updated_at"]
-    metadata_class = DocumentMetadata
+    serializer_class = serializers.DocumentSerializer
+
+    def get_serializer_class(self):
+        """
+        Use ListDocumentSerializer for list actions, otherwise use DocumentSerializer.
+        """
+        if self.action == "list":
+            return serializers.ListDocumentSerializer
+        return self.serializer_class
+
+    def get_queryset(self):
+        """Optimize queryset to include favorite status for the current user."""
+        queryset = super().get_queryset()
+        user = self.request.user
+
+        # Annotate the number of accesses associated with each document
+        queryset = queryset.annotate(nb_accesses=Count("accesses"))
+
+        if not user.is_authenticated:
+            # If the user is not authenticated, annotate `is_favorite` as False
+            return queryset.annotate(is_favorite=Value(False))
+
+        # Annotate the queryset to indicate if the document is favorited by the current user
+        favorite_exists = models.DocumentFavorite.objects.filter(
+            document_id=OuterRef("pk"), user=user
+        )
+        queryset = queryset.annotate(is_favorite=Exists(favorite_exists))
+
+        # Annotate the queryset with the logged-in user roles
+        user_roles_query = (
+            models.DocumentAccess.objects.filter(
+                Q(user=user) | Q(team__in=user.teams),
+                document_id=OuterRef("pk"),
+            )
+            .values("document")
+            .annotate(roles_array=ArrayAgg("role"))
+            .values("roles_array")
+        )
+        return queryset.annotate(user_roles=Subquery(user_roles_query)).distinct()

    def list(self, request, *args, **kwargs):
        """Restrict resources returned by the list endpoint"""
        queryset = self.filter_queryset(self.get_queryset())
        user = self.request.user
+
        if user.is_authenticated:
            queryset = queryset.filter(
                Q(accesses__user=user)
@@ -401,6 +406,15 @@ class DocumentViewSet(

        return drf_response.Response(serializer.data)

+    def perform_create(self, serializer):
+        """Set the current user as owner of the newly created object."""
+        obj = serializer.save()
+        models.DocumentAccess.objects.create(
+            document=obj,
+            user=self.request.user,
+            role=models.RoleChoices.OWNER,
+        )
+
    @decorators.action(detail=True, methods=["get"], url_path="versions")
    def versions_list(self, request, *args, **kwargs):
        """
@@ -494,6 +508,43 @@ class DocumentViewSet(
        serializer.save()
        return drf_response.Response(serializer.data, status=status.HTTP_200_OK)

+    @decorators.action(detail=True, methods=["post", "delete"], url_path="favorite")
+    def favorite(self, request, *args, **kwargs):
+        """
+        Mark or unmark the document as a favorite for the logged-in user based on the HTTP method.
+        """
+        # Check permissions first
+        document = self.get_object()
+        user = request.user
+
+        if request.method == "POST":
+            # Try to mark as favorite
+            try:
+                models.DocumentFavorite.objects.create(document=document, user=user)
+            except ValidationError:
+                return drf_response.Response(
+                    {"detail": "Document already marked as favorite"},
+                    status=status.HTTP_200_OK,
+                )
+            return drf_response.Response(
+                {"detail": "Document marked as favorite"},
+                status=status.HTTP_201_CREATED,
+            )
+
+        # Handle DELETE method to unmark as favorite
+        deleted, _ = models.DocumentFavorite.objects.filter(
+            document=document, user=user
+        ).delete()
+        if deleted:
+            return drf_response.Response(
+                {"detail": "Document unmarked as favorite"},
+                status=status.HTTP_204_NO_CONTENT,
+            )
+        return drf_response.Response(
+            {"detail": "Document was already not marked as favorite"},
+            status=status.HTTP_200_OK,
+        )
+
    @decorators.action(detail=True, methods=["post"], url_path="attachment-upload")
    def attachment_upload(self, request, *args, **kwargs):
        """Upload a file related to a given document"""
@@ -677,7 +728,6 @@ class DocumentAccessViewSet(


 class TemplateViewSet(
-    ResourceViewsetMixin,
    mixins.CreateModelMixin,
    mixins.DestroyModelMixin,
    mixins.RetrieveModelMixin,
@@ -686,15 +736,35 @@ class TemplateViewSet(
 ):
    """Template ViewSet"""

+    filter_backends = [filters.OrderingFilter]
    permission_classes = [
        permissions.IsAuthenticatedOrSafe,
        permissions.AccessPermission,
    ]
+    ordering = ["-created_at"]
+    ordering_fields = ["created_at", "updated_at", "title"]
    serializer_class = serializers.TemplateSerializer
-    access_model_class = models.TemplateAccess
-    resource_field_name = "template"
    queryset = models.Template.objects.all()

+    def get_queryset(self):
+        """Custom queryset to get user related templates."""
+        queryset = super().get_queryset()
+        user = self.request.user
+
+        if not user.is_authenticated:
+            return queryset
+
+        user_roles_query = (
+            models.TemplateAccess.objects.filter(
+                Q(user=user) | Q(team__in=user.teams),
+                template_id=OuterRef("pk"),
+            )
+            .values("template")
+            .annotate(roles_array=ArrayAgg("role"))
+            .values("roles_array")
+        )
+        return queryset.annotate(user_roles=Subquery(user_roles_query)).distinct()
+
    def list(self, request, *args, **kwargs):
        """Restrict templates returned by the list endpoint"""
        queryset = self.filter_queryset(self.get_queryset())
@@ -716,6 +786,15 @@ class TemplateViewSet(
        serializer = self.get_serializer(queryset, many=True)
        return drf_response.Response(serializer.data)

+    def perform_create(self, serializer):
+        """Set the current user as owner of the newly created object."""
+        obj = serializer.save()
+        models.TemplateAccess.objects.create(
+            template=obj,
+            user=self.request.user,
+            role=models.RoleChoices.OWNER,
+        )
+
    @decorators.action(
        detail=True,
        methods=["post"],
@@ -80,6 +80,13 @@ class DocumentFactory(factory.django.DjangoModelFactory):
            for item in extracted:
                models.LinkTrace.objects.create(document=self, user=item)

+    @factory.post_generation
+    def favorited_by(self, create, extracted, **kwargs):
+        """Mark document as favorited by a list of users."""
+        if create and extracted:
+            for item in extracted:
+                models.DocumentFavorite.objects.create(document=self, user=item)
+

 class UserDocumentAccessFactory(factory.django.DjangoModelFactory):
    """Create fake document user accesses for testing."""
@@ -0,0 +1,37 @@
+# Generated by Django 5.1.2 on 2024-11-08 07:59
+
+import django.db.models.deletion
+import uuid
+from django.conf import settings
+from django.db import migrations, models
+
+
+class Migration(migrations.Migration):
+
+    dependencies = [
+        ('core', '0008_alter_document_link_reach'),
+    ]
+
+    operations = [
+        migrations.AlterField(
+            model_name='user',
+            name='language',
+            field=models.CharField(choices="(('en-us', 'English'), ('fr-fr', 'French'), ('de-de', 'German'))", default='en-us', help_text='The language in which the user wants to see the interface.', max_length=10, verbose_name='language'),
+        ),
+        migrations.CreateModel(
+            name='DocumentFavorite',
+            fields=[
+                ('id', models.UUIDField(default=uuid.uuid4, editable=False, help_text='primary key for the record as UUID', primary_key=True, serialize=False, verbose_name='id')),
+                ('created_at', models.DateTimeField(auto_now_add=True, help_text='date and time at which a record was created', verbose_name='created on')),
+                ('updated_at', models.DateTimeField(auto_now=True, help_text='date and time at which a record was last updated', verbose_name='updated on')),
+                ('document', models.ForeignKey(on_delete=django.db.models.deletion.CASCADE, related_name='favorited_by_users', to='core.document')),
+                ('user', models.ForeignKey(on_delete=django.db.models.deletion.CASCADE, related_name='favorite_documents', to=settings.AUTH_USER_MODEL)),
+            ],
+            options={
+                'verbose_name': 'Document favorite',
+                'verbose_name_plural': 'Document favorites',
+                'db_table': 'impress_document_favorite',
+                'constraints': [models.UniqueConstraint(fields=('user', 'document'), name='unique_document_favorite_user', violation_error_message='This document is already targeted by a favorite relation instance for the same user.')],
+            },
+        ),
+    ]
@@ -518,6 +518,7 @@ class Document(BaseModel):
            "ai_translate": is_owner_or_admin or is_editor,
            "attachment_upload": is_owner_or_admin or is_editor,
            "destroy": RoleChoices.OWNER in roles,
+            "favorite": can_get and user.is_authenticated,
            "link_configuration": is_owner_or_admin,
            "invite_owner": RoleChoices.OWNER in roles,
            "partial_update": is_owner_or_admin or is_editor,
@@ -600,6 +601,37 @@ class LinkTrace(BaseModel):
        return f"{self.user!s} trace on document {self.document!s}"


+class DocumentFavorite(BaseModel):
+    """Relation model to store a user's favorite documents."""
+
+    document = models.ForeignKey(
+        Document,
+        on_delete=models.CASCADE,
+        related_name="favorited_by_users",
+    )
+    user = models.ForeignKey(
+        User, on_delete=models.CASCADE, related_name="favorite_documents"
+    )
+
+    class Meta:
+        db_table = "impress_document_favorite"
+        verbose_name = _("Document favorite")
+        verbose_name_plural = _("Document favorites")
+        constraints = [
+            models.UniqueConstraint(
+                fields=["user", "document"],
+                name="unique_document_favorite_user",
+                violation_error_message=_(
+                    "This document is already targeted by a favorite relation instance "
+                    "for the same user."
+                ),
+            ),
+        ]
+
+    def __str__(self):
+        return f"{self.user!s} favorite on document {self.document!s}"
+
+
 class DocumentAccess(BaseAccess):
    """Relation model to give access to a document for a user or a team with a role."""

@@ -0,0 +1,308 @@
+"""Test favorite document API endpoint for users in impress's core app."""
+
+import pytest
+from rest_framework.test import APIClient
+
+from core import factories, models
+
+pytestmark = pytest.mark.django_db
+
+
+@pytest.mark.parametrize(
+    "reach",
+    [
+        "restricted",
+        "authenticated",
+        "public",
+    ],
+)
+@pytest.mark.parametrize("method", ["post", "delete"])
+def test_api_document_favorite_anonymous_user(method, reach):
+    """Anonymous users should not be able to mark/unmark documents as favorites."""
+    document = factories.DocumentFactory(link_reach=reach)
+
+    response = getattr(APIClient(), method)(
+        f"/api/v1.0/documents/{document.id!s}/favorite/"
+    )
+
+    assert response.status_code == 401
+    assert response.json() == {
+        "detail": "Authentication credentials were not provided."
+    }
+
+    # Verify in database
+    assert models.DocumentFavorite.objects.exists() is False
+
+
+@pytest.mark.parametrize(
+    "reach, has_role",
+    [
+        ["restricted", True],
+        ["authenticated", False],
+        ["authenticated", True],
+        ["public", False],
+        ["public", True],
+    ],
+)
+def test_api_document_favorite_authenticated_post_allowed(reach, has_role):
+    """Authenticated users should be able to mark a document as favorite using POST."""
+    user = factories.UserFactory()
+    document = factories.DocumentFactory(link_reach=reach)
+    client = APIClient()
+    client.force_login(user)
+
+    if has_role:
+        models.DocumentAccess.objects.create(document=document, user=user)
+
+    # Mark as favorite
+    response = client.post(f"/api/v1.0/documents/{document.id!s}/favorite/")
+
+    assert response.status_code == 201
+    assert response.json() == {"detail": "Document marked as favorite"}
+
+    # Verify in database
+    assert models.DocumentFavorite.objects.filter(document=document, user=user).exists()
+
+    # Verify document format
+    response = client.get(f"/api/v1.0/documents/{document.id!s}/")
+    assert response.json()["is_favorite"] is True
+
+
+def test_api_document_favorite_authenticated_post_forbidden():
+    """Authenticated users should be able to mark a document as favorite using POST."""
+    user = factories.UserFactory()
+    document = factories.DocumentFactory(link_reach="restricted")
+    client = APIClient()
+    client.force_login(user)
+
+    # Try marking as favorite
+    response = client.post(f"/api/v1.0/documents/{document.id!s}/favorite/")
+
+    assert response.status_code == 403
+    assert response.json() == {
+        "detail": "You do not have permission to perform this action."
+    }
+
+    # Verify in database
+    assert (
+        models.DocumentFavorite.objects.filter(document=document, user=user).exists()
+        is False
+    )
+
+
+@pytest.mark.parametrize(
+    "reach, has_role",
+    [
+        ["restricted", True],
+        ["authenticated", False],
+        ["authenticated", True],
+        ["public", False],
+        ["public", True],
+    ],
+)
+def test_api_document_favorite_authenticated_post_already_favorited_allowed(
+    reach, has_role
+):
+    """POST should not create duplicate favorites if already marked."""
+    user = factories.UserFactory()
+    document = factories.DocumentFactory(link_reach=reach, favorited_by=[user])
+    client = APIClient()
+    client.force_login(user)
+
+    if has_role:
+        models.DocumentAccess.objects.create(document=document, user=user)
+
+    # Try to mark as favorite again
+    response = client.post(f"/api/v1.0/documents/{document.id!s}/favorite/")
+
+    assert response.status_code == 200
+    assert response.json() == {"detail": "Document already marked as favorite"}
+
+    # Verify in database
+    assert models.DocumentFavorite.objects.filter(document=document, user=user).exists()
+
+    # Verify document format
+    response = client.get(f"/api/v1.0/documents/{document.id!s}/")
+    assert response.json()["is_favorite"] is True
+
+
+def test_api_document_favorite_authenticated_post_already_favorited_forbidden():
+    """POST should not create duplicate favorites if already marked."""
+    user = factories.UserFactory()
+    document = factories.DocumentFactory(link_reach="restricted", favorited_by=[user])
+    client = APIClient()
+    client.force_login(user)
+
+    # Try to mark as favorite again
+    response = client.post(f"/api/v1.0/documents/{document.id!s}/favorite/")
+
+    assert response.status_code == 403
+    assert response.json() == {
+        "detail": "You do not have permission to perform this action."
+    }
+
+    # Verify in database
+    assert models.DocumentFavorite.objects.filter(document=document, user=user).exists()
+
+
+@pytest.mark.parametrize(
+    "reach, has_role",
+    [
+        ["restricted", True],
+        ["authenticated", False],
+        ["authenticated", True],
+        ["public", False],
+        ["public", True],
+    ],
+)
+def test_api_document_favorite_authenticated_delete_allowed(reach, has_role):
+    """Authenticated users should be able to unmark a document as favorite using DELETE."""
+    user = factories.UserFactory()
+    document = factories.DocumentFactory(link_reach=reach, favorited_by=[user])
+    client = APIClient()
+    client.force_login(user)
+
+    if has_role:
+        models.DocumentAccess.objects.create(document=document, user=user)
+
+    # Unmark as favorite
+    response = client.delete(f"/api/v1.0/documents/{document.id!s}/favorite/")
+    assert response.status_code == 204
+
+    # Verify in database
+    assert (
+        models.DocumentFavorite.objects.filter(document=document, user=user).exists()
+        is False
+    )
+
+    # Verify document format
+    response = client.get(f"/api/v1.0/documents/{document.id!s}/")
+    assert response.json()["is_favorite"] is False
+
+
+def test_api_document_favorite_authenticated_delete_forbidden():
+    """Authenticated users should be able to unmark a document as favorite using DELETE."""
+    user = factories.UserFactory()
+    document = factories.DocumentFactory(link_reach="restricted", favorited_by=[user])
+    client = APIClient()
+    client.force_login(user)
+
+    # Unmark as favorite
+    response = client.delete(f"/api/v1.0/documents/{document.id!s}/favorite/")
+
+    assert response.status_code == 403
+    assert response.json() == {
+        "detail": "You do not have permission to perform this action."
+    }
+
+    # Verify in database
+    assert (
+        models.DocumentFavorite.objects.filter(document=document, user=user).exists()
+        is True
+    )
+
+
+@pytest.mark.parametrize(
+    "reach, has_role",
+    [
+        ["restricted", True],
+        ["authenticated", False],
+        ["authenticated", True],
+        ["public", False],
+        ["public", True],
+    ],
+)
+def test_api_document_favorite_authenticated_delete_not_favorited_allowed(
+    reach, has_role
+):
+    """DELETE should be idempotent if the document is not marked as favorite."""
+    user = factories.UserFactory()
+    document = factories.DocumentFactory(link_reach=reach)
+    client = APIClient()
+    client.force_login(user)
+
+    if has_role:
+        models.DocumentAccess.objects.create(document=document, user=user)
+
+    # Try to unmark as favorite when no favorite entry exists
+    response = client.delete(f"/api/v1.0/documents/{document.id!s}/favorite/")
+
+    assert response.status_code == 200
+    assert response.json() == {"detail": "Document was already not marked as favorite"}
+
+    # Verify in database
+    assert (
+        models.DocumentFavorite.objects.filter(document=document, user=user).exists()
+        is False
+    )
+
+    # Verify document format
+    response = client.get(f"/api/v1.0/documents/{document.id!s}/")
+    assert response.json()["is_favorite"] is False
+
+
+def test_api_document_favorite_authenticated_delete_not_favorited_forbidden():
+    """DELETE should be idempotent if the document is not marked as favorite."""
+    user = factories.UserFactory()
+    document = factories.DocumentFactory(link_reach="restricted")
+    client = APIClient()
+    client.force_login(user)
+
+    # Try to unmark as favorite when no favorite entry exists
+    response = client.delete(f"/api/v1.0/documents/{document.id!s}/favorite/")
+
+    assert response.status_code == 403
+    assert response.json() == {
+        "detail": "You do not have permission to perform this action."
+    }
+
+    # Verify in database
+    assert (
+        models.DocumentFavorite.objects.filter(document=document, user=user).exists()
+        is False
+    )
+
+
+@pytest.mark.parametrize(
+    "reach, has_role",
+    [
+        ["restricted", True],
+        ["authenticated", False],
+        ["authenticated", True],
+        ["public", False],
+        ["public", True],
+    ],
+)
+def test_api_document_favorite_authenticated_post_unmark_then_mark_again_allowed(
+    reach, has_role
+):
+    """A user should be able to mark, unmark, and mark a document again as favorite."""
+    user = factories.UserFactory()
+    document = factories.DocumentFactory(link_reach=reach)
+    client = APIClient()
+    client.force_login(user)
+
+    if has_role:
+        models.DocumentAccess.objects.create(document=document, user=user)
+
+    url = f"/api/v1.0/documents/{document.id!s}/favorite/"
+
+    # Mark as favorite
+    response = client.post(url)
+    assert response.status_code == 201
+
+    # Unmark as favorite
+    response = client.delete(url)
+    assert response.status_code == 204
+
+    # Mark as favorite again
+    response = client.post(url)
+    assert response.status_code == 201
+    assert response.json() == {"detail": "Document marked as favorite"}
+
+    # Verify in database
+    assert models.DocumentFavorite.objects.filter(document=document, user=user).exists()
+
+    # Verify document format
+    response = client.get(f"/api/v1.0/documents/{document.id!s}/")
+    assert response.json()["is_favorite"] is True
@@ -32,7 +32,44 @@ def test_api_documents_list_anonymous(reach, role):
    assert len(results) == 0


-def test_api_documents_list_authenticated_direct():
+def test_api_documents_list_format():
+    """Validate the format of documents as returned by the list view."""
+    user = factories.UserFactory()
+
+    client = APIClient()
+    client.force_login(user)
+
+    document = factories.DocumentFactory(
+        users=[user, *factories.UserFactory.create_batch(2)],
+        favorited_by=[user, *factories.UserFactory.create_batch(2)],
+    )
+
+    response = client.get("/api/v1.0/documents/")
+
+    assert response.status_code == 200
+    content = response.json()
+    results = content.pop("results")
+    assert content == {
+        "count": 1,
+        "next": None,
+        "previous": None,
+    }
+    assert len(results) == 1
+    assert results[0] == {
+        "id": str(document.id),
+        "abilities": document.get_abilities(user),
+        "content": document.content,
+        "created_at": document.created_at.isoformat().replace("+00:00", "Z"),
+        "is_favorite": True,
+        "link_reach": document.link_reach,
+        "link_role": document.link_role,
+        "nb_accesses": 3,
+        "title": document.title,
+        "updated_at": document.updated_at.isoformat().replace("+00:00", "Z"),
+    }
+
+
+def test_api_documents_list_authenticated_direct(django_assert_num_queries):
    """
    Authenticated users should be able to list documents they are a direct
    owner/administrator/member of or documents that have a link reach other
@@ -55,9 +92,8 @@ def test_api_documents_list_authenticated_direct():

    expected_ids = {str(document.id) for document in documents}

-    response = client.get(
-        "/api/v1.0/documents/",
-    )
+    with django_assert_num_queries(3):
+        response = client.get("/api/v1.0/documents/")

    assert response.status_code == 200
    results = response.json()["results"]
@@ -66,7 +102,9 @@ def test_api_documents_list_authenticated_direct():
    assert expected_ids == results_id


-def test_api_documents_list_authenticated_via_team(mock_user_teams):
+def test_api_documents_list_authenticated_via_team(
+    django_assert_num_queries, mock_user_teams
+):
    """
    Authenticated users should be able to list documents they are a
    owner/administrator/member of via a team.
@@ -89,7 +127,8 @@ def test_api_documents_list_authenticated_via_team(mock_user_teams):

    expected_ids = {str(document.id) for document in documents_team1 + documents_team2}

-    response = client.get("/api/v1.0/documents/")
+    with django_assert_num_queries(3):
+        response = client.get("/api/v1.0/documents/")

    assert response.status_code == 200
    results = response.json()["results"]
@@ -98,7 +137,9 @@ def test_api_documents_list_authenticated_via_team(mock_user_teams):
    assert expected_ids == results_id


-def test_api_documents_list_authenticated_link_reach_restricted():
+def test_api_documents_list_authenticated_link_reach_restricted(
+    django_assert_num_queries,
+):
    """
    An authenticated user who has link traces to a document that is restricted should not
    see it on the list view
@@ -115,9 +156,10 @@ def test_api_documents_list_authenticated_link_reach_restricted():
    other_document = factories.DocumentFactory(link_reach="public")
    models.LinkTrace.objects.create(document=other_document, user=user)

-    response = client.get(
-        "/api/v1.0/documents/",
-    )
+    with django_assert_num_queries(3):
+        response = client.get(
+            "/api/v1.0/documents/",
+        )

    assert response.status_code == 200
    results = response.json()["results"]
@@ -127,7 +169,9 @@ def test_api_documents_list_authenticated_link_reach_restricted():
    assert results[0]["id"] == str(other_document.id)


-def test_api_documents_list_authenticated_link_reach_public_or_authenticated():
+def test_api_documents_list_authenticated_link_reach_public_or_authenticated(
+    django_assert_num_queries,
+):
    """
    An authenticated user who has link traces to a document with public or authenticated
    link reach should see it on the list view.
@@ -144,9 +188,10 @@ def test_api_documents_list_authenticated_link_reach_public_or_authenticated():
    ]
    expected_ids = {str(document.id) for document in documents}

-    response = client.get(
-        "/api/v1.0/documents/",
-    )
+    with django_assert_num_queries(3):
+        response = client.get(
+            "/api/v1.0/documents/",
+        )

    assert response.status_code == 200
    results = response.json()["results"]
@@ -254,6 +299,8 @@ def test_api_documents_list_ordering_by_fields():
    for parameter in [
        "created_at",
        "-created_at",
+        "is_favorite",
+        "-is_favorite",
        "updated_at",
        "-updated_at",
        "title",
@@ -272,3 +319,45 @@ def test_api_documents_list_ordering_by_fields():
        compare = operator.ge if is_descending else operator.le
        for i in range(4):
            assert compare(results[i][field], results[i + 1][field])
+
+
+def test_api_documents_list_favorites_no_extra_queries(django_assert_num_queries):
+    """
+    Ensure that marking documents as favorite does not generate additional queries
+    when fetching the document list.
+    """
+    user = factories.UserFactory()
+    client = APIClient()
+    client.force_login(user)
+
+    special_documents = factories.DocumentFactory.create_batch(3, users=[user])
+    factories.DocumentFactory.create_batch(2, users=[user])
+
+    url = "/api/v1.0/documents/"
+    with django_assert_num_queries(3):
+        response = client.get(url)
+
+    assert response.status_code == 200
+    results = response.json()["results"]
+    assert len(results) == 5
+
+    assert all(result["is_favorite"] is False for result in results)
+
+    # Mark documents as favorite and check results again
+    for document in special_documents:
+        models.DocumentFavorite.objects.create(document=document, user=user)
+
+    with django_assert_num_queries(3):
+        response = client.get(url)
+
+    assert response.status_code == 200
+    results = response.json()["results"]
+    assert len(results) == 5
+
+    # Check if the "is_favorite" annotation is correctly set for the favorited documents
+    favorited_ids = {str(doc.id) for doc in special_documents}
+    for result in results:
+        if result["id"] in favorited_ids:
+            assert result["is_favorite"] is True
+        else:
+            assert result["is_favorite"] is False
@@ -27,6 +27,8 @@ def test_api_documents_retrieve_anonymous_public():
            "ai_translate": document.link_role == "editor",
            "attachment_upload": document.link_role == "editor",
            "destroy": False,
+            # Anonymous user can't favorite a document even with read access
+            "favorite": False,
            "invite_owner": False,
            "link_configuration": False,
            "partial_update": document.link_role == "editor",
@@ -36,12 +38,13 @@ def test_api_documents_retrieve_anonymous_public():
            "versions_list": False,
            "versions_retrieve": False,
        },
-        "accesses": [],
+        "nb_accesses": 0,
+        "content": document.content,
+        "created_at": document.created_at.isoformat().replace("+00:00", "Z"),
+        "is_favorite": False,
        "link_reach": "public",
        "link_role": document.link_role,
        "title": document.title,
-        "content": document.content,
-        "created_at": document.created_at.isoformat().replace("+00:00", "Z"),
        "updated_at": document.updated_at.isoformat().replace("+00:00", "Z"),
    }

@@ -84,9 +87,10 @@ def test_api_documents_retrieve_authenticated_unrelated_public_or_authenticated(
            "ai_transform": document.link_role == "editor",
            "ai_translate": document.link_role == "editor",
            "attachment_upload": document.link_role == "editor",
-            "link_configuration": False,
            "destroy": False,
+            "favorite": True,
            "invite_owner": False,
+            "link_configuration": False,
            "partial_update": document.link_role == "editor",
            "retrieve": True,
            "update": document.link_role == "editor",
@@ -94,12 +98,13 @@ def test_api_documents_retrieve_authenticated_unrelated_public_or_authenticated(
            "versions_list": False,
            "versions_retrieve": False,
        },
-        "accesses": [],
-        "link_reach": reach,
-        "link_role": document.link_role,
-        "title": document.title,
        "content": document.content,
        "created_at": document.created_at.isoformat().replace("+00:00", "Z"),
+        "is_favorite": False,
+        "link_reach": reach,
+        "link_role": document.link_role,
+        "nb_accesses": 0,
+        "title": document.title,
        "updated_at": document.updated_at.isoformat().replace("+00:00", "Z"),
    }
    assert (
@@ -168,43 +173,25 @@ def test_api_documents_retrieve_authenticated_related_direct():
    client.force_login(user)

    document = factories.DocumentFactory()
-    access1 = factories.UserDocumentAccessFactory(document=document, user=user)
+    factories.UserDocumentAccessFactory(document=document, user=user)
    access2 = factories.UserDocumentAccessFactory(document=document)
-    access1_user = serializers.UserSerializer(instance=user).data
-    access2_user = serializers.UserSerializer(instance=access2.user).data
+    serializers.UserSerializer(instance=user)
+    serializers.UserSerializer(instance=access2.user)

    response = client.get(
        f"/api/v1.0/documents/{document.id!s}/",
    )
    assert response.status_code == 200
-    content = response.json()
-    assert sorted(content.pop("accesses"), key=lambda x: x["id"]) == sorted(
-        [
-            {
-                "id": str(access1.id),
-                "user": access1_user,
-                "team": "",
-                "role": access1.role,
-                "abilities": access1.get_abilities(user),
-            },
-            {
-                "id": str(access2.id),
-                "user": access2_user,
-                "team": "",
-                "role": access2.role,
-                "abilities": access2.get_abilities(user),
-            },
-        ],
-        key=lambda x: x["id"],
-    )
    assert response.json() == {
        "id": str(document.id),
-        "title": document.title,
-        "content": document.content,
        "abilities": document.get_abilities(user),
+        "content": document.content,
+        "created_at": document.created_at.isoformat().replace("+00:00", "Z"),
+        "is_favorite": False,
        "link_reach": document.link_reach,
        "link_role": document.link_role,
-        "created_at": document.created_at.isoformat().replace("+00:00", "Z"),
+        "nb_accesses": 2,
+        "title": document.title,
        "updated_at": document.updated_at.isoformat().replace("+00:00", "Z"),
    }

@@ -257,7 +244,7 @@ def test_api_documents_retrieve_authenticated_related_team_members(
 ):
    """
    Authenticated users should be allowed to retrieve a document to which they
-    are related via a team whatever the role and see all its accesses.
+    are related via a team whatever the role.
    """
    mock_user_teams.return_value = teams

@@ -268,81 +255,33 @@ def test_api_documents_retrieve_authenticated_related_team_members(

    document = factories.DocumentFactory(link_reach="restricted")

-    access_reader = factories.TeamDocumentAccessFactory(
+    factories.TeamDocumentAccessFactory(
        document=document, team="readers", role="reader"
    )
-    access_editor = factories.TeamDocumentAccessFactory(
+    factories.TeamDocumentAccessFactory(
        document=document, team="editors", role="editor"
    )
-    access_administrator = factories.TeamDocumentAccessFactory(
+    factories.TeamDocumentAccessFactory(
        document=document, team="administrators", role="administrator"
    )
-    access_owner = factories.TeamDocumentAccessFactory(
-        document=document, team="owners", role="owner"
-    )
-    other_access = factories.TeamDocumentAccessFactory(document=document)
+    factories.TeamDocumentAccessFactory(document=document, team="owners", role="owner")
+    factories.TeamDocumentAccessFactory(document=document)
    factories.TeamDocumentAccessFactory()

    response = client.get(f"/api/v1.0/documents/{document.id!s}/")

    # pylint: disable=R0801
    assert response.status_code == 200
-    content = response.json()
-    expected_abilities = {
-        "destroy": False,
-        "retrieve": True,
-        "set_role_to": [],
-        "update": False,
-        "partial_update": False,
-    }
-    assert sorted(content.pop("accesses"), key=lambda x: x["id"]) == sorted(
-        [
-            {
-                "id": str(access_reader.id),
-                "user": None,
-                "team": "readers",
-                "role": access_reader.role,
-                "abilities": expected_abilities,
-            },
-            {
-                "id": str(access_editor.id),
-                "user": None,
-                "team": "editors",
-                "role": access_editor.role,
-                "abilities": expected_abilities,
-            },
-            {
-                "id": str(access_administrator.id),
-                "user": None,
-                "team": "administrators",
-                "role": access_administrator.role,
-                "abilities": expected_abilities,
-            },
-            {
-                "id": str(access_owner.id),
-                "user": None,
-                "team": "owners",
-                "role": access_owner.role,
-                "abilities": expected_abilities,
-            },
-            {
-                "id": str(other_access.id),
-                "user": None,
-                "team": other_access.team,
-                "role": other_access.role,
-                "abilities": expected_abilities,
-            },
-        ],
-        key=lambda x: x["id"],
-    )
    assert response.json() == {
        "id": str(document.id),
-        "title": document.title,
-        "content": document.content,
        "abilities": document.get_abilities(user),
+        "nb_accesses": 5,
+        "content": document.content,
+        "created_at": document.created_at.isoformat().replace("+00:00", "Z"),
+        "is_favorite": False,
        "link_reach": "restricted",
        "link_role": document.link_role,
-        "created_at": document.created_at.isoformat().replace("+00:00", "Z"),
+        "title": document.title,
        "updated_at": document.updated_at.isoformat().replace("+00:00", "Z"),
    }

@@ -360,7 +299,7 @@ def test_api_documents_retrieve_authenticated_related_team_administrators(
 ):
    """
    Authenticated users should be allowed to retrieve a document to which they
-    are related via a team whatever the role and see all its accesses.
+    are related via a team whatever the role.
    """
    mock_user_teams.return_value = teams

@@ -371,98 +310,33 @@ def test_api_documents_retrieve_authenticated_related_team_administrators(

    document = factories.DocumentFactory(link_reach="restricted")

-    access_reader = factories.TeamDocumentAccessFactory(
+    factories.TeamDocumentAccessFactory(
        document=document, team="readers", role="reader"
    )
-    access_editor = factories.TeamDocumentAccessFactory(
+    factories.TeamDocumentAccessFactory(
        document=document, team="editors", role="editor"
    )
-    access_administrator = factories.TeamDocumentAccessFactory(
+    factories.TeamDocumentAccessFactory(
        document=document, team="administrators", role="administrator"
    )
-    access_owner = factories.TeamDocumentAccessFactory(
-        document=document, team="owners", role="owner"
-    )
-    other_access = factories.TeamDocumentAccessFactory(document=document)
+    factories.TeamDocumentAccessFactory(document=document, team="owners", role="owner")
+    factories.TeamDocumentAccessFactory(document=document)
    factories.TeamDocumentAccessFactory()

    response = client.get(f"/api/v1.0/documents/{document.id!s}/")

    # pylint: disable=R0801
    assert response.status_code == 200
-    content = response.json()
-    assert sorted(content.pop("accesses"), key=lambda x: x["id"]) == sorted(
-        [
-            {
-                "id": str(access_reader.id),
-                "user": None,
-                "team": "readers",
-                "role": "reader",
-                "abilities": {
-                    "destroy": True,
-                    "retrieve": True,
-                    "set_role_to": ["administrator", "editor"],
-                    "update": True,
-                    "partial_update": True,
-                },
-            },
-            {
-                "id": str(access_editor.id),
-                "user": None,
-                "team": "editors",
-                "role": "editor",
-                "abilities": {
-                    "destroy": True,
-                    "retrieve": True,
-                    "set_role_to": ["administrator", "reader"],
-                    "update": True,
-                    "partial_update": True,
-                },
-            },
-            {
-                "id": str(access_administrator.id),
-                "user": None,
-                "team": "administrators",
-                "role": "administrator",
-                "abilities": {
-                    "destroy": True,
-                    "retrieve": True,
-                    "set_role_to": ["editor", "reader"],
-                    "update": True,
-                    "partial_update": True,
-                },
-            },
-            {
-                "id": str(access_owner.id),
-                "user": None,
-                "team": "owners",
-                "role": "owner",
-                "abilities": {
-                    "destroy": False,
-                    "retrieve": True,
-                    "set_role_to": [],
-                    "update": False,
-                    "partial_update": False,
-                },
-            },
-            {
-                "id": str(other_access.id),
-                "user": None,
-                "team": other_access.team,
-                "role": other_access.role,
-                "abilities": other_access.get_abilities(user),
-            },
-        ],
-        key=lambda x: x["id"],
-    )
    assert response.json() == {
        "id": str(document.id),
-        "title": document.title,
-        "content": document.content,
        "abilities": document.get_abilities(user),
+        "nb_accesses": 5,
+        "content": document.content,
+        "created_at": document.created_at.isoformat().replace("+00:00", "Z"),
+        "is_favorite": False,
        "link_reach": "restricted",
        "link_role": document.link_role,
-        "created_at": document.created_at.isoformat().replace("+00:00", "Z"),
+        "title": document.title,
        "updated_at": document.updated_at.isoformat().replace("+00:00", "Z"),
    }

@@ -481,7 +355,7 @@ def test_api_documents_retrieve_authenticated_related_team_owners(
 ):
    """
    Authenticated users should be allowed to retrieve a restricted document to which
-    they are related via a team whatever the role and see all its accesses.
+    they are related via a team whatever the role.
    """
    mock_user_teams.return_value = teams

@@ -492,100 +366,32 @@ def test_api_documents_retrieve_authenticated_related_team_owners(

    document = factories.DocumentFactory(link_reach="restricted")

-    access_reader = factories.TeamDocumentAccessFactory(
+    factories.TeamDocumentAccessFactory(
        document=document, team="readers", role="reader"
    )
-    access_editor = factories.TeamDocumentAccessFactory(
+    factories.TeamDocumentAccessFactory(
        document=document, team="editors", role="editor"
    )
-    access_administrator = factories.TeamDocumentAccessFactory(
+    factories.TeamDocumentAccessFactory(
        document=document, team="administrators", role="administrator"
    )
-    access_owner = factories.TeamDocumentAccessFactory(
-        document=document, team="owners", role="owner"
-    )
-    other_access = factories.TeamDocumentAccessFactory(document=document)
+    factories.TeamDocumentAccessFactory(document=document, team="owners", role="owner")
+    factories.TeamDocumentAccessFactory(document=document)
    factories.TeamDocumentAccessFactory()

    response = client.get(f"/api/v1.0/documents/{document.id!s}/")

    # pylint: disable=R0801
    assert response.status_code == 200
-    content = response.json()
-    assert sorted(content.pop("accesses"), key=lambda x: x["id"]) == sorted(
-        [
-            {
-                "id": str(access_reader.id),
-                "user": None,
-                "team": "readers",
-                "role": "reader",
-                "abilities": {
-                    "destroy": True,
-                    "retrieve": True,
-                    "set_role_to": ["owner", "administrator", "editor"],
-                    "update": True,
-                    "partial_update": True,
-                },
-            },
-            {
-                "id": str(access_editor.id),
-                "user": None,
-                "team": "editors",
-                "role": "editor",
-                "abilities": {
-                    "destroy": True,
-                    "retrieve": True,
-                    "set_role_to": ["owner", "administrator", "reader"],
-                    "update": True,
-                    "partial_update": True,
-                },
-            },
-            {
-                "id": str(access_administrator.id),
-                "user": None,
-                "team": "administrators",
-                "role": "administrator",
-                "abilities": {
-                    "destroy": True,
-                    "retrieve": True,
-                    "set_role_to": ["owner", "editor", "reader"],
-                    "update": True,
-                    "partial_update": True,
-                },
-            },
-            {
-                "id": str(access_owner.id),
-                "user": None,
-                "team": "owners",
-                "role": "owner",
-                "abilities": {
-                    # editable only if there is another owner role than the user's team...
-                    "destroy": other_access.role == "owner",
-                    "retrieve": True,
-                    "set_role_to": ["administrator", "editor", "reader"]
-                    if other_access.role == "owner"
-                    else [],
-                    "update": other_access.role == "owner",
-                    "partial_update": other_access.role == "owner",
-                },
-            },
-            {
-                "id": str(other_access.id),
-                "user": None,
-                "team": other_access.team,
-                "role": other_access.role,
-                "abilities": other_access.get_abilities(user),
-            },
-        ],
-        key=lambda x: x["id"],
-    )
    assert response.json() == {
        "id": str(document.id),
-        "title": document.title,
-        "content": document.content,
        "abilities": document.get_abilities(user),
+        "nb_accesses": 5,
+        "content": document.content,
+        "created_at": document.created_at.isoformat().replace("+00:00", "Z"),
+        "is_favorite": False,
        "link_reach": "restricted",
        "link_role": document.link_role,
-        "created_at": document.created_at.isoformat().replace("+00:00", "Z"),
+        "title": document.title,
        "updated_at": document.updated_at.isoformat().replace("+00:00", "Z"),
    }
@@ -216,7 +216,7 @@ def test_api_documents_update_authenticated_editor_administrator_or_owner(
    document = models.Document.objects.get(pk=document.pk)
    document_values = serializers.DocumentSerializer(instance=document).data
    for key, value in document_values.items():
-        if key in ["id", "accesses", "created_at", "link_reach", "link_role"]:
+        if key in ["id", "created_at", "link_reach", "link_role", "nb_accesses"]:
            assert value == old_document_values[key]
        elif key == "updated_at":
            assert value > old_document_values[key]
@@ -255,7 +255,7 @@ def test_api_documents_update_authenticated_owners(via, mock_user_teams):
    document = models.Document.objects.get(pk=document.pk)
    document_values = serializers.DocumentSerializer(instance=document).data
    for key, value in document_values.items():
-        if key in ["id", "accesses", "created_at", "link_reach", "link_role"]:
+        if key in ["id", "created_at", "link_reach", "link_role", "nb_accesses"]:
            assert value == old_document_values[key]
        elif key == "updated_at":
            assert value > old_document_values[key]
@@ -88,9 +88,10 @@ def test_models_documents_get_abilities_forbidden(is_authenticated, reach, role)
        "ai_transform": False,
        "ai_translate": False,
        "attachment_upload": False,
-        "link_configuration": False,
        "destroy": False,
+        "favorite": False,
        "invite_owner": False,
+        "link_configuration": False,
        "partial_update": False,
        "retrieve": False,
        "update": False,
@@ -123,8 +124,9 @@ def test_models_documents_get_abilities_reader(is_authenticated, reach):
        "ai_translate": False,
        "attachment_upload": False,
        "destroy": False,
-        "link_configuration": False,
+        "favorite": is_authenticated,
        "invite_owner": False,
+        "link_configuration": False,
        "partial_update": False,
        "retrieve": True,
        "update": False,
@@ -157,8 +159,9 @@ def test_models_documents_get_abilities_editor(is_authenticated, reach):
        "ai_translate": True,
        "attachment_upload": True,
        "destroy": False,
-        "link_configuration": False,
+        "favorite": is_authenticated,
        "invite_owner": False,
+        "link_configuration": False,
        "partial_update": True,
        "retrieve": True,
        "update": True,
@@ -180,8 +183,9 @@ def test_models_documents_get_abilities_owner():
        "ai_translate": True,
        "attachment_upload": True,
        "destroy": True,
-        "link_configuration": True,
+        "favorite": True,
        "invite_owner": True,
+        "link_configuration": True,
        "partial_update": True,
        "retrieve": True,
        "update": True,
@@ -202,8 +206,9 @@ def test_models_documents_get_abilities_administrator():
        "ai_translate": True,
        "attachment_upload": True,
        "destroy": False,
-        "link_configuration": True,
+        "favorite": True,
        "invite_owner": False,
+        "link_configuration": True,
        "partial_update": True,
        "retrieve": True,
        "update": True,
@@ -227,8 +232,9 @@ def test_models_documents_get_abilities_editor_user(django_assert_num_queries):
        "ai_translate": True,
        "attachment_upload": True,
        "destroy": False,
-        "link_configuration": False,
+        "favorite": True,
        "invite_owner": False,
+        "link_configuration": False,
        "partial_update": True,
        "retrieve": True,
        "update": True,
@@ -254,8 +260,9 @@ def test_models_documents_get_abilities_reader_user(django_assert_num_queries):
        "ai_translate": False,
        "attachment_upload": False,
        "destroy": False,
-        "link_configuration": False,
+        "favorite": True,
        "invite_owner": False,
+        "link_configuration": False,
        "partial_update": False,
        "retrieve": True,
        "update": False,
@@ -282,8 +289,9 @@ def test_models_documents_get_abilities_preset_role(django_assert_num_queries):
        "ai_translate": False,
        "attachment_upload": False,
        "destroy": False,
-        "link_configuration": False,
+        "favorite": True,
        "invite_owner": False,
+        "link_configuration": False,
        "partial_update": False,
        "retrieve": True,
        "update": False,
@@ -12,7 +12,7 @@
    "test:ui::chromium": "yarn test:ui --project=chromium"
  },
  "devDependencies": {
-    "@playwright/test": "1.48.1",
+    "@playwright/test": "1.48.2",
    "@types/node": "*",
    "@types/pdf-parse": "1.1.4",
    "eslint-config-impress": "*",
@@ -21,35 +21,35 @@
    "@gouvfr-lasuite/integration": "1.0.2",
    "@hocuspocus/provider": "2.13.7",
    "@openfun/cunningham-react": "2.9.4",
-    "@tanstack/react-query": "5.59.15",
-    "i18next": "23.16.2",
+    "@tanstack/react-query": "5.59.20",
+    "i18next": "23.16.5",
    "i18next-browser-languagedetector": "8.0.0",
    "idb": "8.0.0",
    "lodash": "4.17.21",
    "luxon": "3.5.0",
-    "next": "14.2.15",
+    "next": "15.0.3",
    "react": "*",
    "react-aria-components": "1.4.1",
    "react-dom": "*",
-    "react-i18next": "15.0.3",
-    "react-select": "5.8.1",
+    "react-i18next": "15.1.1",
+    "react-select": "5.8.3",
    "styled-components": "6.1.13",
    "y-protocols": "1.0.6",
    "yjs": "*",
-    "zustand": "5.0.0"
+    "zustand": "5.0.1"
  },
  "devDependencies": {
    "@svgr/webpack": "8.1.0",
-    "@tanstack/react-query-devtools": "5.59.15",
+    "@tanstack/react-query-devtools": "5.59.20",
    "@testing-library/dom": "10.4.0",
-    "@testing-library/jest-dom": "6.6.2",
+    "@testing-library/jest-dom": "6.6.3",
    "@testing-library/react": "16.0.1",
    "@testing-library/user-event": "14.5.2",
-    "@types/jest": "29.5.13",
-    "@types/lodash": "4.17.12",
+    "@types/jest": "29.5.14",
+    "@types/lodash": "4.17.13",
    "@types/luxon": "3.4.2",
    "@types/node": "*",
-    "@types/react": "18.3.11",
+    "@types/react": "18.3.12",
    "@types/react-dom": "*",
    "cross-env": "*",
    "dotenv": "16.4.5",
@@ -63,7 +63,7 @@
    "stylelint-config-standard": "36.0.1",
    "stylelint-prettier": "5.0.2",
    "typescript": "*",
-    "webpack": "5.95.0",
-    "workbox-webpack-plugin": "7.1.0"
+    "webpack": "5.96.1",
+    "workbox-webpack-plugin": "7.3.0"
  }
 }
@@ -5,7 +5,7 @@ import { AppWrapper } from '@/tests/utils';

 import Page from '../pages';

-jest.mock('next/navigation', () => ({
+jest.mock('next/router', () => ({
  useRouter() {
    return {
      push: jest.fn(),
@@ -1,6 +1,6 @@
 import { ComponentPropsWithRef, ReactHTML } from 'react';
 import styled from 'styled-components';
-import { CSSProperties } from 'styled-components/dist/types';
+import { CSSProperties, RuleSet } from 'styled-components/dist/types';

 import {
  MarginPadding,
@@ -15,7 +15,7 @@ export interface BoxProps {
  $align?: CSSProperties['alignItems'];
  $background?: CSSProperties['background'];
  $color?: CSSProperties['color'];
-  $css?: string;
+  $css?: string | RuleSet<object>;
  $direction?: CSSProperties['flexDirection'];
  $display?: CSSProperties['display'];
  $effect?: 'show' | 'hide';
@@ -73,7 +73,7 @@ export const Box = styled('div')<BoxProps>`
  ${({ $transition }) => $transition && `transition: ${$transition};`}
  ${({ $width }) => $width && `width: ${$width};`}
  ${({ $wrap }) => $wrap && `flex-wrap: ${$wrap};`}
-  ${({ $css }) => $css && `${$css};`}
+  ${({ $css }) => $css && (typeof $css === 'string' ? `${$css};` : $css)}
  ${({ $zIndex }) => $zIndex && `z-index: ${$zIndex};`}
  ${({ $effect }) => {
    let effect;
@@ -1,4 +1,5 @@
 import { ComponentPropsWithRef, forwardRef } from 'react';
+import { css } from 'styled-components';

 import { Box, BoxType } from './Box';

@@ -26,7 +27,7 @@ const BoxButton = forwardRef<HTMLDivElement, BoxType>(
        $background="none"
        $margin="none"
        $padding="none"
-        $css={`
+        $css={css`
          cursor: pointer;
          border: none;
          outline: none;
@@ -1,4 +1,5 @@
 import { PropsWithChildren } from 'react';
+import { css } from 'styled-components';

 import { useCunninghamTheme } from '@/cunningham';

@@ -15,7 +16,7 @@ export const Card = ({
    <Box
      $background="white"
      $radius="4px"
-      $css={`
+      $css={css`
        box-shadow: 2px 2px 5px ${colorsTokens()['greyscale-300']};
        border: 1px solid ${colorsTokens()['card-border']};
        ${$css}
@@ -14,14 +14,13 @@ import { useTranslation } from 'react-i18next';

 import { isAPIError } from '@/api';
 import { Box, Text } from '@/components';
-import { useDocOptions } from '@/features/docs/doc-management/';
+import { useDocOptions, useDocStore } from '@/features/docs/doc-management/';

 import {
  AITransformActions,
  useDocAITransform,
  useDocAITranslate,
 } from '../api/';
-import { useDocStore } from '../stores';

 type LanguageTranslate = {
  value: string;
@@ -1,4 +1,4 @@
-import { locales } from '@blocknote/core';
+import { Dictionary, locales } from '@blocknote/core';
 import '@blocknote/core/fonts/inter.css';
 import { BlockNoteView } from '@blocknote/mantine';
 import '@blocknote/mantine/style.css';
@@ -12,11 +12,10 @@ import { Box, TextErrors } from '@/components';
 import { mediaUrl } from '@/core';
 import { useAuthStore } from '@/core/auth';
 import { Doc } from '@/features/docs/doc-management';
-import { Version } from '@/features/docs/doc-versioning/';

 import { useCreateDocAttachment } from '../api/useCreateDocUpload';
 import useSaveDoc from '../hook/useSaveDoc';
-import { useDocStore, useHeadingStore } from '../stores';
+import { useEditorStore, useHeadingStore } from '../stores';
 import { randomColor } from '../utils';

 import { BlockNoteToolbar } from './BlockNoteToolbar';
@@ -43,6 +42,11 @@ const cssEditor = (readonly: boolean) => `
    padding: 2px;
    border-radius: 4px;
  }
+  /* @TODO: A fix is made in v0.19.1 - This code can be removed after the upgrade  */
+  .bn-block-content[data-content-type=codeBlock]>div>select option{
+    color: black;
+    background-color: white;
+  }
  @media screen and (width <= 560px) {
    & .bn-editor {
      padding-left: 40px;
@@ -75,47 +79,22 @@ const cssEditor = (readonly: boolean) => `
 `;

 interface BlockNoteEditorProps {
-  doc: Doc;
-  version?: Version;
-}
-
-export const BlockNoteEditor = ({ doc, version }: BlockNoteEditorProps) => {
-  const { createProvider, docsStore } = useDocStore();
-  const storeId = version?.id || doc.id;
-  const initialContent = version?.content || doc.content;
-  const provider = docsStore?.[storeId]?.provider;
-
-  useEffect(() => {
-    if (!provider || provider.document.guid !== storeId) {
-      createProvider(storeId, initialContent);
-    }
-  }, [createProvider, initialContent, provider, storeId]);
-
-  if (!provider) {
-    return null;
-  }
-
-  return <BlockNoteContent doc={doc} provider={provider} storeId={storeId} />;
-};
-
-interface BlockNoteContentProps {
  doc: Doc;
  provider: HocuspocusProvider;
  storeId: string;
 }

-export const BlockNoteContent = ({
+export const BlockNoteEditor = ({
  doc,
  provider,
  storeId,
-}: BlockNoteContentProps) => {
+}: BlockNoteEditorProps) => {
  const isVersion = doc.id !== storeId;
  const { userData } = useAuthStore();
-  const { setStore, docsStore } = useDocStore();
+  const { setEditor } = useEditorStore();

  const readOnly = !doc.abilities.partial_update || isVersion;
  useSaveDoc(doc.id, provider.document, !readOnly);
-  const storedEditor = docsStore?.[storeId]?.editor;
  const {
    mutateAsync: createDocAttachment,
    isError: isErrorAttachment,
@@ -150,15 +129,19 @@ export const BlockNoteContent = ({
          color: randomColor(),
        },
      },
-      dictionary: locales[lang as keyof typeof locales],
+      dictionary: locales[lang as keyof typeof locales] as Dictionary,
      uploadFile,
    },
    [lang, provider, uploadFile, userData?.email, userData?.full_name],
  );

  useEffect(() => {
-    setStore(storeId, { editor });
-  }, [setStore, storeId, editor]);
+    setEditor(editor);
+
+    return () => {
+      setEditor(undefined);
+    };
+  }, [setEditor, editor]);

  useEffect(() => {
    setHeadings(editor);
@@ -185,7 +168,7 @@ export const BlockNoteContent = ({
      )}

      <BlockNoteView
-        editor={storedEditor ?? editor}
+        editor={editor}
        formattingToolbar={false}
        editable={!readOnly}
        theme="light"
@@ -1,13 +1,12 @@
 import { Alert, Loader, VariantType } from '@openfun/cunningham-react';
-import { useRouter as useNavigate } from 'next/navigation';
 import { useRouter } from 'next/router';
-import React from 'react';
+import React, { useEffect } from 'react';
 import { useTranslation } from 'react-i18next';

 import { Box, Card, Text, TextErrors } from '@/components';
 import { useCunninghamTheme } from '@/cunningham';
 import { DocHeader } from '@/features/docs/doc-header';
-import { Doc } from '@/features/docs/doc-management';
+import { Doc, useDocStore } from '@/features/docs/doc-management';
 import { Versions, useDocVersion } from '@/features/docs/doc-versioning/';
 import { useResponsiveStore } from '@/stores';

@@ -32,6 +31,13 @@ export const DocEditor = ({ doc }: DocEditorProps) => {

  const { colorsTokens } = useCunninghamTheme();

+  const { providers } = useDocStore();
+  const provider = providers?.[doc.id];
+
+  if (!provider) {
+    return null;
+  }
+
  return (
    <>
      <DocHeader doc={doc} versionId={versionId as Versions['version_id']} />
@@ -66,7 +72,7 @@ export const DocEditor = ({ doc }: DocEditorProps) => {
          {isVersion ? (
            <DocVersionEditor doc={doc} versionId={versionId} />
          ) : (
-            <BlockNoteEditor doc={doc} />
+            <BlockNoteEditor doc={doc} storeId={doc.id} provider={provider} />
          )}
          {!isMobile && <IconOpenPanelEditor headings={headings} />}
        </Card>
@@ -91,12 +97,24 @@ export const DocVersionEditor = ({ doc, versionId }: DocVersionEditorProps) => {
    docId: doc.id,
    versionId,
  });
+  const { createProvider, providers } = useDocStore();

-  const navigate = useNavigate();
+  const { replace } = useRouter();
+
+  useEffect(() => {
+    if (!version?.id) {
+      return;
+    }
+
+    const provider = providers?.[version.id];
+    if (!provider || provider.document.guid !== version.id) {
+      createProvider(version.id, version.content);
+    }
+  }, [createProvider, providers, version]);

  if (isError && error) {
    if (error.status === 404) {
-      navigate.replace(`/404`);
+      void replace(`/404`);
      return null;
    }

@@ -124,5 +142,11 @@ export const DocVersionEditor = ({ doc, versionId }: DocVersionEditorProps) => {
    );
  }

-  return <BlockNoteEditor doc={doc} version={version} />;
+  const provider = providers?.[version.id];
+
+  if (!provider) {
+    return null;
+  }
+
+  return <BlockNoteEditor doc={doc} storeId={version.id} provider={provider} />;
 };
@@ -127,9 +127,7 @@ export const PanelEditor = ({
            </BoxButton>
          )}
        </Box>
-        {isPanelTableContentOpen && (
-          <TableContent doc={doc} headings={headings} />
-        )}
+        {isPanelTableContentOpen && <TableContent headings={headings} />}
        {!isPanelTableContentOpen && doc.abilities.versions_list && (
          <VersionList doc={doc} />
        )}
@@ -1,3 +1,3 @@
-export * from './useDocStore';
+export * from './useEditorStore';
 export * from './useHeadingStore';
 export * from './usePanelEditorStore';
@@ -0,0 +1,14 @@
+import { BlockNoteEditor } from '@blocknote/core';
+import { create } from 'zustand';
+
+export interface UseEditorstore {
+  editor?: BlockNoteEditor;
+  setEditor: (editor: BlockNoteEditor | undefined) => void;
+}
+
+export const useEditorStore = create<UseEditorstore>((set) => ({
+  editor: undefined,
+  setEditor: (editor) => {
+    set({ editor });
+  },
+}));
@@ -1,5 +1,3 @@
-import * as Y from 'yjs';
-
 export const randomColor = () => {
  const randomInt = (min: number, max: number) => {
    return Math.floor(Math.random() * (max - min + 1)) + min;
@@ -28,20 +26,3 @@ function hslToHex(h: number, s: number, l: number) {
 export const toBase64 = (
  str: WithImplicitCoercion<ArrayBuffer | SharedArrayBuffer>,
 ) => Buffer.from(str).toString('base64');
-
-type BasicBlock = {
-  type: string;
-  content: string;
-};
-export const blocksToYDoc = (blocks: BasicBlock[], doc: Y.Doc) => {
-  const xmlFragment = doc.getXmlFragment('document-store');
-
-  blocks.forEach((block) => {
-    const xmlElement = new Y.XmlElement(block.type);
-    if (block.content) {
-      xmlElement.insert(0, [new Y.XmlText(block.content)]);
-    }
-
-    xmlFragment.push([xmlElement]);
-  });
-};
@@ -1,5 +1,6 @@
-import React, { Fragment } from 'react';
+import { Fragment } from 'react';
 import { useTranslation } from 'react-i18next';
+import { css } from 'styled-components';

 import { Box, Card, StyledLink, Text } from '@/components';
 import { useCunninghamTheme } from '@/cunningham';
@@ -46,7 +47,11 @@ export const DocHeader = ({ doc, versionId }: DocHeaderProps) => {
              $theme="primary"
              $variation="600"
              $size="2rem"
-              $css={`&:hover {background-color: ${colorsTokens()['primary-100']}; };`}
+              $css={css`
+                &:hover {
+                  background-color: ${colorsTokens()['primary-100']};
+                }
+              `}
              $hasTransition
              $radius="5px"
              $padding="tiny"
@@ -18,7 +18,7 @@ import {
  useTrans,
  useUpdateDoc,
 } from '@/features/docs/doc-management';
-import { useResponsiveStore } from '@/stores';
+import { useBroadcastStore, useResponsiveStore } from '@/stores';
 import { isFirefox } from '@/utils/userAgent';

 interface DocTitleProps {
@@ -54,6 +54,7 @@ const DocTitleInput = ({ doc }: DocTitleProps) => {
  const headingText = headings?.[0]?.contentText;
  const debounceRef = useRef<NodeJS.Timeout>();
  const { isMobile } = useResponsiveStore();
+  const { broadcast } = useBroadcastStore();

  const { mutate: updateDoc } = useUpdateDoc({
    listInvalideQueries: [KEY_DOC, KEY_LIST_DOC],
@@ -61,6 +62,9 @@ const DocTitleInput = ({ doc }: DocTitleProps) => {
      if (data.title !== untitledDocument) {
        toast(t('Document title updated successfully'), VariantType.SUCCESS);
      }
+
+      // Broadcast to every user connected to the document
+      broadcast(`${KEY_DOC}-${data.id}`);
    },
  });

@@ -8,16 +8,18 @@ import { useTranslation } from 'react-i18next';

 import { Box, DropButton, IconOptions } from '@/components';
 import { useAuthStore } from '@/core';
-import { useDocStore, usePanelEditorStore } from '@/features/docs/doc-editor/';
+import {
+  useEditorStore,
+  usePanelEditorStore,
+} from '@/features/docs/doc-editor/';
 import {
  Doc,
  ModalRemoveDoc,
  ModalShare,
 } from '@/features/docs/doc-management';
+import { ModalVersion, Versions } from '@/features/docs/doc-versioning';
 import { useResponsiveStore } from '@/stores';

-import { ModalVersion, Versions } from '../../doc-versioning';
-
 import { ModalPDF } from './ModalExport';

 interface DocToolBoxProps {
@@ -35,13 +37,12 @@ export const DocToolBox = ({ doc, versionId }: DocToolBoxProps) => {
  const [isModalVersionOpen, setIsModalVersionOpen] = useState(false);
  const { isSmallMobile } = useResponsiveStore();
  const { authenticated } = useAuthStore();
-  const { docsStore } = useDocStore();
+  const { editor } = useEditorStore();
  const { toast } = useToastProvider();

  const copyCurrentEditorToClipboard = async (
    asFormat: 'html' | 'markdown',
  ) => {
-    const editor = docsStore[doc.id]?.editor;
    if (!editor) {
      toast(t('Editor unavailable'), VariantType.ERROR, { duration: 3000 });
      return;
@@ -14,7 +14,7 @@ import { t } from 'i18next';
 import { useEffect, useMemo, useState } from 'react';

 import { Box, Text } from '@/components';
-import { useDocStore } from '@/features/docs/doc-editor/';
+import { useEditorStore } from '@/features/docs/doc-editor';
 import { Doc } from '@/features/docs/doc-management';

 import { useExport } from '../api/useExport';
@@ -31,7 +31,7 @@ export const ModalPDF = ({ onClose, doc }: ModalPDFProps) => {
    ordering: TemplatesOrdering.BY_CREATED_ON_DESC,
  });
  const { toast } = useToastProvider();
-  const { docsStore } = useDocStore();
+  const { editor } = useEditorStore();
  const {
    mutate: createExport,
    data: documentGenerated,
@@ -104,8 +104,6 @@ export const ModalPDF = ({ onClose, doc }: ModalPDFProps) => {
      return;
    }

-    const editor = docsStore[doc.id].editor;
-
    if (!editor) {
      toast(t('No editor found'), VariantType.ERROR);
      return;
@@ -1,7 +1,8 @@
 import { useMutation, useQueryClient } from '@tanstack/react-query';

 import { APIError, errorCauses, fetchAPI } from '@/api';
-import { Doc } from '@/features/docs';
+import { Doc, KEY_DOC } from '@/features/docs/doc-management';
+import { useBroadcastStore } from '@/stores';

 export type UpdateDocLinkParams = Pick<Doc, 'id'> &
  Partial<Pick<Doc, 'link_role' | 'link_reach'>>;
@@ -37,14 +38,20 @@ export function useUpdateDocLink({
  listInvalideQueries,
 }: UpdateDocLinkProps = {}) {
  const queryClient = useQueryClient();
+  const { broadcast } = useBroadcastStore();
+
  return useMutation<Doc, APIError, UpdateDocLinkParams>({
    mutationFn: updateDocLink,
-    onSuccess: (data) => {
+    onSuccess: (data, variable) => {
      listInvalideQueries?.forEach((queryKey) => {
        void queryClient.resetQueries({
          queryKey: [queryKey],
        });
      });
+
+      // Broadcast to every user connected to the document
+      broadcast(`${KEY_DOC}-${variable.id}`);
+
      onSuccess?.(data);
    },
  });
@@ -7,7 +7,7 @@ import {
  useToastProvider,
 } from '@openfun/cunningham-react';
 import { t } from 'i18next';
-import { useRouter } from 'next/navigation';
+import { useRouter } from 'next/router';

 import { Box, Text, TextErrors } from '@/components';
 import useCunninghamTheme from '@/cunningham/useCunninghamTheme';
@@ -24,7 +24,7 @@ interface ModalRemoveDocProps {
 export const ModalRemoveDoc = ({ onClose, doc }: ModalRemoveDocProps) => {
  const { colorsTokens } = useCunninghamTheme();
  const { toast } = useToastProvider();
-  const router = useRouter();
+  const { push } = useRouter();

  const {
    mutate: removeDoc,
@@ -35,7 +35,7 @@ export const ModalRemoveDoc = ({ onClose, doc }: ModalRemoveDocProps) => {
      toast(t('The document has been deleted.'), VariantType.SUCCESS, {
        duration: 4000,
      });
-      router.push('/');
+      void push('/');
    },
  });

@@ -1,5 +1,6 @@
 export * from './api';
 export * from './components';
 export * from './hooks';
+export * from './stores';
 export * from './types';
 export * from './utils';
@@ -0,0 +1 @@
+export * from './useDocStore';
@@ -1,31 +1,23 @@
-import { BlockNoteEditor } from '@blocknote/core';
 import { HocuspocusProvider } from '@hocuspocus/provider';
 import * as Y from 'yjs';
 import { create } from 'zustand';

 import { providerUrl } from '@/core';
-import { Base64, Doc } from '@/features/docs/doc-management';
-
-import { blocksToYDoc } from '../utils';
-
-interface DocStore {
-  provider: HocuspocusProvider;
-  editor?: BlockNoteEditor;
-}
+import { Base64, Doc, blocksToYDoc } from '@/features/docs/doc-management';

 export interface UseDocStore {
  currentDoc?: Doc;
-  docsStore: {
-    [storeId: string]: DocStore;
+  providers: {
+    [storeId: string]: HocuspocusProvider;
  };
  createProvider: (storeId: string, initialDoc: Base64) => HocuspocusProvider;
-  setStore: (storeId: string, props: Partial<DocStore>) => void;
+  setProviders: (storeId: string, providers: HocuspocusProvider) => void;
  setCurrentDoc: (doc: Doc | undefined) => void;
 }

 export const useDocStore = create<UseDocStore>((set, get) => ({
  currentDoc: undefined,
-  docsStore: {},
+  providers: {},
  createProvider: (storeId: string, initialDoc: Base64) => {
    const doc = new Y.Doc({
      guid: storeId,
@@ -50,23 +42,17 @@ export const useDocStore = create<UseDocStore>((set, get) => ({
      document: doc,
    });

-    get().setStore(storeId, { provider });
+    get().setProviders(storeId, provider);

    return provider;
  },
-  setStore: (storeId, props) => {
-    set(({ docsStore }, ...store) => {
-      return {
-        ...store,
-        docsStore: {
-          ...docsStore,
-          [storeId]: {
-            ...docsStore[storeId],
-            ...props,
-          },
-        },
-      };
-    });
+  setProviders: (storeId, provider) => {
+    set(({ providers }) => ({
+      providers: {
+        ...providers,
+        [storeId]: provider,
+      },
+    }));
  },
  setCurrentDoc: (doc) => {
    set({ currentDoc: doc });
@@ -1,3 +1,5 @@
+import * as Y from 'yjs';
+
 import { Doc, Role } from './types';

 export const currentDocRole = (abilities: Doc['abilities']): Role => {
@@ -9,3 +11,20 @@ export const currentDocRole = (abilities: Doc['abilities']): Role => {
        ? Role.EDITOR
        : Role.READER;
 };
+
+type BasicBlock = {
+  type: string;
+  content: string;
+};
+export const blocksToYDoc = (blocks: BasicBlock[], doc: Y.Doc) => {
+  const xmlFragment = doc.getXmlFragment('document-store');
+
+  blocks.forEach((block) => {
+    const xmlElement = new Y.XmlElement(block.type);
+    if (block.content) {
+      xmlElement.insert(0, [new Y.XmlText(block.content)]);
+    }
+
+    xmlFragment.push([xmlElement]);
+  });
+};
@@ -2,22 +2,19 @@ import React, { useEffect, useState } from 'react';
 import { useTranslation } from 'react-i18next';

 import { Box, BoxButton, Text } from '@/components';
-import { HeadingBlock, useDocStore } from '@/features/docs/doc-editor';
-import { Doc } from '@/features/docs/doc-management';
+import { HeadingBlock, useEditorStore } from '@/features/docs/doc-editor';
 import { useResponsiveStore } from '@/stores';

 import { Heading } from './Heading';

 interface TableContentProps {
-  doc: Doc;
  headings: HeadingBlock[];
 }

-export const TableContent = ({ doc, headings }: TableContentProps) => {
-  const { docsStore } = useDocStore();
+export const TableContent = ({ headings }: TableContentProps) => {
+  const { editor } = useEditorStore();
  const { isMobile } = useResponsiveStore();
  const { t } = useTranslation();
-  const editor = docsStore?.[doc.id]?.editor;
  const [headingIdHighlight, setHeadingIdHighlight] = useState<string>();

  // To highlight the first heading in the viewport
@@ -7,12 +7,12 @@ import {
  useToastProvider,
 } from '@openfun/cunningham-react';
 import { t } from 'i18next';
-import { useRouter } from 'next/navigation';
+import { useRouter } from 'next/router';
 import * as Y from 'yjs';

 import { Box, Text } from '@/components';
-import { toBase64, useDocStore } from '@/features/docs/doc-editor';
-import { Doc, useUpdateDoc } from '@/features/docs/doc-management';
+import { toBase64 } from '@/features/docs/doc-editor';
+import { Doc, useDocStore, useUpdateDoc } from '@/features/docs/doc-management';

 import { KEY_LIST_DOC_VERSIONS } from '../api/useDocVersions';
 import { Versions } from '../types';
@@ -31,29 +31,25 @@ export const ModalVersion = ({
  versionId,
 }: ModalVersionProps) => {
  const { toast } = useToastProvider();
-  const router = useRouter();
-  const { docsStore, setStore } = useDocStore();
+  const { push } = useRouter();
+  const { providers } = useDocStore();
  const { mutate: updateDoc } = useUpdateDoc({
    listInvalideQueries: [KEY_LIST_DOC_VERSIONS],
    onSuccess: () => {
      const onDisplaySuccess = () => {
        toast(t('Version restored successfully'), VariantType.SUCCESS);
-        router.push(`/docs/${docId}`);
+        void push(`/docs/${docId}`);
      };

-      if (!docsStore?.[docId]?.provider || !docsStore?.[versionId]?.provider) {
+      if (!providers?.[docId] || !providers?.[versionId]) {
        onDisplaySuccess();
        return;
      }

-      setStore(docId, {
-        editor: undefined,
-      });
-
      revertUpdate(
-        docsStore[docId].provider.document,
-        docsStore[docId].provider.document,
-        docsStore[versionId].provider.document,
+        providers[docId].document,
+        providers[docId].document,
+        providers[versionId].document,
      );

      onDisplaySuccess();
@@ -83,7 +79,7 @@ export const ModalVersion = ({
          fullWidth
          onClick={() => {
            const newDoc = toBase64(
-              Y.encodeStateAsUpdate(docsStore?.[versionId]?.provider.document),
+              Y.encodeStateAsUpdate(providers?.[versionId].document),
            );

            updateDoc({
@@ -1,5 +1,5 @@
 import { Button } from '@openfun/cunningham-react';
-import { useRouter } from 'next/navigation';
+import { useRouter } from 'next/router';
 import React from 'react';
 import { useTranslation } from 'react-i18next';

@@ -12,12 +12,12 @@ import { DocsGrid } from './DocsGrid';
 export const DocsGridContainer = () => {
  const { t } = useTranslation();
  const { untitledDocument } = useTrans();
-  const router = useRouter();
+  const { push } = useRouter();
  const { isMobile } = useResponsiveStore();

  const { mutate: createDoc } = useCreateDoc({
    onSuccess: (doc) => {
-      router.push(`/docs/${doc.id}`);
+      void push(`/docs/${doc.id}`);
    },
  });

@@ -5,11 +5,13 @@ import { User } from '@/core/auth';
 import {
  Access,
  Doc,
+  KEY_DOC,
  KEY_LIST_DOC,
  Role,
 } from '@/features/docs/doc-management';
 import { KEY_LIST_DOC_ACCESSES } from '@/features/docs/members/members-list';
 import { ContentLanguage } from '@/i18n/types';
+import { useBroadcastStore } from '@/stores';

 import { OptionType } from '../types';

@@ -53,9 +55,11 @@ export const createDocAccess = async ({

 export function useCreateDocAccess() {
  const queryClient = useQueryClient();
+  const { broadcast } = useBroadcastStore();
+
  return useMutation<Access, APIError, CreateDocAccessParams>({
    mutationFn: createDocAccess,
-    onSuccess: () => {
+    onSuccess: (_data, variable) => {
      void queryClient.resetQueries({
        queryKey: [KEY_LIST_DOC],
      });
@@ -65,6 +69,9 @@ export function useCreateDocAccess() {
      void queryClient.resetQueries({
        queryKey: [KEY_LIST_DOC_ACCESSES],
      });
+
+      // Broadcast to every user connected to the document
+      broadcast(`${KEY_DOC}-${variable.docId}`);
    },
  });
 }
@@ -7,6 +7,7 @@ import {
 import { APIError, errorCauses, fetchAPI } from '@/api';
 import { KEY_DOC, KEY_LIST_DOC } from '@/features/docs/doc-management';
 import { KEY_LIST_USER } from '@/features/docs/members/members-add';
+import { useBroadcastStore } from '@/stores';

 import { KEY_LIST_DOC_ACCESSES } from './useDocAccesses';

@@ -39,6 +40,8 @@ type UseDeleteDocAccessOptions = UseMutationOptions<

 export const useDeleteDocAccess = (options?: UseDeleteDocAccessOptions) => {
  const queryClient = useQueryClient();
+  const { broadcast } = useBroadcastStore();
+
  return useMutation<void, APIError, DeleteDocAccessProps>({
    mutationFn: deleteDocAccess,
    ...options,
@@ -49,6 +52,10 @@ export const useDeleteDocAccess = (options?: UseDeleteDocAccessOptions) => {
      void queryClient.invalidateQueries({
        queryKey: [KEY_DOC],
      });
+
+      // Broadcast to every user connected to the document
+      broadcast(`${KEY_DOC}-${variables.docId}`);
+
      void queryClient.resetQueries({
        queryKey: [KEY_LIST_DOC],
      });
@@ -11,6 +11,7 @@ import {
  KEY_LIST_DOC,
  Role,
 } from '@/features/docs/doc-management';
+import { useBroadcastStore } from '@/stores';

 import { KEY_LIST_DOC_ACCESSES } from './useDocAccesses';

@@ -49,6 +50,8 @@ type UseUpdateDocAccessOptions = UseMutationOptions<

 export const useUpdateDocAccess = (options?: UseUpdateDocAccessOptions) => {
  const queryClient = useQueryClient();
+  const { broadcast } = useBroadcastStore();
+
  return useMutation<Access, APIError, UpdateDocAccessProps>({
    mutationFn: updateDocAccess,
    ...options,
@@ -59,6 +62,10 @@ export const useUpdateDocAccess = (options?: UseUpdateDocAccessOptions) => {
      void queryClient.invalidateQueries({
        queryKey: [KEY_DOC],
      });
+
+      // Broadcast to every user connected to the document
+      broadcast(`${KEY_DOC}-${variables.docId}`);
+
      void queryClient.invalidateQueries({
        queryKey: [KEY_LIST_DOC],
      });
@@ -5,7 +5,7 @@ import {
  VariantType,
  useToastProvider,
 } from '@openfun/cunningham-react';
-import { useRouter } from 'next/navigation';
+import { useRouter } from 'next/router';
 import React, { useState } from 'react';
 import { useTranslation } from 'react-i18next';

@@ -35,7 +35,7 @@ export const MemberItem = ({
  const { isSmallMobile, screenWidth } = useResponsiveStore();
  const [localRole, setLocalRole] = useState(role);
  const { toast } = useToastProvider();
-  const router = useRouter();
+  const { push } = useRouter();
  const { mutate: updateDocAccess, error: errorUpdate } = useUpdateDocAccess({
    onSuccess: () => {
      toast(t('The role has been updated'), VariantType.SUCCESS, {
@@ -55,7 +55,7 @@ export const MemberItem = ({
      );

      if (isMyself) {
-        router.push('/');
+        void push('/');
      }
    },
  });
@@ -1,5 +1,4 @@
 import Image from 'next/image';
-import React from 'react';
 import { useTranslation } from 'react-i18next';
 import styled from 'styled-components';

@@ -1,15 +1,16 @@
 import { Loader } from '@openfun/cunningham-react';
+import { useQueryClient } from '@tanstack/react-query';
 import Head from 'next/head';
-import { useRouter as useNavigate } from 'next/navigation';
 import { useRouter } from 'next/router';
 import { useEffect, useState } from 'react';

 import { Box, Text } from '@/components';
 import { TextErrors } from '@/components/TextErrors';
 import { useAuthStore } from '@/core/auth';
-import { DocEditor, useDocStore } from '@/features/docs';
-import { useDoc } from '@/features/docs/doc-management';
+import { DocEditor } from '@/features/docs/doc-editor';
+import { KEY_DOC, useDoc, useDocStore } from '@/features/docs/doc-management';
 import { MainLayout } from '@/layouts';
+import { useBroadcastStore } from '@/stores';
 import { NextPageWithLayout } from '@/types/next';

 export function DocLayout() {
@@ -41,9 +42,11 @@ const DocPage = ({ id }: DocProps) => {
  const { login } = useAuthStore();
  const { data: docQuery, isError, error } = useDoc({ id });
  const [doc, setDoc] = useState(docQuery);
-  const { setCurrentDoc } = useDocStore();
-
-  const navigate = useNavigate();
+  const { setCurrentDoc, createProvider, providers } = useDocStore();
+  const { setBroadcastProvider, addTask } = useBroadcastStore();
+  const queryClient = useQueryClient();
+  const { replace } = useRouter();
+  const provider = providers?.[id];

  useEffect(() => {
    if (doc?.title) {
@@ -66,9 +69,38 @@ const DocPage = ({ id }: DocProps) => {
    };
  }, [docQuery, setCurrentDoc]);

+  useEffect(() => {
+    if (!doc?.id) {
+      return;
+    }
+
+    let newProvider = provider;
+    if (!provider || provider.document.guid !== doc.id) {
+      newProvider = createProvider(doc.id, doc.content);
+    }
+
+    setBroadcastProvider(newProvider);
+  }, [createProvider, doc, provider, setBroadcastProvider]);
+
+  /**
+   * We add a broadcast task to reset the query cache
+   * when the document visibility changes.
+   */
+  useEffect(() => {
+    if (!doc?.id) {
+      return;
+    }
+
+    addTask(`${KEY_DOC}-${doc.id}`, () => {
+      void queryClient.resetQueries({
+        queryKey: [KEY_DOC, { id: doc.id }],
+      });
+    });
+  }, [addTask, doc?.id, queryClient]);
+
  if (isError && error) {
    if (error.status === 404) {
-      navigate.replace(`/404`);
+      void replace(`/404`);
      return null;
    }

@@ -1 +1,2 @@
+export * from './useBroadcastStore';
 export * from './useResponsiveStore';
@@ -0,0 +1,54 @@
+import { HocuspocusProvider } from '@hocuspocus/provider';
+import * as Y from 'yjs';
+import { create } from 'zustand';
+
+interface BroadcastState {
+  addTask: (taskLabel: string, action: () => void) => void;
+  broadcast: (taskLabel: string) => void;
+  getBroadcastProvider: () => HocuspocusProvider | undefined;
+  provider?: HocuspocusProvider;
+  setBroadcastProvider: (provider: HocuspocusProvider) => void;
+  tasks: { [taskLabel: string]: Y.Array<string> };
+}
+
+export const useBroadcastStore = create<BroadcastState>((set, get) => ({
+  provider: undefined,
+  tasks: {},
+  setBroadcastProvider: (provider) => set({ provider }),
+  getBroadcastProvider: () => {
+    const provider = get().provider;
+    if (!provider) {
+      console.warn('Provider is not defined');
+      return;
+    }
+
+    return provider;
+  },
+  addTask: (taskLabel, action) => {
+    const taskExistAlready = get().tasks[taskLabel];
+    const provider = get().getBroadcastProvider();
+    if (taskExistAlready || !provider) {
+      return;
+    }
+
+    const task = provider.document.getArray<string>(taskLabel);
+    task.observe(() => {
+      action();
+    });
+
+    set((state) => ({
+      tasks: {
+        ...state.tasks,
+        [taskLabel]: task,
+      },
+    }));
+  },
+  broadcast: (taskLabel) => {
+    const task = get().tasks[taskLabel];
+    if (!task) {
+      console.warn(`Task ${taskLabel} is not defined`);
+      return;
+    }
+    task.push([`broadcast: ${taskLabel}`]);
+  },
+}));
@@ -25,13 +25,13 @@
    "i18n:test": "yarn I18N run test"
  },
  "resolutions": {
-    "@blocknote/core": "0.17.1",
-    "@blocknote/mantine": "0.17.1",
-    "@blocknote/react": "0.17.1",
-    "@types/node": "20.16.13",
+    "@blocknote/core": "0.19.0",
+    "@blocknote/mantine": "0.19.0",
+    "@blocknote/react": "0.19.0",
+    "@types/node": "22.9.0",
    "@types/react-dom": "18.3.1",
-    "@typescript-eslint/eslint-plugin": "8.10.0",
-    "@typescript-eslint/parser": "8.10.0",
+    "@typescript-eslint/eslint-plugin": "8.14.0",
+    "@typescript-eslint/parser": "8.14.0",
    "cross-env": "7.0.3",
    "eslint": "8.57.0",
    "react": "18.3.1",
@@ -6,19 +6,19 @@
    "lint": "eslint --ext .js ."
  },
  "dependencies": {
-    "@next/eslint-plugin-next": "14.2.15",
-    "@tanstack/eslint-plugin-query": "5.59.7",
+    "@next/eslint-plugin-next": "15.0.3",
+    "@tanstack/eslint-plugin-query": "5.60.1",
    "@typescript-eslint/eslint-plugin": "*",
    "@typescript-eslint/parser": "*",
    "eslint": "*",
-    "eslint-config-next": "14.2.15",
+    "eslint-config-next": "15.0.3",
    "eslint-config-prettier": "9.1.0",
    "eslint-plugin-import": "2.31.0",
-    "eslint-plugin-jest": "28.8.3",
-    "eslint-plugin-jsx-a11y": "6.10.1",
-    "eslint-plugin-playwright": "1.8.0",
+    "eslint-plugin-jest": "28.9.0",
+    "eslint-plugin-jsx-a11y": "6.10.2",
+    "eslint-plugin-playwright": "2.0.1",
    "eslint-plugin-prettier": "5.2.1",
-    "eslint-plugin-react": "7.37.1",
+    "eslint-plugin-react": "7.37.2",
    "eslint-plugin-testing-library": "6.4.0",
    "prettier": "3.3.3"
  }
@@ -12,7 +12,7 @@
    "test": "jest"
  },
  "dependencies": {
-    "@types/jest": "29.5.13",
+    "@types/jest": "29.5.14",
    "@types/node": "*",
    "eslint-config-impress": "*",
    "eslint-plugin-import": "2.31.0",
Author	SHA1	Message	Date
Samuel Paccoud - DINUM	644c37651e	✨(backend) annotate number of accesses on documents The new UI will display the number of accesses on each document. /!\ Once team accesses will be used, this will not represent the number of people with access anymore and will have to be improved by computing the number of people in each team.	2024-11-16 00:32:01 +01:00
Samuel Paccoud - DINUM	47a845fed9	✨(backend) allow users to mark/unmark documents as favorite A user can now mark/unmark documents as favorite. This is done via a new action of the document API endpoint: /api/v1.0/documents/{document_id}/favorite POST to mark as favorite / DELETE to unmark	2024-11-16 00:32:01 +01:00
Samuel Paccoud - DINUM	dc7a28dd9c	⚡️(backend) optimize number of queries on document list view I realized most of the database queries made when getting a document list view were to include nested accesses. This detailed information about accesses in only necessary for the document detail view. I introduced a specific serializer for the document list view with less fields. For a list of 20 documents with 5 accesses, we go down from 3x5x20= 300 queries to just 3 queries.	2024-11-16 00:32:01 +01:00
Nathan Panchout	bbe9b6b6cf	✨(frontend) add styledCss props to Box component In order to facilitate DX and not to use a string in the code for the css. We add the $styledCss props to the Box component. This object comes from Styled component	2024-11-15 10:33:56 +01:00
Anthony LC	23231563c9	💄(frontend) text color on Blocknote code block options The options for the code block in the Blocknote editor was not visible. We changed the text color to make it visible. A fix will be made to the code block options in the next blocknote release.	2024-11-14 17:36:11 +01:00
Anthony LC	d75c8668c5	🚨(frontend) blocknote cast to Dictionnary The last Blocknote upgrade (0.19.0) gives us a warning with the dictionnary typing. We cast it to the correct type to remove the warning.	2024-11-14 17:36:11 +01:00
Anthony LC	f266232b5a	♻️(frontend) use next/router instead of next/navigation The last upgrade of next.js gives a warning when we were using next/navigation with the pages router. This commit fixes this issue.	2024-11-14 17:36:11 +01:00
Anthony LC	a8362e8e88	⬆️(dependencies) update js dependencies	2024-11-14 17:36:11 +01:00
Anthony LC	e4dfae1905	♻️(frontend) simplify useDocStore We moved the editor store to its own store in the previous commit. This change allow us to simplify useDocStore.	2024-11-13 15:25:29 +01:00
Anthony LC	a09e740648	♻️(frontend) move editor store to useEditorStore Previous changes migrated the editor store to doc-management, we move it back doc-editor and simplify it.	2024-11-13 15:25:29 +01:00
Anthony LC	5ee6a43f08	✨(frontend) add useBroadcastStore Add the useBroadcastStore. It will give us the ability to easily broadcast actions to all connected clients. In this case, we requery the doc to everyone when a change relative to the doc rights is made.	2024-11-09 10:21:24 +01:00
Anthony LC	8bd83cbfcd	🚚(frontend) move useDocStore to doc-management We want to make more accessible the doc store to every feature, so we move it to the doc-management folder.	2024-11-09 10:21:24 +01:00