Ascending/Descending order by button for projects dashboard page. (#1100)

pages/dashboard/projects.vue

@@ -192,8 +192,11 @@
                 :close-on-select="true"
                 :show-labels="false"
                 :allow-empty="false"
-                @update:model-value="projects = updateSort(projects, sortBy)"
+                @update:model-value="projects = updateSort(projects, sortBy, descending)"
               />
+              <button class="square-button" @click="updateDescending()">
+                <ArrowIcon :transform="`rotate(${descending ? -90 : 90})`" />
+              </button>
             </div>
           </div>
         </div>
@@ -308,6 +311,7 @@ import PlusIcon from '~/assets/images/utils/plus.svg'
 import CrossIcon from '~/assets/images/utils/x.svg'
 import EditIcon from '~/assets/images/utils/edit.svg'
 import SaveIcon from '~/assets/images/utils/save.svg'
+import ArrowIcon from '~/assets/images/utils/left-arrow.svg'
 
 export default defineNuxtComponent({
   components: {
@@ -325,6 +329,7 @@ export default defineNuxtComponent({
     ModalCreation,
     Multiselect,
     CopyCode,
+    ArrowIcon,
   },
   async setup() {
     const user = await useUser()
@@ -340,6 +345,7 @@ export default defineNuxtComponent({
       versions: [],
       selectedProjects: [],
       sortBy: 'Name',
+      descending: false,
       editLinks: {
         showAffected: false,
         source: {
@@ -375,10 +381,15 @@ export default defineNuxtComponent({
     this.DELETE_PROJECT = 1 << 7
   },
   methods: {
-    updateSort(projects, sort) {
+    updateDescending() {
+      this.descending = !this.descending
+      this.projects = this.updateSort(this.projects, this.sortBy, this.descending)
+    },
+    updateSort(projects, sort, descending) {
+      let sortedArray = projects
       switch (sort) {
         case 'Name':
-          return projects.slice().sort((a, b) => {
+          sortedArray = projects.slice().sort((a, b) => {
             if (a.title < b.title) {
               return -1
             }
@@ -387,8 +398,9 @@ export default defineNuxtComponent({
             }
             return 0
           })
+          break
         case 'Status':
-          return projects.slice().sort((a, b) => {
+          sortedArray = projects.slice().sort((a, b) => {
             if (a.status < b.status) {
               return -1
             }
@@ -397,8 +409,9 @@ export default defineNuxtComponent({
             }
             return 0
           })
+          break
         case 'Type':
-          return projects.slice().sort((a, b) => {
+          sortedArray = projects.slice().sort((a, b) => {
             if (a.project_type < b.project_type) {
               return -1
             }
@@ -407,9 +420,16 @@ export default defineNuxtComponent({
             }
             return 0
           })
+          break
         default:
           break
       }
+
+      if (descending) {
+        sortedArray = sortedArray.reverse()
+      }
+
+      return sortedArray
     },
     async bulkEditLinks() {
       try {