diff --git a/packages/core/upload/admin/src/components/PaginationFooter/index.js b/packages/core/upload/admin/src/components/PaginationFooter/index.js new file mode 100644 index 0000000000..7387ae50e6 --- /dev/null +++ b/packages/core/upload/admin/src/components/PaginationFooter/index.js @@ -0,0 +1,32 @@ +import React from 'react'; +import PropTypes from 'prop-types'; +import { Box, Row } from '@strapi/parts'; +import { PaginationURLQuery, PageSizeURLQuery } from '@strapi/helper-plugin'; + +export const PaginationFooter = ({ pagination }) => { + return ( + + + + + + + ); +}; + +PaginationFooter.defaultProps = { + pagination: { + pageCount: 0, + pageSize: 10, + total: 0, + }, +}; + +PaginationFooter.propTypes = { + pagination: PropTypes.shape({ + page: PropTypes.number, + pageCount: PropTypes.number, + pageSize: PropTypes.number, + total: PropTypes.number, + }), +}; diff --git a/packages/core/upload/admin/src/pages/App/components/ListView.js b/packages/core/upload/admin/src/pages/App/components/ListView.js index 3c35313d2e..31af2784c4 100644 --- a/packages/core/upload/admin/src/pages/App/components/ListView.js +++ b/packages/core/upload/admin/src/pages/App/components/ListView.js @@ -7,50 +7,57 @@ import { ImageAssetCard } from '../../../components/AssetCard/ImageAssetCard'; import { VideoAssetCard } from '../../../components/AssetCard/VideoAssetCard'; import { DocAssetCard } from '../../../components/AssetCard/DocAssetCard'; import { AssetType } from '../../../constants'; +import { PaginationFooter } from '../../../components/PaginationFooter'; export const ListView = ({ assets }) => { return ( - - - {assets.map(asset => { - if (asset.mime.includes(AssetType.Video)) { + <> + + + {assets.map(asset => { + if (asset.mime.includes(AssetType.Video)) { + return ( + + ); + } + + if (asset.mime.includes(AssetType.Image)) { + return ( + + ); + } + return ( - ); - } + })} + + - if (asset.mime.includes(AssetType.Image)) { - return ( - - ); - } - - return ( - - ); - })} - - + + ); };