Fix: show specific field media files in library, cascade folder templates (#3252)

* feat: cascade & compose media folders - initial commit

* refactor: code cleanup

* fix: pass field instead of folder to getAsset

* fix: only show field media files in library

* test: fix medial library selector test

* fix: fallback to original path when asset not found

* fix: only show field media files in media library

* fix: properly handle empty strings in field folders
This commit is contained in:
Erez Rokah
2020-02-14 22:31:33 +02:00
committed by GitHub
parent 8d67de0e68
commit 02ef2010e7
22 changed files with 565 additions and 243 deletions

View File

@ -12,11 +12,11 @@ const FileLink = styled(({ href, path }) => (
display: block;
`;
function FileLinkList({ values, getAsset, folder }) {
function FileLinkList({ values, getAsset, field }) {
return (
<div>
{values.map(value => (
<FileLink key={value} path={value} href={getAsset(value, folder)} />
<FileLink key={value} path={value} href={getAsset(value, field)} />
))}
</div>
);
@ -24,12 +24,10 @@ function FileLinkList({ values, getAsset, folder }) {
function FileContent(props) {
const { value, getAsset, field } = props;
const folder = field.get('media_folder');
if (Array.isArray(value) || List.isList(value)) {
return <FileLinkList values={value} getAsset={getAsset} folder={folder} />;
return <FileLinkList values={value} getAsset={getAsset} field={field} />;
}
return <FileLink key={value} path={value} href={getAsset(value, folder)} />;
return <FileLink key={value} path={value} href={getAsset(value, field)} />;
}
const FilePreview = props => (

View File

@ -165,8 +165,7 @@ export default function withFileControl({ forImage } = {}) {
value,
allowMultiple: !!mediaLibraryFieldOptions.get('allow_multiple', true),
config: mediaLibraryFieldOptions.get('config'),
mediaFolder: field.get('media_folder'),
publicFolder: field.get('public_folder'),
field,
});
};
@ -211,21 +210,20 @@ export default function withFileControl({ forImage } = {}) {
renderImages = () => {
const { getAsset, value, field } = this.props;
const folder = field.get('media_folder');
if (isMultiple(value)) {
return (
<MultiImageWrapper>
{value.map(val => (
<ImageWrapper key={val}>
<Image src={getAsset(val, folder) || ''} />
<Image src={getAsset(val, field) || ''} />
</ImageWrapper>
))}
</MultiImageWrapper>
);
}
const src = getAsset(value, folder);
const src = getAsset(value, field);
return (
<ImageWrapper>
<Image src={src || ''} />