fix: allow setting per-file editor preview (#4414)

This commit is contained in:
stefanprobst 2020-10-12 12:33:18 +02:00 committed by GitHub
parent 083c20eaee
commit ecb4fd6165
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
2 changed files with 18 additions and 5 deletions

View File

@ -17,6 +17,8 @@ import EditorControlPane from './EditorControlPane/EditorControlPane';
import EditorPreviewPane from './EditorPreviewPane/EditorPreviewPane'; import EditorPreviewPane from './EditorPreviewPane/EditorPreviewPane';
import EditorToolbar from './EditorToolbar'; import EditorToolbar from './EditorToolbar';
import { hasI18n, getI18nInfo, getPreviewEntry } from '../../lib/i18n'; import { hasI18n, getI18nInfo, getPreviewEntry } from '../../lib/i18n';
import { FILES } from '../../constants/collectionTypes';
import { getFileFromSlug } from '../../reducers/collections';
const PREVIEW_VISIBLE = 'cms.preview-visible'; const PREVIEW_VISIBLE = 'cms.preview-visible';
const SCROLL_SYNC_ENABLED = 'cms.scroll-sync-enabled'; const SCROLL_SYNC_ENABLED = 'cms.scroll-sync-enabled';
@ -135,6 +137,15 @@ const EditorContent = ({
} }
}; };
function isPreviewEnabled(collection, entry) {
if (collection.get('type') === FILES) {
const file = getFileFromSlug(collection, entry.get('slug'));
const previewEnabled = file?.getIn(['editor', 'preview']);
if (previewEnabled != null) return previewEnabled;
}
return collection.getIn(['editor', 'preview'], true);
}
class EditorInterface extends Component { class EditorInterface extends Component {
state = { state = {
showEventBlocker: false, showEventBlocker: false,
@ -221,7 +232,9 @@ class EditorInterface extends Component {
} = this.props; } = this.props;
const { scrollSyncEnabled, showEventBlocker } = this.state; const { scrollSyncEnabled, showEventBlocker } = this.state;
const collectionPreviewEnabled = collection.getIn(['editor', 'preview'], true);
const previewEnabled = isPreviewEnabled(collection, entry);
const collectionI18nEnabled = hasI18n(collection); const collectionI18nEnabled = hasI18n(collection);
const { locales, defaultLocale } = getI18nInfo(this.props.collection); const { locales, defaultLocale } = getI18nInfo(this.props.collection);
const editorProps = { const editorProps = {
@ -300,7 +313,7 @@ class EditorInterface extends Component {
); );
const i18nVisible = collectionI18nEnabled && this.state.i18nVisible; const i18nVisible = collectionI18nEnabled && this.state.i18nVisible;
const previewVisible = collectionPreviewEnabled && this.state.previewVisible; const previewVisible = previewEnabled && this.state.previewVisible;
const scrollSyncVisible = i18nVisible || previewVisible; const scrollSyncVisible = i18nVisible || previewVisible;
return ( return (
@ -349,7 +362,7 @@ class EditorInterface extends Component {
marginTop="70px" marginTop="70px"
/> />
)} )}
{collectionPreviewEnabled && ( {previewEnabled && (
<EditorToggle <EditorToggle
isActive={previewVisible} isActive={previewVisible}
onClick={this.handleTogglePreview} onClick={this.handleTogglePreview}

View File

@ -142,11 +142,11 @@ const getFieldsWithMediaFolders = (fields: EntryField[]) => {
return fieldsWithMediaFolders; return fieldsWithMediaFolders;
}; };
const getFileFromSlug = (collection: Collection, slug: string) => { export const getFileFromSlug = (collection: Collection, slug: string) => {
return collection return collection
.get('files') .get('files')
?.toArray() ?.toArray()
.filter(f => f.get('name') === slug)[0]; .find(f => f.get('name') === slug);
}; };
export const selectFieldsWithMediaFolders = (collection: Collection, slug: string) => { export const selectFieldsWithMediaFolders = (collection: Collection, slug: string) => {