diff --git a/apps/wpcom-block-editor/src/wpcom/editor.js b/apps/wpcom-block-editor/src/wpcom/editor.js
index 4b844e4128658..0d5520647257f 100644
--- a/apps/wpcom-block-editor/src/wpcom/editor.js
+++ b/apps/wpcom-block-editor/src/wpcom/editor.js
@@ -6,6 +6,7 @@ import './features/fix-coblocks-fonts';
import './features/reorder-block-categories';
import './features/tracking';
import './features/use-classic-block-guide';
+import { OnboardingNextStepAfterPublishingPost } from './features/onboarding-next-step-after-publishing-post';
import { RedirectOnboardingUserAfterPublishingPost } from './features/redirect-onboarding-user-after-publishing-post';
import InserterMenuTrackingEvent from './features/tracking/wpcom-inserter-menu-search-term';
import './features/site-editor-env-consistency';
@@ -23,3 +24,9 @@ registerPlugin( 'start-writing-flow', {
return ;
},
} );
+
+registerPlugin( 'onboarding-next-step-after-publishing-post', {
+ render() {
+ return ;
+ },
+} );
diff --git a/apps/wpcom-block-editor/src/wpcom/features/onboarding-next-step-after-publishing-post.js b/apps/wpcom-block-editor/src/wpcom/features/onboarding-next-step-after-publishing-post.js
new file mode 100644
index 0000000000000..a79baf07f7752
--- /dev/null
+++ b/apps/wpcom-block-editor/src/wpcom/features/onboarding-next-step-after-publishing-post.js
@@ -0,0 +1,72 @@
+import { dispatch, select, subscribe, useSelect } from '@wordpress/data';
+import { __ } from '@wordpress/i18n';
+import { Icon, pending } from '@wordpress/icons';
+import { getQueryArg } from '@wordpress/url';
+
+export function OnboardingNextStepAfterPublishingPost() {
+ const currentPostType = useSelect(
+ ( localSelect ) => localSelect( 'core/editor' ).getCurrentPostType(),
+ []
+ );
+
+ const hasPublishFirstPostTaskQueryArg = window.location.hash === '#publish-first-post';
+
+ if ( ! hasPublishFirstPostTaskQueryArg || currentPostType !== 'post' ) {
+ return false;
+ }
+
+ // Save site origin in session storage to be used in editor refresh.
+ const siteOriginParam = getQueryArg( window.location.search, 'origin' );
+ if ( siteOriginParam ) {
+ window.sessionStorage.setItem( 'site-origin', siteOriginParam );
+ }
+
+ const siteOrigin = window.sessionStorage.getItem( 'site-origin' ) || 'https://wordpress.com';
+ const siteSlug = window.location.hostname;
+
+ const unsubscribe = subscribe( () => {
+ const isSavingPost = select( 'core/editor' ).isSavingPost();
+ const getCurrentPostRevisionsCount = select( 'core/editor' ).getCurrentPostRevisionsCount();
+
+ if ( isSavingPost ) {
+ const unsubscribeFromSavingPost = subscribe( () => {
+ const postStatus = select( 'core/editor' ).getEditedPostAttribute( 'status' );
+ if (
+ ( postStatus === 'publish' || postStatus === 'future' ) &&
+ getCurrentPostRevisionsCount >= 1
+ ) {
+ unsubscribeFromSavingPost();
+ unsubscribe();
+ dispatch( 'core/edit-post' ).closePublishSidebar();
+
+ const unsubscribeFromNotices = subscribe( () => {
+ const notices = select( 'core/notices' ).getNotices();
+ if ( notices.some( ( notice ) => notice.id === 'editor-save' ) ) {
+ dispatch( 'core/notices' ).removeNotice( 'editor-save' );
+
+ // Show success notice with Next steps link
+ dispatch( 'core/notices' ).createSuccessNotice(
+ __( 'Well done publishing your first post!', 'wpcom-onboarding-task' ),
+ {
+ actions: [
+ {
+ label: 'Next steps',
+ url: `${ siteOrigin }/home/${ siteSlug }`,
+ },
+ ],
+ type: 'snackbar',
+ isDismissible: true,
+ explicitDismiss: true,
+ icon: ,
+ id: 'NEXT_STEPS_NOTICE_ID',
+ }
+ );
+
+ unsubscribeFromNotices();
+ }
+ } );
+ }
+ } );
+ }
+ } );
+}