1113439055

Committed 19 Dec 2023 09:01PM UTC coverage: 82.752% (-17.2%) from 99.964%

Build # 1113439055

Build Type

Pull #4258

gitlab-ci

Committed by

mender-test-bot

Commit Message

chore: Types update

Signed-off-by: Mender Test Bot <mender@northern.tech>

Pull Request Pull Request #4258: chore: Types update

Run Details

4326 of 6319 branches covered (0.0%)

8348 of 10088 relevant lines covered (82.75%)

189.39 hits per line

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

96.3

/src/js/components/common/pagination.js

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

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

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

const defaultRowsPerPageOptions = [10, 20, DEVICE_LIST_MAXIMUM_LENGTH];
const { perPage: defaultPerPage } = DEVICE_LIST_DEFAULTS;
const paginationIndex = 1;
const paginationLimit = 10000;

const MaybeWrapper = ({ children, disabled }) =>
  disabled ? (
    <MenderTooltip arrow placement="top" title="Please refine your filter criteria first in order to proceed.">
      <div>{children}</div>
    </MenderTooltip>
  ) : (
    <div>{children}</div>
  );

export const TablePaginationActions = ({ count, page = 0, onPageChange, rowsPerPage = defaultPerPage, showCountInfo = true }) => {
  const [pageNo, setPageNo] = useState(page + paginationIndex);

  useEffect(() => {
    setPageNo(page + paginationIndex);
  }, [page, rowsPerPage, count]);

  const debouncedPage = useDebounce(pageNo, TIMEOUTS.debounceShort);

  useEffect(() => {
    const newPage = Math.min(Math.max(paginationIndex, debouncedPage), Math.max(paginationIndex, Math.ceil(count / rowsPerPage)));
    if (newPage !== page + paginationIndex) {
      onPageChange(newPage);
    }
  }, [count, debouncedPage, onPageChange, page, rowsPerPage]);

  const pages = Math.ceil(count / rowsPerPage);

  const isAtPaginationLimit = pageNo >= paginationLimit / rowsPerPage;
  return (
    <div className="flexbox center-aligned">
      {showCountInfo && <div>{`${(pageNo - paginationIndex) * rowsPerPage + 1}-${Math.min(pageNo * rowsPerPage, count)} of ${count}`}</div>}
      <IconButton onClick={() => setPageNo(pageNo - 1)} disabled={pageNo === paginationIndex} size="large">
        <KeyboardArrowLeft />
      </IconButton>
      <MaybeWrapper disabled={isAtPaginationLimit}>
        <IconButton onClick={() => setPageNo(pageNo + 1)} disabled={pageNo >= pages || isAtPaginationLimit} size="large">
          <KeyboardArrowRight />
        </IconButton>
      </MaybeWrapper>
    </div>
  );
};

const Pagination = props => {
  const { className, onChangeRowsPerPage, onChangePage, page = 0, rowsPerPageOptions = defaultRowsPerPageOptions, showCountInfo, ...remainingProps } = props;
  // this is required due to the MUI tablepagination being 0-indexed, whereas we work with 1-indexed apis
  // running it without adjustment will lead to warnings from MUI
  const propsPage = Math.max(page - paginationIndex, 0);
  return (
    <TablePagination
      className={`flexbox margin-top ${className || ''}`}
      classes={{ spacer: 'flexbox no-basis' }}
      component="div"
      labelDisplayedRows={() => ''}
      labelRowsPerPage="Rows"
      SelectProps={{ name: 'pagination' }}
      rowsPerPageOptions={rowsPerPageOptions}
      onRowsPerPageChange={e => onChangeRowsPerPage(e.target.value)}
      page={propsPage}
      onPageChange={onChangePage}
      ActionsComponent={actionProps => <TablePaginationActions {...actionProps} showCountInfo={showCountInfo} />}
      {...remainingProps}
    />
  );
};

export default Pagination;

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];	28✔
25	const { perPage: defaultPerPage } = DEVICE_LIST_DEFAULTS;	28✔
26	const paginationIndex = 1;	28✔
27	const paginationLimit = 10000;	28✔
28
29	const MaybeWrapper = ({ children, disabled }) =>	28✔
30	disabled ? (	157✔
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 }) => {	28!
39	const [pageNo, setPageNo] = useState(page + paginationIndex);	157✔
40
41	useEffect(() => {	157✔
42	setPageNo(page + paginationIndex);	139✔
43	}, [page, rowsPerPage, count]);
44
45	const debouncedPage = useDebounce(pageNo, TIMEOUTS.debounceShort);	157✔
46
47	useEffect(() => {	157✔
48	const newPage = Math.min(Math.max(paginationIndex, debouncedPage), Math.max(paginationIndex, Math.ceil(count / rowsPerPage)));	142✔
49	if (newPage !== page + paginationIndex) {	142✔
50	onPageChange(newPage);	3✔
51	}
52	}, [count, debouncedPage, onPageChange, page, rowsPerPage]);
53
54	const pages = Math.ceil(count / rowsPerPage);	157✔
55
56	const isAtPaginationLimit = pageNo >= paginationLimit / rowsPerPage;	157✔
57	return (	157✔
58	<div className="flexbox center-aligned">
59	{showCountInfo && <div>{`${(pageNo - paginationIndex) * rowsPerPage + 1}-${Math.min(pageNo * rowsPerPage, count)} of ${count}`}</div>}	314✔
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 => {	28✔
73	const { className, onChangeRowsPerPage, onChangePage, page = 0, rowsPerPageOptions = defaultRowsPerPageOptions, showCountInfo, ...remainingProps } = props;	135!
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);	135✔
77	return (	135✔
78	<TablePagination
79	className={`flexbox margin-top ${className \|\| ''}`}	137✔
80	classes={{ spacer: 'flexbox no-basis' }}
81	component="div"
82	labelDisplayedRows={() => ''}	147✔
83	labelRowsPerPage="Rows"
84	SelectProps={{ name: 'pagination' }}
85	rowsPerPageOptions={rowsPerPageOptions}
86	onRowsPerPageChange={e => onChangeRowsPerPage(e.target.value)}	×
87	page={propsPage}
88	onPageChange={onChangePage}
89	ActionsComponent={actionProps => <TablePaginationActions {...actionProps} showCountInfo={showCountInfo} />}	147✔
90	{...remainingProps}
91	/>
92	);
93	};
94
95	export default Pagination;

mendersoftware / gui / 1113439055

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

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