8096387480

Committed 29 Feb 2024 12:56PM UTC coverage: 97.177% (-0.3%) from 97.491%

Build # 8096387480

Build Type

push

github

Committed by

web-flow

Commit Message

Merge pull request #323 from IQSS/feature/311-integrate-breadcrumbs-with-owner-information

311 - Integrate breadcrumbs with owner information

Run Details

541 of 565 branches covered (95.75%)

Branch coverage included in aggregate %.

11 of 13 new or added lines in 6 files covered. (84.62%)

2 existing lines in 1 file now uncovered.

1593 of 1631 relevant lines covered (97.67%)

3714.58 hits per line

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

85.71

/src/sections/shared/pagination/PaginationControls.tsx

import { Col, Pagination, Row } from '@iqss/dataverse-design-system'
import { PageNumbersButtonsWithEllipsis } from './PageNumbersButtonsWithEllipsis'
import { PageSizeSelector } from './PageSizeSelector'
import styles from './Pagination.module.scss'
import { PaginationInfo } from '../../../shared/pagination/domain/models/PaginationInfo'
import { useEffect, useState } from 'react'
import { FilePaginationInfo } from '../../../files/domain/models/FilePaginationInfo'
import { DatasetPaginationInfo } from '../../../dataset/domain/models/DatasetPaginationInfo'
import { useSearchParams } from 'react-router-dom'

interface PaginationProps {
  onPaginationInfoChange: (
    paginationInfo: PaginationInfo<DatasetPaginationInfo | FilePaginationInfo>
  ) => void
  initialPaginationInfo: PaginationInfo<DatasetPaginationInfo | FilePaginationInfo>
  showPageSizeSelector?: boolean
  updateQueryParam?: boolean
}
const MINIMUM_NUMBER_OF_PAGES_TO_DISPLAY_PAGINATION = 2
export function PaginationControls({
  onPaginationInfoChange,
  initialPaginationInfo,
  showPageSizeSelector = true,
  updateQueryParam = false
}: PaginationProps) {
  const [searchParams, setSearchParams] = useSearchParams()
  const [paginationInfo, setPaginationInfo] = useState<DatasetPaginationInfo | FilePaginationInfo>(
    initialPaginationInfo
  )
  const goToPage = (newPage: number) => {
    setPaginationInfo(paginationInfo.goToPage(newPage))
  }
  const goToPreviousPage = () => {
    setPaginationInfo(paginationInfo.goToPreviousPage())
  }
  const goToNextPage = () => {
    setPaginationInfo(paginationInfo.goToNextPage())
  }
  const setPageSize = (newPageSize: number) => {
    setPaginationInfo(paginationInfo.withPageSize(newPageSize))
  }

  useEffect(() => {
    onPaginationInfoChange(paginationInfo)
  }, [paginationInfo.pageSize])

  useEffect(() => {
    onPaginationInfoChange(paginationInfo)
    if (updateQueryParam) {
      if (searchParams.get('page') !== paginationInfo.page.toString()) {
        searchParams.set('page', paginationInfo.page.toString())
        setSearchParams(searchParams)
      }
    }
  }, [paginationInfo.page])

  useEffect(() => {
    setPaginationInfo(paginationInfo.withTotal(initialPaginationInfo.totalItems))
  }, [initialPaginationInfo.totalItems])

  useEffect(() => {
    if (updateQueryParam) {
      if (searchParams.get('page') !== paginationInfo.page.toString()) {
        const page = searchParams.get('page') ? parseInt(searchParams.get('page') as string) : 1
        searchParams.set('page', page.toString())
        setSearchParams(searchParams, { replace: true })
        goToPage(page)
      }
    }
  }, [searchParams])

  if (paginationInfo.totalPages < MINIMUM_NUMBER_OF_PAGES_TO_DISPLAY_PAGINATION) {
    return <></>
  }
  return (
    <Row className={styles.row}>
      <Col md="auto">
        <div className={styles.container}>
          <Pagination>
            <Pagination.First
              onClick={() => goToPage(1)}
              disabled={!paginationInfo.hasPreviousPage}
            />
            <Pagination.Prev
              onClick={() => goToPreviousPage()}
              disabled={!paginationInfo.hasPreviousPage}
            />
            <PageNumbersButtonsWithEllipsis
              selectedPageIndex={paginationInfo.page - 1}
              pageCount={paginationInfo.totalPages}
              goToPage={goToPage}
            />
            <Pagination.Next
              onClick={() => goToNextPage()}
              disabled={!paginationInfo.hasNextPage}
            />
            <Pagination.Last
              onClick={() => goToPage(paginationInfo.totalPages)}
              disabled={!paginationInfo.hasNextPage}
            />
          </Pagination>
          {showPageSizeSelector && (
            <PageSizeSelector
              itemName={paginationInfo.itemName}
              pageSize={paginationInfo.pageSize}
              setPageSize={setPageSize}
            />
          )}
        </div>
      </Col>
    </Row>
  )
}

1	import { Col, Pagination, Row } from '@iqss/dataverse-design-system'
2	import { PageNumbersButtonsWithEllipsis } from './PageNumbersButtonsWithEllipsis'
3	import { PageSizeSelector } from './PageSizeSelector'
4	import styles from './Pagination.module.scss'
5	import { PaginationInfo } from '../../../shared/pagination/domain/models/PaginationInfo'
6	import { useEffect, useState } from 'react'
7	import { FilePaginationInfo } from '../../../files/domain/models/FilePaginationInfo'
8	import { DatasetPaginationInfo } from '../../../dataset/domain/models/DatasetPaginationInfo'
9	import { useSearchParams } from 'react-router-dom'
10
11	interface PaginationProps {
12	onPaginationInfoChange: (
13	paginationInfo: PaginationInfo<DatasetPaginationInfo \| FilePaginationInfo>
14	) => void
15	initialPaginationInfo: PaginationInfo<DatasetPaginationInfo \| FilePaginationInfo>
16	showPageSizeSelector?: boolean
17	updateQueryParam?: boolean
18	}
19	const MINIMUM_NUMBER_OF_PAGES_TO_DISPLAY_PAGINATION = 2	54✔
20	export function PaginationControls({	54✔
21	onPaginationInfoChange,
22	initialPaginationInfo,
23	showPageSizeSelector = true,	1,956✔
24	updateQueryParam = false	1,960✔
25	}: PaginationProps) {	2,065✔
26	const [searchParams, setSearchParams] = useSearchParams()	2,065✔
27	const [paginationInfo, setPaginationInfo] = useState<DatasetPaginationInfo \| FilePaginationInfo>(	2,065✔
28	initialPaginationInfo
29	)
30	const goToPage = (newPage: number) => {	2,065✔
31	setPaginationInfo(paginationInfo.goToPage(newPage))	119✔
32	}
33	const goToPreviousPage = () => {	2,065✔
34	setPaginationInfo(paginationInfo.goToPreviousPage())	24✔
35	}
36	const goToNextPage = () => {	2,065✔
37	setPaginationInfo(paginationInfo.goToNextPage())	34✔
38	}
39	const setPageSize = (newPageSize: number) => {	2,065✔
40	setPaginationInfo(paginationInfo.withPageSize(newPageSize))	115✔
41	}
42
43	useEffect(() => {	2,065✔
44	onPaginationInfoChange(paginationInfo)	511✔
45	}, [paginationInfo.pageSize])
46
47	useEffect(() => {	2,065✔
48	onPaginationInfoChange(paginationInfo)	615✔
49	if (updateQueryParam) {	615✔
50	if (searchParams.get('page') !== paginationInfo.page.toString()) {	44✔
51	searchParams.set('page', paginationInfo.page.toString())	40✔
52	setSearchParams(searchParams)	40✔
53	}
54	}
55	}, [paginationInfo.page])
56
57	useEffect(() => {	2,065✔
58	setPaginationInfo(paginationInfo.withTotal(initialPaginationInfo.totalItems))	671✔
59	}, [initialPaginationInfo.totalItems])
60
61	useEffect(() => {	2,065✔
62	if (updateQueryParam) {	436✔
63	if (searchParams.get('page') !== paginationInfo.page.toString()) {	80!
UNCOV 64	const page = searchParams.get('page') ? parseInt(searchParams.get('page') as string) : 1	×
NEW 65	searchParams.set('page', page.toString())	×
NEW 66	setSearchParams(searchParams, { replace: true })	×
UNCOV 67	goToPage(page)	×
68	}
69	}
70	}, [searchParams])
71
72	if (paginationInfo.totalPages < MINIMUM_NUMBER_OF_PAGES_TO_DISPLAY_PAGINATION) {	2,065✔
73	return <></>	1,025✔
74	}
75	return (	1,040✔
76	<Row className={styles.row}>
77	<Col md="auto">
78	<div className={styles.container}>
79	<Pagination>
80	<Pagination.First
81	onClick={() => goToPage(1)}	8✔
82	disabled={!paginationInfo.hasPreviousPage}
83	/>
84	<Pagination.Prev
85	onClick={() => goToPreviousPage()}	24✔
86	disabled={!paginationInfo.hasPreviousPage}
87	/>
88	<PageNumbersButtonsWithEllipsis
89	selectedPageIndex={paginationInfo.page - 1}
90	pageCount={paginationInfo.totalPages}
91	goToPage={goToPage}
92	/>
93	<Pagination.Next
94	onClick={() => goToNextPage()}	34✔
95	disabled={!paginationInfo.hasNextPage}
96	/>
97	<Pagination.Last
98	onClick={() => goToPage(paginationInfo.totalPages)}	17✔
99	disabled={!paginationInfo.hasNextPage}
100	/>
101	</Pagination>
102	{showPageSizeSelector && (	1,975✔
103	<PageSizeSelector
104	itemName={paginationInfo.itemName}
105	pageSize={paginationInfo.pageSize}
106	setPageSize={setPageSize}
107	/>
108	)}
109	</div>
110	</Col>
111	</Row>
112	)
113	}	54✔

IQSS / dataverse-frontend / 8096387480

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