Global Styles: Hide Custom CSS setting for users without 'edit_css' c…

…ap (#46815) * Global Styles: Hide Custom CSS setting for users without 'unfiltered_html' cap * Remove Experiments setting * Use 'edit_css' meta cap * Add since to PHPDoc * Cast actions array to boolean
WordPress · Jan 16, 2023 · cc7e88e · cc7e88e
1 parent 4e29eee
commit cc7e88e
Show file tree

Hide file tree

Showing 4 changed files with 39 additions and 27 deletions.
diff --git a/lib/compat/wordpress-6.2/class-gutenberg-rest-global-styles-controller-6-2.php b/lib/compat/wordpress-6.2/class-gutenberg-rest-global-styles-controller-6-2.php
@@ -89,6 +89,29 @@ public function prepare_item_for_response( $post, $request ) { // phpcs:ignore V
 		return $response;
 	}
 
+	/**
+	 * Get the link relations available for the post and current user.
+	 *
+	 * @since 5.9.0
+	 * @since 6.2.0 Added 'edit-css' action.
+	 *
+	 * @return array List of link relations.
+	 */
+	protected function get_available_actions() {
+		$rels = array();
+
+		$post_type = get_post_type_object( $this->post_type );
+		if ( current_user_can( $post_type->cap->publish_posts ) ) {
+			$rels[] = 'https://api.w.org/action-publish';
+		}
+
+		if ( current_user_can( 'edit_css' ) ) {
+			$rels[] = 'https://api.w.org/action-edit-css';
+		}
+
+		return $rels;
+	}
+
 	/**
 	 * Updates a single global style config.
 	 *

diff --git a/lib/experimental/editor-settings.php b/lib/experimental/editor-settings.php
@@ -86,9 +86,6 @@ function gutenberg_enable_experiments() {
 	if ( $gutenberg_experiments && array_key_exists( 'gutenberg-off-canvas-navigation-editor', $gutenberg_experiments ) ) {
 		wp_add_inline_script( 'wp-block-editor', 'window.__experimentalEnableOffCanvasNavigationEditor = true', 'before' );
 	}
-	if ( $gutenberg_experiments && array_key_exists( 'gutenberg-global-styles-custom-css', $gutenberg_experiments ) ) {
-		wp_add_inline_script( 'wp-block-editor', 'window.__experimentalEnableGlobalStylesCustomCSS = true', 'before' );
-	}
 }
 
 add_action( 'admin_init', 'gutenberg_enable_experiments' );
diff --git a/lib/experiments-page.php b/lib/experiments-page.php
@@ -77,22 +77,6 @@ function gutenberg_initialize_experiments_settings() {
 		)
 	);
 
-	add_settings_field(
-		'gutenberg-global-styles-custom-css',
-		__( 'Global styles custom css ', 'gutenberg' ),
-		'gutenberg_display_experiment_field',
-		'gutenberg-experiments',
-		'gutenberg_experiments_section',
-		array(
-			'label' => sprintf(
-				/* translators: %s: WordPress documentation for roles and capabilities. */
-				__( 'Test the Global Styles custom CSS field in the site editor. This requires a user to have <a href="%s">unfiltered html capabilities</a>.', 'gutenberg' ),
-				'https://wordpress.org/support/article/roles-and-capabilities/#unfiltered_html'
-			),
-			'id'    => 'gutenberg-global-styles-custom-css',
-		)
-	);
-
 	register_setting(
 		'gutenberg-experiments',
 		'gutenberg-experiments'

diff --git a/packages/edit-site/src/components/global-styles/screen-root.js b/packages/edit-site/src/components/global-styles/screen-root.js
@@ -26,17 +26,25 @@ import ContextMenu from './context-menu';
 import StylesPreview from './preview';
 
 function ScreenRoot() {
-	const { variations } = useSelect( ( select ) => {
+	const { variations, canEditCSS } = useSelect( ( select ) => {
+		const {
+			getEntityRecord,
+			__experimentalGetCurrentGlobalStylesId,
+			__experimentalGetCurrentThemeGlobalStylesVariations,
+		} = select( coreStore );
+
+		const globalStylesId = __experimentalGetCurrentGlobalStylesId();
+		const globalStyles = globalStylesId
+			? getEntityRecord( 'root', 'globalStyles', globalStylesId )
+			: undefined;
+
 		return {
-			variations:
-				select(
-					coreStore
-				).__experimentalGetCurrentThemeGlobalStylesVariations(),
+			variations: __experimentalGetCurrentThemeGlobalStylesVariations(),
+			canEditCSS:
+				!! globalStyles?._links?.[ 'wp:action-edit-css' ] ?? false,
 		};
 	}, [] );
 
-	const __experimentalGlobalStylesCustomCSS =
-		window?.__experimentalEnableGlobalStylesCustomCSS;
 	return (
 		<Card size="small">
 			<CardBody>
@@ -102,7 +110,7 @@ function ScreenRoot() {
 				</ItemGroup>
 			</CardBody>
 
-			{ __experimentalGlobalStylesCustomCSS && (
+			{ canEditCSS && (
 				<>
 					<CardDivider />
 					<CardBody>