yujunjun/strapi
1
0
Fork 0
mirror of https://github.com/strapi/strapi.git synced 2025-12-27 15:13:21 +00:00
Code Issues Packages Projects Releases Wiki Activity

Display multiple files

Browse Source 
Signed-off-by: soupette <cyril@strapi.io>
This commit is contained in:
soupette 2021-09-13 18:40:31 +02:00
parent faf3b8ddda
commit b31c6e3e7d
6 changed files with 54 additions and 17 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

18
packages/core/admin/admin/src/content-manager/components/DynamicTable/CellContent/Media.js
View File

@ -1,9 +1,21 @@
import React from 'react';
import PropTypes from 'prop-types';
import styled from 'styled-components';
import { Avatar } from '@strapi/parts/Avatar';
import { Text } from '@strapi/parts/Text';
import { Row } from '@strapi/parts/Row';
import { getFileExtension, prefixFileUrlWithBackendUrl } from '@strapi/helper-plugin';
// TODO: this is very temporary until we get a design
const FileWrapper = styled(Row)`
position: relative;
border-radius: 50%;
width: 26px;
height: 26px;
// TODO
background: ${({ theme }) => theme.colors.neutral100};
`;
const Media = ({ url, mime, alternativeText, name, ext, formats }) => {
const fileURL = prefixFileUrlWithBackendUrl(url);
@ -16,7 +28,11 @@ const Media = ({ url, mime, alternativeText, name, ext, formats }) => {
const fileExtension = getFileExtension(ext);
return <Text textColor="neutral800">{fileExtension}</Text>;
return (
<FileWrapper>
<Text textColor="neutral800">{fileExtension}</Text>
</FileWrapper>
);
};
Media.defaultProps = {

27
packages/core/admin/admin/src/content-manager/components/DynamicTable/CellContent/MultipleMedias.js
View File

@ -1,8 +1,29 @@
import React from 'react';
import { Text } from '@strapi/parts/Text';
import PropTypes from 'prop-types';
import { AvatarGroup } from '@strapi/parts/Avatar';
import Media from './Media';
const MultipleMedia = () => {
return <Text textColor="neutral800">TODO</Text>;
const MultipleMedia = ({ value }) => {
return (
<AvatarGroup>
{value.map(file => {
return <Media key={file.id} {...file} />;
})}
</AvatarGroup>
);
};
MultipleMedia.propTypes = {
value: PropTypes.arrayOf(
PropTypes.shape({
alternativeText: PropTypes.string,
ext: PropTypes.string.isRequired,
formats: PropTypes.object,
mime: PropTypes.string.isRequired,
name: PropTypes.string.isRequired,
url: PropTypes.string.isRequired,
})
).isRequired,
};
export default MultipleMedia;

2
packages/core/admin/admin/src/content-manager/components/DynamicTable/CellContent/index.js
View File

@ -16,7 +16,7 @@ const CellContent = ({ content, fieldSchema, metadatas, name, queryInfos, rowId
}
if (fieldSchema.type === 'media' && fieldSchema.multiple) {
return <MultipleMedias {...content} />;
return <MultipleMedias value={content} />;
}
if (fieldSchema.type === 'relation') {

4
packages/core/admin/package.json
View File

@ -40,8 +40,8 @@
"@fortawesome/react-fontawesome": "^0.1.14",
"@strapi/babel-plugin-switch-ee-ce": "1.0.0",
"@strapi/helper-plugin": "3.6.8",
"@strapi/icons": "0.0.1-alpha.28",
"@strapi/parts": "0.0.1-alpha.28",
"@strapi/icons": "0.0.1-alpha.29",
"@strapi/parts": "0.0.1-alpha.29",
"@strapi/utils": "3.6.8",
"axios": "^0.21.1",
"babel-loader": "8.2.2",

4
packages/core/helper-plugin/package.json
View File

@ -57,8 +57,8 @@
"@storybook/builder-webpack5": "^6.3.7",
"@storybook/manager-webpack5": "^6.3.7",
"@storybook/react": "^6.3.7",
"@strapi/icons": "0.0.1-alpha.28",
"@strapi/parts": "0.0.1-alpha.28",
"@strapi/icons": "0.0.1-alpha.29",
"@strapi/parts": "0.0.1-alpha.29",
"babel-loader": "^8.2.2",
"cross-env": "^7.0.3",
"enzyme": "^3.8.0",

16
yarn.lock
View File

@ -4910,15 +4910,15 @@
resolve-from "^5.0.0"
store2 "^2.12.0"
"@strapi/icons@0.0.1-alpha.28":
version "0.0.1-alpha.28"
resolved "https://registry.yarnpkg.com/@strapi/icons/-/icons-0.0.1-alpha.28.tgz#dd9b283c3e937b74d2439d52167f2f396ef1329b"
integrity sha512-YwQ2XQhXist8vNiPirj/nGZX1qz97w1+6ABa80wMwkXoe5PJkl/iR4N9Arfy+fOMr6RaH1o49Z/YEtUFSo9TRw==
"@strapi/icons@0.0.1-alpha.29":
version "0.0.1-alpha.29"
resolved "https://registry.yarnpkg.com/@strapi/icons/-/icons-0.0.1-alpha.29.tgz#775fa16f9e0cdddd5adc7fb96a989fa536d2a0ff"
integrity sha512-WcVFJR1xKViA5oUCCMYWFW1OTGnAyBmG8N1+l4mSK+PtrSYsI+/cd/SdOiqW//2BIbW7ei/2KM8aShKlVelM/A==
"@strapi/parts@0.0.1-alpha.28":
version "0.0.1-alpha.28"
resolved "https://registry.yarnpkg.com/@strapi/parts/-/parts-0.0.1-alpha.28.tgz#8380ea7d52ef114ffba09b444e59cc5edc0e81f9"
integrity sha512-AavYsBN0obvKP1VOvNkA+1qJHYZccu9CU64D8XXkROdAyLln4zIi7nmYLZ89bo8STd+Ae9YgrjG63XBD+wVQow==
"@strapi/parts@0.0.1-alpha.29":
version "0.0.1-alpha.29"
resolved "https://registry.yarnpkg.com/@strapi/parts/-/parts-0.0.1-alpha.29.tgz#cb863b47616ff86f365e2c97af62913f4402f855"
integrity sha512-pPvo3QHXOclywrRwflSYRXQJHv0T3TQcYG2aVOlVV4wCqbjvXwkzsVGC5zZyWUi4ZmKRMbLwRLRmTONH2caN0g==
dependencies:
"@internationalized/number" "^3.0.2"
compute-scroll-into-view "^1.0.17"