Skip to content

Commit

Permalink
Unify publish flow between post and site editors
Browse files Browse the repository at this point in the history
  • Loading branch information
ntsekouras committed Apr 1, 2024
1 parent 91ea8fa commit 5616b5a
Show file tree
Hide file tree
Showing 19 changed files with 576 additions and 374 deletions.
102 changes: 2 additions & 100 deletions packages/edit-post/README.md
Original file line number Diff line number Diff line change
Expand Up @@ -106,56 +106,7 @@ _Returns_

### PluginPostPublishPanel

Renders provided content to the post-publish panel in the publish flow (side panel that opens after a user publishes the post).

_Usage_

```js
// Using ES5 syntax
var __ = wp.i18n.__;
var PluginPostPublishPanel = wp.editPost.PluginPostPublishPanel;

function MyPluginPostPublishPanel() {
return React.createElement(
PluginPostPublishPanel,
{
className: 'my-plugin-post-publish-panel',
title: __( 'My panel title' ),
initialOpen: true,
},
__( 'My panel content' )
);
}
```

```jsx
// Using ESNext syntax
import { __ } from '@wordpress/i18n';
import { PluginPostPublishPanel } from '@wordpress/edit-post';

const MyPluginPostPublishPanel = () => (
<PluginPostPublishPanel
className="my-plugin-post-publish-panel"
title={ __( 'My panel title' ) }
initialOpen={ true }
>
{ __( 'My panel content' ) }
</PluginPostPublishPanel>
);
```

_Parameters_

- _props_ `Object`: Component properties.
- _props.className_ `[string]`: An optional class name added to the panel.
- _props.title_ `[string]`: Title displayed at the top of the panel.
- _props.initialOpen_ `[boolean]`: Whether to have the panel initially opened. When no title is provided it is always opened.
- _props.icon_ `[WPBlockTypeIconRender]`: The [Dashicon](https://developer.wordpress.org/resource/dashicons/) icon slug string, or an SVG WP element, to be rendered when the sidebar is pinned to toolbar.
- _props.children_ `Element`: Children to be rendered

_Returns_

- `Component`: The component to be rendered.
Undocumented declaration.

### PluginPostStatusInfo

Expand Down Expand Up @@ -203,56 +154,7 @@ _Returns_

### PluginPrePublishPanel

Renders provided content to the pre-publish side panel in the publish flow (side panel that opens when a user first pushes "Publish" from the main editor).

_Usage_

```js
// Using ES5 syntax
var __ = wp.i18n.__;
var PluginPrePublishPanel = wp.editPost.PluginPrePublishPanel;

function MyPluginPrePublishPanel() {
return React.createElement(
PluginPrePublishPanel,
{
className: 'my-plugin-pre-publish-panel',
title: __( 'My panel title' ),
initialOpen: true,
},
__( 'My panel content' )
);
}
```

```jsx
// Using ESNext syntax
import { __ } from '@wordpress/i18n';
import { PluginPrePublishPanel } from '@wordpress/edit-post';

const MyPluginPrePublishPanel = () => (
<PluginPrePublishPanel
className="my-plugin-pre-publish-panel"
title={ __( 'My panel title' ) }
initialOpen={ true }
>
{ __( 'My panel content' ) }
</PluginPrePublishPanel>
);
```

_Parameters_

- _props_ `Object`: Component props.
- _props.className_ `[string]`: An optional class name added to the panel.
- _props.title_ `[string]`: Title displayed at the top of the panel.
- _props.initialOpen_ `[boolean]`: Whether to have the panel initially opened. When no title is provided it is always opened.
- _props.icon_ `[WPBlockTypeIconRender]`: The [Dashicon](https://developer.wordpress.org/resource/dashicons/) icon slug string, or an SVG WP element, to be rendered when the sidebar is pinned to toolbar.
- _props.children_ `Element`: Children to be rendered

_Returns_

- `Component`: The component to be rendered.
Undocumented declaration.

### PluginSidebar

Expand Down
9 changes: 6 additions & 3 deletions packages/edit-post/src/components/header/index.js
Original file line number Diff line number Diff line change
Expand Up @@ -36,14 +36,17 @@ import { store as preferencesStore } from '@wordpress/preferences';
*/
import FullscreenModeClose from './fullscreen-mode-close';
import MoreMenu from './more-menu';
import PostPublishButtonOrToggle from './post-publish-button-or-toggle';
import MainDashboardButton from './main-dashboard-button';
import { store as editPostStore } from '../../store';
import { unlock } from '../../lock-unlock';

const { useShowBlockTools } = unlock( blockEditorPrivateApis );
const { DocumentTools, PostViewLink, PreviewDropdown } =
unlock( editorPrivateApis );
const {
DocumentTools,
PostViewLink,
PreviewDropdown,
PostPublishButtonOrToggle,
} = unlock( editorPrivateApis );

const slideY = {
hidden: { y: '-50px' },
Expand Down
4 changes: 2 additions & 2 deletions packages/edit-post/src/components/layout/actions-panel.js
Original file line number Diff line number Diff line change
Expand Up @@ -4,6 +4,8 @@
import {
EntitiesSavedStates,
PostPublishPanel,
PluginPrePublishPanel,
PluginPostPublishPanel,
store as editorStore,
} from '@wordpress/editor';
import { useSelect, useDispatch } from '@wordpress/data';
Expand All @@ -14,8 +16,6 @@ import { useCallback } from '@wordpress/element';
/**
* Internal dependencies
*/
import PluginPostPublishPanel from '../sidebar/plugin-post-publish-panel';
import PluginPrePublishPanel from '../sidebar/plugin-pre-publish-panel';
import { store as editPostStore } from '../../store';

const { Fill, Slot } = createSlotFill( 'ActionsPanel' );
Expand Down

This file was deleted.

23 changes: 2 additions & 21 deletions packages/edit-post/src/components/preferences-modal/index.js
Original file line number Diff line number Diff line change
Expand Up @@ -3,7 +3,6 @@
*/

import { __ } from '@wordpress/i18n';
import { useViewportMatch } from '@wordpress/compose';
import { useSelect, useDispatch } from '@wordpress/data';
import { store as interfaceStore } from '@wordpress/interface';
import { privateApis as preferencesPrivateApis } from '@wordpress/preferences';
Expand All @@ -14,17 +13,13 @@ import { privateApis as editorPrivateApis } from '@wordpress/editor';
*/
import { unlock } from '../../lock-unlock';
import MetaBoxesSection from './meta-boxes-section';
import EnablePublishSidebarOption from './enable-publish-sidebar';

const { PreferencesModalSection, PreferenceToggleControl } = unlock(
preferencesPrivateApis
);
const { PreferenceToggleControl } = unlock( preferencesPrivateApis );
const { PreferencesModal } = unlock( editorPrivateApis );

export const PREFERENCES_MODAL_NAME = 'edit-post/preferences';

export default function EditPostPreferencesModal() {
const isLargeViewport = useViewportMatch( 'medium' );
const { closeModal } = useDispatch( interfaceStore );
const { isModalActive } = useSelect( ( select ) => {
const modalActive = select( interfaceStore ).isModalActive(
Expand All @@ -36,21 +31,7 @@ export default function EditPostPreferencesModal() {
}, [] );

const extraSections = {
general: (
<>
{ isLargeViewport && (
<PreferencesModalSection title={ __( 'Publishing' ) }>
<EnablePublishSidebarOption
help={ __(
'Review settings, such as visibility and tags.'
) }
label={ __( 'Enable pre-publish checks' ) }
/>
</PreferencesModalSection>
) }
<MetaBoxesSection title={ __( 'Advanced' ) } />
</>
),
general: <MetaBoxesSection title={ __( 'Advanced' ) } />,
appearance: (
<PreferenceToggleControl
scope="core/edit-post"
Expand Down
Original file line number Diff line number Diff line change
@@ -1,83 +1,15 @@
/**
* WordPress dependencies
*/
import { usePluginContext } from '@wordpress/plugins';
import { createSlotFill, PanelBody } from '@wordpress/components';

const { Fill, Slot } = createSlotFill( 'PluginPostPublishPanel' );

/**
* Renders provided content to the post-publish panel in the publish flow
* (side panel that opens after a user publishes the post).
*
* @param {Object} props Component properties.
* @param {string} [props.className] An optional class name added to the panel.
* @param {string} [props.title] Title displayed at the top of the panel.
* @param {boolean} [props.initialOpen=false] Whether to have the panel initially opened. When no title is provided it is always opened.
* @param {WPBlockTypeIconRender} [props.icon=inherits from the plugin] The [Dashicon](https://developer.wordpress.org/resource/dashicons/) icon slug string, or an SVG WP element, to be rendered when the sidebar is pinned to toolbar.
* @param {Element} props.children Children to be rendered
*
* @example
* ```js
* // Using ES5 syntax
* var __ = wp.i18n.__;
* var PluginPostPublishPanel = wp.editPost.PluginPostPublishPanel;
*
* function MyPluginPostPublishPanel() {
* return React.createElement(
* PluginPostPublishPanel,
* {
* className: 'my-plugin-post-publish-panel',
* title: __( 'My panel title' ),
* initialOpen: true,
* },
* __( 'My panel content' )
* );
* }
* ```
*
* @example
* ```jsx
* // Using ESNext syntax
* import { __ } from '@wordpress/i18n';
* import { PluginPostPublishPanel } from '@wordpress/edit-post';
*
* const MyPluginPostPublishPanel = () => (
* <PluginPostPublishPanel
* className="my-plugin-post-publish-panel"
* title={ __( 'My panel title' ) }
* initialOpen={ true }
* >
* { __( 'My panel content' ) }
* </PluginPostPublishPanel>
* );
* ```
*
* @return {Component} The component to be rendered.
*/
const PluginPostPublishPanel = ( {
children,
className,
title,
initialOpen = false,
icon,
} ) => {
const { icon: pluginIcon } = usePluginContext();

return (
<Fill>
<PanelBody
className={ className }
initialOpen={ initialOpen || ! title }
title={ title }
icon={ icon ?? pluginIcon }
>
{ children }
</PanelBody>
</Fill>
);
};

PluginPostPublishPanel.Slot = Slot;

export default PluginPostPublishPanel;
import deprecated from '@wordpress/deprecated';
import { PluginPostPublishPanel } from '@wordpress/editor';

// TODO: need to add to `editor` README.md manually..
export default function EditPostPluginPostPublishPanel( props ) {
deprecated( 'wp.editPost.PluginPostPublishPanel', {
since: '6.6',
version: '6.8',
alternative: 'wp.editor.PluginPostPublishPanel',
} );
return <PluginPostPublishPanel { ...props } />;
}

0 comments on commit 5616b5a

Please sign in to comment.