From fbd5ef20bd3cc8165e5a3b7077f44a9786163e4c Mon Sep 17 00:00:00 2001
From: Andrey Platov <andrey@hardcoreeng.com>
Date: Tue, 5 Oct 2021 16:43:50 +0200
Subject: [PATCH] add table sorting capabilities

Signed-off-by: Andrey Platov <andrey@hardcoreeng.com>
---
 .../src/components/TableView.svelte           | 29 +++++++++++++++++--
 1 file changed, 27 insertions(+), 2 deletions(-)

diff --git a/plugins/view-resources/src/components/TableView.svelte b/plugins/view-resources/src/components/TableView.svelte
index 0e207d0dc9..91f41359a2 100644
--- a/plugins/view-resources/src/components/TableView.svelte
+++ b/plugins/view-resources/src/components/TableView.svelte
@@ -33,11 +33,12 @@
   export let search: string
 
   let sortKey = 'modifiedOn'
+  let sortOrder = SortingOrder.Descending
 
   let objects: Doc[]
 
   const query = createQuery()
-  $: query.query(_class, search === '' ? { space } : { $search: search }, result => { objects = result }, { sort: { [sortKey]: SortingOrder.Descending }, ...options })
+  $: query.query(_class, search === '' ? { space } : { $search: search }, result => { objects = result }, { sort: { [sortKey]: sortOrder }, ...options })
 
   function getValue(doc: Doc, key: string): any {
     if (key.length === 0)
@@ -70,6 +71,21 @@
       elRow.classList.remove('fixed')
     }))
   }
+
+  function changeSorting(key: string) {
+    if (key === '')
+      return
+    if (key !== sortKey) {
+      sortKey = key
+      sortOrder = SortingOrder.Ascending
+    } else {
+      if (sortOrder == SortingOrder.Ascending) {
+        sortOrder = SortingOrder.Descending
+      } else {
+        sortOrder = SortingOrder.Ascending
+      }
+    }
+  }
 </script>
 
 {#await buildModel(client, _class, config, options)}
@@ -88,7 +104,16 @@
                 </div>
               </th>
             {/if}
-            <th><Label label = {attribute.label}/></th>
+            <th on:click={() => changeSorting(attribute.key)}>
+              <Label label = {attribute.label}/>
+              {#if attribute.key === sortKey}
+                {#if sortOrder === SortingOrder.Ascending}
+                  ^
+                {:else}
+                  v
+                {/if}
+              {/if}
+            </th>
           {/each}
         </tr>
       </thead>