Merge pull request #80 from bigbite/fix/avoid-storing-non-user-values

Prevents storing non-user values in the database
bigbite · Jul 23, 2024 · dd2dc75 · dd2dc75
2 parents f796c9a + d0b4f82
commit dd2dc75
Show file tree

Hide file tree

Showing 9 changed files with 17 additions and 16 deletions.
diff --git a/src/editor/components/StylesBorder.js b/src/editor/components/StylesBorder.js
@@ -14,7 +14,7 @@ import StylesContext from '../context/StylesContext';
  * @param {string} props.selector Property target selector
  */
 const Border = ( { selector } ) => {
-	const { themeConfig } = useContext( EditorContext );
+	const { userConfig, themeConfig } = useContext( EditorContext );
 	const { setUserConfig } = useContext( StylesContext );
 	const value = getThemeOption( selector, themeConfig );
 	const themePalette = getThemeOption(
@@ -23,7 +23,7 @@ const Border = ( { selector } ) => {
 	);
 
 	const onChange = ( newValue ) => {
-		let config = structuredClone( themeConfig );
+		let config = structuredClone( userConfig );
 		config = set( config, selector, newValue );
 		setUserConfig( config );
 	};

diff --git a/src/editor/components/StylesColor.js b/src/editor/components/StylesColor.js
@@ -15,7 +15,7 @@ import StylesContext from '../context/StylesContext';
  * @param {string} props.selector Property target selector
  */
 const Color = ( { selector } ) => {
-	const { themeConfig } = useContext( EditorContext );
+	const { userConfig, themeConfig } = useContext( EditorContext );
 	const { setUserConfig } = useContext( StylesContext );
 	const colorStyles = getThemeOption( selector, themeConfig ) || {};
 	const themePalette = getThemeOption(
@@ -24,7 +24,7 @@ const Color = ( { selector } ) => {
 	);
 
 	const onChange = ( newValue, key ) => {
-		let config = structuredClone( themeConfig );
+		let config = structuredClone( userConfig );
 		config = set(
 			config,
 			[ selector, key ].join( '.' ),

diff --git a/src/editor/components/StylesDimensions.js b/src/editor/components/StylesDimensions.js
@@ -58,7 +58,7 @@ const parseUnitValue = ( minHeight, typeValue ) => {
  * @param {string} props.selector Property target selector
  */
 const Dimensions = ( { selector } ) => {
-	const { themeConfig } = useContext( EditorContext );
+	const { userConfig, themeConfig } = useContext( EditorContext );
 	const { setUserConfig } = useContext( StylesContext );
 	const dimensionsStyles = getThemeOption( selector, themeConfig ) || {};
 	const { minHeight } = dimensionsStyles;
@@ -68,7 +68,7 @@ const Dimensions = ( { selector } ) => {
 	// Updates a property value in the outline object.
 	const handleNewValue = ( value ) => {
 		dimensionsStyles.minHeight = value;
-		let config = structuredClone( themeConfig );
+		let config = structuredClone( userConfig );
 		config = set( config, selector, dimensionsStyles );
 		setUserConfig( config );
 	};

diff --git a/src/editor/components/StylesFilter.js b/src/editor/components/StylesFilter.js
@@ -15,7 +15,7 @@ import { varToDuotone, duotoneToVar } from '../../utils/block-helpers';
  * @param {string} props.selector Property target selector
  */
 const Filter = ( { selector } ) => {
-	const { themeConfig } = useContext( EditorContext );
+	const { userConfig, themeConfig } = useContext( EditorContext );
 	const { setUserConfig } = useContext( StylesContext );
 	const duotoneThemeObj = getThemeOption(
 		'settings.color.duotone',
@@ -47,7 +47,7 @@ const Filter = ( { selector } ) => {
 			...filterStyles,
 			duotone: duotoneToVar( newVal, duotoneOptions ),
 		};
-		let config = structuredClone( themeConfig );
+		let config = structuredClone( userConfig );
 		config = set( config, selector, newFilterStyles );
 		setUserConfig( config );
 	};

diff --git a/src/editor/components/StylesOutline.js b/src/editor/components/StylesOutline.js
@@ -30,7 +30,7 @@ const unitControlUnits = ALLOWED_UNITS.map( ( unit ) => {
  * @param {string} props.selector Property target selector
  */
 const Outline = ( { selector } ) => {
-	const { themeConfig } = useContext( EditorContext );
+	const { userConfig, themeConfig } = useContext( EditorContext );
 	const { setUserConfig } = useContext( StylesContext );
 	const outlineStyles = getThemeOption( selector, themeConfig );
 	const themePalette = getThemeOption(
@@ -58,7 +58,7 @@ const Outline = ( { selector } ) => {
 	// Updates a property value in the outline object.
 	const handleNewValue = ( value, key ) => {
 		const newOutlineStyles = { ...outlineStyles, [ key ]: value };
-		let config = structuredClone( themeConfig );
+		let config = structuredClone( userConfig );
 		config = set( config, selector, newOutlineStyles );
 		setUserConfig( config );
 	};

diff --git a/src/editor/components/StylesShadow.js b/src/editor/components/StylesShadow.js
@@ -47,7 +47,7 @@ const parseUserValue = ( value ) => {
  * @param {string} props.selector Property target selector
  */
 const Shadow = ( { selector } ) => {
-	const { themeConfig } = useContext( EditorContext );
+	const { userConfig, themeConfig } = useContext( EditorContext );
 	const { setUserConfig } = useContext( StylesContext );
 	const shadowStyles = getThemeOption( selector, themeConfig );
 	const themePalette = getThemeOption(
@@ -69,7 +69,7 @@ const Shadow = ( { selector } ) => {
 			.join( ' ' )
 			.trim();
 
-		let config = structuredClone( themeConfig );
+		let config = structuredClone( userConfig );
 		config = set( config, selector, updatedShadowStyles );
 		setUserConfig( config );
 	};

diff --git a/src/editor/components/StylesSpacing.js b/src/editor/components/StylesSpacing.js
@@ -74,7 +74,7 @@ const parseMarginPaddingValues = ( type, spacingStyles, themeSpacingSizes ) => {
  * @param {string} props.selector Property target selector
  */
 const Spacing = ( { selector } ) => {
-	const { themeConfig } = useContext( EditorContext );
+	const { userConfig, themeConfig } = useContext( EditorContext );
 	const { setUserConfig } = useContext( StylesContext );
 	const spacingStyles = getThemeOption( selector, themeConfig );
 	const themeSpacingSizes = getThemeOption(
@@ -117,7 +117,7 @@ const Spacing = ( { selector } ) => {
 			};
 		}
 
-		let config = structuredClone( themeConfig );
+		let config = structuredClone( userConfig );
 		config = set( config, selector, newSpacingStyles );
 		setUserConfig( config );
 	};

diff --git a/src/editor/components/StylesTypography/index.js b/src/editor/components/StylesTypography/index.js
@@ -35,7 +35,7 @@ import FontSize from './FontSize';
  * @param {string} props.selector Property target selector
  */
 const Typography = ( { selector } ) => {
-	const { themeConfig } = useContext( EditorContext );
+	const { userConfig, themeConfig } = useContext( EditorContext );
 	const { setUserConfig } = useContext( StylesContext );
 	const typographyStyles = getThemeOption( selector, themeConfig );
 
@@ -46,7 +46,7 @@ const Typography = ( { selector } ) => {
 	 */
 	const handleNewValue = ( newVal ) => {
 		const newTypographyStyles = { ...typographyStyles, ...newVal };
-		let config = structuredClone( themeConfig );
+		let config = structuredClone( userConfig );
 		config = set( config, selector, newTypographyStyles );
 		setUserConfig( config );
 	};

diff --git a/src/editor/components/ThemerComponent.js b/src/editor/components/ThemerComponent.js
@@ -210,6 +210,7 @@ const ThemerComponent = () => {
 			<EditorContext.Provider
 				value={ {
 					globalStylesId,
+					userConfig,
 					themeConfig,
 					schema,
 					previewBlocks,