diff --git a/js/components/__tests__/members_list.test.js b/js/components/__tests__/members_list.test.js deleted file mode 100644 index f73bf2fc..00000000 --- a/js/components/__tests__/members_list.test.js +++ /dev/null @@ -1,60 +0,0 @@ -import { shallowMount } from '@vue/test-utils' - -import MembersList from '../members_list' - -describe('MembersList', () => { - const members = [ - { - name: 'Luke Skywalker', - num_env: 2, - status: 'active', - role: 'developer', - }, - { - name: 'Chewie', - num_env: 3, - status: 'pending', - role: 'admin', - }, - ] - const role_choices = [ - { display_name: 'Developer', name: 'developer' }, - { display_name: 'Admin', name: 'admin' }, - ] - const status_choices = [ - { display_name: 'Active', name: 'active' }, - { display_name: 'Pending', name: 'pending' }, - ] - - const createWrapper = () => - shallowMount(MembersList, { - propsData: { - members, - role_choices, - status_choices, - }, - }) - - it('should sort by name by default', () => { - const wrapper = createWrapper() - const listedMembers = wrapper.vm.searchedList - const memberNames = listedMembers.map(member => member.name) - expect(memberNames).toEqual(['Chewie', 'Luke Skywalker']) - }) - - it('should reverse sort by name when updated with Name', () => { - const wrapper = createWrapper() - wrapper.vm.updateSort('Name') - const listedMembers = wrapper.vm.searchedList - const memberNames = listedMembers.map(member => member.name) - expect(memberNames).toEqual(['Luke Skywalker', 'Chewie']) - }) - - it('should sort by number of environments when environments selected', () => { - const wrapper = createWrapper() - wrapper.vm.updateSort('Environments') - const listedMembers = wrapper.vm.searchedList - const memberEnvs = listedMembers.map(member => member.num_env) - expect(memberEnvs).toEqual([2, 3]) - }) -}) diff --git a/js/components/members_list.js b/js/components/members_list.js deleted file mode 100644 index 7c862a31..00000000 --- a/js/components/members_list.js +++ /dev/null @@ -1,152 +0,0 @@ -import { - compose, - sortBy, - reverse, - indexBy, - partial, - prop, - pipe, - toLower, -} from 'ramda' - -const search = (query, members) => { - if (query === '' || query === 'all') { - return members - } else { - const normalizedQuery = query.toLowerCase() - return members.filter(member => - member.name.toLowerCase().includes(normalizedQuery) - ) - } -} - -const filterByStatus = (status, statusesByDisplayName, members) => { - const getStatusFromDisplayName = _status => - statusesByDisplayName[_status].name - - if (status === '' || status === 'all') { - return members - } else { - return members.filter( - member => getStatusFromDisplayName(member.status) === status - ) - } -} - -const filterByRole = (role, rolesByDisplayname, members) => { - const getRoleNameFromDisplayName = _role => rolesByDisplayname[_role].name - - if (role === '' || role === 'all') { - return members - } else { - return members.filter( - member => getRoleNameFromDisplayName(member.role) === role - ) - } -} - -const sort = (sortInfo, members) => { - if (sortInfo.columnName === '') { - return members - } else { - const sortColumn = sortInfo.columns[sortInfo.columnName] - const sortedMembers = sortColumn.sortFunc(sortColumn.attr, members) - - return sortInfo.isAscending ? sortedMembers : reverse(sortedMembers) - } -} - -export default { - name: 'members-list', - - props: { - members: Array, - role_choices: { - type: Array, - default: () => [], - }, - status_choices: { - type: Array, - default: () => [], - }, - }, - - data: function() { - const alphabeticalSort = (attr, members) => { - const lowercaseProp = compose( - toLower, - prop(attr) - ) - return sortBy(lowercaseProp, members) - } - - const numericSort = (attr, members) => sortBy(prop(attr), members) - - const columns = [ - { - displayName: 'Name', - attr: 'name', - sortFunc: alphabeticalSort, - width: '50%', - }, - { - displayName: 'Environments', - attr: 'num_env', - sortFunc: numericSort, - class: 'table-cell--align-center', - }, - { - displayName: 'Status', - attr: 'status', - sortFunc: alphabeticalSort, - }, - { - displayName: 'Portfolio Role', - attr: 'role', - sortFunc: alphabeticalSort, - }, - ] - - const defaultSortColumn = 'Name' - - return { - searchValue: '', - status: '', - statusesByDisplayName: indexBy(prop('display_name'), this.status_choices), - role: '', - rolesByDisplayName: indexBy(prop('display_name'), this.role_choices), - sortInfo: { - columnName: defaultSortColumn, - isAscending: true, - columns: indexBy(prop('displayName'), columns), - }, - } - }, - - computed: { - searchedList: function() { - return pipe( - partial(search, [this.searchValue]), - partial(filterByStatus, [this.status, this.statusesByDisplayName]), - partial(filterByRole, [this.role, this.rolesByDisplayName]), - partial(sort, [this.sortInfo]) - )(this.members) - }, - }, - - methods: { - updateSort: function(columnName) { - // clicking a column twice toggles ascending / descending - if (columnName === this.sortInfo.columnName) { - this.sortInfo.isAscending = !this.sortInfo.isAscending - } - - this.sortInfo.columnName = columnName - }, - getColumns: function() { - return Object.values(this.sortInfo.columns) - }, - }, - - template: '
', -} diff --git a/js/index.js b/js/index.js index 3a84820e..42a7b7c5 100644 --- a/js/index.js +++ b/js/index.js @@ -30,7 +30,6 @@ import BudgetChart from './components/charts/budget_chart' import SpendTable from './components/tables/spend_table' import EnvironmentsTable from './components/tables/application_environments' import TaskOrderList from './components/tables/task_order_list.js' -import MembersList from './components/members_list' import LocalDatetime from './components/local_datetime' import ConfirmationPopover from './components/confirmation_popover' import { isNotInVerticalViewport } from './lib/viewport' @@ -69,7 +68,6 @@ const app = new Vue({ SpendTable, EnvironmentsTable, TaskOrderList, - MembersList, LocalDatetime, EditEnvironmentRole, EditApplicationRoles, diff --git a/templates/portfolios/applications/members.html b/templates/portfolios/applications/members.html deleted file mode 100644 index 44ff537b..00000000 --- a/templates/portfolios/applications/members.html +++ /dev/null @@ -1,90 +0,0 @@ -{% extends "portfolios/applications/base.html" %} - -{% from "components/empty_state.html" import EmptyState %} -{% from "components/icon.html" import Icon %} - -{% set secondary_breadcrumb = 'portfolios.applications.team_management.title' | translate({ "application_name": application.name }) %} - -{% block application_content %} - -- !{ col.displayName } - - {{ Icon("caret_down") }} - - - {{ Icon("caret_up") }} - - | -||||
---|---|---|---|---|
- - | -- - | -- No Environment Access - | -- | - |
- - Add A New Member - {{ Icon('plus') }} - - | -