diff --git a/packages/js/product-editor/changelog/fix-rest-namespace-blocks-37619 b/packages/js/product-editor/changelog/fix-rest-namespace-blocks-37619 new file mode 100644 index 00000000000..a6315f79155 --- /dev/null +++ b/packages/js/product-editor/changelog/fix-rest-namespace-blocks-37619 @@ -0,0 +1,4 @@ +Significance: minor +Type: fix + +Adding apifetch middleware to override product api endpoint only for the product editor. diff --git a/packages/js/product-editor/package.json b/packages/js/product-editor/package.json index f508c8d9d77..49b271d990a 100644 --- a/packages/js/product-editor/package.json +++ b/packages/js/product-editor/package.json @@ -41,6 +41,7 @@ "@woocommerce/number": "workspace:*", "@woocommerce/settings": "^1.0.0", "@woocommerce/tracks": "workspace:^1.3.0", + "@wordpress/api-fetch": "wp-6.0", "@wordpress/block-editor": "^9.8.0", "@wordpress/blocks": "^12.3.0", "@wordpress/components": "wp-6.0", diff --git a/packages/js/product-editor/src/utils/index.ts b/packages/js/product-editor/src/utils/index.ts index 67a0014effc..31d0ce7f148 100644 --- a/packages/js/product-editor/src/utils/index.ts +++ b/packages/js/product-editor/src/utils/index.ts @@ -22,6 +22,7 @@ import { preventLeavingProductForm } from './prevent-leaving-product-form'; export * from './create-ordered-children'; export * from './sort-fills-by-order'; export * from './init-blocks'; +export * from './product-apifetch-middleware'; export { AUTO_DRAFT_NAME, diff --git a/packages/js/product-editor/src/utils/product-apifetch-middleware.ts b/packages/js/product-editor/src/utils/product-apifetch-middleware.ts new file mode 100644 index 00000000000..b33c5d8ca71 --- /dev/null +++ b/packages/js/product-editor/src/utils/product-apifetch-middleware.ts @@ -0,0 +1,34 @@ +/** + * External dependencies + */ +import apiFetch from '@wordpress/api-fetch'; +import { getQuery } from '@woocommerce/navigation'; + +const isProductEditor = () => { + const query: { page?: string; path?: string } = getQuery(); + return ( + query?.page === 'wc-admin' && + [ '/add-product', '/product/' ].some( ( path ) => + query?.path?.startsWith( path ) + ) + ); +}; + +export const productApiFetchMiddleware = () => { + // This is needed to ensure that we use the correct namespace for the entity data store + // without disturbing the rest_namespace outside of the product block editor. + apiFetch.use( ( options, next ) => { + const versionTwoRegex = new RegExp( '^/wp/v2/product' ); + if ( + options.path && + versionTwoRegex.test( options?.path ) && + isProductEditor() + ) { + options.path = options.path.replace( + versionTwoRegex, + '/wc/v3/products' + ); + } + return next( options ); + } ); +}; diff --git a/plugins/woocommerce-admin/client/products/hooks/use-product-entity-record.ts b/plugins/woocommerce-admin/client/products/hooks/use-product-entity-record.ts index b0f03086810..823e371869d 100644 --- a/plugins/woocommerce-admin/client/products/hooks/use-product-entity-record.ts +++ b/plugins/woocommerce-admin/client/products/hooks/use-product-entity-record.ts @@ -4,7 +4,6 @@ import { AUTO_DRAFT_NAME } from '@woocommerce/product-editor'; import { Product } from '@woocommerce/data'; import { useDispatch, resolveSelect } from '@wordpress/data'; - import { useEffect, useState } from '@wordpress/element'; export function useProductEntityRecord( diff --git a/plugins/woocommerce-admin/client/products/product-page.tsx b/plugins/woocommerce-admin/client/products/product-page.tsx index 6b414978f5a..2f67ab5fadb 100644 --- a/plugins/woocommerce-admin/client/products/product-page.tsx +++ b/plugins/woocommerce-admin/client/products/product-page.tsx @@ -4,6 +4,7 @@ import { __experimentalEditor as Editor, ProductEditorSettings, + productApiFetchMiddleware, } from '@woocommerce/product-editor'; import { Spinner } from '@wordpress/components'; @@ -20,6 +21,8 @@ import './fills/product-block-editor-fills'; declare const productBlockEditorSettings: ProductEditorSettings; +productApiFetchMiddleware(); + export default function ProductPage() { const { productId } = useParams(); diff --git a/plugins/woocommerce/changelog/fix-rest-namespace-blocks-37619 b/plugins/woocommerce/changelog/fix-rest-namespace-blocks-37619 new file mode 100644 index 00000000000..683a9b7bc9f --- /dev/null +++ b/plugins/woocommerce/changelog/fix-rest-namespace-blocks-37619 @@ -0,0 +1,4 @@ +Significance: patch +Type: fix + +Removing modification to rest_namespace on post type and replacing with middleware. diff --git a/plugins/woocommerce/includes/class-wc-post-types.php b/plugins/woocommerce/includes/class-wc-post-types.php index e2c74e2afe7..a115f340190 100644 --- a/plugins/woocommerce/includes/class-wc-post-types.php +++ b/plugins/woocommerce/includes/class-wc-post-types.php @@ -365,7 +365,6 @@ class WC_Post_Types { 'has_archive' => $has_archive, 'show_in_nav_menus' => true, 'show_in_rest' => true, - 'rest_namespace' => 'wp/v3', 'template' => array( array( 'woocommerce/product-tab', diff --git a/plugins/woocommerce/src/Admin/Features/ProductBlockEditor/Init.php b/plugins/woocommerce/src/Admin/Features/ProductBlockEditor/Init.php index b907226e10f..3f81ba822d7 100644 --- a/plugins/woocommerce/src/Admin/Features/ProductBlockEditor/Init.php +++ b/plugins/woocommerce/src/Admin/Features/ProductBlockEditor/Init.php @@ -33,7 +33,6 @@ class Init { } if ( Features::is_enabled( self::FEATURE_ID ) ) { add_action( 'admin_enqueue_scripts', array( $this, 'enqueue_scripts' ) ); - add_filter( 'woocommerce_register_post_type_product', array( $this, 'add_rest_base_config' ) ); $block_registry = new BlockRegistry(); $block_registry->register_product_blocks(); } @@ -106,15 +105,4 @@ class Init { return $link; } - /** - * Updates the product endpoint to use WooCommerce REST API. - * - * @param array $post_args Args for the product post type. - * @return array - */ - public function add_rest_base_config( $post_args ) { - $post_args['rest_base'] = 'products'; - $post_args['rest_namespace'] = 'wc/v3'; - return $post_args; - } } diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml index 94584ec418c..9d24fa04cd5 100644 --- a/pnpm-lock.yaml +++ b/pnpm-lock.yaml @@ -1441,6 +1441,7 @@ importers: '@woocommerce/number': workspace:* '@woocommerce/settings': ^1.0.0 '@woocommerce/tracks': workspace:^1.3.0 + '@wordpress/api-fetch': wp-6.0 '@wordpress/block-editor': ^9.8.0 '@wordpress/blocks': ^12.3.0 '@wordpress/browserslist-config': wp-6.0 @@ -1496,6 +1497,7 @@ importers: '@woocommerce/number': link:../number '@woocommerce/settings': 1.0.0 '@woocommerce/tracks': link:../tracks + '@wordpress/api-fetch': 6.3.1 '@wordpress/block-editor': 9.8.0_mtk4wljkd5jimhszw4p7nnxuzm '@wordpress/blocks': 12.5.0_react@17.0.2 '@wordpress/components': 19.8.5_eqi5qhcxfphl6j3pngzexvnehi @@ -9078,7 +9080,7 @@ packages: '@babel/core': ^7.0.0-0 dependencies: '@babel/core': 7.17.8 - '@babel/helper-plugin-utils': 7.19.0 + '@babel/helper-plugin-utils': 7.20.2 '@babel/plugin-proposal-unicode-property-regex': 7.18.6_@babel+core@7.17.8 '@babel/plugin-transform-dotall-regex': 7.18.6_@babel+core@7.17.8 '@babel/types': 7.21.3 @@ -9091,7 +9093,7 @@ packages: '@babel/core': ^7.0.0-0 dependencies: '@babel/core': 7.21.3 - '@babel/helper-plugin-utils': 7.19.0 + '@babel/helper-plugin-utils': 7.20.2 '@babel/plugin-proposal-unicode-property-regex': 7.18.6_@babel+core@7.21.3 '@babel/plugin-transform-dotall-regex': 7.18.6_@babel+core@7.21.3 '@babel/types': 7.21.3 @@ -17215,7 +17217,7 @@ packages: '@wordpress/style-engine': 0.15.0 '@wordpress/token-list': 2.19.0 '@wordpress/url': 3.29.0 - '@wordpress/warning': 2.28.0 + '@wordpress/warning': 2.19.0 '@wordpress/wordcount': 3.19.0 change-case: 4.1.2 classnames: 2.3.1 @@ -20624,8 +20626,8 @@ packages: peerDependencies: postcss: ^8.1.0 dependencies: - browserslist: 4.21.4 - caniuse-lite: 1.0.30001418 + browserslist: 4.20.2 + caniuse-lite: 1.0.30001352 fraction.js: 4.2.0 normalize-range: 0.1.2 picocolors: 1.0.0 @@ -22182,7 +22184,6 @@ packages: escalade: 3.1.1 node-releases: 2.0.6 picocolors: 1.0.0 - dev: true /browserslist/4.20.4: resolution: {integrity: sha512-ok1d+1WpnU24XYN7oC3QWgTyMhY/avPJ/r9T00xxvUOIparA/gc+UPUMaod3i+G6s+nI2nUb9xZ5k794uIwShw==} @@ -38056,7 +38057,7 @@ packages: is-touch-device: 1.0.1 lodash: 4.17.21 moment: 2.29.4 - object.assign: 4.1.2 + object.assign: 4.1.4 object.values: 1.1.5 prop-types: 15.8.1 raf: 3.4.1