Steve-Dee-Designs
/
woocommerce
mirror of https://github.com/woocommerce/woocommerce.git
1
0
Fork 0
Code Issues Packages Projects Releases Wiki Activity

Pattern: fetch product id on the JS side (https://github.com/woocommerce/woocommerce-blocks/pull/11138) 

* Pattern: fetch product id on the frontend side

* fix TS type
This commit is contained in:
Luigi Teschio 2023-10-05 09:30:50 +02:00 committed by GitHub
parent dec4e4fc75
commit ad80598ab8
3 changed files with 28 additions and 28 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

29
plugins/woocommerce-blocks/assets/js/blocks/single-product/edit/index.tsx
View File

@ -2,18 +2,19 @@
* External dependencies
*/
import { __ } from '@wordpress/i18n';
import { useState } from '@wordpress/element';
import { useEffect, useState } from '@wordpress/element';
import { Placeholder, Button, PanelBody } from '@wordpress/components';
import { withProduct } from '@woocommerce/block-hocs';
import BlockErrorBoundary from '@woocommerce/base-components/block-error-boundary';
import EditProductLink from '@woocommerce/editor-components/edit-product-link';
import { singleProductBlockPreview } from '@woocommerce/resource-previews';
import { InspectorControls, useBlockProps } from '@wordpress/block-editor';
import { ProductResponseItem } from '@woocommerce/types';
import ErrorPlaceholder, {
ErrorObject,
} from '@woocommerce/editor-components/error-placeholder';
import { PRODUCTS_STORE_NAME, Product } from '@woocommerce/data';
import { useSelect } from '@wordpress/data';
/**
* Internal dependencies
*/
@ -52,9 +53,29 @@ const Editor = ( {
const [ isEditing, setIsEditing ] = useState( ! productId );
const blockProps = useBlockProps();
if ( isPreview ) {
return singleProductBlockPreview;
const productPreview = useSelect( ( select ) => {
if ( ! isPreview ) {
return null;
}
return select( PRODUCTS_STORE_NAME ).getProducts< Array< Product > >( {
per_page: 1,
} );
} );
useEffect( () => {
const productPreviewId = productPreview
? productPreview[ 0 ]?.id
: null;
if ( ! productPreviewId ) {
return;
}
setAttributes( {
...attributes,
productId: productPreviewId,
} );
setIsEditing( false );
}, [ attributes, productPreview, setAttributes ] );
if ( error ) {
return (

13
plugins/woocommerce-blocks/patterns/product-details-listing.php
View File

@ -4,20 +4,9 @@
* Slug: woocommerce-blocks/product-details-listing
* Categories: WooCommerce
*/
$query = new \WC_Product_Query(
array(
'limit' => 1,
'return' => 'ids',
'status' => array( 'publish' ),
)
);
$products = $query->get_products();
$product_id = $products ? $products[0] : null;
?>
<!-- wp:woocommerce/single-product {"productId":<?php echo esc_attr( $product_id ); ?>} -->
<!-- wp:woocommerce/single-product {"isPreview": true} -->
<div class="wp-block-woocommerce-single-product">
<!-- wp:columns -->
<div class="wp-block-columns">

12
plugins/woocommerce-blocks/patterns/product-hero.php
View File

@ -5,19 +5,9 @@
* Categories: WooCommerce
*/
$query = new \WC_Product_Query(
array(
'limit' => 1,
'return' => 'ids',
'status' => array( 'publish' ),
)
);
$products = $query->get_products();
$product_id = $products ? $products[0] : null;
?>
<!-- wp:woocommerce/single-product {"productId":<?php echo esc_attr( $product_id ); ?>,"align":"wide"} -->
<!-- wp:woocommerce/single-product {"isPreview":true, "align":"wide"} -->
<div class="wp-block-woocommerce-single-product alignwide">
<!-- wp:columns -->
<div class="wp-block-columns">