GroupMemberContributions Store

ee/app/assets/javascripts/group_member_contributions/store/group_member_store.js

+import { convertObjectPropsToCamelCase } from '~/lib/utils/common_utils';
+
+export default class GroupMemberStore {
+  constructor() {
+    this.state = {};
+    this.state.members = [];
+    this.state.columns = [];
+    this.state.sortOrders = {};
+    this.state.currentSortedColumn = '';
+  }
+
+  get members() {
+    return this.state.members;
+  }
+
+  get sortOrders() {
+    return this.state.sortOrders;
+  }
+
+  setColumns(columns) {
+    this.state.columns = columns;
+    this.state.sortOrders = this.state.columns.reduce(
+      (acc, column) => ({ ...acc, [column.name]: 1 }),
+      {},
+    );
+  }
+
+  setMembers(rawMembers) {
+    this.state.members = rawMembers.map(rawMember => GroupMemberStore.formatMember(rawMember));
+  }
+
+  sortMembers(sortByColumn) {
+    if (sortByColumn) {
+      this.state.currentSortedColumn = sortByColumn;
+      this.state.sortOrders[sortByColumn] = this.state.sortOrders[sortByColumn] * -1;
+
+      const currentColumnOrder = this.state.sortOrders[sortByColumn] || 1;
+      const members = this.state.members.slice().sort((a, b) => {
+        let delta = -1;
+        const columnOrderA = a[sortByColumn];
+        const columnOrderB = b[sortByColumn];
+
+        if (columnOrderA === columnOrderB) {
+          delta = 0;
+        } else if (columnOrderA > columnOrderB) {
+          delta = 1;
+        }
+
+        return delta * currentColumnOrder;
+      });
+
+      this.state.members = members;
+    }
+  }
+
+  static formatMember(rawMember) {
+    return convertObjectPropsToCamelCase(rawMember);
+  }
+}

spec/javascripts/group_member_contributions/store/group_member_store_spec.js

+import GroupMemberStore from 'ee/group_member_contributions/store/group_member_store';
+import defaultColumns from 'ee/group_member_contributions/constants';
+
+import { rawMembers } from '../mock_data';
+
+describe('GroupMemberStore', () => {
+  let store;
+
+  beforeEach(() => {
+    store = new GroupMemberStore();
+  });
+
+  describe('setColumns', () => {
+    beforeEach(() => {
+      store.setColumns(defaultColumns);
+    });
+
+    it('sets columns to store state', () => {
+      expect(store.state.columns).toBe(defaultColumns);
+    });
+
+    it('initializes sortOrders on store state', () => {
+      Object.keys(store.state.sortOrders).forEach(column => {
+        expect(store.state.sortOrders[column]).toBe(1);
+      });
+    });
+  });
+
+  describe('setMembers', () => {
+    it('sets members to store state', () => {
+      store.setMembers(rawMembers);
+      expect(store.state.members.length).toBe(rawMembers.length);
+    });
+  });
+
+  describe('sortMembers', () => {
+    it('sorts members list based on provided column name', () => {
+      store.setColumns(defaultColumns);
+      store.setMembers(rawMembers);
+
+      let firstMember = store.state.members[0];
+      expect(firstMember.fullname).toBe('Administrator');
+
+      store.sortMembers('fullname');
+      firstMember = store.state.members[0];
+      expect(firstMember.fullname).toBe('Terrell Graham');
+    });
+  });
+});