From 3e42c038cbcbcccbe95bade99e1811a951d1ef1e Mon Sep 17 00:00:00 2001 From: Riad Benguella Date: Tue, 21 Nov 2023 13:07:10 +0100 Subject: [PATCH] Site Editor: Add the Post Author component to the Page sidebar (#56368) --- .../components/sidebar/post-author/index.js | 20 ------------------- .../components/sidebar/post-author/style.scss | 5 ----- .../components/sidebar/post-status/index.js | 4 ++-- packages/edit-post/src/style.scss | 1 - .../page-panels/page-summary.js | 9 +++++++-- packages/editor/src/components/index.js | 1 + .../src/components/post-author/panel.js | 18 +++++++++++++++++ .../src/components/post-author/style.scss | 7 +++++++ .../src/components/post-panel-row/index.js | 14 +++---------- .../src/components/post-panel-row/style.scss | 3 +++ packages/editor/src/style.scss | 1 + 11 files changed, 42 insertions(+), 41 deletions(-) delete mode 100644 packages/edit-post/src/components/sidebar/post-author/index.js delete mode 100644 packages/edit-post/src/components/sidebar/post-author/style.scss create mode 100644 packages/editor/src/components/post-author/panel.js create mode 100644 packages/editor/src/components/post-author/style.scss diff --git a/packages/edit-post/src/components/sidebar/post-author/index.js b/packages/edit-post/src/components/sidebar/post-author/index.js deleted file mode 100644 index 8f5eca9aea46b..0000000000000 --- a/packages/edit-post/src/components/sidebar/post-author/index.js +++ /dev/null @@ -1,20 +0,0 @@ -/** - * WordPress dependencies - */ -import { PanelRow } from '@wordpress/components'; -import { - PostAuthor as PostAuthorForm, - PostAuthorCheck, -} from '@wordpress/editor'; - -export function PostAuthor() { - return ( - - - - - - ); -} - -export default PostAuthor; diff --git a/packages/edit-post/src/components/sidebar/post-author/style.scss b/packages/edit-post/src/components/sidebar/post-author/style.scss deleted file mode 100644 index bfc80bdd2cf70..0000000000000 --- a/packages/edit-post/src/components/sidebar/post-author/style.scss +++ /dev/null @@ -1,5 +0,0 @@ -.edit-post-post-author { - display: flex; - flex-direction: column; - align-items: stretch; -} diff --git a/packages/edit-post/src/components/sidebar/post-status/index.js b/packages/edit-post/src/components/sidebar/post-status/index.js index ba6afa2ae9f27..1b24de6082d16 100644 --- a/packages/edit-post/src/components/sidebar/post-status/index.js +++ b/packages/edit-post/src/components/sidebar/post-status/index.js @@ -8,6 +8,7 @@ import { } from '@wordpress/components'; import { useDispatch, useSelect } from '@wordpress/data'; import { + PostAuthorPanel, PostSchedulePanel, PostSwitchToDraftButton, PostSyncStatus, @@ -20,7 +21,6 @@ import { import PostVisibility from '../post-visibility'; import PostTrash from '../post-trash'; import PostSticky from '../post-sticky'; -import PostAuthor from '../post-author'; import PostSlug from '../post-slug'; import PostFormat from '../post-format'; import PostPendingStatus from '../post-pending-status'; @@ -69,7 +69,7 @@ export default function PostStatus() { - + { fills } + + ); } diff --git a/packages/editor/src/components/index.js b/packages/editor/src/components/index.js index a5a4fc7fcac36..a3dfc99152322 100644 --- a/packages/editor/src/components/index.js +++ b/packages/editor/src/components/index.js @@ -26,6 +26,7 @@ export { default as PageAttributesParent } from './page-attributes/parent'; export { default as PageTemplate } from './post-template'; export { default as PostAuthor } from './post-author'; export { default as PostAuthorCheck } from './post-author/check'; +export { default as PostAuthorPanel } from './post-author/panel'; export { default as PostComments } from './post-comments'; export { default as PostExcerpt } from './post-excerpt'; export { default as PostExcerptCheck } from './post-excerpt/check'; diff --git a/packages/editor/src/components/post-author/panel.js b/packages/editor/src/components/post-author/panel.js new file mode 100644 index 0000000000000..78f0e0a5f2cc8 --- /dev/null +++ b/packages/editor/src/components/post-author/panel.js @@ -0,0 +1,18 @@ +/** + * Internal dependencies + */ +import PostAuthorCheck from './check'; +import PostAuthorForm from './index'; +import PostPanelRow from '../post-panel-row'; + +export function PostAuthor() { + return ( + + + + + + ); +} + +export default PostAuthor; diff --git a/packages/editor/src/components/post-author/style.scss b/packages/editor/src/components/post-author/style.scss new file mode 100644 index 0000000000000..349ad712334c8 --- /dev/null +++ b/packages/editor/src/components/post-author/style.scss @@ -0,0 +1,7 @@ +.editor-post-author__panel { + padding-top: $grid-unit-10; +} + +.editor-post-author__panel .editor-post-panel__row-control > div { + width: 100%; +} diff --git a/packages/editor/src/components/post-panel-row/index.js b/packages/editor/src/components/post-panel-row/index.js index a746486ea25f6..f6f0c658cd724 100644 --- a/packages/editor/src/components/post-panel-row/index.js +++ b/packages/editor/src/components/post-panel-row/index.js @@ -15,18 +15,10 @@ const PostPanelRow = forwardRef( ( { className, label, children }, ref ) => { className={ classnames( 'editor-post-panel__row', className ) } ref={ ref } > - { label ? ( - <> -
- { label } -
-
- { children } -
- - ) : ( - children + { label && ( +
{ label }
) } +
{ children }
 ); } ); diff --git a/packages/editor/src/components/post-panel-row/style.scss b/packages/editor/src/components/post-panel-row/style.scss index b3dfc8c6bcf6b..bc1c7fbd000c6 100644 --- a/packages/editor/src/components/post-panel-row/style.scss +++ b/packages/editor/src/components/post-panel-row/style.scss @@ -15,4 +15,7 @@ .editor-post-panel__row-control { flex-grow: 1; + min-height: $button-size; + display: flex; + align-items: center; } diff --git a/packages/editor/src/style.scss b/packages/editor/src/style.scss index 5861764ff8737..ccc26e23b430b 100644 --- a/packages/editor/src/style.scss +++ b/packages/editor/src/style.scss @@ -3,6 +3,7 @@ @import "./components/editor-notices/style.scss"; @import "./components/entities-saved-states/style.scss"; @import "./components/error-boundary/style.scss"; +@import "./components/post-author/style.scss"; @import "./components/post-excerpt/style.scss"; @import "./components/post-featured-image/style.scss"; @import "./components/post-format/style.scss";