fix: allow setting per-file editor preview (#4414)
This commit is contained in:
parent
083c20eaee
commit
ecb4fd6165
@ -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}
|
||||||
|
@ -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) => {
|
||||||
|
Loading…
x
Reference in New Issue
Block a user