Fix uploading background images in stylebook view. (#68159)

Co-authored-by: tellthemachines <isabel_brison@git.wordpress.org> Co-authored-by: ramonjd <ramonopoly@git.wordpress.org>
WordPress · Dec 20, 2024 · 8ad85f9 · 8ad85f9 · github-actions · Dec 20, 2024
1 parent 6dfea11
commit 8ad85f9
Show file tree

Hide file tree

Showing 3 changed files with 18 additions and 2 deletions.
diff --git a/package-lock.json b/package-lock.json
diff --git a/packages/edit-site/package.json b/packages/edit-site/package.json
@@ -56,6 +56,7 @@
 		"@wordpress/icons": "*",
 		"@wordpress/keyboard-shortcuts": "*",
 		"@wordpress/keycodes": "*",
+		"@wordpress/media-utils": "5.14.0",
 		"@wordpress/notices": "*",
 		"@wordpress/patterns": "*",
 		"@wordpress/plugins": "*",

diff --git a/packages/edit-site/src/components/style-book/index.js b/packages/edit-site/src/components/style-book/index.js
@@ -35,6 +35,8 @@ import {
 	useEffect,
 } from '@wordpress/element';
 import { ENTER, SPACE } from '@wordpress/keycodes';
+import { uploadMedia } from '@wordpress/media-utils';
+import { store as coreStore } from '@wordpress/core-data';
 
 /**
  * Internal dependencies
@@ -361,10 +363,22 @@ export const StyleBookPreview = ( { userConfig = {}, isStatic = false } ) => {
 		[]
 	);
 
+	const canUserUploadMedia = useSelect(
+		( select ) =>
+			select( coreStore ).canUser( 'create', {
+				kind: 'root',
+				name: 'media',
+			} ),
+		[]
+	);
+
 	// Update block editor settings because useMultipleOriginColorsAndGradients fetch colours from there.
 	useEffect( () => {
-		dispatch( blockEditorStore ).updateSettings( siteEditorSettings );
-	}, [ siteEditorSettings ] );
+		dispatch( blockEditorStore ).updateSettings( {
+			...siteEditorSettings,
+			mediaUpload: canUserUploadMedia ? uploadMedia : undefined,
+		} );
+	}, [ siteEditorSettings, canUserUploadMedia ] );
 
 	const [ section, onChangeSection ] = useSection();