Album sorting fixed and changed

- New buttons for sorting in both orders, since not easy to adjust in mobile mode. Have to switch from album view to explore, than to settings and then to say which order to sort. Not easy adjustable
- Old function was also broken since the config was not queried during sorting process
- Alternative would be to simply fix it by quering the config, if you think it is better to keep the toggle in the settings to keep cleaner UI

src/components/top-matter/AlbumTopMatter.vue

@@ -15,25 +15,51 @@
           <SortIcon :size="20" />
         </template>
 
+        <!-- Sort by date descending -->
         <NcActionRadio
           name="sort"
-          :aria-label="t('memories', 'Sort by date')"
+          :aria-label="t('memories', 'Sort by date (descending)')"
           :checked="config.album_list_sort === 1"
           @change="changeSort(1)"
           close-after-click
         >
-          {{ t('memories', 'Sort by date') }}
+          {{ t('memories', 'Sort by date') }} ▼
           <template #icon> <SortDateIcon :size="20" /> </template>
         </NcActionRadio>
 
+        <!-- Sort by date ascending -->
         <NcActionRadio
           name="sort"
-          :aria-label="t('memories', 'Sort by name')"
+          :aria-label="t('memories', 'Sort by date (ascending)')"
+          :checked="config.album_list_sort === 0"
+          @change="changeSort(0)"
+          close-after-click
+        >
+          {{ t('memories', 'Sort by date') }} ▲
+          <template #icon> <SortDateIcon :size="20" /> </template>
+        </NcActionRadio>
+
+        <!-- Sort by name ascending -->
+        <NcActionRadio
+          name="sort"
+          :aria-label="t('memories', 'Sort by name (ascending)')"
           :checked="config.album_list_sort === 2"
           @change="changeSort(2)"
           close-after-click
         >
-          {{ t('memories', 'Sort by name') }}
+          {{ t('memories', 'Sort by name') }} ▲
+          <template #icon> <SlotAlphabeticalIcon :size="20" /> </template>
+        </NcActionRadio>
+
+        <!-- Sort by name descending -->
+        <NcActionRadio
+          name="sort"
+          :aria-label="t('memories', 'Sort by name (descending)')"
+          :checked="config.album_list_sort === 3"
+          @change="changeSort(3)"
+          close-after-click
+        >
+          {{ t('memories', 'Sort by name') }} ▼
           <template #icon> <SlotAlphabeticalIcon :size="20" /> </template>
         </NcActionRadio>
       </NcActions>
@@ -188,9 +214,9 @@ export default defineComponent({
 
     /**
      * Change the sorting order
-     * 1 = date, 2 = name
+     * 0 = date ascending, 1 = date descending, 2 = name ascending, 3 = name descending
      */
-    changeSort(order: 1 | 2) {
+    changeSort(order: 0 | 1 | 2 | 3) {
       this.config.album_list_sort = order;
       this.updateSetting('album_list_sort');
     },

src/services/dav/albums.ts

@@ -24,6 +24,22 @@ export function getAlbumPath(user: string, name: string) {
   }
 }
 
+/**
+ * Helper function to sort by name
+ */
+function sortByName(data: any[], reverse: boolean = false) {
+  const direction = reverse ? -1 : 1;
+  data.sort((a, b) => direction * a.name.localeCompare(b.name, getLanguage(), { numeric: true }));
+}
+
+/**
+ * Helper function to sort by creation date
+ */
+function sortByCreated(data: any[], reverse: boolean = false) {
+  const direction = reverse ? -1 : 1;
+  data.sort((a, b) => direction * (a.created - b.created));
+}
+
 /**
  * Get list of albums.
  * @param fileid Optional file ID to get albums for
@@ -40,12 +56,23 @@ export async function getAlbums(fileid?: number) {
 
   // Sort the response
   switch (await staticConfig.get('album_list_sort')) {
+    case 3:
+      // Sort by name in reverse (descending)
+      sortByName(data, true);
+      break;
     case 2:
-      data.sort((a, b) => a.name.localeCompare(b.name, getLanguage(), { numeric: true }));
+      // Sort by name (ascending)
+      sortByName(data);
+      break;
+    case 0:
+      // Sort by date album was created (ascending)
+      sortByCreated(data);
       break;
     case 1:
     default:
-      data.sort((a, b) => b.created - a.created);
+      // Sort by date album was created in reverse (descending)
+      sortByCreated(data, true);
+      break;
   }
 
   return data;

src/typings/config.d.ts

@@ -40,6 +40,6 @@ declare module '@typings' {
     square_thumbs: boolean;
     high_res_cond: HighResCond | null;
     show_face_rect: boolean;
-    album_list_sort: 1 | 2;
+    album_list_sort: 0 | 1 | 2 | 3;
   };
 }