dequelabs / dequelabs/cauldron

Using Pagination with a Modal causes a react state update on tooltip forcing the modal to close

Open
#727 1 comment 0 reactions 0 assignees View on GitHub
bug info needed
Dominant language
TypeScript
Stars
127
Forks
31
Avg merge
2d 12h
Merged PRs (30d)
8

Description

When clicking the chevron buttons once it reaches the page limit is is trying to update the tooltip component when the button is disabled causing the modal to close. Esstionally its trying to replace itself within the modal

There is a work around, to override the onClick function within pagination:

```
const onFirstPageClick = (
event: React.MouseEvent
): void => {
event.preventDefault();
pagination.onFirstPageClick();
};

const onPreviousPageClick = (
event: React.MouseEvent
): void => {
event.preventDefault();
pagination.onPreviousPageClick();
};

const onNextPageClick = (
event: React.MouseEvent
): void => {
event.preventDefault();
pagination.onNextPageClick();
};

const onLastPageClick = (
event: React.MouseEvent
): void => {
event.preventDefault();
pagination.onLastPageClick();
};
```
Within Pagination:
```tsx

{t('{{ x }} of {{ y }}', {
x: pageStatus.currentPage,
y: nodeLength
})}

}
/>
```

Contributor guide

Open the contributing guide

Assessment

This issue has not been assessed yet.

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.