Sort groups by name in dropdown (#211)

* Sort groups by name in dropdown

* Adjust tests

* Edit fixture

* Fix group ids

Author: ryanmccarthy031

cypress/e2e/accounts_spec.cy.ts

@@ -648,11 +648,11 @@ describe('Account Management', () => {
             .click()
 
           cy.get('pep-pharos-modal:visible pep-pharos-button')
-            .contains('ithaka', { matchCase: false })
+            .contains('ilium', { matchCase: false })
             .click()
 
           cy.get('pep-pharos-modal:visible pep-pharos-dropdown-menu-item')
-            .contains('ilium', { matchCase: false })
+            .contains('ithaka', { matchCase: false })
             .click()
 
           cy.get('pep-pharos-modal:visible .feature-selection pep-pharos-checkbox')

cypress/fixtures/account/edit_user__two_groups__request.json

@@ -1,50 +1,50 @@
 {
-    "name": "Test User",
-    "contact": "user.name@ithaka.org",
-    "id": 3,
-    "type": "users",
-    "groups": [
-        {
-            "id": 1,
-            "name": "Ithaka",
-            "features": {
-                "view_snippet": true,
-                "view_abstract": true,
-                "view_book_description": true,
-                "print_pdf": true,
-                "download_pdf": true,
-                "remove_users": true,
-                "add_or_edit_users": true,
-                "get_users": true,
-                "approve_requests": true,
-                "deny_requests": true,
-                "bulk_approve": true,
-                "undo_bulk_approve": true,
-                "get_facilities": true,
-                "edit_facilities": true,
-                "test_feature": true
-            }
-        },
-        {
-            "id": 2,
-            "name": "Ilium",
-            "features": {
-                "view_snippet": true,
-                "remove_users": true,
-                "add_or_edit_users": true,
-                "get_users": true,
-                "view_abstract": true,
-                "view_book_description": true,
-                "print_pdf": true,
-                "download_pdf": true,
-                "approve_requests": true,
-                "deny_requests": true,
-                "bulk_approve": true,
-                "undo_bulk_approve": true,
-                "get_facilities": true,
-                "edit_facilities": true,
-                "test_feature": true
-            }
-        }
-    ]
-}
+  "name": "Test User",
+  "contact": "user.name@ithaka.org",
+  "id": 3,
+  "type": "users",
+  "groups": [
+    {
+      "id": 2,
+      "name": "Ilium",
+      "features": {
+        "view_snippet": true,
+        "view_abstract": true,
+        "view_book_description": true,
+        "print_pdf": true,
+        "download_pdf": true,
+        "remove_users": true,
+        "add_or_edit_users": true,
+        "get_users": true,
+        "approve_requests": true,
+        "deny_requests": true,
+        "bulk_approve": true,
+        "undo_bulk_approve": true,
+        "get_facilities": true,
+        "edit_facilities": true,
+        "test_feature": true
+      }
+    },
+    {
+      "id": 1,
+      "name": "Ithaka",
+      "features": {
+        "view_snippet": true,
+        "remove_users": true,
+        "add_or_edit_users": true,
+        "get_users": true,
+        "view_abstract": true,
+        "view_book_description": true,
+        "print_pdf": true,
+        "download_pdf": true,
+        "approve_requests": true,
+        "deny_requests": true,
+        "bulk_approve": true,
+        "undo_bulk_approve": true,
+        "get_facilities": true,
+        "edit_facilities": true,
+        "test_feature": true
+      }
+    }
+  ]
+}

src/components/account/EntityManager.vue

@@ -64,13 +64,15 @@ if (!selectedGroups.value[featureName.value]) {
 }
 
 const selectorGroupOptions = ref(
-  featureDetails.value[featureName.value]?.groups.reduce((arr, id: number) => {
-    const group = groupMap.value.get(id)
-    if (group) {
-      arr.push(group)
-    }
-    return arr
-  }, [] as Group[]) || [],
+  featureDetails.value[featureName.value]?.groups
+    .reduce((arr, id: number) => {
+      const group = groupMap.value.get(id)
+      if (group) {
+        arr.push(group)
+      }
+      return arr
+    }, [] as Group[])
+    .sort((a, b) => a.name.localeCompare(b.name)) || [],
 )
 
 if (props.action === 'edit') {