fix (global typography): Migrate global typography font sizes to string (#3517)

* fix: add checks before migrating

* fix: add global typography font size migration

* fix: move db lookup

* fix: add additional checks

* fix: remove typography var

Author: Arukuen

src/block-components/alignment/deprecated/index.js

@@ -29,13 +29,19 @@ export const deprecateInnerBlockRowGapAndContainerHeight = {
 		const getAttrName = getAttrNameFunction( attrNameTemplate )
 		const getAttribute = _attrName => attributes[ getAttrName( _attrName ) ]
 
+		const newAttributes = {
+			...attributes,
+		}
+
 		const containerHeight = getAttribute( 'containerHeight' )
 		const innerBlockRowGap = getAttribute( 'innerBlockRowGap' )
 
-		const newAttributes = {
-			...attributes,
-			[ getAttrName( 'containerHeight' ) ]: String( containerHeight ),
-			[ getAttrName( 'innerBlockRowGap' ) ]: String( innerBlockRowGap ),
+		if ( typeof containerHeight === 'number' ) {
+			newAttributes[ getAttrName( 'containerHeight' ) ] = String( containerHeight )
+		}
+
+		if ( typeof innerBlockRowGap === 'number' ) {
+			newAttributes[ getAttrName( 'innerBlockRowGap' ) ] = String( innerBlockRowGap )
 		}
 
 		return newAttributes

src/block-components/columns/deprecated/index.js

@@ -41,15 +41,24 @@ export const deprecateColumnAndRowGap = {
 		const getAttrName = getAttrNameFunction( attrNameTemplate )
 		const getAttribute = _attrName => attributes[ getAttrName( _attrName ) ]
 
+		const newAttributes = {
+			...attributes,
+		}
+
 		const columnSpacing = getAttribute( 'columnSpacing' )
 		const columnGap = getAttribute( 'columnGap' )
 		const rowGap = getAttribute( 'rowGap' )
 
-		const newAttributes = {
-			...attributes,
-			[ getAttrName( 'columnSpacing' ) ]: String( columnSpacing ),
-			[ getAttrName( 'columnGap' ) ]: String( columnGap ),
-			[ getAttrName( 'rowGap' ) ]: String( rowGap ),
+		if ( typeof columnSpacing === 'number' ) {
+			newAttributes[ getAttrName( 'columnSpacing' ) ] = String( columnSpacing )
+		}
+
+		if ( typeof columnGap === 'number' ) {
+			newAttributes[ getAttrName( 'columnGap' ) ] = String( columnGap )
+		}
+
+		if ( typeof rowGap === 'number' ) {
+			newAttributes[ getAttrName( 'rowGap' ) ] = String( rowGap )
 		}
 
 		return newAttributes

src/block-components/helpers/size/deprecated.js

@@ -29,11 +29,14 @@ export const deprecateSizeControlHeight = {
 		const getAttrName = getAttrNameFunction( attrNameTemplate )
 		const getAttribute = _attrName => attributes[ getAttrName( _attrName ) ]
 
-		const height = getAttribute( 'height' )
-
 		const newAttributes = {
 			...attributes,
-			[ getAttrName( 'height' ) ]: String( height ),
+		}
+
+		const height = getAttribute( 'height' )
+
+		if ( typeof height === 'number' ) {
+			newAttributes[ getAttrName( 'height' ) ] = String( height )
 		}
 
 		return newAttributes

src/block-components/typography/deprecated.js

@@ -130,11 +130,14 @@ export const deprecateTypographyFontSize = {
 		const getAttrName = getAttrNameFunction( attrNameTemplate )
 		const getAttribute = _attrName => attributes[ getAttrName( _attrName ) ]
 
-		const fontSize = getAttribute( 'fontSize' )
-
 		const newAttributes = {
 			...attributes,
-			[ getAttrName( 'fontSize' ) ]: String( fontSize ),
+		}
+
+		const fontSize = getAttribute( 'fontSize' )
+
+		if ( typeof fontSize === 'number' ) {
+			newAttributes[ getAttrName( 'fontSize' ) ] = String( fontSize )
 		}
 
 		return newAttributes

src/plugins/global-settings/preset-controls/index.php

@@ -44,6 +44,7 @@ class Stackable_Size_And_Spacing_Preset_Controls {
   		function __construct() {
 			add_action( 'register_stackable_global_settings', array( $this, 'register_use_size_presets_by_default' ) );
 			add_action( 'stackable_early_version_upgraded',  array( $this, 'use_size_presets_by_default_set_default' ), 10, 2 );
+			add_action( 'stackable_early_version_upgraded',  array( $this, 'migrate_global_typography_font_size' ), 10, 2 );
 			add_filter( 'stackable_js_settings', array( $this, 'add_setting' ) );
 
 			add_filter( 'stackable_inline_styles_nodep', array( $this, 'add_preset_controls_styles' ) );
@@ -79,6 +80,40 @@ public function use_size_presets_by_default_set_default( $old_version, $new_vers
 			}
 		}
 
+		/**
+		 * Migrates global typography font sizes from numbers to strings 
+		 * when upgrading to v3.16.0 and above
+		 *
+		 * @since 3.16.0
+		 */
+		public function migrate_global_typography_font_size( $old_version, $new_version ) {
+			if ( ! empty( $old_version ) && version_compare( $old_version, "3.16.0", "<" ) ) {
+				$typography_option = get_option( 'stackable_global_typography' );
+
+				if ( ! empty( $typography_option ) && isset( $typography_option[ 0 ] ) && is_array( $typography_option[ 0 ] ) ) {
+					$updated = false;
+
+					foreach ( $typography_option[ 0 ] as $key => $item ) {
+						if ( ! is_array( $item ) ) {
+							continue;
+						}
+
+						foreach ( [ 'fontSize', 'tabletFontSize', 'mobileFontSize' ] as $size_key ) {
+							if ( isset( $item[ $size_key ] ) && is_numeric( $item[ $size_key ] ) ) {
+								$typography_option[ 0 ][ $key ][ $size_key ] = strval( $item[ $size_key ] );
+								$updated = true;
+							}
+						}
+					}
+
+					if ( $updated ) {
+						update_option( 'stackable_global_typography', $typography_option );
+					}
+				}
+			}
+		}
+
+
 		// Make the setting available in the editor
 		public function add_setting( $settings ) {
 			$settings['stackable_use_size_presets_by_default'] = get_option( 'stackable_use_size_presets_by_default' );