rename org teams functions based on guide

This commit is contained in:
John Mitchell
2019-03-26 17:04:34 -04:00
parent 7e414ace5a
commit 5419434daa
5 changed files with 43 additions and 43 deletions

View File

@@ -25,7 +25,7 @@ describe('<OrganizationTeamsList />', () => {
<OrganizationTeamsList <OrganizationTeamsList
match={{ path: '/organizations/:id', url: '/organizations/1', params: { id: '1' } }} match={{ path: '/organizations/:id', url: '/organizations/1', params: { id: '1' } }}
location={{ search: '', pathname: '/organizations/1/teams' }} location={{ search: '', pathname: '/organizations/1/teams' }}
getTeamsList={() => {}} onReadTeamsList={() => {}}
removeRole={() => {}} removeRole={() => {}}
/> />
</MemoryRouter> </MemoryRouter>
@@ -40,7 +40,7 @@ describe('<OrganizationTeamsList />', () => {
<OrganizationTeamsList <OrganizationTeamsList
match={{ path: '/organizations/:id', url: '/organizations/1', params: { id: '0' } }} match={{ path: '/organizations/:id', url: '/organizations/1', params: { id: '0' } }}
location={{ search: '', pathname: '/organizations/1/teams' }} location={{ search: '', pathname: '/organizations/1/teams' }}
getTeamsList={() => ({ data: { count: 1, results: mockData } })} onReadTeamsList={() => ({ data: { count: 1, results: mockData } })}
/> />
</MemoryRouter> </MemoryRouter>
</I18nProvider> </I18nProvider>
@@ -52,52 +52,52 @@ describe('<OrganizationTeamsList />', () => {
}); });
}); });
test('onSort being passed properly to DataListToolbar component', async (done) => { test('handleSort being passed properly to DataListToolbar component', async (done) => {
const onSort = jest.spyOn(OrganizationTeamsList.prototype, 'onSort'); const handleSort = jest.spyOn(OrganizationTeamsList.prototype, 'handleSort');
const wrapper = mount( const wrapper = mount(
<I18nProvider> <I18nProvider>
<MemoryRouter> <MemoryRouter>
<OrganizationTeamsList <OrganizationTeamsList
match={{ path: '/organizations/:id', url: '/organizations/1', params: { id: '0' } }} match={{ path: '/organizations/:id', url: '/organizations/1', params: { id: '0' } }}
location={{ search: '', pathname: '/organizations/1/teams' }} location={{ search: '', pathname: '/organizations/1/teams' }}
getTeamsList={() => ({ data: { count: 1, results: mockData } })} onReadTeamsList={() => ({ data: { count: 1, results: mockData } })}
/> />
</MemoryRouter> </MemoryRouter>
</I18nProvider> </I18nProvider>
).find('OrganizationTeamsList'); ).find('OrganizationTeamsList');
expect(onSort).not.toHaveBeenCalled(); expect(handleSort).not.toHaveBeenCalled();
setImmediate(() => { setImmediate(() => {
const rendered = wrapper.update(); const rendered = wrapper.update();
rendered.find('button[aria-label="Sort"]').simulate('click'); rendered.find('button[aria-label="Sort"]').simulate('click');
expect(onSort).toHaveBeenCalled(); expect(handleSort).toHaveBeenCalled();
done(); done();
}); });
}); });
test('onSetPage calls getQueryParams fetchOrgTeamsList ', () => { test('handleSetPage calls readQueryParams and readOrganizationTeamsList ', () => {
const spyQueryParams = jest.spyOn(OrganizationTeamsList.prototype, 'getQueryParams'); const spyQueryParams = jest.spyOn(OrganizationTeamsList.prototype, 'readQueryParams');
const spyFetch = jest.spyOn(OrganizationTeamsList.prototype, 'fetchOrgTeamsList'); const spyFetch = jest.spyOn(OrganizationTeamsList.prototype, 'readOrganizationTeamsList');
const wrapper = mount( const wrapper = mount(
<I18nProvider> <I18nProvider>
<MemoryRouter> <MemoryRouter>
<OrganizationTeamsList <OrganizationTeamsList
match={{ path: '/organizations/:id', url: '/organizations/1', params: { id: '0' } }} match={{ path: '/organizations/:id', url: '/organizations/1', params: { id: '0' } }}
location={{ search: '', pathname: '/organizations/1/teams' }} location={{ search: '', pathname: '/organizations/1/teams' }}
getTeamsList={() => ({ data: { count: 1, results: mockData } })} onReadTeamsList={() => ({ data: { count: 1, results: mockData } })}
/> />
</MemoryRouter> </MemoryRouter>
</I18nProvider> </I18nProvider>
).find('OrganizationTeamsList'); ).find('OrganizationTeamsList');
wrapper.instance().onSetPage(2, 10); wrapper.instance().handleSetPage(2, 10);
expect(spyQueryParams).toHaveBeenCalled(); expect(spyQueryParams).toHaveBeenCalled();
expect(spyFetch).toHaveBeenCalled(); expect(spyFetch).toHaveBeenCalled();
wrapper.setState({ sortOrder: 'descending' }); wrapper.setState({ sortOrder: 'descending' });
wrapper.instance().onSetPage(3, 5); wrapper.instance().handleSetPage(3, 5);
expect(spyQueryParams).toHaveBeenCalled(); expect(spyQueryParams).toHaveBeenCalled();
expect(spyFetch).toHaveBeenCalled(); expect(spyFetch).toHaveBeenCalled();
const queryParamCalls = spyQueryParams.mock.calls; const queryParamCalls = spyQueryParams.mock.calls;
// make sure last two getQueryParams calls // make sure last two readQueryParams calls
// were called with the correct arguments // were called with the correct arguments
expect(queryParamCalls[queryParamCalls.length - 2][0]) expect(queryParamCalls[queryParamCalls.length - 2][0])
.toEqual({ order_by: 'name', page: 2, page_size: 10 }); .toEqual({ order_by: 'name', page: 2, page_size: 10 });

View File

@@ -8,7 +8,7 @@ const mockAPITeamsList = {
foo: 'bar', foo: 'bar',
}; };
const mockGetOrganizationTeamsList = () => Promise.resolve(mockAPITeamsList); const readOrganizationTeamsList = () => Promise.resolve(mockAPITeamsList);
describe('<OrganizationTeams />', () => { describe('<OrganizationTeams />', () => {
test('initially renders succesfully', () => { test('initially renders succesfully', () => {
@@ -19,7 +19,7 @@ describe('<OrganizationTeams />', () => {
location={{ search: '', pathname: '/organizations/1/teams' }} location={{ search: '', pathname: '/organizations/1/teams' }}
params={{}} params={{}}
api={{ api={{
getOrganizationTeamsList: jest.fn(), readOrganizationTeamsList: jest.fn(),
}} }}
/> />
</MemoryRouter> </MemoryRouter>
@@ -34,12 +34,12 @@ describe('<OrganizationTeams />', () => {
location={{ search: '', pathname: '/organizations/1/teams' }} location={{ search: '', pathname: '/organizations/1/teams' }}
params={{}} params={{}}
api={{ api={{
getOrganizationTeamsList: mockGetOrganizationTeamsList readOrganizationTeamsList
}} }}
/> />
</MemoryRouter> </MemoryRouter>
).find('OrganizationTeams'); ).find('OrganizationTeams');
const teamsList = await wrapper.instance().getOrgTeamsList(); const teamsList = await wrapper.instance().readOrganizationTeamsList();
expect(teamsList).toEqual(mockAPITeamsList); expect(teamsList).toEqual(mockAPITeamsList);
}); });
}); });

View File

@@ -70,7 +70,7 @@ class APIClient {
return this.http.get(endpoint, { params }); return this.http.get(endpoint, { params });
} }
getOrganizationTeamsList (id, params = {}) { readOrganizationTeamsList (id, params = {}) {
const endpoint = `${API_ORGANIZATIONS}${id}/teams/`; const endpoint = `${API_ORGANIZATIONS}${id}/teams/`;
return this.http.get(endpoint, { params }); return this.http.get(endpoint, { params });

View File

@@ -45,7 +45,7 @@ class OrganizationTeamsList extends React.Component {
constructor (props) { constructor (props) {
super(props); super(props);
const { page, page_size } = this.getQueryParams(); const { page, page_size } = this.readQueryParams();
this.state = { this.state = {
page, page,
@@ -56,22 +56,22 @@ class OrganizationTeamsList extends React.Component {
results: [], results: [],
}; };
this.fetchOrgTeamsList = this.fetchOrgTeamsList.bind(this); this.readOrganizationTeamsList = this.readOrganizationTeamsList.bind(this);
this.onSetPage = this.onSetPage.bind(this); this.handleSetPage = this.handleSetPage.bind(this);
this.onSort = this.onSort.bind(this); this.handleSort = this.handleSort.bind(this);
this.getQueryParams = this.getQueryParams.bind(this); this.reatQueryParams = this.readQueryParams.bind(this);
} }
componentDidMount () { componentDidMount () {
const queryParams = this.getQueryParams(); const queryParams = this.readQueryParams();
try { try {
this.fetchOrgTeamsList(queryParams); this.readOrganizationTeamsList(queryParams);
} catch (error) { } catch (error) {
this.setState({ error }); this.setState({ error });
} }
} }
onSetPage (pageNumber, pageSize) { handleSetPage (pageNumber, pageSize) {
const { sortOrder, sortedColumnKey } = this.state; const { sortOrder, sortedColumnKey } = this.state;
const page = parseInt(pageNumber, 10); const page = parseInt(pageNumber, 10);
const page_size = parseInt(pageSize, 10); const page_size = parseInt(pageSize, 10);
@@ -82,12 +82,12 @@ class OrganizationTeamsList extends React.Component {
order_by = `-${order_by}`; order_by = `-${order_by}`;
} }
const queryParams = this.getQueryParams({ page, page_size, order_by }); const queryParams = this.readQueryParams({ page, page_size, order_by });
this.fetchOrgTeamsList(queryParams); this.readOrganizationTeamsList(queryParams);
} }
onSort (sortedColumnKey, sortOrder) { handleSort (sortedColumnKey, sortOrder) {
const { page_size } = this.state; const { page_size } = this.state;
let order_by = sortedColumnKey; let order_by = sortedColumnKey;
@@ -96,12 +96,12 @@ class OrganizationTeamsList extends React.Component {
order_by = `-${order_by}`; order_by = `-${order_by}`;
} }
const queryParams = this.getQueryParams({ order_by, page_size }); const queryParams = this.readQueryParams({ order_by, page_size });
this.fetchOrgTeamsList(queryParams); this.readOrganizationTeamsList(queryParams);
} }
getQueryParams (overrides = {}) { readQueryParams (overrides = {}) {
const { location } = this.props; const { location } = this.props;
const { search } = location; const { search } = location;
@@ -110,8 +110,8 @@ class OrganizationTeamsList extends React.Component {
return Object.assign({}, this.defaultParams, searchParams, overrides); return Object.assign({}, this.defaultParams, searchParams, overrides);
} }
async fetchOrgTeamsList (queryParams) { async readOrganizationTeamsList (queryParams) {
const { match, getTeamsList } = this.props; const { match, onReadTeamsList } = this.props;
const { page, page_size, order_by } = queryParams; const { page, page_size, order_by } = queryParams;
@@ -126,7 +126,7 @@ class OrganizationTeamsList extends React.Component {
try { try {
const { data: const { data:
{ count = 0, results = [] } { count = 0, results = [] }
} = await getTeamsList(match.params.id, queryParams); } = await onReadTeamsList(match.params.id, queryParams);
const pageCount = Math.ceil(count / page_size); const pageCount = Math.ceil(count / page_size);
const stateToUpdate = { const stateToUpdate = {
@@ -178,7 +178,7 @@ class OrganizationTeamsList extends React.Component {
sortOrder={sortOrder} sortOrder={sortOrder}
columns={this.columns} columns={this.columns}
onSearch={() => { }} onSearch={() => { }}
onSort={this.onSort} onSort={this.handleSort}
/> />
<DataList aria-label={i18n._(t`Teams List`)}> <DataList aria-label={i18n._(t`Teams List`)}>
{results.map(({ url, id, name }) => ( {results.map(({ url, id, name }) => (
@@ -198,7 +198,7 @@ class OrganizationTeamsList extends React.Component {
page={page} page={page}
pageCount={pageCount} pageCount={pageCount}
page_size={page_size} page_size={page_size}
onSetPage={this.onSetPage} onSetPage={this.handleSetPage}
/> />
</Fragment> </Fragment>
)} )}
@@ -210,7 +210,7 @@ class OrganizationTeamsList extends React.Component {
} }
OrganizationTeamsList.propTypes = { OrganizationTeamsList.propTypes = {
getTeamsList: PropTypes.func.isRequired, onReadTeamsList: PropTypes.func.isRequired,
}; };
export default OrganizationTeamsList; export default OrganizationTeamsList;

View File

@@ -5,12 +5,12 @@ class OrganizationTeams extends React.Component {
constructor (props) { constructor (props) {
super(props); super(props);
this.getOrgTeamsList = this.getOrgTeamsList.bind(this); this.readOrganizationTeamsList = this.readOrganizationTeamsList.bind(this);
} }
getOrgTeamsList (id, params) { readOrganizationTeamsList (id, params) {
const { api } = this.props; const { api } = this.props;
return api.getOrganizationTeamsList(id, params); return api.readOrganizationTeamsList(id, params);
} }
render () { render () {
@@ -22,7 +22,7 @@ class OrganizationTeams extends React.Component {
return ( return (
<OrganizationTeamsList <OrganizationTeamsList
getTeamsList={this.getOrgTeamsList} onReadTeamsList={this.readOrganizationTeamsList}
match={match} match={match}
location={location} location={location}
history={history} history={history}