Internationalization: PostScheduleLabel format cannot easily be translated and makes for incorrect English phrases

[jeherve]

Description

The PostScheduleLabel component does not always display a full date ; in some scenarios it uses words, like "Today", or "Tomorrow":

gutenberg/packages/editor/src/components/post-schedule/label.js

Lines 60 to 95 in 7e9e53d

	export function getPostScheduleLabel(
	dateAttribute,
	{ isFloating = false, now = new Date() } = {}
	) {
	if ( ! dateAttribute || isFloating ) {
	return __( 'Immediately' );
	}
	// If the user timezone does not equal the site timezone then using words
	// like 'tomorrow' is confusing, so show the full date.
	if ( ! isTimezoneSameAsSiteTimezone( now ) ) {
	return getFullPostScheduleLabel( dateAttribute );
	}
	const date = getDate( dateAttribute );
	if ( isSameDay( date, now ) ) {
	return sprintf(
	// translators: %s: Time of day the post is scheduled for.
	__( 'Today at %s' ),
	// translators: If using a space between 'g:i' and 'a', use a non-breaking space.
	dateI18n( _x( 'g:i\xa0a', 'post schedule time format' ), date )
	);
	}
	const tomorrow = new Date( now );
	tomorrow.setDate( tomorrow.getDate() + 1 );
	if ( isSameDay( date, tomorrow ) ) {
	return sprintf(
	// translators: %s: Time of day the post is scheduled for.
	__( 'Tomorrow at %s' ),
	// translators: If using a space between 'g:i' and 'a', use a non-breaking space.
	dateI18n( _x( 'g:i\xa0a', 'post schedule time format' ), date )
	);
	}

This is not ideal as the date can be used as part of a sentence in the post-publish panel:

gutenberg/packages/editor/src/components/post-publish-panel/postpublish.js

Lines 110 to 113 in a6212c8

	<>
	{ __( 'is now scheduled. It will go live on' ) }{ ' ' }
	<PostScheduleLabel />.
	</>

It becomes hard for translators to translate that phrase (not all languages are built that way) and even make for incorrect phrases in English.

Ideally, I think this should be broken into different strings based on the type of string outputted by PostScheduleLabel.

---

This was also discussed here:
#56854 (comment)

Step-by-step reproduction instructions

1. Go to Posts > Add New
2. Write a new post
3. Schedule it to be published tomorrow
4. See the post-publish panel.

Screenshots, screen recording, code snippet

Environment info

Note that your site's timezone in Settings > General must match your own.

Please confirm that you have searched existing issues in the repo.

• Yes

Please confirm that you have tested with all plugins deactivated except Gutenberg.

• Yes

Please confirm which theme type you used for testing.

• Block
• Classic
• Hybrid (e.g. classic with theme.json)
• Not sure

[CoderAbhinav]

We can break the sentence ‘is now scheduled. It will go live on’ such that, the <PostScheduleLabel/> component will return a full sentence rather than just returning “Today” / “Tomorrow” / Date. So the translators will be able to simply write the translations for the fill string, providing a better context and arrangement.

Since the same component is also used here, we either need to create a separate label for the same purpose.

gutenberg/packages/editor/src/components/post-publish-panel/prepublish.js

Lines 124 to 133 in 7e9e53d

	<PanelBody
	initialOpen={ false }
	title={ [
	__( 'Publish:' ),
	<span
	className="editor-post-publish-panel__link"
	key="label"
	>
	<PostScheduleLabel />
	</span>,

[CoderAbhinav]

I have added my solution in this PR: #67614