GlobalStyles: Save and Delete JS changes

packages/core-data/src/actions.js

@@ -193,6 +193,28 @@ export function __experimentalReceiveThemeGlobalStyleVariations(
 	};
 }
 
+/**
+ * Returns an action object used in signalling that the user global styles variations have been received.
+ * Ignored from documentation as it's internal to the data store.
+ *
+ * @ignore
+ *
+ * @param {string}  stylesheet Stylesheet.
+ * @param {Array}  variations The global styles variations.
+ *
+ * @return {Object} Action object.
+ */
+export function __experimentalReceiveUserGlobalStyleVariations(
+	stylesheet,
+	variations
+) {
+	return {
+		type: 'RECEIVE_USER_GLOBAL_STYLE_VARIATIONS',
+		stylesheet,
+		variations,
+	};
+}
+
 /**
  * Returns an action object used in signalling that the index has been received.
  *
@@ -834,3 +856,40 @@ export function receiveAutosaves( postId, autosaves ) {
 		autosaves: Array.isArray( autosaves ) ? autosaves : [ autosaves ],
 	};
 }
+
+/**
+ * Discards changes in the specified record.
+ *
+ * @param {string} kind     Entity kind.
+ * @param {string} name     Entity name.
+ * @param {*} recordId Record ID.
+ *
+ */
+export const __experimentalDiscardRecordChanges =
+	( kind, name, recordId ) =>
+	( { dispatch, select } ) => {
+		const edits = select.getEntityRecordEdits( kind, name, recordId );
+
+		if ( ! edits ) {
+			return;
+		}
+
+		const clearedEdits = Object.keys( edits ).reduce( ( acc, key ) => {
+			return {
+				...acc,
+				[ key ]: undefined,
+			};
+		}, {} );
+
+		dispatch( {
+			type: 'EDIT_ENTITY_RECORD',
+			kind,
+			name,
+			recordId,
+			edits: clearedEdits,
+			transientEdits: clearedEdits,
+			meta: {
+				isUndo: false,
+			},
+		} );
+	};

packages/core-data/src/reducer.js

@@ -187,6 +187,26 @@ export function themeGlobalStyleVariations( state = {}, action ) {
 	return state;
 }
 
+/**
+ * Reducer managing the user global styles variations.
+ *
+ * @param {Record<string, object>} state  Current state.
+ * @param {Object}                 action Dispatched action.
+ *
+ * @return {Record<string, object>} Updated state.
+ */
+export function userGlobalStyleVariations( state = {}, action ) {
+	switch ( action.type ) {
+		case 'RECEIVE_USER_GLOBAL_STYLE_VARIATIONS':
+			return {
+				...state,
+				[ action.stylesheet ]: action.variations,
+			};
+	}
+
+	return state;
+}
+
 /**
  * Higher Order Reducer for a given entity config. It supports:
  *
@@ -658,4 +678,5 @@ export default combineReducers( {
 	autosaves,
 	blockPatterns,
 	blockPatternCategories,
+	userGlobalStyleVariations,
 } );

packages/core-data/src/resolvers.js

@@ -487,17 +487,30 @@ export const __experimentalGetCurrentThemeBaseGlobalStyles =
 		);
 	};
 
-export const __experimentalGetCurrentThemeGlobalStylesVariations =
-	() =>
+/**
+ * @param {string} [author] Variations author. Either 'theme' or 'user'.
+ */
+export const __experimentalGetGlobalStylesVariations =
+	( author = 'theme' ) =>
 	async ( { resolveSelect, dispatch } ) => {
 		const currentTheme = await resolveSelect.getCurrentTheme();
-		const variations = await apiFetch( {
-			path: `/wp/v2/global-styles/themes/${ currentTheme.stylesheet }/variations`,
-		} );
-		dispatch.__experimentalReceiveThemeGlobalStyleVariations(
-			currentTheme.stylesheet,
-			variations
-		);
+		if ( author === 'theme' ) {
+			const variations = await apiFetch( {
+				path: `/wp/v2/global-styles/themes/${ currentTheme.stylesheet }/variations`,
+			} );
+			dispatch.__experimentalReceiveThemeGlobalStyleVariations(
+				currentTheme.stylesheet,
+				variations
+			);
+		} else {
+			const variations = await apiFetch( {
+				path: `/wp/v2/global-styles`,
+			} );
+			dispatch.__experimentalReceiveUserGlobalStyleVariations(
+				currentTheme.stylesheet,
+				variations
+			);
+		}
 	};
 
 export const getBlockPatterns =

packages/core-data/src/selectors.ts

@@ -34,7 +34,8 @@ export interface State {
 	embedPreviews: Record< string, { html: string } >;
 	entities: EntitiesState;
 	themeBaseGlobalStyles: Record< string, Object >;
-	themeGlobalStyleVariations: Record< string, string >;
+	themeGlobalStyleVariations: Record< string, Object[] >;
+	userGlobalStyleVariations: Record< string, Object[] >;
 	undo: UndoState;
 	users: UserState;
 }
@@ -1238,20 +1239,27 @@ export function __experimentalGetCurrentThemeBaseGlobalStyles(
 }
 
 /**
- * Return the ID of the current global styles object.
+ * Return global styles variations.
  *
  * @param  state Data state.
+ * @param author Variations author. Either 'theme' or 'user'.
  *
- * @return The current global styles ID.
+ * @return Global styles variations
  */
-export function __experimentalGetCurrentThemeGlobalStylesVariations(
-	state: State
-): string | null {
+export function __experimentalGetGlobalStylesVariations(
+	state: State,
+	author: 'theme' | 'user' = 'theme'
+): Object[] | null {
 	const currentTheme = getCurrentTheme( state );
 	if ( ! currentTheme ) {
 		return null;
 	}
-	return state.themeGlobalStyleVariations[ currentTheme.stylesheet ];
+
+	if ( author === 'theme' ) {
+		return state.themeGlobalStyleVariations[ currentTheme.stylesheet ];
+	}
+
+	return state.userGlobalStyleVariations[ currentTheme.stylesheet ];
 }
 
 /**

packages/e2e-tests/plugins/global-styles.php

@@ -0,0 +1,32 @@
+<?php
+/**
+ * Plugin Name: Gutenberg Test Plugin, Global Styles
+ * Plugin URI: https://github.com/WordPress/gutenberg
+ * Author: Gutenberg Team
+ *
+ * @package gutenberg-test-plugin-global-styles
+ */
+
+/**
+ * Add REST endpoint.
+ */
+function gutenberg_add_delete_all_global_styles_endpoint() {
+	register_rest_route(
+		'wp/v2',
+		'/delete-all-global-styles',
+		array(
+			array(
+				'methods'             => WP_REST_Server::DELETABLE,
+				'callback'            => function() {
+					global $wpdb;
+					$gs_id = WP_Theme_JSON_Resolver_Gutenberg::get_user_global_styles_post_id();
+					// phpcs:ignore WordPress.DB.PreparedSQL.InterpolatedNotPrepared
+					$wpdb->get_results( "DELETE FROM {$wpdb->posts} WHERE post_type = 'wp_global_styles' AND id != {$gs_id}" );
+					return rest_ensure_response( array( 'deleted' => true ) );
+				},
+				'permission_callback' => '__return_true',
+			),
+		)
+	);
+}
+add_action( 'rest_api_init', 'gutenberg_add_delete_all_global_styles_endpoint' );