diff --git a/packages/block-editor/src/components/publish-date-time-picker/index.js b/packages/block-editor/src/components/publish-date-time-picker/index.js index 418006cf854c14..57b6428ccd4b07 100644 --- a/packages/block-editor/src/components/publish-date-time-picker/index.js +++ b/packages/block-editor/src/components/publish-date-time-picker/index.js @@ -1,7 +1,7 @@ /** * WordPress dependencies */ -import { DateTimePicker } from '@wordpress/components'; +import { DateTimePicker, TimePicker } from '@wordpress/components'; import { __ } from '@wordpress/i18n'; import { forwardRef } from '@wordpress/element'; import { getSettings } from '@wordpress/date'; @@ -11,23 +11,34 @@ import { getSettings } from '@wordpress/date'; */ import InspectorPopoverHeader from '../inspector-popover-header'; -function PublishDateTimePicker( - { onClose, onChange, ...additionalProps }, +export function PublishDateTimePicker( + { + onClose, + onChange, + showPopoverHeaderActions, + isCompact, + ...additionalProps + }, ref ) { + const DatePickerComponent = isCompact ? TimePicker : DateTimePicker; return (
onChange?.( null ), - }, - ] } + actions={ + showPopoverHeaderActions + ? [ + { + label: __( 'Now' ), + onClick: () => onChange?.( null ), + }, + ] + : undefined + } onClose={ onClose } /> - + ); +} + +export default forwardRef( PublicPublishDateTimePicker ); diff --git a/packages/block-editor/src/private-apis.js b/packages/block-editor/src/private-apis.js index d55139c8bcdc54..006ec42987a019 100644 --- a/packages/block-editor/src/private-apis.js +++ b/packages/block-editor/src/private-apis.js @@ -41,6 +41,7 @@ import { requiresWrapperOnCopy } from './components/writing-flow/utils'; import { PrivateRichText } from './components/rich-text/'; import { PrivateBlockPopover } from './components/block-popover'; import { PrivateInserterLibrary } from './components/inserter/library'; +import { PrivatePublishDateTimePicker } from './components/publish-date-time-picker'; /** * Private @wordpress/block-editor APIs. @@ -82,4 +83,5 @@ lock( privateApis, { PrivateInserterLibrary, reusableBlocksSelectKey, PrivateBlockPopover, + PrivatePublishDateTimePicker, } ); diff --git a/packages/editor/src/components/post-schedule/index.js b/packages/editor/src/components/post-schedule/index.js index af32cc46c67ace..87a6e4649f9214 100644 --- a/packages/editor/src/components/post-schedule/index.js +++ b/packages/editor/src/components/post-schedule/index.js @@ -8,7 +8,7 @@ import { parseISO, endOfMonth, startOfMonth } from 'date-fns'; */ import { getSettings } from '@wordpress/date'; import { useDispatch, useSelect } from '@wordpress/data'; -import { __experimentalPublishDateTimePicker as PublishDateTimePicker } from '@wordpress/block-editor'; +import { privateApis as blockEditorPrivateApis } from '@wordpress/block-editor'; import { useState, useMemo } from '@wordpress/element'; import { store as coreStore } from '@wordpress/core-data'; @@ -16,6 +16,9 @@ import { store as coreStore } from '@wordpress/core-data'; * Internal dependencies */ import { store as editorStore } from '../../store'; +import { unlock } from '../../lock-unlock'; + +const { PrivatePublishDateTimePicker } = unlock( blockEditorPrivateApis ); /** * Renders the PostSchedule component. It allows the user to schedule a post. @@ -25,7 +28,21 @@ import { store as editorStore } from '../../store'; * * @return {Component} The component to be rendered. */ -export default function PostSchedule( { onClose } ) { +export default function PostSchedule( props ) { + return ( + + ); +} + +export function PrivatePostSchedule( { + onClose, + showPopoverHeaderActions, + isCompact, +} ) { const { postDate, postType } = useSelect( ( select ) => ( { postDate: select( editorStore ).getEditedPostAttribute( 'date' ), @@ -77,7 +94,7 @@ export default function PostSchedule( { onClose } ) { ); return ( - ); } diff --git a/packages/editor/src/components/post-status/index.js b/packages/editor/src/components/post-status/index.js index 642bc059a0b24e..571898779c531b 100644 --- a/packages/editor/src/components/post-status/index.js +++ b/packages/editor/src/components/post-status/index.js @@ -27,6 +27,7 @@ import { NAVIGATION_POST_TYPE, } from '../../store/constants'; import PostPanelRow from '../post-panel-row'; +import { PrivatePostSchedule } from '../post-schedule'; import { store as editorStore } from '../../store'; const labels = { @@ -174,11 +175,6 @@ export default function PostStatus() { let newPassword = password; if ( status === 'future' && new Date( date ) > new Date() ) { newDate = null; - } else if ( value === 'future' ) { - if ( ! date || new Date( date ) < new Date() ) { - newDate = new Date(); - newDate.setDate( newDate.getDate() + 7 ); - } } if ( value === 'private' && password ) { newPassword = ''; @@ -232,6 +228,16 @@ export default function PostStatus() { : status } /> + { status === 'future' && ( +
+ +
+ ) } { status !== 'private' && (