Add template URL parameter to allow choosing template directly (#48573)

This commit is contained in:
Nathan Silveira 2024-06-19 10:08:53 -03:00 committed by GitHub
parent 3ea4df2055
commit e0a35960d2
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
2 changed files with 23 additions and 0 deletions

View File

@ -0,0 +1,4 @@
Significance: minor
Type: add
Add template URL parameter to allow choosing template directly

View File

@ -17,6 +17,7 @@ import { __ } from '@wordpress/i18n';
import { useLayoutTemplate } from '@woocommerce/block-templates';
import { store as keyboardShortcutsStore } from '@wordpress/keyboard-shortcuts';
import { Product } from '@woocommerce/data';
import { getPath, getQuery } from '@woocommerce/navigation';
import {
// eslint-disable-next-line @typescript-eslint/ban-ts-comment
// @ts-ignore No types for this exist yet.
@ -52,6 +53,7 @@ import { BlockEditorProps } from './types';
import { LoadingState } from './loading-state';
import type { ProductFormPostProps, ProductTemplate } from '../../types';
import isProductFormTemplateSystemEnabled from '../../utils/is-product-form-template-system-enabled';
import useProductEntityProp from '../../hooks/use-product-entity-prop';
const PluginArea = lazy( () =>
import( '@wordpress/plugins' ).then( ( module ) => ( {
@ -198,6 +200,11 @@ export function BlockEditor( {
[ product?.meta_data ]
);
const [ , setProductTemplateId ] = useProductEntityProp(
'meta_data._product_template_id',
{ postType }
);
const { productTemplate } = useProductTemplate(
productTemplateId,
hasResolved ? product : null
@ -303,6 +310,18 @@ export function BlockEditor( {
setIsEditorLoading( isEditorLoading );
}, [ isEditorLoading ] );
useEffect( function maybeSetProductTemplateFromURL() {
const query: { template?: string } = getQuery();
const isAddProduct = getPath().endsWith( 'add-product' );
if ( isAddProduct && query.template ) {
const productTemplates =
window.productBlockEditorSettings?.productTemplates ?? [];
if ( productTemplates.find( ( t ) => t.id === query.template ) ) {
setProductTemplateId( query.template );
}
}
}, [] );
// Check if the Modal editor is open from the store.
const isModalEditorOpen = useSelect( ( selectCore ) => {
return selectCore( productEditorUiStore ).isModalEditorOpen();