Merge pull request #445 from dod-ccpo/filter-by-member-status

Filter by all member statuses

atst/domain/workspace_roles.py

@@ -9,6 +9,16 @@ from .users import Users
 from .exceptions import NotFoundError
 
 
+MEMBER_STATUSES = [
+    {"name": "active", "display_name": "Active"},
+    {"name": "revoked", "display_name": "Revoked"},
+    {"name": "expired", "display_name": "Invite expired"},
+    {"name": "error", "display_name": "Error on invite"},
+    {"name": "pending", "display_name": "Pending"},
+    {"name": "unknown", "display_name": "Unknown errors"},
+]
+
+
 class WorkspaceRoles(object):
     @classmethod
     def get(cls, workspace_id, user_id):

atst/models/workspace_role.py

@@ -53,11 +53,12 @@ class WorkspaceRole(Base, mixins.TimestampsMixin, mixins.AuditableMixin):
         elif self.latest_invitation:
             if self.latest_invitation.is_revoked:
                 return "Revoked"
-            elif self.latest_invitation.is_rejected_expired:
-                return "Invite expired"
             elif self.latest_invitation.is_rejected_wrong_user:
                 return "Error on invite"
-            elif self.latest_invitation.is_expired:
+            elif (
+                self.latest_invitation.is_rejected_expired
+                or self.latest_invitation.is_expired
+            ):
                 return "Invite expired"
             else:
                 return "Pending"

atst/routes/workspaces.py

@@ -14,7 +14,7 @@ from atst.domain.exceptions import UnauthorizedError, AlreadyExistsError
 from atst.domain.projects import Projects
 from atst.domain.reports import Reports
 from atst.domain.workspaces import Workspaces
-from atst.domain.workspace_roles import WorkspaceRoles
+from atst.domain.workspace_roles import WorkspaceRoles, MEMBER_STATUSES
 from atst.domain.environments import Environments
 from atst.domain.environment_roles import EnvironmentRoles
 from atst.forms.project import NewProjectForm, ProjectForm
@@ -123,7 +123,8 @@ def workspace_members(workspace_id):
     return render_template(
         "workspaces/members/index.html",
         workspace=workspace,
-        choices=WORKSPACE_ROLE_DEFINITIONS,
+        role_choices=WORKSPACE_ROLE_DEFINITIONS,
+        status_choices=MEMBER_STATUSES,
         members=members_list,
         new_member=new_member,
     )

js/components/forms/members_list.js

@@ -11,12 +11,14 @@ const search = (query, members) => {
   }
 }
 
-const filterByStatus = (status, members) => {
+const filterByStatus = (status, statusesByDisplayName, members) => {
+  const getStatusFromDisplayName = (_status) => statusesByDisplayName[_status].name
+
   if (status === '' || status === 'all') {
     return members
   } else {
     return members.filter(
-      (member) => member.status.toLowerCase() === status
+      (member) => getStatusFromDisplayName(member.status) === status
     )
   }
 }
@@ -51,7 +53,8 @@ export default {
 
   props: {
     members: Array,
-    choices: Array,
+    role_choices: Array,
+    status_choices: Array,
   },
 
   data: function () {
@@ -90,8 +93,9 @@ export default {
     return {
       searchValue: '',
       status: '',
+      statusesByDisplayName: indexBy(prop('display_name'), this.status_choices),
       role: '',
-      rolesByDisplayName: indexBy(prop('display_name'), this.choices),
+      rolesByDisplayName: indexBy(prop('display_name'), this.role_choices),
       sortInfo: {
         columnName: '',
         isAscending: true,
@@ -104,7 +108,7 @@ export default {
     searchedList: function () {
       return pipe(
         partial(search, [this.searchValue]),
-        partial(filterByStatus, [this.status]),
+        partial(filterByStatus, [this.status, this.statusesByDisplayName]),
         partial(filterByRole, [this.role, this.rolesByDisplayName]),
         partial(sort, [this.sortInfo])
       )(this.members)

styles/components/_search_bar.scss

@@ -27,6 +27,8 @@
     flex-basis: 100%;
 
     .usa-input {
+      flex-basis: 100%;
+
       @media (min-width:1000px) {
         margin-top: 0;
       }

templates/workspaces/members/index.html

@@ -47,7 +47,12 @@
 {% endif %}
 
 
-<members-list inline-template id="search-template" v-bind:members='{{ members | tojson}}' v-bind:choices='{{ choices | tojson}}'>
+<members-list
+  inline-template
+  id="search-template"
+  v-bind:members='{{ members | tojson}}'
+  v-bind:role_choices='{{ role_choices | tojson}}'
+  v-bind:status_choices='{{ status_choices | tojson}}'>
   <div>
   <form class='search-bar' @submit.prevent>
     <div class='usa-input search-input'>
@@ -56,26 +61,28 @@
       <button type="button"></button>
     </div>
 
-    <div class='usa-input filter-input'>
+    <div class="search-bar__filters">
-      <label for='filter-status'>Filter members by status</label>
+      <div class='usa-input'>
-      <select v-model="status" id="filter-status" name="filter-status">
+        <label for='filter-status'>Filter members by status</label>
-        <option value="" selected disabled>Filter by status</option>
+        <select v-model="status" id="filter-status" name="filter-status">
-        <option value="all">View All</option>
+          <option value="" selected disabled>Filter by status</option>
-        <option value="active">Active</option>
+          <option value="all">View All</option>
-        <option value="pending">Pending</option>
+          {% for status in status_choices %}
-        <option value="denied">Denied</option>
+            <option value='{{ status.name }}'>{{ status.display_name }}</option>
-      </select>
+          {% endfor %}
-    </div>
+        </select>
+      </div>
 
-    <div class='usa-input filter-input'>
+      <div class='usa-input'>
-      <label for='filter-role'>Filter members by role</label>
+        <label for='filter-role'>Filter members by role</label>
-      <select v-model="role" id="filter-role" name="filter-role">
+        <select v-model="role" id="filter-role" name="filter-role">
-        <option value="" selected disabled>Filter by role</option>
+          <option value="" selected disabled>Filter by role</option>
-        <option value="all">View All</option>
+          <option value="all">View All</option>
-        {% for role in choices %}
+          {% for role in role_choices %}
-          <option value='{{ role.name }}'>{{ role.display_name }}</option>
+            <option value='{{ role.name }}'>{{ role.display_name }}</option>
-        {% endfor %}
+          {% endfor %}
-      </select>
+        </select>
+      </div>
     </div>
   </form>