Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

[TablePagination] Fix negative pagination numbers #8435

Merged
merged 3 commits into from
Sep 28, 2017
Merged

[TablePagination] Fix negative pagination numbers #8435

Show file tree
Hide file tree
Changes from 1 commit
Commits
Show all changes
3 commits
Select commit Hold shift + click to select a range
10b83b4
[TablePagination] Never show negative start numbers, display start nu…
leMaik Sep 28, 2017
cf01f51
[TablePagination] Improve the test and add another one.
leMaik Sep 28, 2017
ac645eb
Update TablePagination.spec.js
oliviertassinari Sep 28, 2017
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
4 changes: 2 additions & 2 deletions src/Table/TablePagination.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -119,7 +119,7 @@ class TablePagination extends React.Component<DefaultProps & Props> {
};

componentWillReceiveProps({ count, onChangePage, rowsPerPage }) {
const newLastPage = Math.ceil(count / rowsPerPage) - 1;
const newLastPage = Math.max(0, Math.ceil(count / rowsPerPage) - 1);
if (this.props.page > newLastPage) {
onChangePage(null, newLastPage);
}
Expand Down Expand Up @@ -171,7 +171,7 @@ class TablePagination extends React.Component<DefaultProps & Props> {
</Select>
<Typography type="caption">
{labelDisplayedRows({
from: page * rowsPerPage + 1,
from: count === 0 ? 0 : page * rowsPerPage + 1,
to: Math.min(count, (page + 1) * rowsPerPage),
count,
page,
Expand Down
30 changes: 30 additions & 0 deletions src/Table/TablePagination.spec.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -213,5 +213,35 @@ describe('<TablePagination />', () => {
// now, the third page doesn't exist anymore
assert.strictEqual(page, 1);
});

it('should not display 0 as start number if the table is empty ', () => {
function ExampleTable(props) {
// setProps only works on the mounted root element, so wrap the table
return (
<table>
<TableFooter>
<TablePagination
count={0}
page={0}
onChangePage={noop}
onChangeRowsPerPage={noop}
{...props}
/>
</TableFooter>
</table>
);
}

const wrapper = mount(<ExampleTable rowsPerPage={5} />);
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

is shallow possible?

Copy link
Member Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Yeah, I should split the test. I'll update this.

Copy link
Member Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Unfortunately, I can't get the text of the nested typography element if the Table is shallow. 😕 I updated the test to actually test if #8431 is fixed.

wrapper.setProps({ rowsPerPage: 25 });
// now, there is one page, which is empty
assert.strictEqual(
wrapper
.find('withStyles(Typography)')
.at(1)
.text(),
'0-0 of 0',
);
});
});
});