completely ajaxify the picture page

core/models.py

@@ -991,8 +991,8 @@ class SithFile(models.Model):
             return user.is_board_member
         if user.is_com_admin:
             return True
-        if self.is_in_sas and user.is_in_group(pk=settings.SITH_GROUP_SAS_ADMIN_ID):
-            return True
+        if self.is_in_sas:
+            return user.is_in_group(pk=settings.SITH_GROUP_SAS_ADMIN_ID)
         return user.id == self.owner_id
 
     def can_be_viewed_by(self, user):

core/static/core/js/script.js

@@ -107,3 +107,35 @@ function update_query_string(key, value, action = History.REPLACE, url = null) {
 
     return url;
 }
+
+
+/**
+ * Given a paginated endpoint, fetch all the items of this endpoint,
+ * performing multiple API calls if necessary.
+ * @param {string} url The paginated endpoint to fetch
+ * @return {Promise<Object[]>}
+ */
+async function fetch_paginated(url) {
+  const max_per_page = 199;
+  const paginated_url = new URL(url, document.location.origin);
+  paginated_url.searchParams.set("page_size", max_per_page.toString());
+  paginated_url.searchParams.set("page", "1");
+
+  let first_page = (await ( await fetch(paginated_url)).json());
+  let results = first_page.results;
+
+  const nb_pictures = first_page.count
+  const nb_pages = Math.ceil(nb_pictures / max_per_page);
+
+  if (nb_pages > 1) {
+      let promises = [];
+      for (let i = 2; i <= nb_pages; i++) {
+        paginated_url.searchParams.set("page", i.toString());
+        promises.push(
+          fetch(paginated_url).then(res => res.json().then(json => json.results))
+        );
+      }
+      results.push(...await Promise.all(promises))
+  }
+  return results;
+}

core/templates/core/user_pictures.jinja

@@ -65,17 +65,29 @@
 
   {{ super() }}
   <script>
+      /**
+       * @typedef UserProfile
+       * @property {number} id
+       * @property {string} first_name
+       * @property {string} last_name
+       * @property {string} nick_name
+       * @property {string} display_name
+       * @property {string} profile_url
+       * @property {string} profile_pict
+       */
     /**
      * @typedef Picture
      * @property {number} id
      * @property {string} name
      * @property {number} size
      * @property {string} date
-     * @property {Object} author
+     * @property {UserProfile} owner
      * @property {string} full_size_url
      * @property {string} compressed_url
      * @property {string} thumb_url
      * @property {string} album
+     * @property {boolean} is_moderated
+     * @property {boolean} asked_for_removal
      */
 
     document.addEventListener("alpine:init", () => {
@@ -86,7 +98,7 @@
         albums: {},
 
         async init() {
-          this.pictures = await this.get_pictures();
+          this.pictures = await fetch_paginated("{{ url("api:pictures") }}" + "?users_identified={{ object.id }}");
           this.albums = this.pictures.reduce((acc, picture) => {
             if (!acc[picture.album]){
               acc[picture.album] = [];
@@ -97,34 +109,6 @@
           this.loading = false;
         },
 
-        /**
-         * @return {Promise<Picture[]>}
-         */
-        async get_pictures() {
-          {# The API forbids to get more than 199 items at once
-           from paginated routes.
-           In order to download all the user pictures, it may be needed
-           to performs multiple requests #}
-          const max_per_page = 199;
-          const url = "{{ url("api:pictures") }}"
-          + "?users_identified={{ object.id }}"
-          + `&page_size=${max_per_page}`;
-
-          let first_page = (await ( await fetch(url)).json());
-          let promises = [first_page.results];
-
-          const nb_pictures = first_page.count
-          const nb_pages = Math.ceil(nb_pictures / max_per_page);
-
-          for (let i = 2; i <= nb_pages; i++) {
-            promises.push(
-              fetch(url + `&page=${i}`).then(res => res.json().then(json => json.results))
-            );
-          }
-          return (await Promise.all(promises)).flat()
-        },
-
-
         async download_zip(){
           this.is_downloading = true;
           const bar = this.$refs.progress;