yujunjun/strapi
1
0
Fork 0
mirror of https://github.com/strapi/strapi.git synced 2025-07-24 17:40:18 +00:00
Code Issues Packages Projects Releases Wiki Activity

ml iterations

Browse Source
This commit is contained in:
mfrachet 2021-09-22 14:39:38 +02:00
parent 9099409692
commit 2213d36f9c
2 changed files with 72 additions and 33 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

32
packages/core/upload/admin/src/components/PaginationFooter/index.js Normal file
View File

@ -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 (
<Box paddingTop={6}>
<Row alignItems="flex-end" justifyContent="space-between">
<PageSizeURLQuery trackedEvent="willChangeNumberOfEntriesPerPage" />
<PaginationURLQuery pagination={pagination} />
</Row>
</Box>
);
};
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,
}),
};

73
packages/core/upload/admin/src/pages/App/components/ListView.js
View File

@ -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 (
<KeyboardNavigable tagName="article">
<GridLayout>
{assets.map(asset => {
if (asset.mime.includes(AssetType.Video)) {
<>
<KeyboardNavigable tagName="article">
<GridLayout>
{assets.map(asset => {
if (asset.mime.includes(AssetType.Video)) {
return (
<VideoAssetCard
id={asset.id}
key={asset.id}
name={asset.name}
extension={getFileExtension(asset.ext)}
url={prefixFileUrlWithBackendUrl(asset.url)}
mime={asset.mime}
/>
);
}
if (asset.mime.includes(AssetType.Image)) {
return (
<ImageAssetCard
id={asset.id}
key={asset.id}
name={asset.name}
extension={getFileExtension(asset.ext)}
height={asset.height}
width={asset.width}
thumbnail={prefixFileUrlWithBackendUrl(
asset?.formats?.thumbnail?.url || asset.url
)}
/>
);
}
return (
<VideoAssetCard
<DocAssetCard
id={asset.id}
key={asset.id}
name={asset.name}
extension={getFileExtension(asset.ext)}
url={prefixFileUrlWithBackendUrl(asset.url)}
mime={asset.mime}
/>
);
}
})}
</GridLayout>
</KeyboardNavigable>
if (asset.mime.includes(AssetType.Image)) {
return (
<ImageAssetCard
id={asset.id}
key={asset.id}
name={asset.name}
extension={getFileExtension(asset.ext)}
height={asset.height}
width={asset.width}
thumbnail={prefixFileUrlWithBackendUrl(asset?.formats?.thumbnail?.url || asset.url)}
/>
);
}
return (
<DocAssetCard
id={asset.id}
key={asset.id}
name={asset.name}
extension={getFileExtension(asset.ext)}
/>
);
})}
</GridLayout>
</KeyboardNavigable>
<PaginationFooter />
</>
);
};