Merge pull request #163 from mabashian/146-access-expand-collapse

Remove expand/collapse from org access list

__tests__/pages/Organizations/components/OrganizationAccessList.test.jsx

@@ -65,35 +65,6 @@ describe('<OrganizationAccessList />', () => {
     });
   });
 
-  test('onExpand and onCompact methods called when user clicks on Expand and Compact icons respectively', async (done) => {
-    const onExpand = jest.spyOn(_OrganizationAccessList.prototype, 'onExpand');
-    const onCompact = jest.spyOn(_OrganizationAccessList.prototype, 'onCompact');
-    const wrapper = mount(
-      <I18nProvider>
-        <MemoryRouter>
-          <_OrganizationAccessList
-            match={{ path: '/organizations/:id', url: '/organizations/1', params: { id: '0' } }}
-            location={{ search: '', pathname: '/organizations/1/access' }}
-            getAccessList={() => ({ data: { count: 1, results: mockData } })}
-            removeRole={() => {}}
-            handleHttpError={() => {}}
-          />
-        </MemoryRouter>
-      </I18nProvider>
-    ).find('OrganizationAccessList');
-    expect(onExpand).not.toHaveBeenCalled();
-    expect(onCompact).not.toHaveBeenCalled();
-
-    setImmediate(() => {
-      const rendered = wrapper.update();
-      rendered.find('button[aria-label="Expand"]').simulate('click');
-      rendered.find('button[aria-label="Collapse"]').simulate('click');
-      expect(onExpand).toHaveBeenCalled();
-      expect(onCompact).toHaveBeenCalled();
-      done();
-    });
-  });
-
   test('onSort being passed properly to DataListToolbar component', async (done) => {
     const onSort = jest.spyOn(_OrganizationAccessList.prototype, 'onSort');
     const wrapper = mount(

src/pages/Organizations/components/OrganizationAccessList.jsx

@@ -44,10 +44,6 @@ const detailValueStyle = {
   overflow: 'visible',
 };
 
-const hiddenStyle = {
-  display: 'none',
-};
-
 const Detail = ({ label, value, url, customStyles }) => {
   let detail = null;
   if (value) {
@@ -105,7 +101,6 @@ class OrganizationAccessList extends React.Component {
       count: 0,
       sortOrder: 'ascending',
       sortedColumnKey: 'username',
-      isCompact: false,
       showWarning: false,
       warningTitle: '',
       warningMsg: '',
@@ -117,8 +112,6 @@ class OrganizationAccessList extends React.Component {
 
     this.fetchOrgAccessList = this.fetchOrgAccessList.bind(this);
     this.onSetPage = this.onSetPage.bind(this);
-    this.onExpand = this.onExpand.bind(this);
-    this.onCompact = this.onCompact.bind(this);
     this.onSort = this.onSort.bind(this);
     this.getQueryParams = this.getQueryParams.bind(this);
     this.removeAccessRole = this.removeAccessRole.bind(this);
@@ -136,14 +129,6 @@ class OrganizationAccessList extends React.Component {
     }
   }
 
-  onExpand () {
-    this.setState({ isCompact: false });
-  }
-
-  onCompact () {
-    this.setState({ isCompact: true });
-  }
-
   onSetPage (pageNumber, pageSize) {
     const { sortOrder, sortedColumnKey } = this.state;
     const page = parseInt(pageNumber, 10);
@@ -315,7 +300,6 @@ class OrganizationAccessList extends React.Component {
       page,
       sortedColumnKey,
       sortOrder,
-      isCompact,
       warningMsg,
       warningTitle,
       showWarning
@@ -343,10 +327,6 @@ class OrganizationAccessList extends React.Component {
                   columns={this.columns}
                   onSearch={() => { }}
                   onSort={this.onSort}
-                  onCompact={this.onCompact}
-                  onExpand={this.onExpand}
-                  isCompact={isCompact}
-                  showExpandCollapse
                 />
                 {showWarning && (
                   <AlertModal
@@ -375,7 +355,7 @@ class OrganizationAccessList extends React.Component {
                             label={i18n._(t`Name`)}
                             value={`${result.first_name} ${result.last_name}`}
                             url={null}
-                            customStyles={isCompact ? hiddenStyle : null}
+                            customStyles={null}
                           />
                         ) : (
                           null
@@ -386,13 +366,10 @@ class OrganizationAccessList extends React.Component {
                           label=" "
                           value=" "
                           url={null}
-                          customStyles={isCompact ? hiddenStyle : null}
+                          customStyles={null}
                         />
                         {result.userRoles.length > 0 && (
-                          <ul style={isCompact
-                            ? { ...userRolesWrapperStyle, ...hiddenStyle }
-                            : userRolesWrapperStyle}
-                          >
+                          <ul style={userRolesWrapperStyle}>
                             <Text component={TextVariants.h6} style={detailLabelStyle}>{i18n._(t`User Roles`)}</Text>
                             {result.userRoles.map(role => (
                               <Chip
@@ -406,10 +383,7 @@ class OrganizationAccessList extends React.Component {
                           </ul>
                         )}
                         {result.teamRoles.length > 0 && (
-                          <ul style={isCompact
-                            ? { ...userRolesWrapperStyle, ...hiddenStyle }
-                            : userRolesWrapperStyle}
-                          >
+                          <ul style={userRolesWrapperStyle}>
                             <Text component={TextVariants.h6} style={detailLabelStyle}>{i18n._(t`Team Roles`)}</Text>
                             {result.teamRoles.map(role => (
                               <Chip