feat(components): addToolbarBackButton util in newspack-components

includes/content-gate/class-content-gate.php

@@ -395,8 +395,8 @@ public static function redirect_cpt() {
 			return;
 		}
 		global $pagenow;
-		if ( 'edit.php' === $pagenow && isset( $_GET['post_type'] ) && self::GATE_CPT === $_GET['post_type'] ) { // phpcs:ignore WordPress.Security.NonceVerification.Recommended
-			$redirect = \admin_url( 'admin.php?page=newspack-audience#/content-gating' );
+		if ( 'edit.php' === $pagenow && isset( $_GET['post_type'] ) && in_array( $_GET['post_type'], [ self::GATE_CPT, self::GATE_LAYOUT_CPT ], true ) ) { // phpcs:ignore WordPress.Security.NonceVerification.Recommended
+			$redirect = Memberships::is_active() ? \admin_url( 'admin.php?page=newspack-audience#/content-gating' ) : \admin_url( 'admin.php?page=newspack-audience-access-control#/' );
 			\wp_safe_redirect( $redirect );
 			exit;
 		}

packages/components/src/utils/editor-toolbar-back-button.tsx

@@ -0,0 +1,42 @@
+/**
+ * A utility to add a back button to the editor toolbar.
+ */
+
+/**
+ * WordPress dependencies
+ */
+import { __ } from '@wordpress/i18n';
+import { Button, Tooltip } from '@wordpress/components';
+import { subscribe } from '@wordpress/data';
+import domReady from '@wordpress/dom-ready';
+import { createRoot } from '@wordpress/element';
+import { arrowUpLeft } from '@wordpress/icons';
+
+const WRAPPER_ID = 'newspack-editor-toolbar-wrapper';
+
+const ToolbarButton = ( { href }: { href: string } ) => (
+	<Tooltip text={ __( 'Go back', 'newspack-plugin' ) }>
+		<Button icon={ arrowUpLeft } href={ href } style={ { marginRight: '24px' } } />
+	</Tooltip>
+);
+
+export const addToolbarBackButton = ( href: string = '' ) =>
+	subscribe( () => {
+		if ( document.getElementById( WRAPPER_ID ) ) {
+			return;
+		}
+
+		domReady( () => {
+			const toolbar = document.querySelector( '.editor-header__toolbar' );
+			if ( ! toolbar ) {
+				return;
+			}
+
+			const wrapper = document.createElement( 'div' );
+			wrapper.id = WRAPPER_ID;
+			toolbar.prepend( wrapper );
+
+			const root = createRoot( wrapper );
+			root.render( <ToolbarButton href={ href } /> );
+		} );
+	} );

src/content-gate/editor/editor.js

@@ -14,6 +14,7 @@ import { registerPlugin } from '@wordpress/plugins';
  * Internal dependencies
  */
 import PositionControl from '../../../packages/components/src/position-control';
+import { addToolbarBackButton } from '../../../packages/components/src/utils/editor-toolbar-back-button';
 import './editor.scss';
 
 const styles = [
@@ -42,6 +43,9 @@ function GateEdit() {
 		};
 	} );
 	const { editPost } = useDispatch( 'core/editor' );
+	useEffect( () => {
+		addToolbarBackButton( '/wp-admin/admin.php?page=newspack-audience-access-control#/' );
+	}, [] );
 	useEffect( () => {
 		const wrapper = document.querySelector( '.editor-styles-wrapper' );
 		if ( ! wrapper ) {