Added creation of theme validation to site editor interface

WordPress · Mar 22, 2024 · 1a52998 · 1a52998
1 parent c18c22c
commit 1a52998
Show file tree

Hide file tree

Showing 3 changed files with 78 additions and 11 deletions.
diff --git a/admin/create-theme/theme-json.php b/admin/create-theme/theme-json.php
@@ -10,33 +10,27 @@ public static function add_theme_json_to_local( $export_type ) {
 	}
 
 	public static function add_theme_json_variation_to_local( $export_type, $theme ) {
-		$variation_slug = sanitize_title( $theme['variation'] );
 		$variation_path = get_stylesheet_directory() . DIRECTORY_SEPARATOR . 'styles' . DIRECTORY_SEPARATOR;
-		$file_counter   = 0;
 
 		if ( ! file_exists( $variation_path ) ) {
 			wp_mkdir_p( $variation_path );
 		}
 
-		if ( file_exists( $variation_path . $variation_slug . '.json' ) ) {
-			$file_counter++;
-			while ( file_exists( $variation_path . $variation_slug . '_' . $file_counter . '.json' ) ) {
-				$file_counter++;
-			}
-			$variation_slug = $variation_slug . '_' . $file_counter;
+		if ( file_exists( $variation_path . $theme['slug'] . '.json' ) ) {
+			return new WP_Error( 'variation_already_exists', __( 'Variation already exists.', 'create-block-theme' ) );
 		}
 
-		$_POST['theme']['variation_slug'] = $variation_slug;
+		$_POST['theme']['variation_slug'] = $theme['slug'];
 
 		$extra_theme_data = array(
 			'version' => WP_Theme_JSON::LATEST_SCHEMA,
-			'title'   => $theme['variation'],
+			'title'   => $theme['name'],
 		);
 
 		$variation_theme_json = MY_Theme_JSON_Resolver::export_theme_data( $export_type, $extra_theme_data );
 
 		file_put_contents(
-			$variation_path . $variation_slug . '.json',
+			$variation_path . $theme['slug'] . '.json',
 			$variation_theme_json
 		);
 	}

diff --git a/includes/class-create-block-theme-api.php b/includes/class-create-block-theme-api.php
@@ -64,6 +64,17 @@ public function register_rest_routes() {
 				},
 			)
 		);
+		register_rest_route(
+			'create-block-theme/v1',
+			'/create-variation',
+			array(
+				'methods'             => 'POST',
+				'callback'            => array( $this, 'rest_create_variation' ),
+				'permission_callback' => function () {
+					return current_user_can( 'edit_theme_options' );
+				},
+			)
+		);
 		register_rest_route(
 			'create-block-theme/v1',
 			'/create-blank',
@@ -135,6 +146,22 @@ function rest_clone_theme( $request ) {
 		);
 	}
 
+	function rest_create_variation( $request ) {
+
+		$response = Theme_Json::add_theme_json_variation_to_local( 'variation', $this->sanitize_theme_data( $request->get_params() ) );
+
+		if ( is_wp_error( $response ) ) {
+			return $response;
+		}
+
+		return new WP_REST_Response(
+			array(
+				'status'  => 'SUCCESS',
+				'message' => __( 'Theme Variation Created.', 'create-block-theme' ),
+			)
+		);
+	}
+
 	function rest_create_blank_theme( $request ) {
 
 		$theme = $this->sanitize_theme_data( $request->get_params() );

diff --git a/src/editor-sidebar/create-panel.js b/src/editor-sidebar/create-panel.js
@@ -142,6 +142,36 @@ export const CreateThemePanel = () => {
 			} );
 	};
 
+	const handleCreateVariationClick = () => {
+		apiFetch( {
+			path: '/create-block-theme/v1/create-variation',
+			method: 'POST',
+			data: theme,
+			headers: {
+				'Content-Type': 'application/json',
+			},
+		} )
+			.then( () => {
+				// eslint-disable-next-line
+				alert(
+					__(
+						'Theme variation created successfully. The editor will now reload.',
+						'create-block-theme'
+					)
+				);
+				window.location.reload();
+			} )
+			.catch( ( error ) => {
+				const errorMessage =
+					error.message ||
+					__(
+						'An error occurred while attempting to create the theme variation.',
+						'create-block-theme'
+					);
+				createErrorNotice( errorMessage, { type: 'snackbar' } );
+			} );
+	};
+
 	return (
 		<PanelBody>
 			<Heading>
@@ -236,6 +266,22 @@ export const CreateThemePanel = () => {
 			</Text>
 			<hr></hr>
 			<Spacer />
+			<Button
+				icon={ copy }
+				variant="secondary"
+				onClick={ handleCreateVariationClick }
+			>
+				{ __( 'Create Theme Variation', 'create-block-theme' ) }
+			</Button>
+			<Spacer />
+			<Text variant="muted">
+				{ __(
+					'Save the Global Styles changes as a theme variation.',
+					'create-block-theme'
+				) }
+			</Text>
+			<hr></hr>
+			<Spacer />
 			<Button
 				icon={ download }
 				variant="secondary"