{ __( 'Sync status' ) }
- { isFullySynced ? __( 'Fully synced' ) : __( 'Not synced' ) }
+ { currentSyncStatus === 'unsynced'
+ ? __( 'Not synced' )
+ : __( 'Fully synced' ) }
);
}
+
+export function PostSyncStatusModal() {
+ const { editPost } = useDispatch( editorStore );
+ const [ isModalOpen, setIsModalOpen ] = useState( false );
+ const [ syncType, setSyncType ] = useState( undefined );
+
+ const { postType, isNewPost } = useSelect( ( select ) => {
+ const { getEditedPostAttribute, isCleanNewPost } =
+ select( editorStore );
+ return {
+ postType: getEditedPostAttribute( 'type' ),
+ isNewPost: isCleanNewPost(),
+ };
+ }, [] );
+
+ useEffect( () => {
+ if ( isNewPost && postType === 'wp_block' ) {
+ setIsModalOpen( true );
+ }
+ // We only want the modal to open when the page is first loaded.
+ // eslint-disable-next-line react-hooks/exhaustive-deps
+ }, [] );
+
+ const setSyncStatus = () => {
+ editPost( {
+ meta: {
+ wp_pattern_sync_status: syncType,
+ },
+ } );
+ };
+
+ if ( postType !== 'wp_block' || ! isNewPost ) {
+ return null;
+ }
+
+ return (
+ <>
+ { isModalOpen && (
+