• Home
  • Features
  • Pricing
  • Docs
  • Announcements
  • Sign In

mendersoftware / gui / 951400782

pending completion
951400782

Pull #3900

gitlab-ci

web-flow
chore: bump @testing-library/jest-dom from 5.16.5 to 5.17.0

Bumps [@testing-library/jest-dom](https://github.com/testing-library/jest-dom) from 5.16.5 to 5.17.0.
- [Release notes](https://github.com/testing-library/jest-dom/releases)
- [Changelog](https://github.com/testing-library/jest-dom/blob/main/CHANGELOG.md)
- [Commits](https://github.com/testing-library/jest-dom/compare/v5.16.5...v5.17.0)

---
updated-dependencies:
- dependency-name: "@testing-library/jest-dom"
  dependency-type: direct:development
  update-type: version-update:semver-minor
...

Signed-off-by: dependabot[bot] <support@github.com>
Pull Request #3900: chore: bump @testing-library/jest-dom from 5.16.5 to 5.17.0

4446 of 6414 branches covered (69.32%)

8342 of 10084 relevant lines covered (82.73%)

186.0 hits per line

Source File
Press 'n' to go to next uncovered line, 'b' for previous

92.86
/src/js/components/common/pagination.js
1
// Copyright 2019 Northern.tech AS
2
//
3
//    Licensed under the Apache License, Version 2.0 (the "License");
4
//    you may not use this file except in compliance with the License.
5
//    You may obtain a copy of the License at
6
//
7
//        http://www.apache.org/licenses/LICENSE-2.0
8
//
9
//    Unless required by applicable law or agreed to in writing, software
10
//    distributed under the License is distributed on an "AS IS" BASIS,
11
//    WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
12
//    See the License for the specific language governing permissions and
13
//    limitations under the License.
14
import React, { useEffect, useState } from 'react';
15

16
import { KeyboardArrowLeft, KeyboardArrowRight } from '@mui/icons-material';
17
import { IconButton, TablePagination } from '@mui/material';
18

19
import { TIMEOUTS } from '../../constants/appConstants';
20
import { DEVICE_LIST_DEFAULTS, DEVICE_LIST_MAXIMUM_LENGTH } from '../../constants/deviceConstants';
21
import { useDebounce } from '../../utils/debouncehook';
22
import MenderTooltip from '../common/mendertooltip';
23

24
const defaultRowsPerPageOptions = [10, 20, DEVICE_LIST_MAXIMUM_LENGTH];
29✔
25
const { perPage: defaultPerPage } = DEVICE_LIST_DEFAULTS;
29✔
26
const paginationIndex = 1;
29✔
27
const paginationLimit = 10000;
29✔
28

29
const MaybeWrapper = ({ children, disabled }) =>
29✔
30
  disabled ? (
140✔
31
    <MenderTooltip arrow placement="top" title="Please refine your filter criteria first in order to proceed.">
32
      <div>{children}</div>
33
    </MenderTooltip>
34
  ) : (
35
    <div>{children}</div>
36
  );
37

38
export const TablePaginationActions = ({ count, page = 0, onPageChange, rowsPerPage = defaultPerPage, showCountInfo = true }) => {
29!
39
  const [pageNo, setPageNo] = useState(page + paginationIndex);
140✔
40

41
  useEffect(() => {
140✔
42
    setPageNo(page + paginationIndex);
119✔
43
  }, [page, rowsPerPage, count]);
44

45
  const debouncedPage = useDebounce(pageNo, TIMEOUTS.debounceShort);
140✔
46

47
  useEffect(() => {
140✔
48
    const newPage = Math.min(Math.max(paginationIndex, debouncedPage), Math.max(paginationIndex, Math.ceil(count / rowsPerPage)));
122✔
49
    if (newPage !== page + paginationIndex) {
122✔
50
      onPageChange(newPage);
3✔
51
    }
52
  }, [debouncedPage]);
53

54
  const pages = Math.ceil(count / rowsPerPage);
140✔
55

56
  const isAtPaginationLimit = pageNo >= paginationLimit / rowsPerPage;
140✔
57
  return (
140✔
58
    <div className="flexbox center-aligned">
59
      {showCountInfo && <div>{`${(pageNo - paginationIndex) * rowsPerPage + 1}-${Math.min(pageNo * rowsPerPage, count)} of ${count}`}</div>}
280✔
60
      <IconButton onClick={() => setPageNo(pageNo - 1)} disabled={pageNo === paginationIndex} size="large">
1✔
61
        <KeyboardArrowLeft />
62
      </IconButton>
63
      <MaybeWrapper disabled={isAtPaginationLimit}>
64
        <IconButton onClick={() => setPageNo(pageNo + 1)} disabled={pageNo >= pages || isAtPaginationLimit} size="large">
2✔
65
          <KeyboardArrowRight />
66
        </IconButton>
67
      </MaybeWrapper>
68
    </div>
69
  );
70
};
71

72
const Pagination = props => {
29✔
73
  const { className, onChangeRowsPerPage, onChangePage, page = 0, rowsPerPageOptions = defaultRowsPerPageOptions, showCountInfo, ...remainingProps } = props;
115!
74
  // this is required due to the MUI tablepagination being 0-indexed, whereas we work with 1-indexed apis
75
  // running it without adjustment will lead to warnings from MUI
76
  const propsPage = Math.max(page - paginationIndex, 0);
115✔
77
  return (
115✔
78
    <TablePagination
79
      className={`flexbox margin-top ${className || ''}`}
117✔
80
      classes={{ spacer: 'flexbox no-basis' }}
81
      component="div"
82
      labelDisplayedRows={() => ''}
130✔
83
      labelRowsPerPage="Rows"
84
      rowsPerPageOptions={rowsPerPageOptions}
85
      onRowsPerPageChange={e => onChangeRowsPerPage(e.target.value)}
×
86
      page={propsPage}
87
      onPageChange={onChangePage}
88
      ActionsComponent={actionProps => <TablePaginationActions {...actionProps} showCountInfo={showCountInfo} />}
130✔
89
      {...remainingProps}
90
    />
91
  );
92
};
93

94
export default Pagination;
STATUS · Troubleshooting · Open an Issue · Sales · Support · CAREERS · ENTERPRISE · START FREE · SCHEDULE DEMO
ANNOUNCEMENTS · TWITTER · TOS & SLA · Supported CI Services · What's a CI service? · Automated Testing

© 2025 Coveralls, Inc