diff --git a/backend/composer.json b/backend/composer.json index c5e3379b8..cc362af53 100644 --- a/backend/composer.json +++ b/backend/composer.json @@ -119,7 +119,7 @@ }, "require": { "dre1080/wp-graphql-upload": "^0.1", - "harness-software/wp-graphql-gravity-forms": "^0.4", + "harness-software/wp-graphql-gravity-forms": "^0.7", "pristas-peter/wp-graphql-gutenberg": "^0.3", "wds/wds-headless-acf": "^1.0", "wds/wds-headless-algolia": "^1.0", diff --git a/backend/plugins/wds-headless-blocks/inc/blocks.php b/backend/plugins/wds-headless-blocks/inc/blocks.php index 6c6bda7d7..cb62e6dbb 100644 --- a/backend/plugins/wds-headless-blocks/inc/blocks.php +++ b/backend/plugins/wds-headless-blocks/inc/blocks.php @@ -67,4 +67,4 @@ function enqueue_block_editor_assets() { true ); } -add_action( 'enqueue_block_editor_assets', __NAMESPACE__ . '\enqueue_block_editor_assets' ); +add_action( 'enqueue_block_editor_assets', __NAMESPACE__ . '\enqueue_block_editor_assets', 1 ); diff --git a/backend/plugins/wds-headless-blocks/js/blocks.js b/backend/plugins/wds-headless-blocks/js/blocks.js index 447aca2e7..cbb9521cb 100644 --- a/backend/plugins/wds-headless-blocks/js/blocks.js +++ b/backend/plugins/wds-headless-blocks/js/blocks.js @@ -6,9 +6,10 @@ * @since 1.0.0 */ -const { validateThemeColors, validateThemeGradients } = wp.blockEditor; -const { useEffect } = wp.element; -const { addFilter, applyFilters } = wp.hooks; +const {validateThemeColors, validateThemeGradients} = wp.blockEditor +const {useEffect, createElement} = wp.element +const {addFilter, applyFilters} = wp.hooks +const {createHigherOrderComponent} = wp.compose /** * Customize core block settings. @@ -17,23 +18,17 @@ const { addFilter, applyFilters } = wp.hooks; * @since 1.0.0 */ wp.domReady(() => { - wp.blocks.unregisterBlockStyle("core/image", "default"); - wp.blocks.unregisterBlockStyle("core/separator", "dots"); - wp.blocks.unregisterBlockStyle("core/separator", "wide"); - wp.blocks.registerBlockStyle("core/separator", { - name: "full-width", - label: "Full Width", - }); -}); - -addFilter( - "blocks.registerBlockType", - "wds/filterBlockColorAttrs", - wdsAddColorPaletteHexValues -); + wp.blocks.unregisterBlockStyle('core/image', 'default') + wp.blocks.unregisterBlockStyle('core/separator', 'dots') + wp.blocks.unregisterBlockStyle('core/separator', 'wide') + wp.blocks.registerBlockStyle('core/separator', { + name: 'full-width', + label: 'Full Width' + }) +}) /** - * Filter block registration to add custom color attributes to specified blocks. + * Filter block registration to add custom color attributes. * * @author WebDevStudios * @since 1.0.0 @@ -41,138 +36,157 @@ addFilter( * @return {object} Block settings config. */ function wdsAddColorPaletteHexValues(settings) { - // Add background color hex attribute. - if (settings.attributes.hasOwnProperty("backgroundColor")) { - settings.attributes.backgroundColorHex = { - type: "string", - default: "", - }; - } - - // Add gradient background hex attribute. - if (settings.attributes.hasOwnProperty("gradient")) { - settings.attributes.gradientHex = { - type: "string", - default: "", - }; - } - - // Add main color hex attribute. - if (settings.attributes.hasOwnProperty("mainColor")) { - settings.attributes.mainColorHex = { - type: "string", - default: "", - }; - } - - // Add overlay color hex attribute. - if (settings.attributes.hasOwnProperty("overlayColor")) { - settings.attributes.overlayColorHex = { - type: "string", - default: "", - }; - } - - // Add text color hex attribute. - if (settings.attributes.hasOwnProperty("textColor")) { - settings.attributes.textColorHex = { - type: "string", - default: "", - }; - } - - return { - ...settings, - edit(props) { - const { - attributes: { - backgroundColor, - gradient, - mainColor, - overlayColor, - textColor, - }, - } = props; - - useEffect(() => { - // Note: This may not work as expected if a custom theme palette has been set. - // In that case, this filter may need to be customized. - const defaultColors = validateThemeColors(); - - const defaultGradients = validateThemeGradients(); - - // Check for presence of background color attr. - if (backgroundColor) { - // Get color object by slug. - const backgroundColorObj = defaultColors.filter( - (color) => color.slug === backgroundColor - ); - - // Retrieve color hex value. - props.attributes.backgroundColorHex = - backgroundColorObj?.[0]?.color || null; - } else { - delete props.attributes.backgroundColorHex; - } - - // Check for presence of gradient color attr. - if (gradient) { - // Get color object by slug. - const gradientObj = defaultGradients.filter( - (color) => color.slug === gradient - ); - - // Retrieve color hex value. - props.attributes.gradientHex = - gradientObj?.[0]?.gradient || null; - } else { - delete props.attributes.gradientHex; - } - - // Check for presence of main color attr. - if (mainColor) { - // Get color object by slug. - const mainColorObj = defaultColors.filter( - (color) => color.slug === mainColor - ); - - // Retrieve color hex value. - props.attributes.mainColorHex = - mainColorObj?.[0]?.color || null; - } else { - delete props.attributes.mainColorHex; - } - - // Check for presence of overlay color attr. - if (overlayColor) { - // Get color object by slug. - const overlayColorObj = defaultColors.filter( - (color) => color.slug === overlayColor - ); - - // Retrieve color hex value. - props.attributes.overlayColorHex = - overlayColorObj?.[0]?.color || null; - } else { - delete props.attributes.overlayColorHex; - } - - // Check for presence of text color attr. - if (textColor) { - // Get color object by slug. - const textColorObj = defaultColors.filter( - (color) => color.slug === textColor - ); - - // Retrieve color hex value. - props.attributes.textColorHex = - textColorObj?.[0]?.color || null; - } else { - delete props.attributes.textColorHex; - } - }, [backgroundColor, mainColor, textColor]); - - return settings.edit(props); - }, - }; + const attributes = {} + + // Add background color hex attribute. + if (settings.attributes.hasOwnProperty('backgroundColor')) { + attributes.backgroundColorHex = { + type: 'string', + default: '' + } + } + + // Add gradient background hex attribute. + if (settings.attributes.hasOwnProperty('gradient')) { + attributes.gradientHex = { + type: 'string', + default: '' + } + } + + // Add main color hex attribute. + if (settings.attributes.hasOwnProperty('mainColor')) { + attributes.mainColorHex = { + type: 'string', + default: '' + } + } + + // Add overlay color hex attribute. + if (settings.attributes.hasOwnProperty('overlayColor')) { + attributes.overlayColorHex = { + type: 'string', + default: '' + } + } + + // Add text color hex attribute. + if (settings.attributes.hasOwnProperty('textColor')) { + attributes.textColorHex = { + type: 'string', + default: '' + } + } + + return lodash.assign({}, settings, { + attributes: lodash.assign({}, settings.attributes, attributes) + }) } + +addFilter( + 'blocks.registerBlockType', + 'wds/filterBlockColorAttrs', + wdsAddColorPaletteHexValues +) + +/** + * Filter block edit function to set custom color attributes. + * + * @author WebDevStudios + * @since 1.0.1 + */ +const withColorPaletteHexValues = createHigherOrderComponent((BlockEdit) => { + return (props) => { + const { + attributes: { + backgroundColor, + gradient, + mainColor, + overlayColor, + textColor + } + } = props + + useEffect(() => { + // Note: This may not work as expected if a custom theme palette has been set. + // In that case, this filter may need to be customized. + const defaultColors = validateThemeColors() + + const defaultGradients = validateThemeGradients() + + // Check for presence of background color attr. + if (backgroundColor) { + // Get color object by slug. + const backgroundColorObj = defaultColors.filter( + (color) => color.slug === backgroundColor + ) + + // Retrieve color hex value. + props.attributes.backgroundColorHex = + backgroundColorObj?.[0]?.color || null + } else { + delete props.attributes.backgroundColorHex + } + + // Check for presence of gradient color attr. + if (gradient) { + // Get color object by slug. + const gradientObj = defaultGradients.filter( + (color) => color.slug === gradient + ) + + // Retrieve color hex value. + props.attributes.gradientHex = gradientObj?.[0]?.gradient || null + } else { + delete props.attributes.gradientHex + } + + // Check for presence of main color attr. + if (mainColor) { + // Get color object by slug. + const mainColorObj = defaultColors.filter( + (color) => color.slug === mainColor + ) + + // Retrieve color hex value. + props.attributes.mainColorHex = mainColorObj?.[0]?.color || null + } else { + delete props.attributes.mainColorHex + } + + // Check for presence of overlay color attr. + if (overlayColor) { + // Get color object by slug. + const overlayColorObj = defaultColors.filter( + (color) => color.slug === overlayColor + ) + + // Retrieve color hex value. + props.attributes.overlayColorHex = overlayColorObj?.[0]?.color || null + } else { + delete props.attributes.overlayColorHex + } + + // Check for presence of text color attr. + if (textColor) { + // Get color object by slug. + const textColorObj = defaultColors.filter( + (color) => color.slug === textColor + ) + + // Retrieve color hex value. + props.attributes.textColorHex = textColorObj?.[0]?.color || null + } else { + delete props.attributes.textColorHex + } + }, [backgroundColor, mainColor, textColor]) + + return createElement(BlockEdit, props) + } +}, 'withColorPaletteHexValues') + +addFilter( + 'editor.BlockEdit', + 'wds/filterBlockEditColorAttrs', + withColorPaletteHexValues +) diff --git a/backend/plugins/wds-headless-blocks/wds-headless-blocks.php b/backend/plugins/wds-headless-blocks/wds-headless-blocks.php index 31acf19f5..836872788 100644 --- a/backend/plugins/wds-headless-blocks/wds-headless-blocks.php +++ b/backend/plugins/wds-headless-blocks/wds-headless-blocks.php @@ -5,7 +5,7 @@ * Description: WDS Headless extension handling Gutenberg block functionality. * Author: WebDevStudios * Author URI: https://webdevstudios.com - * Version: 1.0.0 + * Version: 1.0.1 * Requires at least: 5.6 * Requires PHP: 7.4 * License: GPL-2 @@ -23,7 +23,7 @@ // Define constants. define( 'WDS_HEADLESS_BLOCKS_PLUGIN_DIR', plugin_dir_path( __FILE__ ) ); define( 'WDS_HEADLESS_BLOCKS_PLUGIN_URL', plugin_dir_url( __FILE__ ) ); -define( 'WDS_HEADLESS_BLOCKS_VERSION', '1.0.0' ); +define( 'WDS_HEADLESS_BLOCKS_VERSION', '1.0.1' ); // Register de/activation hooks. register_activation_hook( __FILE__, __NAMESPACE__ . '\activation_callback' ); diff --git a/backend/plugins/wds-headless-gravityforms/inc/wp-graphql.php b/backend/plugins/wds-headless-gravityforms/inc/wp-graphql.php index fa79f0afd..9c9d38e3a 100644 --- a/backend/plugins/wds-headless-gravityforms/inc/wp-graphql.php +++ b/backend/plugins/wds-headless-gravityforms/inc/wp-graphql.php @@ -76,7 +76,7 @@ function( $field ) use ( &$file_uploads, $form_id ) { $upload = handle_file_upload( $file, $target ); // If error occurs, skip field. - if ( ! $upload ) { + if ( ! $upload || ! $upload['url'] ) { $field['value'] = ''; return $field; diff --git a/frontend/functions/next-api/wordpress/gravityForms/processGfFieldValues.js b/frontend/functions/next-api/wordpress/gravityForms/processGfFieldValues.js index 17366a635..0c27be459 100644 --- a/frontend/functions/next-api/wordpress/gravityForms/processGfFieldValues.js +++ b/frontend/functions/next-api/wordpress/gravityForms/processGfFieldValues.js @@ -91,8 +91,10 @@ export default function processGfFieldValues(entryData, fieldData) { break case 'EmailField': - // TODO: As of WP GraphQL Gravity Forms v.0.4.1, this is accurate, but it appears it may be changing to a nested version in the next release: fieldValue.emailValues = { value, confirmationValue }. - fieldValue.value = entryData[fieldName] + fieldValue.emailValues = { + value: entryData[fieldName], + confirmationValue: entryData[fieldName] + } break case 'FileUploadField': diff --git a/frontend/functions/wordpress/gravityForms/insertGfFormEntry.js b/frontend/functions/wordpress/gravityForms/insertGfFormEntry.js index 9dc0ee207..e2d81ecc4 100644 --- a/frontend/functions/wordpress/gravityForms/insertGfFormEntry.js +++ b/frontend/functions/wordpress/gravityForms/insertGfFormEntry.js @@ -20,7 +20,7 @@ export default async function insertGfFormEntry(formId, fieldValues) { } // Convert File objects to be accepted on WP side. - fieldValues = fieldValues.map((field) => { + const newFieldValues = fieldValues.map((field) => { if (!field?.fileUploadValues) { return field } @@ -38,7 +38,7 @@ export default async function insertGfFormEntry(formId, fieldValues) { // Determine query variables. const variables = { formId, - fieldValues + fieldValues: newFieldValues } // Execute query.