editing boolean results in an error and false values vanish

#733 (comment)

Author: contactashish13

classes/Visualizer/Gutenberg/Block.php

@@ -659,6 +659,8 @@ public function update_chart_data( $data ) {
 
 	/**
 	 * Format chart data.
+	 *
+	 * Note: No matter how tempted, don't use the similar method from Visualizer_Source. That works on a different structure.
 	 */
 	public function format_chart_data( $data, $series ) {
 		foreach ( $series as $i => $row ) {
@@ -671,36 +673,35 @@ public function format_chart_data( $data, $series ) {
 				continue;
 			}
 
-			if ( $row['type'] === 'number' ) {
-				foreach ( $data as $o => $col ) {
-					$data[ $o ][ $i ] = ( is_numeric( $col[ $i ] ) ) ? floatval( $col[ $i ] ) : ( is_numeric( str_replace( ',', '', $col[ $i ] ) ) ? floatval( str_replace( ',', '', $col[ $i ] ) ) : null );
-				}
-			}
-
-			if ( $row['type'] === 'boolean' ) {
-				foreach ( $data as $o => $col ) {
-					$data[ $o ][ $i ] = ! empty( $col[ $i ] ) ? filter_var( $col[ $i ], FILTER_VALIDATE_BOOLEAN ) : null;
-				}
-			}
-
-			if ( $row['type'] === 'timeofday' ) {
-				foreach ( $data as $o => $col ) {
-					$date = new DateTime( '1984-03-16T' . $col[ $i ] );
-					if ( $date ) {
-						$data[ $o ][ $i ] = array(
-							intval( $date->format( 'H' ) ),
-							intval( $date->format( 'i' ) ),
-							intval( $date->format( 's' ) ),
-							0,
-						);
+			switch ( $row['type'] ) {
+				case 'number':
+					foreach ( $data as $o => $col ) {
+						$data[ $o ][ $i ] = ( is_numeric( $col[ $i ] ) ) ? floatval( $col[ $i ] ) : ( is_numeric( str_replace( ',', '', $col[ $i ] ) ) ? floatval( str_replace( ',', '', $col[ $i ] ) ) : null );
 					}
-				}
-			}
-
-			if ( $row['type'] === 'string' ) {
-				foreach ( $data as $o => $col ) {
-					$data[ $o ][ $i ] = $this->toUTF8( $col[ $i ] );
-				}
+					break;
+				case 'boolean':
+					foreach ( $data as $o => $col ) {
+						$data[ $o ][ $i ] = ! empty( $col[ $i ] ) ? filter_var( $col[ $i ], FILTER_VALIDATE_BOOLEAN ) : false;
+					}
+					break;
+				case 'timeofday':
+					foreach ( $data as $o => $col ) {
+						$date = new DateTime( '1984-03-16T' . $col[ $i ] );
+						if ( $date ) {
+							$data[ $o ][ $i ] = array(
+								intval( $date->format( 'H' ) ),
+								intval( $date->format( 'i' ) ),
+								intval( $date->format( 's' ) ),
+								0,
+							);
+						}
+					}
+					break;
+				case 'string':
+					foreach ( $data as $o => $col ) {
+						$data[ $o ][ $i ] = $this->toUTF8( $col[ $i ] );
+					}
+					break;
 			}
 		}
 

classes/Visualizer/Gutenberg/build/block.js

@@ -339,20 +339,39 @@ class Editor extends Component {
 		let map = series;
 		let fieldName = 'series';
 
-		if ( 'pie' === type ) {
-			map = chartData;
-			fieldName = 'slices';
-
-            // pie charts are finicky about a number being a number
-            // and editing a number makes it a string
-            // so let's convert it back into a number.
-            chartData.map( ( i, index ) => {
-                switch ( series[1].type ) {
-                    case 'number':
-                        i[1] = parseFloat( i[1]);
-                        break;
-                }
-            });
+        switch ( type ) {
+            case 'pie':
+                map = chartData;
+                fieldName = 'slices';
+
+                // pie charts are finicky about a number being a number
+                // and editing a number makes it a string
+                // so let's convert it back into a number.
+                chartData.map( ( i, index ) => {
+                    switch ( series[1].type ) {
+                        case 'number':
+                            i[1] = parseFloat( i[1]);
+                            break;
+                    }
+                });
+                break;
+            case 'tabular':
+
+                // table charts are finicky about a boolean being a boolean
+                // and editing a boolean makes it a string
+                // so let's convert it back into a boolean.
+                chartData.map( ( i, index ) => {
+                    series.map( ( seriesObject, seriesIndex ) => {
+                        switch ( seriesObject.type ) {
+                            case 'boolean':
+                                if ( 'string' === typeof i[seriesIndex]) {
+                                    i[seriesIndex] = 'true' === i[seriesIndex];
+                                }
+                                break;
+                        }
+                    });
+                });
+                break;
         }
 
 		map.map( ( i, index ) => {
@@ -362,16 +381,18 @@ class Editor extends Component {
 
 			const seriesIndex = 'pie' !== type ? index - 1 : index;
 
-			if ( settings[fieldName][seriesIndex] === undefined ) {
+			if ( Array.isArray( settings[fieldName]) && settings[fieldName][seriesIndex] === undefined ) {
                 settings[fieldName][seriesIndex] = {};
 				settings[fieldName][seriesIndex].temp = 1;
             }
 		});
 
-		settings[fieldName] = settings[fieldName].filter( ( i, index ) => {
-			const length = -1 >= [ 'pie', 'tabular', 'dataTable' ].indexOf( type ) ? map.length - 1 : map.length;
-			return index < length;
-		});
+        if ( Array.isArray( settings[fieldName]) ) {
+            settings[fieldName] = settings[fieldName].filter( ( i, index ) => {
+                const length = -1 >= [ 'pie', 'tabular', 'dataTable' ].indexOf( type ) ? map.length - 1 : map.length;
+                return index < length;
+            });
+        }
 
 		chart['visualizer-source'] = source;
 		chart['visualizer-default-data'] = 0;