feat: cache user pictures

core/templates/core/base/navbar.jinja

@@ -20,6 +20,14 @@
     <a class="link" href="{{ url('forum:main') }}">{% trans %}Forum{% endtrans %}</a>
     <a class="link" href="{{ url('sas:main') }}">{% trans %}Gallery{% endtrans %}</a>
     <a class="link" href="{{ url('eboutic:main') }}">{% trans %}Eboutic{% endtrans %}</a>
+    <details name="navbar" class="menu">
+      <summary class="head">{% trans %}Services{% endtrans %}</summary>
+      <ul class="content">
+        <li><a href="{{ url('matmat:search_clear') }}">{% trans %}Matmatronch{% endtrans %}</a></li>
+        <li><a href="{{ url('core:file_list') }}">{% trans %}Files{% endtrans %}</a></li>
+        <li><a href="{{ url('pedagogy:guide') }}">{% trans %}Pedagogy{% endtrans %}</a></li>
+      </ul>
+    </details>
     <details name="navbar" class="menu">
       <summary class="head">{% trans %}My Benefits{% endtrans %}</summary>
       <ul class="content">

sas/static/bundled/sas/user/pictures-index.ts

@@ -7,6 +7,7 @@ import {
 
 interface PagePictureConfig {
   userId: number;
+  lastPhotoDate?: string;
 }
 
 interface Album {
@@ -20,11 +21,28 @@ document.addEventListener("alpine:init", () => {
     loading: true,
     albums: [] as Album[],
 
-    async init() {
+    async fetchPictures(): Promise<PictureSchema[]> {
+      const localStorageKey = `user${config.userId}Pictures`;
+      const localStorageDateKey = `user${config.userId}PicturesDate`;
+      const lastCachedDate = localStorage.getItem(localStorageDateKey);
+      if (
+        config.lastPhotoDate !== undefined &&
+        lastCachedDate !== undefined &&
+        lastCachedDate >= config.lastPhotoDate
+      ) {
+        return JSON.parse(localStorage.getItem(localStorageKey));
+      }
       const pictures = await paginated(picturesFetchPictures, {
         // biome-ignore lint/style/useNamingConvention: from python api
         query: { users_identified: [config.userId] },
       } as PicturesFetchPicturesData);
+      localStorage.setItem(localStorageDateKey, config.lastPhotoDate);
+      localStorage.setItem(localStorageKey, JSON.stringify(pictures));
+      return pictures;
+    },
+
+    async init() {
+      const pictures = await this.fetchPictures();
       const groupedAlbums = Object.groupBy(pictures, (i: PictureSchema) => i.album.id);
       this.albums = Object.values(groupedAlbums).map((pictures: PictureSchema[]) => {
         return {

sas/templates/sas/user_pictures.jinja

@@ -15,7 +15,7 @@
 {% endblock %}
 
 {% block content %}
-  <main x-data="user_pictures({ userId: {{ object.id }} })">
+  <main x-data="user_pictures({ userId: {{ object.id }}, lastPhotoDate: '{{ object.last_photo_date }}' })">
     {% if user.id == object.id %}
       {{ download_button(_("Download all my pictures")) }}
     {% endif %}

sas/views.py

@@ -16,6 +16,7 @@ from typing import Any
 
 from django.conf import settings
 from django.core.exceptions import PermissionDenied
+from django.db.models import OuterRef, Subquery
 from django.http import Http404, HttpResponseRedirect
 from django.shortcuts import get_object_or_404
 from django.urls import reverse
@@ -178,6 +179,13 @@ class UserPicturesView(UserTabsMixin, CanViewMixin, DetailView):
     context_object_name = "profile"
     template_name = "sas/user_pictures.jinja"
     current_tab = "pictures"
+    queryset = User.objects.annotate(
+        last_photo_date=Subquery(
+            Picture.objects.filter(people__user=OuterRef("id"))
+            .order_by("-date")
+            .values("date")[:1]
+        )
+    ).all()
 
 
 # Admin views