perf: Move collection sorting to frontend (#3475)

* perf: Move collection sorting to frontend, on demand, memoized

* fix: Add default

server/migrations/20220430043135-collection-sort-backfill.js

@@ -0,0 +1,29 @@
+'use strict';
+
+module.exports = {
+  up: async (queryInterface) => {
+    let again = 1;
+  
+    while (again) {
+      console.log("Backfilling collection sort…");
+      const [, metadata] = await queryInterface.sequelize.query(`
+WITH rows AS (
+  SELECT id FROM collections WHERE "sort" IS NULL ORDER BY id LIMIT 1000
+)
+UPDATE collections
+SET "sort" = :sort::jsonb
+WHERE EXISTS (SELECT * FROM rows WHERE collections.id = rows.id)
+  `, {
+        replacements: {
+          sort: JSON.stringify({ field: "title", direction: "asc" }),
+        }
+      });
+
+      again = metadata.rowCount;
+    }
+  },
+
+  down: async () => {
+    // cannot be undone
+  }
+};

server/models/Collection.ts

@@ -161,6 +161,7 @@ class Collection extends ParanoidModel {
   @Column
   sharing: boolean;
 
+  @Default({ field: "title", direction: "asc" })
   @Column({
     type: DataType.JSONB,
     validate: {
@@ -184,7 +185,7 @@ class Collection extends ParanoidModel {
       },
     },
   })
-  sort: Sort | null;
+  sort: Sort;
 
   // getters
 
@@ -362,10 +363,6 @@ class Collection extends ParanoidModel {
     if (!this.documentStructure) {
       return null;
     }
-    const sort: Sort = this.sort || {
-      field: "title",
-      direction: "asc",
-    };
 
     let result!: NavigationNode | undefined;
 
@@ -399,7 +396,7 @@ class Collection extends ParanoidModel {
 
     return {
       ...result,
-      children: sortNavigationNodes(result.children, sort),
+      children: sortNavigationNodes(result.children, this.sort),
     };
   };
 

server/presenters/collection.ts

@@ -1,9 +1,8 @@
-import { sortNavigationNodes } from "@shared/utils/collections";
 import { APM } from "@server/logging/tracing";
 import Collection from "@server/models/Collection";
 
 function present(collection: Collection) {
-  const data = {
+  return {
     id: collection.id,
     url: collection.url,
     urlId: collection.urlId,
@@ -20,21 +19,6 @@ function present(collection: Collection) {
     deletedAt: collection.deletedAt,
     documents: collection.documentStructure,
   };
-
-  // Handle the "sort" field being empty here for backwards compatability
-  if (!data.sort) {
-    data.sort = {
-      field: "title",
-      direction: "asc",
-    };
-  }
-
-  data.documents = sortNavigationNodes(
-    collection.documentStructure || [],
-    data.sort
-  );
-
-  return data;
 }
 
 export default APM.traceFunction({