-
Notifications
You must be signed in to change notification settings - Fork 4k
/
index.js
109 lines (104 loc) · 3.29 KB
/
index.js
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
/**
* External dependencies
*/
import classnames from 'classnames';
import { some } from 'lodash';
/**
* WordPress dependencies
*/
import { Popover, navigateRegions } from '@wordpress/components';
import { __ } from '@wordpress/i18n';
import {
AutosaveMonitor,
UnsavedChangesWarning,
EditorNotices,
PostPublishPanel,
DocumentTitle,
PreserveScrollInReorder,
} from '@wordpress/editor';
import { withDispatch, withSelect } from '@wordpress/data';
import { compose } from '@wordpress/element';
import { PluginArea } from '@wordpress/plugins';
/**
* Internal dependencies
*/
import './style.scss';
import Header from '../header';
import Sidebar from '../sidebar';
import TextEditor from '../text-editor';
import VisualEditor from '../visual-editor';
import EditorModeKeyboardShortcuts from '../keyboard-shortcuts';
import MetaBoxes from '../meta-boxes';
import { getMetaBoxContainer } from '../../utils/meta-boxes';
import PluginSidebar from '../plugin-sidebar';
function Layout( {
mode,
editorSidebarOpened,
pluginSidebarOpened,
sidebarName,
publishSidebarOpened,
hasFixedToolbar,
closePublishSidebar,
metaBoxes,
hasActiveMetaboxes,
isSaving,
} ) {
const className = classnames( 'edit-post-layout', {
'is-sidebar-opened': editorSidebarOpened || pluginSidebarOpened || publishSidebarOpened,
'has-fixed-toolbar': hasFixedToolbar,
} );
return (
<div className={ className }>
<DocumentTitle />
<UnsavedChangesWarning forceIsDirty={ () => {
return some( metaBoxes, ( metaBox, location ) => {
return metaBox.isActive &&
jQuery( getMetaBoxContainer( location ) ).serialize() !== metaBox.data;
} );
} } />
<AutosaveMonitor />
<Header />
<div className="edit-post-layout__content" role="region" aria-label={ __( 'Editor content' ) } tabIndex="-1">
<EditorNotices />
<PreserveScrollInReorder />
<EditorModeKeyboardShortcuts />
{ mode === 'text' && <TextEditor /> }
{ mode === 'visual' && <VisualEditor /> }
<div className="edit-post-layout__metaboxes">
<MetaBoxes location="normal" />
</div>
<div className="edit-post-layout__metaboxes">
<MetaBoxes location="advanced" />
</div>
</div>
{ publishSidebarOpened && (
<PostPublishPanel
onClose={ closePublishSidebar }
forceIsDirty={ hasActiveMetaboxes }
forceIsSaving={ isSaving }
/>
) }
{ editorSidebarOpened && <Sidebar /> }
{ pluginSidebarOpened && <PluginSidebar.Slot name={ sidebarName } /> }
<Popover.Slot />
<PluginArea />
</div>
);
}
export default compose(
withSelect( ( select ) => ( {
mode: select( 'core/edit-post' ).getEditorMode(),
editorSidebarOpened: select( 'core/edit-post' ).isEditorSidebarOpened(),
pluginSidebarOpened: select( 'core/edit-post' ).isPluginSidebarOpened(),
sidebarName: select( 'core/edit-post' ).getActiveGeneralSidebarName(),
publishSidebarOpened: select( 'core/edit-post' ).isPublishSidebarOpened(),
hasFixedToolbar: select( 'core/edit-post' ).isFeatureActive( 'fixedToolbar' ),
metaBoxes: select( 'core/edit-post' ).getMetaBoxes(),
hasActiveMetaboxes: select( 'core/edit-post' ).hasMetaBoxes(),
isSaving: select( 'core/edit-post' ).isSavingMetaBoxes(),
} ) ),
withDispatch( ( dispatch ) => ( {
closePublishSidebar: dispatch( 'core/edit-post' ).closePublishSidebar,
} ) ),
navigateRegions
)( Layout );