From cc2a0c2c9770f4d6e430ec19ac230c15b5675d27 Mon Sep 17 00:00:00 2001 From: Niels Lange Date: Mon, 31 Oct 2022 17:52:09 +0700 Subject: [PATCH 01/58] Convert product-element/price to TypeScript --- .../price/{attributes.js => attributes.ts} | 2 +- .../price/{block.js => block.tsx} | 12 +++---- .../price/{constants.js => constants.tsx} | 6 ++-- .../price/{edit.js => edit.tsx} | 36 +++++++++++++------ .../price/{index.js => index.ts} | 3 +- .../blocks/product-elements/price/types.ts | 5 +++ 6 files changed, 40 insertions(+), 24 deletions(-) rename assets/js/atomic/blocks/product-elements/price/{attributes.js => attributes.ts} (84%) rename assets/js/atomic/blocks/product-elements/price/{block.js => block.tsx} (91%) rename assets/js/atomic/blocks/product-elements/price/{constants.js => constants.tsx} (73%) rename assets/js/atomic/blocks/product-elements/price/{edit.js => edit.tsx} (65%) rename assets/js/atomic/blocks/product-elements/price/{index.js => index.ts} (91%) create mode 100644 assets/js/atomic/blocks/product-elements/price/types.ts diff --git a/assets/js/atomic/blocks/product-elements/price/attributes.js b/assets/js/atomic/blocks/product-elements/price/attributes.ts similarity index 84% rename from assets/js/atomic/blocks/product-elements/price/attributes.js rename to assets/js/atomic/blocks/product-elements/price/attributes.ts index d2baa73ae36..0e55f8d0946 100644 --- a/assets/js/atomic/blocks/product-elements/price/attributes.js +++ b/assets/js/atomic/blocks/product-elements/price/attributes.ts @@ -3,7 +3,7 @@ */ import { isFeaturePluginBuild } from '@woocommerce/block-settings'; -let blockAttributes = { +let blockAttributes: Record< string, Record< string, unknown > > = { productId: { type: 'number', default: 0, diff --git a/assets/js/atomic/blocks/product-elements/price/block.js b/assets/js/atomic/blocks/product-elements/price/block.tsx similarity index 91% rename from assets/js/atomic/blocks/product-elements/price/block.js rename to assets/js/atomic/blocks/product-elements/price/block.tsx index d6872ccf635..6c09e5f0b03 100644 --- a/assets/js/atomic/blocks/product-elements/price/block.js +++ b/assets/js/atomic/blocks/product-elements/price/block.tsx @@ -1,7 +1,6 @@ /** * External dependencies */ -import PropTypes from 'prop-types'; import classnames from 'classnames'; import ProductPrice from '@woocommerce/base-components/product-price'; import { getCurrencyFromPriceResponse } from '@woocommerce/price-format'; @@ -11,11 +10,14 @@ import { } from '@woocommerce/shared-context'; import { useColorProps, useTypographyProps } from '@woocommerce/base-hooks'; import { withProductDataContext } from '@woocommerce/shared-hocs'; +import { HTMLAttributes } from 'react'; /** * Internal dependencies */ +import { Attributes } from './types'; +type Props = Attributes & HTMLAttributes< HTMLDivElement >; /** * Product Price Block Component. * @@ -25,7 +27,7 @@ import { withProductDataContext } from '@woocommerce/shared-hocs'; * context will be used if this is not provided. * @return {*} The component. */ -export const Block = ( props ) => { +const Block = ( props: Props ): JSX.Element | null => { const { className, textAlign } = props; const { parentClassName } = useInnerBlockLayoutContext(); const { product } = useProductDataContext(); @@ -83,10 +85,4 @@ export const Block = ( props ) => { ); }; -Block.propTypes = { - className: PropTypes.string, - product: PropTypes.object, - textAlign: PropTypes.oneOf( [ 'left', 'right', 'center' ] ), -}; - export default withProductDataContext( Block ); diff --git a/assets/js/atomic/blocks/product-elements/price/constants.js b/assets/js/atomic/blocks/product-elements/price/constants.tsx similarity index 73% rename from assets/js/atomic/blocks/product-elements/price/constants.js rename to assets/js/atomic/blocks/product-elements/price/constants.tsx index e61f4701306..544becb88aa 100644 --- a/assets/js/atomic/blocks/product-elements/price/constants.js +++ b/assets/js/atomic/blocks/product-elements/price/constants.tsx @@ -4,17 +4,17 @@ import { __ } from '@wordpress/i18n'; import { currencyDollar, Icon } from '@wordpress/icons'; -export const BLOCK_TITLE = __( +export const BLOCK_TITLE: string = __( 'Product Price', 'woo-gutenberg-products-block' ); -export const BLOCK_ICON = ( +export const BLOCK_ICON: JSX.Element = ( ); -export const BLOCK_DESCRIPTION = __( +export const BLOCK_DESCRIPTION: string = __( 'Display the price of a product.', 'woo-gutenberg-products-block' ); diff --git a/assets/js/atomic/blocks/product-elements/price/edit.js b/assets/js/atomic/blocks/product-elements/price/edit.tsx similarity index 65% rename from assets/js/atomic/blocks/product-elements/price/edit.js rename to assets/js/atomic/blocks/product-elements/price/edit.tsx index e0acf021781..f46356ba19e 100644 --- a/assets/js/atomic/blocks/product-elements/price/edit.js +++ b/assets/js/atomic/blocks/product-elements/price/edit.tsx @@ -7,7 +7,6 @@ import { BlockControls, useBlockProps, } from '@wordpress/block-editor'; -import { __ } from '@wordpress/i18n'; import { useEffect } from 'react'; /** @@ -15,9 +14,31 @@ import { useEffect } from 'react'; */ import Block from './block'; import withProductSelector from '../shared/with-product-selector'; -import { BLOCK_TITLE, BLOCK_ICON } from './constants'; +import { + BLOCK_TITLE as label, + BLOCK_ICON as icon, + BLOCK_DESCRIPTION as description, +} from './constants'; + +interface Attributes { + textAlign: 'left' | 'center' | 'right'; +} + +interface Context { + queryId: number; +} + +interface Props { + attributes: Attributes; + setAttributes: ( attributes: Record< string, unknown > ) => void; + context: Context; +} -const PriceEdit = ( { attributes, setAttributes, context } ) => { +const PriceEdit = ( { + attributes, + setAttributes, + context, +}: Props ): JSX.Element => { const blockProps = useBlockProps(); const blockAttrs = { ...attributes, @@ -49,11 +70,4 @@ const PriceEdit = ( { attributes, setAttributes, context } ) => { ); }; -export default withProductSelector( { - icon: BLOCK_ICON, - label: BLOCK_TITLE, - description: __( - 'Choose a product to display its price.', - 'woo-gutenberg-products-block' - ), -} )( PriceEdit ); +export default withProductSelector( { icon, label, description } )( PriceEdit ); diff --git a/assets/js/atomic/blocks/product-elements/price/index.js b/assets/js/atomic/blocks/product-elements/price/index.ts similarity index 91% rename from assets/js/atomic/blocks/product-elements/price/index.js rename to assets/js/atomic/blocks/product-elements/price/index.ts index c677df16713..e0407c6ab42 100644 --- a/assets/js/atomic/blocks/product-elements/price/index.js +++ b/assets/js/atomic/blocks/product-elements/price/index.ts @@ -3,6 +3,7 @@ */ import { isFeaturePluginBuild } from '@woocommerce/block-settings'; import { registerBlockType } from '@wordpress/blocks'; +import type { BlockConfiguration } from '@wordpress/blocks'; /** * Internal dependencies @@ -16,7 +17,7 @@ import { BLOCK_DESCRIPTION as description, } from './constants'; -const blockConfig = { +const blockConfig: BlockConfiguration = { ...sharedConfig, apiVersion: 2, title, diff --git a/assets/js/atomic/blocks/product-elements/price/types.ts b/assets/js/atomic/blocks/product-elements/price/types.ts new file mode 100644 index 00000000000..6eaf7f9342e --- /dev/null +++ b/assets/js/atomic/blocks/product-elements/price/types.ts @@ -0,0 +1,5 @@ +export interface Attributes { + productId: number; + className: string; + textAlign: 'left' | 'center' | 'right'; +} From e53fb671977fbeb0aa9b41446712e8d91cc5d475 Mon Sep 17 00:00:00 2001 From: Niels Lange Date: Mon, 31 Oct 2022 19:36:06 +0700 Subject: [PATCH 02/58] Apply feedback from #7095 to this PR --- .../blocks/product-elements/price/block.tsx | 16 ++++------------ .../blocks/product-elements/price/types.ts | 2 +- 2 files changed, 5 insertions(+), 13 deletions(-) diff --git a/assets/js/atomic/blocks/product-elements/price/block.tsx b/assets/js/atomic/blocks/product-elements/price/block.tsx index 6c09e5f0b03..fa85a8e641d 100644 --- a/assets/js/atomic/blocks/product-elements/price/block.tsx +++ b/assets/js/atomic/blocks/product-elements/price/block.tsx @@ -10,23 +10,15 @@ import { } from '@woocommerce/shared-context'; import { useColorProps, useTypographyProps } from '@woocommerce/base-hooks'; import { withProductDataContext } from '@woocommerce/shared-hocs'; -import { HTMLAttributes } from 'react'; +import type { HTMLAttributes } from 'react'; /** * Internal dependencies */ -import { Attributes } from './types'; +import type { BlockAttributes } from './types'; + +type Props = BlockAttributes & HTMLAttributes< HTMLDivElement >; -type Props = Attributes & HTMLAttributes< HTMLDivElement >; -/** - * Product Price Block Component. - * - * @param {Object} props Incoming props. - * @param {string} [props.className] CSS Class name for the component. - * @param {string} [props.textAlign] Text alignment. - * context will be used if this is not provided. - * @return {*} The component. - */ const Block = ( props: Props ): JSX.Element | null => { const { className, textAlign } = props; const { parentClassName } = useInnerBlockLayoutContext(); diff --git a/assets/js/atomic/blocks/product-elements/price/types.ts b/assets/js/atomic/blocks/product-elements/price/types.ts index 6eaf7f9342e..974c7325cd9 100644 --- a/assets/js/atomic/blocks/product-elements/price/types.ts +++ b/assets/js/atomic/blocks/product-elements/price/types.ts @@ -1,4 +1,4 @@ -export interface Attributes { +export interface BlockAttributes { productId: number; className: string; textAlign: 'left' | 'center' | 'right'; From 64684d4a9d6068aaf8189e5633691c9c08089d20 Mon Sep 17 00:00:00 2001 From: Niels Lange Date: Wed, 2 Nov 2022 15:51:24 +0700 Subject: [PATCH 03/58] Export block due to Cross-Sells dependency --- assets/js/atomic/blocks/product-elements/price/block.tsx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/assets/js/atomic/blocks/product-elements/price/block.tsx b/assets/js/atomic/blocks/product-elements/price/block.tsx index fa85a8e641d..b798fc4dca9 100644 --- a/assets/js/atomic/blocks/product-elements/price/block.tsx +++ b/assets/js/atomic/blocks/product-elements/price/block.tsx @@ -19,7 +19,7 @@ import type { BlockAttributes } from './types'; type Props = BlockAttributes & HTMLAttributes< HTMLDivElement >; -const Block = ( props: Props ): JSX.Element | null => { +export const Block = ( props: Props ): JSX.Element | null => { const { className, textAlign } = props; const { parentClassName } = useInnerBlockLayoutContext(); const { product } = useProductDataContext(); From 1687c433c7e0a4dfd060f6068aed9511980f5faf Mon Sep 17 00:00:00 2001 From: Niels Lange Date: Thu, 3 Nov 2022 11:52:49 +0700 Subject: [PATCH 04/58] Update assets/js/atomic/blocks/product-elements/price/edit.tsx Co-authored-by: Manish Menaria --- assets/js/atomic/blocks/product-elements/price/edit.tsx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/assets/js/atomic/blocks/product-elements/price/edit.tsx b/assets/js/atomic/blocks/product-elements/price/edit.tsx index f46356ba19e..9e0f32361b0 100644 --- a/assets/js/atomic/blocks/product-elements/price/edit.tsx +++ b/assets/js/atomic/blocks/product-elements/price/edit.tsx @@ -30,7 +30,7 @@ interface Context { interface Props { attributes: Attributes; - setAttributes: ( attributes: Record< string, unknown > ) => void; + setAttributes: ( attributes: Partial< BlockAttributes > & Record< string, unknown > ) => void; context: Context; } From 143c111f96c8e27f7dbc2c1f5f74eaec783588e3 Mon Sep 17 00:00:00 2001 From: "github-actions[bot]" <41898282+github-actions[bot]@users.noreply.github.com> Date: Thu, 3 Nov 2022 04:55:59 +0000 Subject: [PATCH 05/58] bot: update checkstyle.xml --- checkstyle.xml | 44 ++++++++++++++++---------------------------- 1 file changed, 16 insertions(+), 28 deletions(-) diff --git a/checkstyle.xml b/checkstyle.xml index f794cc7b3b3..ac103909d19 100644 --- a/checkstyle.xml +++ b/checkstyle.xml @@ -645,7 +645,7 @@ - - - + + - - - + + + @@ -1469,28 +1469,15 @@ Type '{ text: true; background: true; link: false; gradients: true; __experimentalSkipSerialization: true; }' is not assignable to type 'Partial<ColorProps>'. Object literal may only specify known properties, and '__experimentalSkipSerialization' does not exist in type 'Partial<ColorProps>'." source="TS2322" /> - - - - + + - - - - - + + @@ -2404,6 +2391,7 @@ + Date: Thu, 3 Nov 2022 05:09:11 +0000 Subject: [PATCH 08/58] bot: update checkstyle.xml --- checkstyle.xml | 13 +++++++------ 1 file changed, 7 insertions(+), 6 deletions(-) diff --git a/checkstyle.xml b/checkstyle.xml index ac103909d19..37297d5f881 100644 --- a/checkstyle.xml +++ b/checkstyle.xml @@ -1470,14 +1470,15 @@ Object literal may only specify known properties, and '__experimentalSkipSerialization' does not exist in type 'Partial<ColorProps>'." source="TS2322" /> - + - + Type 'Partial<ColorProps> | { text: boolean; background: boolean; link: boolean; __experimentalSkipSerialization: boolean; } | undefined' is not assignable to type 'Partial<ColorProps> | undefined'. + Type '{ text: boolean; background: boolean; link: boolean; __experimentalSkipSerialization: boolean; }' is not assignable to type 'Partial<ColorProps>'. + Types of property 'text' are incompatible. + Type 'boolean' is not assignable to type 'string'." source="TS2322" /> @@ -2391,7 +2392,7 @@ - + ); -export const BLOCK_DESCRIPTION = __( +export const BLOCK_DESCRIPTION: string = __( 'Display the price of a product.', 'woo-gutenberg-products-block' ); diff --git a/assets/js/atomic/blocks/product-elements/price/edit.js b/assets/js/atomic/blocks/product-elements/price/edit.tsx similarity index 51% rename from assets/js/atomic/blocks/product-elements/price/edit.js rename to assets/js/atomic/blocks/product-elements/price/edit.tsx index e0acf021781..90129ca207b 100644 --- a/assets/js/atomic/blocks/product-elements/price/edit.js +++ b/assets/js/atomic/blocks/product-elements/price/edit.tsx @@ -7,17 +7,44 @@ import { BlockControls, useBlockProps, } from '@wordpress/block-editor'; -import { __ } from '@wordpress/i18n'; import { useEffect } from 'react'; +import type { BlockAlignment } from '@wordpress/blocks'; /** * Internal dependencies */ import Block from './block'; import withProductSelector from '../shared/with-product-selector'; -import { BLOCK_TITLE, BLOCK_ICON } from './constants'; +import { BLOCK_TITLE as label, BLOCK_ICON as icon } from './constants'; -const PriceEdit = ( { attributes, setAttributes, context } ) => { +type UnsupportedAligments = 'wide' | 'full'; +type AllowedAlignments = Exclude< BlockAlignment, UnsupportedAligments >; + +interface BlockAttributes { + textAlign?: AllowedAlignments; +} + +interface Attributes { + textAlign: 'left' | 'center' | 'right'; +} + +interface Context { + queryId: number; +} + +interface Props { + attributes: Attributes; + setAttributes: ( + attributes: Partial< BlockAttributes > & Record< string, unknown > + ) => void; + context: Context; +} + +const PriceEdit = ( { + attributes, + setAttributes, + context, +}: Props ): JSX.Element => { const blockProps = useBlockProps(); const blockAttrs = { ...attributes, @@ -36,8 +63,8 @@ const PriceEdit = ( { attributes, setAttributes, context } ) => { { isFeaturePluginBuild() && ( { - setAttributes( { textAlign: newAlign } ); + onChange={ ( textAlign: AllowedAlignments ) => { + setAttributes( { textAlign } ); } } /> ) } @@ -49,11 +76,4 @@ const PriceEdit = ( { attributes, setAttributes, context } ) => { ); }; -export default withProductSelector( { - icon: BLOCK_ICON, - label: BLOCK_TITLE, - description: __( - 'Choose a product to display its price.', - 'woo-gutenberg-products-block' - ), -} )( PriceEdit ); +export default withProductSelector( { icon, label } )( PriceEdit ); diff --git a/assets/js/atomic/blocks/product-elements/price/index.js b/assets/js/atomic/blocks/product-elements/price/index.ts similarity index 56% rename from assets/js/atomic/blocks/product-elements/price/index.js rename to assets/js/atomic/blocks/product-elements/price/index.ts index 8972e727109..9cfc5434ccc 100644 --- a/assets/js/atomic/blocks/product-elements/price/index.js +++ b/assets/js/atomic/blocks/product-elements/price/index.ts @@ -1,8 +1,8 @@ /** * External dependencies */ -import { isFeaturePluginBuild } from '@woocommerce/block-settings'; import { registerBlockType } from '@wordpress/blocks'; +import type { BlockConfiguration } from '@wordpress/blocks'; /** * Internal dependencies @@ -10,13 +10,18 @@ import { registerBlockType } from '@wordpress/blocks'; import sharedConfig from '../shared/config'; import edit from './edit'; import attributes from './attributes'; +import { supports } from './supports'; import { BLOCK_TITLE as title, BLOCK_ICON as icon, BLOCK_DESCRIPTION as description, } from './constants'; -const blockConfig = { +type CustomBlockConfiguration = BlockConfiguration & { + ancestor: string[]; +}; + +const blockConfig: CustomBlockConfiguration = { ...sharedConfig, apiVersion: 2, title, @@ -29,25 +34,8 @@ const blockConfig = { usesContext: [ 'query', 'queryId', 'postId' ], icon: { src: icon }, attributes, + supports, edit, - supports: { - ...sharedConfig.supports, - ...( isFeaturePluginBuild() && { - color: { - text: true, - background: false, - link: false, - __experimentalSkipSerialization: true, - }, - typography: { - fontSize: true, - __experimentalFontWeight: true, - __experimentalFontStyle: true, - __experimentalSkipSerialization: true, - }, - __experimentalSelector: '.wc-block-components-product-price', - } ), - }, }; registerBlockType( 'woocommerce/product-price', blockConfig ); diff --git a/assets/js/atomic/blocks/product-elements/price/supports.ts b/assets/js/atomic/blocks/product-elements/price/supports.ts new file mode 100644 index 00000000000..078b70d46c8 --- /dev/null +++ b/assets/js/atomic/blocks/product-elements/price/supports.ts @@ -0,0 +1,28 @@ +/** + * External dependencies + */ +import { isFeaturePluginBuild } from '@woocommerce/block-settings'; + +/** + * Internal dependencies + */ +import sharedConfig from '../shared/config'; + +export const supports = { + ...sharedConfig.supports, + ...( isFeaturePluginBuild() && { + color: { + text: true, + background: false, + link: false, + __experimentalSkipSerialization: true, + }, + typography: { + fontSize: true, + __experimentalFontWeight: true, + __experimentalFontStyle: true, + __experimentalSkipSerialization: true, + }, + __experimentalSelector: '.wc-block-components-product-price', + } ), +}; diff --git a/assets/js/atomic/blocks/product-elements/price/types.ts b/assets/js/atomic/blocks/product-elements/price/types.ts new file mode 100644 index 00000000000..17e552cfd7d --- /dev/null +++ b/assets/js/atomic/blocks/product-elements/price/types.ts @@ -0,0 +1,6 @@ +export interface BlockAttributes { + productId: number; + className: string; + textAlign: 'left' | 'center' | 'right'; + isDescendentOfQueryLoop: boolean; +} diff --git a/assets/js/base/components/product-price/index.tsx b/assets/js/base/components/product-price/index.tsx index 814aebc7248..6a1bbd8018a 100644 --- a/assets/js/base/components/product-price/index.tsx +++ b/assets/js/base/components/product-price/index.tsx @@ -191,17 +191,17 @@ export interface ProductPriceProps { /** * Currency configuration object */ - currency: Currency | Record< string, never >; + currency?: Currency | Record< string, never >; /** * The string version of the element to use for the price interpolation * * **Note:** It should contain `` (which is also the default value) */ - format: string; + format?: string; /** * The current price */ - price: number | string; + price?: number | string; /** * CSS class for the current price wrapper */ diff --git a/assets/js/shared/context/product-data-context.js b/assets/js/shared/context/product-data-context.js index a81cc16e913..9b2dc5f2a86 100644 --- a/assets/js/shared/context/product-data-context.js +++ b/assets/js/shared/context/product-data-context.js @@ -28,7 +28,10 @@ const defaultProductData = { price: '0', regular_price: '0', sale_price: '0', - price_range: null, + price_range: { + min_amount: '0', + max_amount: '0', + }, }, price_html: '', average_rating: '0', diff --git a/packages/prices/utils/price.ts b/packages/prices/utils/price.ts index 54a7779d744..de00bd8cb80 100644 --- a/packages/prices/utils/price.ts +++ b/packages/prices/utils/price.ts @@ -73,7 +73,7 @@ export const getCurrencyFromPriceResponse = ( // Currency data object, for example an API response containing currency formatting data. currencyData?: | CurrencyResponse - | Record< string, never > + | Record< string, never | unknown > | CartShippingPackageShippingRate ): Currency => { if ( ! currencyData?.currency_code ) { From 239e603d510c2653c1ae6e2a089b314f021e7297 Mon Sep 17 00:00:00 2001 From: "github-actions[bot]" <41898282+github-actions[bot]@users.noreply.github.com> Date: Tue, 15 Nov 2022 06:34:31 +0000 Subject: [PATCH 10/58] bot: update checkstyle.xml --- checkstyle.xml | 56 +++++++++++++++----------------------------------- 1 file changed, 16 insertions(+), 40 deletions(-) diff --git a/checkstyle.xml b/checkstyle.xml index 46b3e0a8e7c..574cfbe444c 100644 --- a/checkstyle.xml +++ b/checkstyle.xml @@ -250,6 +250,9 @@ + + + @@ -266,7 +269,7 @@ Imported via '@woocommerce/price-format' from file '/home/runner/work/woocommerce-blocks/woocommerce-blocks/packages/checkout/components/totals/taxes/index.tsx' Imported via '@woocommerce/price-format' from file '/home/runner/work/woocommerce-blocks/woocommerce-blocks/packages/checkout/components/totals/fees/index.tsx' Imported via '@woocommerce/price-format' from file '/home/runner/work/woocommerce-blocks/woocommerce-blocks/assets/js/base/components/product-price/index.tsx' - Imported via '@woocommerce/price-format' from file '/home/runner/work/woocommerce-blocks/woocommerce-blocks/assets/js/atomic/blocks/product-elements/price/block.js' + Imported via '@woocommerce/price-format' from file '/home/runner/work/woocommerce-blocks/woocommerce-blocks/assets/js/atomic/blocks/product-elements/price/block.tsx' Imported via '@woocommerce/price-format' from file '/home/runner/work/woocommerce-blocks/woocommerce-blocks/assets/js/base/context/hooks/payment-methods/use-payment-method-interface.ts' Imported via '@woocommerce/price-format' from file '/home/runner/work/woocommerce-blocks/woocommerce-blocks/assets/js/base/components/cart-checkout/order-summary/order-summary-item.tsx' Imported via '@woocommerce/price-format' from file '/home/runner/work/woocommerce-blocks/woocommerce-blocks/assets/js/base/components/cart-checkout/product-sale-badge/index.tsx' @@ -753,18 +756,12 @@ No index signature with a parameter of type 'string' was found on type 'Object'." source="TS7053" /> - - - + + + + @@ -1110,16 +1107,6 @@ - - - - - - - @@ -1127,13 +1114,13 @@ - - + + Property 'raw_prices' is missing in type '{ currency_code: string; currency_symbol: string; currency_minor_unit: number; currency_decimal_separator: string; currency_thousand_separator: string; currency_prefix: string; currency_suffix: string; price: string; regular_price: string; sale_price: string; price_range: { ...; }; }' but required in type 'ProductResponseItemPrices'." source="TS2345" /> @@ -1347,15 +1334,6 @@ Type '{ text: true; background: true; link: false; gradients: true; __experimentalSkipSerialization: true; }' is not assignable to type 'Partial<ColorProps>'. Object literal may only specify known properties, and '__experimentalSkipSerialization' does not exist in type 'Partial<ColorProps>'." source="TS2322" /> - - - - - - - - @@ -1422,9 +1400,6 @@ Type 'Readonly<{}>' is not assignable to type 'Record<string, unknown> & { className: string; }'. Property 'className' is missing in type 'Readonly<{}>' but required in type '{ className: string; }'." source="TS2322" /> - - - @@ -2225,6 +2200,7 @@ + Date: Tue, 15 Nov 2022 06:56:46 +0000 Subject: [PATCH 12/58] bot: update checkstyle.xml --- checkstyle.xml | 13 +++++++++---- 1 file changed, 9 insertions(+), 4 deletions(-) diff --git a/checkstyle.xml b/checkstyle.xml index 574cfbe444c..f2833d48d92 100644 --- a/checkstyle.xml +++ b/checkstyle.xml @@ -1107,6 +1107,15 @@ + + + + @@ -2198,10 +2207,6 @@ Overload 2 of 2, '(name: string, settings: BlockConfiguration<{}>): Block<{}> | undefined', gave the following error. Argument of type '{ name: string; version: string; title: string; description: string; category: string; supports: { align: boolean; html: boolean; multiple: boolean; reusable: boolean; inserter: boolean; }; parent: string[]; textdomain: string; apiVersion: number; }' is not assignable to parameter of type 'string'." source="TS2769" /> - - - - Date: Wed, 16 Nov 2022 07:33:00 +0000 Subject: [PATCH 14/58] bot: update checkstyle.xml --- checkstyle.xml | 17 ++++++++++------- 1 file changed, 10 insertions(+), 7 deletions(-) diff --git a/checkstyle.xml b/checkstyle.xml index f6e0947ddff..55ed52edfeb 100644 --- a/checkstyle.xml +++ b/checkstyle.xml @@ -1105,11 +1105,14 @@ - - + @@ -1120,13 +1123,13 @@ - - + + Property 'raw_prices' is missing in type '{ currency_code: string; currency_symbol: string; currency_minor_unit: number; currency_decimal_separator: string; currency_thousand_separator: string; currency_prefix: string; currency_suffix: string; price: string; regular_price: string; sale_price: string; price_range: null; }' but required in type 'ProductResponseItemPrices'." source="TS2345" /> From 4972a431ff0eab051e9541056f6348847c799c8d Mon Sep 17 00:00:00 2001 From: Niels Lange Date: Wed, 16 Nov 2022 14:47:45 +0700 Subject: [PATCH 15/58] Empty-Commit From 31da04f30f10d14f5895167311bf460c04a79ecf Mon Sep 17 00:00:00 2001 From: Niels Lange Date: Wed, 16 Nov 2022 15:59:03 +0700 Subject: [PATCH 16/58] Fix TS problems in product-elements/price/block.tsx --- assets/js/atomic/blocks/product-elements/price/block.tsx | 2 +- assets/js/base/components/product-price/index.tsx | 6 +++--- 2 files changed, 4 insertions(+), 4 deletions(-) diff --git a/assets/js/atomic/blocks/product-elements/price/block.tsx b/assets/js/atomic/blocks/product-elements/price/block.tsx index 52deef25192..4c88551b3bd 100644 --- a/assets/js/atomic/blocks/product-elements/price/block.tsx +++ b/assets/js/atomic/blocks/product-elements/price/block.tsx @@ -62,7 +62,7 @@ export const Block = ( props: Props ): JSX.Element | null => { } const prices: PriceProps = product.prices; - const currency = getCurrencyFromPriceResponse( prices ); + const currency = getCurrencyFromPriceResponse( { ...prices } ); const isOnSale = prices.price !== prices.regular_price; const priceClassName = classnames( { [ `${ parentClassName }__product-price__value` ]: parentClassName, diff --git a/assets/js/base/components/product-price/index.tsx b/assets/js/base/components/product-price/index.tsx index 6a1bbd8018a..bc54bbb206e 100644 --- a/assets/js/base/components/product-price/index.tsx +++ b/assets/js/base/components/product-price/index.tsx @@ -183,7 +183,7 @@ export interface ProductPriceProps { * Applies the `wc-block-components-product-price--align-${ align }` utility * class to the wrapper. */ - align?: 'left' | 'center' | 'right'; + align?: 'left' | 'center' | 'right' | undefined; /** * CSS class for the wrapper */ @@ -216,14 +216,14 @@ export interface ProductPriceProps { * If both `maxPrice` and `minPrice` are set, the component will be rendered * as a `PriceRange` component, otherwise, this value will be ignored. */ - maxPrice?: number | string; + maxPrice?: number | string | undefined; /** * The minimum price in a range * * If both `maxPrice` and `minPrice` are set, the component will be rendered * as a `PriceRange` component, otherwise, this value will be ignored. */ - minPrice?: number | string; + minPrice?: number | string | undefined; /** * The regular price if the item is currently on sale * From 864d6ac047e0ebd429c399c91df5e907b87b7b0b Mon Sep 17 00:00:00 2001 From: "github-actions[bot]" <41898282+github-actions[bot]@users.noreply.github.com> Date: Wed, 16 Nov 2022 09:03:56 +0000 Subject: [PATCH 17/58] bot: update checkstyle.xml --- checkstyle.xml | 12 ------------ 1 file changed, 12 deletions(-) diff --git a/checkstyle.xml b/checkstyle.xml index 55ed52edfeb..6b7a2ab6b44 100644 --- a/checkstyle.xml +++ b/checkstyle.xml @@ -1104,18 +1104,6 @@ - - - - - From cf3d57eb20f02e42d1136b1a9b29504a3a60d2e4 Mon Sep 17 00:00:00 2001 From: Niels Lange Date: Wed, 16 Nov 2022 20:38:47 +0700 Subject: [PATCH 18/58] Solve TS errors --- .../formatted-monetary-amount/index.tsx | 2 +- .../base/components/product-price/index.tsx | 24 +++++++++---------- assets/js/settings/shared/settings-init.ts | 12 ++++++---- packages/prices/utils/price.ts | 2 +- 4 files changed, 22 insertions(+), 18 deletions(-) diff --git a/assets/js/base/components/formatted-monetary-amount/index.tsx b/assets/js/base/components/formatted-monetary-amount/index.tsx index 5c8d4033740..99439193722 100644 --- a/assets/js/base/components/formatted-monetary-amount/index.tsx +++ b/assets/js/base/components/formatted-monetary-amount/index.tsx @@ -24,7 +24,7 @@ interface FormattedMonetaryAmountProps value: number | string; // Value of money amount. currency: Currency | Record< string, never >; // Currency configuration object. onValueChange?: ( unit: number ) => void; // Function to call when value changes. - style?: React.CSSProperties; + style?: React.CSSProperties | undefined; renderText?: ( value: string ) => JSX.Element; } diff --git a/assets/js/base/components/product-price/index.tsx b/assets/js/base/components/product-price/index.tsx index bc54bbb206e..cf4dc87ae74 100644 --- a/assets/js/base/components/product-price/index.tsx +++ b/assets/js/base/components/product-price/index.tsx @@ -31,13 +31,13 @@ interface PriceRangeProps { * * **Note:** this excludes the dash in between the elements */ - priceClassName?: string; + priceClassName?: string | undefined; /** * Any custom style to be applied to each of the elements containing the prices * * **Note:** this excludes the dash in between the elements */ - priceStyle?: React.CSSProperties; + priceStyle?: React.CSSProperties | undefined; } const PriceRange = ( { @@ -95,13 +95,13 @@ interface SalePriceProps { * * i.e. `` element */ - regularPriceClassName?: string; + regularPriceClassName?: string | undefined; /** * Custom style to be applied to the regular price container * * i.e. `` element */ - regularPriceStyle?: React.CSSProperties; + regularPriceStyle?: React.CSSProperties | undefined; /** * The regular price before the sale */ @@ -111,13 +111,13 @@ interface SalePriceProps { * * i.e. `` element */ - priceClassName?: string; + priceClassName?: string | undefined; /** * Custom style to be applied to the regular price container * * i.e. `` element */ - priceStyle?: React.CSSProperties; + priceStyle?: React.CSSProperties | undefined; /** * The new price during the sale */ @@ -183,7 +183,7 @@ export interface ProductPriceProps { * Applies the `wc-block-components-product-price--align-${ align }` utility * class to the wrapper. */ - align?: 'left' | 'center' | 'right' | undefined; + align?: 'left' | 'center' | 'right'; /** * CSS class for the wrapper */ @@ -191,17 +191,17 @@ export interface ProductPriceProps { /** * Currency configuration object */ - currency?: Currency | Record< string, never >; + currency: Currency | Record< string, never >; /** * The string version of the element to use for the price interpolation * * **Note:** It should contain `` (which is also the default value) */ - format?: string; + format: string; /** * The current price */ - price?: number | string; + price: number | string; /** * CSS class for the current price wrapper */ @@ -216,14 +216,14 @@ export interface ProductPriceProps { * If both `maxPrice` and `minPrice` are set, the component will be rendered * as a `PriceRange` component, otherwise, this value will be ignored. */ - maxPrice?: number | string | undefined; + maxPrice?: number | string; /** * The minimum price in a range * * If both `maxPrice` and `minPrice` are set, the component will be rendered * as a `PriceRange` component, otherwise, this value will be ignored. */ - minPrice?: number | string | undefined; + minPrice?: number | string; /** * The regular price if the item is currently on sale * diff --git a/assets/js/settings/shared/settings-init.ts b/assets/js/settings/shared/settings-init.ts index 1f22e0d7938..655a899de28 100644 --- a/assets/js/settings/shared/settings-init.ts +++ b/assets/js/settings/shared/settings-init.ts @@ -1,7 +1,7 @@ /** * External dependencies */ -import { SymbolPosition } from '@woocommerce/type-defs/currency'; +import { SymbolPosition, CurrencyCode } from '@woocommerce/type-defs/currency'; declare global { interface Window { @@ -11,7 +11,7 @@ declare global { export interface WooCommerceSiteCurrency { // The ISO code for the currency. - code: string; + code: CurrencyCode; // The precision (decimal places). precision: number; // The symbol for the currency (eg '$') @@ -84,15 +84,19 @@ const defaults: WooCommerceSharedSettings = { const globalSharedSettings = typeof window.wcSettings === 'object' ? window.wcSettings : {}; +interface AllSettings extends Record< string, unknown > { + currency: WooCommerceSiteCurrency; +} + // Use defaults or global settings, depending on what is set. -const allSettings: Record< string, unknown > = { +const allSettings: AllSettings = { ...defaults, ...globalSharedSettings, }; allSettings.currency = { ...defaults.currency, - ...( allSettings.currency as Record< string, unknown > ), + ...( allSettings.currency as WooCommerceSiteCurrency ), }; allSettings.locale = { diff --git a/packages/prices/utils/price.ts b/packages/prices/utils/price.ts index de00bd8cb80..54a7779d744 100644 --- a/packages/prices/utils/price.ts +++ b/packages/prices/utils/price.ts @@ -73,7 +73,7 @@ export const getCurrencyFromPriceResponse = ( // Currency data object, for example an API response containing currency formatting data. currencyData?: | CurrencyResponse - | Record< string, never | unknown > + | Record< string, never > | CartShippingPackageShippingRate ): Currency => { if ( ! currencyData?.currency_code ) { From 42f1a9e80ae61971cad9c876db608b92687dd7b6 Mon Sep 17 00:00:00 2001 From: "github-actions[bot]" <41898282+github-actions[bot]@users.noreply.github.com> Date: Wed, 16 Nov 2022 13:43:51 +0000 Subject: [PATCH 19/58] bot: update checkstyle.xml --- checkstyle.xml | 30 ++++++++---------------------- 1 file changed, 8 insertions(+), 22 deletions(-) diff --git a/checkstyle.xml b/checkstyle.xml index 72f74925c50..310afbd7ef3 100644 --- a/checkstyle.xml +++ b/checkstyle.xml @@ -240,20 +240,6 @@ Argument of type 'string | BlockConfiguration<{}>' is not assignable to parameter of type 'string'. Type 'BlockConfiguration<{}>' is not assignable to type 'string'." source="TS2769" /> - - - - - - - - - - - - - - @@ -749,14 +735,6 @@ - - - - - - @@ -1101,6 +1079,14 @@ + + + + + From 943e0b1878521f1d84386de24e2866553e7021c7 Mon Sep 17 00:00:00 2001 From: Niels Lange Date: Wed, 16 Nov 2022 21:01:12 +0700 Subject: [PATCH 20/58] Solve TS errors --- .../blocks/product-elements/price/block.tsx | 5 +++-- .../base/components/product-price/index.tsx | 22 +++++++++---------- ...ta-context.js => product-data-context.tsx} | 11 ++++++++-- 3 files changed, 23 insertions(+), 15 deletions(-) rename assets/js/shared/context/{product-data-context.js => product-data-context.tsx} (88%) diff --git a/assets/js/atomic/blocks/product-elements/price/block.tsx b/assets/js/atomic/blocks/product-elements/price/block.tsx index 4c88551b3bd..2e436e19edf 100644 --- a/assets/js/atomic/blocks/product-elements/price/block.tsx +++ b/assets/js/atomic/blocks/product-elements/price/block.tsx @@ -11,6 +11,7 @@ import { import { useColorProps, useTypographyProps } from '@woocommerce/base-hooks'; import { withProductDataContext } from '@woocommerce/shared-hocs'; import type { HTMLAttributes } from 'react'; +import { CurrencyCode } from '@woocommerce/type-defs/currency'; /** * Internal dependencies @@ -20,7 +21,7 @@ import type { BlockAttributes } from './types'; type Props = BlockAttributes & HTMLAttributes< HTMLDivElement >; interface PriceProps { - currency_code: string; + currency_code: CurrencyCode; currency_symbol: string; currency_minor_unit: number; currency_decimal_separator: string; @@ -62,7 +63,7 @@ export const Block = ( props: Props ): JSX.Element | null => { } const prices: PriceProps = product.prices; - const currency = getCurrencyFromPriceResponse( { ...prices } ); + const currency = getCurrencyFromPriceResponse( prices ); const isOnSale = prices.price !== prices.regular_price; const priceClassName = classnames( { [ `${ parentClassName }__product-price__value` ]: parentClassName, diff --git a/assets/js/base/components/product-price/index.tsx b/assets/js/base/components/product-price/index.tsx index cf4dc87ae74..98dd0eb416b 100644 --- a/assets/js/base/components/product-price/index.tsx +++ b/assets/js/base/components/product-price/index.tsx @@ -183,25 +183,25 @@ export interface ProductPriceProps { * Applies the `wc-block-components-product-price--align-${ align }` utility * class to the wrapper. */ - align?: 'left' | 'center' | 'right'; + align?: 'left' | 'center' | 'right' | undefined; /** * CSS class for the wrapper */ - className?: string; + className?: string | undefined; /** * Currency configuration object */ - currency: Currency | Record< string, never >; + currency?: Currency | Record< string, never >; /** * The string version of the element to use for the price interpolation * * **Note:** It should contain `` (which is also the default value) */ - format: string; + format?: string; /** * The current price */ - price: number | string; + price?: number | string; /** * CSS class for the current price wrapper */ @@ -209,36 +209,36 @@ export interface ProductPriceProps { /** * Custom style for the current price */ - priceStyle?: React.CSSProperties; + priceStyle?: React.CSSProperties | undefined; /** * The maximum price in a range * * If both `maxPrice` and `minPrice` are set, the component will be rendered * as a `PriceRange` component, otherwise, this value will be ignored. */ - maxPrice?: number | string; + maxPrice?: number | string | undefined; /** * The minimum price in a range * * If both `maxPrice` and `minPrice` are set, the component will be rendered * as a `PriceRange` component, otherwise, this value will be ignored. */ - minPrice?: number | string; + minPrice?: number | string | undefined; /** * The regular price if the item is currently on sale * * If this property exists and is different from the current price, then the * component will be rendered as a `SalePrice` component. */ - regularPrice?: number | string; + regularPrice?: number | string | undefined; /** * CSS class to apply to the regular price wrapper */ - regularPriceClassName?: string; + regularPriceClassName?: string | undefined; /** * Custom style to apply to the regular price wrapper. */ - regularPriceStyle?: React.CSSProperties; + regularPriceStyle?: React.CSSProperties | undefined; } const ProductPrice = ( { diff --git a/assets/js/shared/context/product-data-context.js b/assets/js/shared/context/product-data-context.tsx similarity index 88% rename from assets/js/shared/context/product-data-context.js rename to assets/js/shared/context/product-data-context.tsx index a81cc16e913..0a95dcc7408 100644 --- a/assets/js/shared/context/product-data-context.js +++ b/assets/js/shared/context/product-data-context.tsx @@ -1,12 +1,13 @@ /** * External dependencies */ +import { ProductResponseItem } from '@woocommerce/types'; import { createContext, useContext } from '@wordpress/element'; /** * Default product shape matching API response. */ -const defaultProductData = { +const defaultProductData: ProductResponseItem = { id: 0, name: '', parent: 0, @@ -67,6 +68,12 @@ const ProductDataContext = createContext( { export const useProductDataContext = () => useContext( ProductDataContext ); +interface ProductDataContextProviderProps { + product: ProductResponseItem | null; + children: JSX.Element; + isLoading: boolean; +} + /** * This context is used to pass product data down to all children blocks in a given tree. * @@ -79,7 +86,7 @@ export const ProductDataContextProvider = ( { product = null, children, isLoading, -} ) => { +}: ProductDataContextProviderProps ) => { const contextValue = { product: product || defaultProductData, isLoading, From e1d9ac4221ef00e085d892ee53ab55efbf9688db Mon Sep 17 00:00:00 2001 From: "github-actions[bot]" <41898282+github-actions[bot]@users.noreply.github.com> Date: Wed, 16 Nov 2022 14:06:12 +0000 Subject: [PATCH 21/58] bot: update checkstyle.xml --- checkstyle.xml | 58 +++++++++++++++++++++++++++++++++----------------- 1 file changed, 39 insertions(+), 19 deletions(-) diff --git a/checkstyle.xml b/checkstyle.xml index 310afbd7ef3..2f0e39b0503 100644 --- a/checkstyle.xml +++ b/checkstyle.xml @@ -735,10 +735,22 @@ + + + + + + + + + + @@ -1079,14 +1091,6 @@ - - - - - @@ -1094,13 +1098,10 @@ - - + @@ -1139,6 +1140,9 @@ + + + @@ -1391,14 +1395,21 @@ + + + + + + + - + - + - + @@ -2169,6 +2180,9 @@ Overload 2 of 2, '(name: string, settings: BlockConfiguration<{}>): Block<{}> | undefined', gave the following error. Argument of type '{ name: string; version: string; title: string; description: string; category: string; supports: { align: boolean; html: boolean; multiple: boolean; reusable: boolean; inserter: boolean; }; parent: string[]; textdomain: string; apiVersion: number; }' is not assignable to parameter of type 'string'." source="TS2769" /> + + + - + @@ -3697,6 +3711,9 @@ + + @@ -3715,6 +3732,9 @@ + + From c310c8f0eac9fcb19639059b1554f52e796e2156 Mon Sep 17 00:00:00 2001 From: Niels Lange Date: Wed, 16 Nov 2022 21:29:44 +0700 Subject: [PATCH 22/58] Solve TS errors --- .../stock-indicator/block.tsx | 2 +- .../formatted-monetary-amount/index.tsx | 19 +++++++++++++------ .../base/components/product-price/index.tsx | 6 +++--- .../shared/context/product-data-context.tsx | 2 +- assets/js/types/type-defs/product-response.ts | 8 +------- 5 files changed, 19 insertions(+), 18 deletions(-) diff --git a/assets/js/atomic/blocks/product-elements/stock-indicator/block.tsx b/assets/js/atomic/blocks/product-elements/stock-indicator/block.tsx index d30c2b7037d..c933a74fe33 100644 --- a/assets/js/atomic/blocks/product-elements/stock-indicator/block.tsx +++ b/assets/js/atomic/blocks/product-elements/stock-indicator/block.tsx @@ -17,7 +17,7 @@ import type { HTMLAttributes } from 'react'; import './style.scss'; import type { BlockAttributes } from './types'; -const lowStockText = ( lowStock: string ): string => { +const lowStockText = ( lowStock: number ): string => { return sprintf( /* translators: %d stock amount (number of items in stock for product) */ __( '%d left in stock', 'woo-gutenberg-products-block' ), diff --git a/assets/js/base/components/formatted-monetary-amount/index.tsx b/assets/js/base/components/formatted-monetary-amount/index.tsx index 99439193722..a6378ab084b 100644 --- a/assets/js/base/components/formatted-monetary-amount/index.tsx +++ b/assets/js/base/components/formatted-monetary-amount/index.tsx @@ -35,16 +35,23 @@ const currencyToNumberFormat = ( currency: FormattedMonetaryAmountProps[ 'currency' ] ) => { return { - thousandSeparator: currency.thousandSeparator, - decimalSeparator: currency.decimalSeparator, - decimalScale: currency.minorUnit, + thousandSeparator: currency?.thousandSeparator, + decimalSeparator: currency?.decimalSeparator, + decimalScale: currency?.minorUnit, fixedDecimalScale: true, - prefix: currency.prefix, - suffix: currency.suffix, + prefix: currency?.prefix, + suffix: currency?.suffix, isNumericString: true, }; }; +type CustomFormattedMonetaryAmountProps = Omit< + FormattedMonetaryAmountProps, + 'currency' +> & { + currency?: Currency | Record< string, never > | undefined; +}; + /** * FormattedMonetaryAmount component. * @@ -57,7 +64,7 @@ const FormattedMonetaryAmount = ( { onValueChange, displayType = 'text', ...props -}: FormattedMonetaryAmountProps ): ReactElement | null => { +}: CustomFormattedMonetaryAmountProps ): ReactElement | null => { const value = typeof rawValue === 'string' ? parseInt( rawValue, 10 ) : rawValue; diff --git a/assets/js/base/components/product-price/index.tsx b/assets/js/base/components/product-price/index.tsx index 98dd0eb416b..bf02a763b89 100644 --- a/assets/js/base/components/product-price/index.tsx +++ b/assets/js/base/components/product-price/index.tsx @@ -17,7 +17,7 @@ interface PriceRangeProps { /** * Currency configuration object */ - currency: Currency | Record< string, never >; + currency: Currency | Record< string, never > | undefined; /** * The maximum price for the range */ @@ -89,7 +89,7 @@ interface SalePriceProps { /** * Currency configuration object */ - currency: Currency | Record< string, never >; + currency: Currency | Record< string, never > | undefined; /** * CSS class to be applied to the regular price container * @@ -121,7 +121,7 @@ interface SalePriceProps { /** * The new price during the sale */ - price: number | string; + price: number | string | undefined; } const SalePrice = ( { diff --git a/assets/js/shared/context/product-data-context.tsx b/assets/js/shared/context/product-data-context.tsx index 0a95dcc7408..deb6f2d8d0e 100644 --- a/assets/js/shared/context/product-data-context.tsx +++ b/assets/js/shared/context/product-data-context.tsx @@ -70,7 +70,7 @@ export const useProductDataContext = () => useContext( ProductDataContext ); interface ProductDataContextProviderProps { product: ProductResponseItem | null; - children: JSX.Element; + children: JSX.Element | JSX.Element[]; isLoading: boolean; } diff --git a/assets/js/types/type-defs/product-response.ts b/assets/js/types/type-defs/product-response.ts index c12ae4b1a2f..f875cf42eee 100644 --- a/assets/js/types/type-defs/product-response.ts +++ b/assets/js/types/type-defs/product-response.ts @@ -8,12 +8,6 @@ export interface ProductResponseItemPrices extends CurrencyResponse { regular_price: string; sale_price: string; price_range: null | { min_amount: string; max_amount: string }; - raw_prices: { - precision: number; - price: string; - regular_price: string; - sale_price: string; - }; } export interface ProductResponseItemBaseData { @@ -74,7 +68,7 @@ export interface ProductResponseItem { on_sale: boolean; prices: ProductResponseItemPrices; price_html: string; - average_rating: number; + average_rating: string; review_count: number; images: Array< ProductResponseImageItem >; categories: Array< ProductResponseTermItem >; From 6dd5afbc6acc9210e13e45a163be3601878f487b Mon Sep 17 00:00:00 2001 From: "github-actions[bot]" <41898282+github-actions[bot]@users.noreply.github.com> Date: Wed, 16 Nov 2022 14:33:12 +0000 Subject: [PATCH 23/58] bot: update checkstyle.xml --- checkstyle.xml | 54 +++++++++++++++++++++++--------------------------- 1 file changed, 25 insertions(+), 29 deletions(-) diff --git a/checkstyle.xml b/checkstyle.xml index 2f0e39b0503..9b55ec5ba15 100644 --- a/checkstyle.xml +++ b/checkstyle.xml @@ -240,6 +240,12 @@ Argument of type 'string | BlockConfiguration<{}>' is not assignable to parameter of type 'string'. Type 'BlockConfiguration<{}>' is not assignable to type 'string'." source="TS2769" /> + + + + + @@ -646,12 +652,24 @@ - - - - - - + + + + + + + + + + + + @@ -736,21 +754,13 @@ No index signature with a parameter of type 'string' was found on type 'Object'." source="TS7053" /> - - - - - - - - @@ -1097,12 +1107,6 @@ - - - @@ -1140,9 +1144,6 @@ - - - @@ -2180,9 +2181,6 @@ Overload 2 of 2, '(name: string, settings: BlockConfiguration<{}>): Block<{}> | undefined', gave the following error. Argument of type '{ name: string; version: string; title: string; description: string; category: string; supports: { align: boolean; html: boolean; multiple: boolean; reusable: boolean; inserter: boolean; }; parent: string[]; textdomain: string; apiVersion: number; }' is not assignable to parameter of type 'string'." source="TS2769" /> - - - - @@ -3732,7 +3729,6 @@ - Date: Fri, 18 Nov 2022 06:58:49 +0000 Subject: [PATCH 24/58] bot: update checkstyle.xml --- checkstyle.xml | 62 +++----------------------------------------------- 1 file changed, 3 insertions(+), 59 deletions(-) diff --git a/checkstyle.xml b/checkstyle.xml index ee08ad5f111..0eba81a24d0 100644 --- a/checkstyle.xml +++ b/checkstyle.xml @@ -1094,30 +1094,6 @@ - - - - - - - - - - - - - - - - @@ -1330,37 +1306,6 @@ Type '{ text: true; background: true; link: false; gradients: true; __experimentalSkipSerialization: true; }' is not assignable to type 'Partial<ColorProps>'. Object literal may only specify known properties, and '__experimentalSkipSerialization' does not exist in type 'Partial<ColorProps>'." source="TS2322" /> - - - - - - - - - - - - - - - - - - - @@ -1417,10 +1362,10 @@ - - - + + + @@ -2198,7 +2143,6 @@ Argument of type 'string' is not assignable to parameter of type 'BlockConfiguration<{}>'. Type 'string' is not assignable to type 'Pick<Block<{}>, "title" | "category" | "attributes">'. Overload 2 of 2, '(name: string, settings: BlockConfiguration<{}>): Block<{}> | undefined', gave the following error. - Argument of type '{ name: string; version: string; title: string; description: string; category: string; supports: { align: boolean; html: boolean; multiple: boolean; reusable: boolean; inserter: boolean; }; parent: string[]; textdomain: string; apiVersion: number; }' is not assignable to parameter of type 'string'." source="TS2769" /> Argument of type '{ icon: { src: JSX.Element; }; edit: () => JSX.Element; save: () => JSX.Element; }' is not assignable to parameter of type 'BlockConfiguration<{}>'. Type '{ icon: { src: Element; }; edit: () => Element; save: () => Element; }' is missing the following properties from type 'Pick<Block<{}>, "title" | "category" | "attributes">': title, category, attributes" source="TS2769" /> From 272b7c9f23e633b0281abc3e3aa87b28728d6c91 Mon Sep 17 00:00:00 2001 From: Niels Lange Date: Tue, 15 Nov 2022 13:20:29 +0700 Subject: [PATCH 25/58] Resolve merge conflicts --- .../price/{attributes.js => attributes.ts} | 16 ++++++- .../price/{block.js => block.tsx} | 15 ++---- .../price/{constants.js => constants.tsx} | 6 +-- .../price/{edit.js => edit.tsx} | 46 +++++++++++++------ .../price/{index.js => index.ts} | 28 ++++------- .../blocks/product-elements/price/supports.ts | 28 +++++++++++ .../blocks/product-elements/price/types.ts | 6 +++ .../base/components/product-price/index.tsx | 6 +-- .../js/shared/context/product-data-context.js | 5 +- packages/prices/utils/price.ts | 2 +- 10 files changed, 106 insertions(+), 52 deletions(-) rename assets/js/atomic/blocks/product-elements/price/{attributes.js => attributes.ts} (62%) rename assets/js/atomic/blocks/product-elements/price/{block.js => block.tsx} (86%) rename assets/js/atomic/blocks/product-elements/price/{constants.js => constants.tsx} (73%) rename assets/js/atomic/blocks/product-elements/price/{edit.js => edit.tsx} (51%) rename assets/js/atomic/blocks/product-elements/price/{index.js => index.ts} (56%) create mode 100644 assets/js/atomic/blocks/product-elements/price/supports.ts create mode 100644 assets/js/atomic/blocks/product-elements/price/types.ts diff --git a/assets/js/atomic/blocks/product-elements/price/attributes.js b/assets/js/atomic/blocks/product-elements/price/attributes.ts similarity index 62% rename from assets/js/atomic/blocks/product-elements/price/attributes.js rename to assets/js/atomic/blocks/product-elements/price/attributes.ts index d2baa73ae36..8e06eeb3e34 100644 --- a/assets/js/atomic/blocks/product-elements/price/attributes.js +++ b/assets/js/atomic/blocks/product-elements/price/attributes.ts @@ -3,7 +3,21 @@ */ import { isFeaturePluginBuild } from '@woocommerce/block-settings'; -let blockAttributes = { +interface BlockAttributes { + productId: { + type: string; + default: number; + }; + isDescendentOfQueryLoop: { + type: string; + default: boolean; + }; + textAlign?: { + type: string; + }; +} + +let blockAttributes: BlockAttributes = { productId: { type: 'number', default: 0, diff --git a/assets/js/atomic/blocks/product-elements/price/block.js b/assets/js/atomic/blocks/product-elements/price/block.tsx similarity index 86% rename from assets/js/atomic/blocks/product-elements/price/block.js rename to assets/js/atomic/blocks/product-elements/price/block.tsx index d6872ccf635..93b6b424fd5 100644 --- a/assets/js/atomic/blocks/product-elements/price/block.js +++ b/assets/js/atomic/blocks/product-elements/price/block.tsx @@ -11,21 +11,16 @@ import { } from '@woocommerce/shared-context'; import { useColorProps, useTypographyProps } from '@woocommerce/base-hooks'; import { withProductDataContext } from '@woocommerce/shared-hocs'; +import type { HTMLAttributes } from 'react'; /** * Internal dependencies */ +import type { BlockAttributes } from './types'; -/** - * Product Price Block Component. - * - * @param {Object} props Incoming props. - * @param {string} [props.className] CSS Class name for the component. - * @param {string} [props.textAlign] Text alignment. - * context will be used if this is not provided. - * @return {*} The component. - */ -export const Block = ( props ) => { +type Props = BlockAttributes & HTMLAttributes< HTMLDivElement >; + +export const Block = ( props: Props ): JSX.Element | null => { const { className, textAlign } = props; const { parentClassName } = useInnerBlockLayoutContext(); const { product } = useProductDataContext(); diff --git a/assets/js/atomic/blocks/product-elements/price/constants.js b/assets/js/atomic/blocks/product-elements/price/constants.tsx similarity index 73% rename from assets/js/atomic/blocks/product-elements/price/constants.js rename to assets/js/atomic/blocks/product-elements/price/constants.tsx index e61f4701306..544becb88aa 100644 --- a/assets/js/atomic/blocks/product-elements/price/constants.js +++ b/assets/js/atomic/blocks/product-elements/price/constants.tsx @@ -4,17 +4,17 @@ import { __ } from '@wordpress/i18n'; import { currencyDollar, Icon } from '@wordpress/icons'; -export const BLOCK_TITLE = __( +export const BLOCK_TITLE: string = __( 'Product Price', 'woo-gutenberg-products-block' ); -export const BLOCK_ICON = ( +export const BLOCK_ICON: JSX.Element = ( ); -export const BLOCK_DESCRIPTION = __( +export const BLOCK_DESCRIPTION: string = __( 'Display the price of a product.', 'woo-gutenberg-products-block' ); diff --git a/assets/js/atomic/blocks/product-elements/price/edit.js b/assets/js/atomic/blocks/product-elements/price/edit.tsx similarity index 51% rename from assets/js/atomic/blocks/product-elements/price/edit.js rename to assets/js/atomic/blocks/product-elements/price/edit.tsx index e0acf021781..90129ca207b 100644 --- a/assets/js/atomic/blocks/product-elements/price/edit.js +++ b/assets/js/atomic/blocks/product-elements/price/edit.tsx @@ -7,17 +7,44 @@ import { BlockControls, useBlockProps, } from '@wordpress/block-editor'; -import { __ } from '@wordpress/i18n'; import { useEffect } from 'react'; +import type { BlockAlignment } from '@wordpress/blocks'; /** * Internal dependencies */ import Block from './block'; import withProductSelector from '../shared/with-product-selector'; -import { BLOCK_TITLE, BLOCK_ICON } from './constants'; +import { BLOCK_TITLE as label, BLOCK_ICON as icon } from './constants'; -const PriceEdit = ( { attributes, setAttributes, context } ) => { +type UnsupportedAligments = 'wide' | 'full'; +type AllowedAlignments = Exclude< BlockAlignment, UnsupportedAligments >; + +interface BlockAttributes { + textAlign?: AllowedAlignments; +} + +interface Attributes { + textAlign: 'left' | 'center' | 'right'; +} + +interface Context { + queryId: number; +} + +interface Props { + attributes: Attributes; + setAttributes: ( + attributes: Partial< BlockAttributes > & Record< string, unknown > + ) => void; + context: Context; +} + +const PriceEdit = ( { + attributes, + setAttributes, + context, +}: Props ): JSX.Element => { const blockProps = useBlockProps(); const blockAttrs = { ...attributes, @@ -36,8 +63,8 @@ const PriceEdit = ( { attributes, setAttributes, context } ) => { { isFeaturePluginBuild() && ( { - setAttributes( { textAlign: newAlign } ); + onChange={ ( textAlign: AllowedAlignments ) => { + setAttributes( { textAlign } ); } } /> ) } @@ -49,11 +76,4 @@ const PriceEdit = ( { attributes, setAttributes, context } ) => { ); }; -export default withProductSelector( { - icon: BLOCK_ICON, - label: BLOCK_TITLE, - description: __( - 'Choose a product to display its price.', - 'woo-gutenberg-products-block' - ), -} )( PriceEdit ); +export default withProductSelector( { icon, label } )( PriceEdit ); diff --git a/assets/js/atomic/blocks/product-elements/price/index.js b/assets/js/atomic/blocks/product-elements/price/index.ts similarity index 56% rename from assets/js/atomic/blocks/product-elements/price/index.js rename to assets/js/atomic/blocks/product-elements/price/index.ts index 8972e727109..9cfc5434ccc 100644 --- a/assets/js/atomic/blocks/product-elements/price/index.js +++ b/assets/js/atomic/blocks/product-elements/price/index.ts @@ -1,8 +1,8 @@ /** * External dependencies */ -import { isFeaturePluginBuild } from '@woocommerce/block-settings'; import { registerBlockType } from '@wordpress/blocks'; +import type { BlockConfiguration } from '@wordpress/blocks'; /** * Internal dependencies @@ -10,13 +10,18 @@ import { registerBlockType } from '@wordpress/blocks'; import sharedConfig from '../shared/config'; import edit from './edit'; import attributes from './attributes'; +import { supports } from './supports'; import { BLOCK_TITLE as title, BLOCK_ICON as icon, BLOCK_DESCRIPTION as description, } from './constants'; -const blockConfig = { +type CustomBlockConfiguration = BlockConfiguration & { + ancestor: string[]; +}; + +const blockConfig: CustomBlockConfiguration = { ...sharedConfig, apiVersion: 2, title, @@ -29,25 +34,8 @@ const blockConfig = { usesContext: [ 'query', 'queryId', 'postId' ], icon: { src: icon }, attributes, + supports, edit, - supports: { - ...sharedConfig.supports, - ...( isFeaturePluginBuild() && { - color: { - text: true, - background: false, - link: false, - __experimentalSkipSerialization: true, - }, - typography: { - fontSize: true, - __experimentalFontWeight: true, - __experimentalFontStyle: true, - __experimentalSkipSerialization: true, - }, - __experimentalSelector: '.wc-block-components-product-price', - } ), - }, }; registerBlockType( 'woocommerce/product-price', blockConfig ); diff --git a/assets/js/atomic/blocks/product-elements/price/supports.ts b/assets/js/atomic/blocks/product-elements/price/supports.ts new file mode 100644 index 00000000000..078b70d46c8 --- /dev/null +++ b/assets/js/atomic/blocks/product-elements/price/supports.ts @@ -0,0 +1,28 @@ +/** + * External dependencies + */ +import { isFeaturePluginBuild } from '@woocommerce/block-settings'; + +/** + * Internal dependencies + */ +import sharedConfig from '../shared/config'; + +export const supports = { + ...sharedConfig.supports, + ...( isFeaturePluginBuild() && { + color: { + text: true, + background: false, + link: false, + __experimentalSkipSerialization: true, + }, + typography: { + fontSize: true, + __experimentalFontWeight: true, + __experimentalFontStyle: true, + __experimentalSkipSerialization: true, + }, + __experimentalSelector: '.wc-block-components-product-price', + } ), +}; diff --git a/assets/js/atomic/blocks/product-elements/price/types.ts b/assets/js/atomic/blocks/product-elements/price/types.ts new file mode 100644 index 00000000000..17e552cfd7d --- /dev/null +++ b/assets/js/atomic/blocks/product-elements/price/types.ts @@ -0,0 +1,6 @@ +export interface BlockAttributes { + productId: number; + className: string; + textAlign: 'left' | 'center' | 'right'; + isDescendentOfQueryLoop: boolean; +} diff --git a/assets/js/base/components/product-price/index.tsx b/assets/js/base/components/product-price/index.tsx index 814aebc7248..6a1bbd8018a 100644 --- a/assets/js/base/components/product-price/index.tsx +++ b/assets/js/base/components/product-price/index.tsx @@ -191,17 +191,17 @@ export interface ProductPriceProps { /** * Currency configuration object */ - currency: Currency | Record< string, never >; + currency?: Currency | Record< string, never >; /** * The string version of the element to use for the price interpolation * * **Note:** It should contain `` (which is also the default value) */ - format: string; + format?: string; /** * The current price */ - price: number | string; + price?: number | string; /** * CSS class for the current price wrapper */ diff --git a/assets/js/shared/context/product-data-context.js b/assets/js/shared/context/product-data-context.js index a81cc16e913..9b2dc5f2a86 100644 --- a/assets/js/shared/context/product-data-context.js +++ b/assets/js/shared/context/product-data-context.js @@ -28,7 +28,10 @@ const defaultProductData = { price: '0', regular_price: '0', sale_price: '0', - price_range: null, + price_range: { + min_amount: '0', + max_amount: '0', + }, }, price_html: '', average_rating: '0', diff --git a/packages/prices/utils/price.ts b/packages/prices/utils/price.ts index 54a7779d744..de00bd8cb80 100644 --- a/packages/prices/utils/price.ts +++ b/packages/prices/utils/price.ts @@ -73,7 +73,7 @@ export const getCurrencyFromPriceResponse = ( // Currency data object, for example an API response containing currency formatting data. currencyData?: | CurrencyResponse - | Record< string, never > + | Record< string, never | unknown > | CartShippingPackageShippingRate ): Currency => { if ( ! currencyData?.currency_code ) { From de87d05da6bf5bc43b3d669de76d51d7d0213161 Mon Sep 17 00:00:00 2001 From: Niels Lange Date: Fri, 18 Nov 2022 14:16:38 +0700 Subject: [PATCH 26/58] Convert product-element/price to TypeScript --- .../blocks/product-elements/price/block.tsx | 24 ++++++++++++------- assets/js/settings/shared/settings-init.ts | 12 ++++++---- 2 files changed, 24 insertions(+), 12 deletions(-) diff --git a/assets/js/atomic/blocks/product-elements/price/block.tsx b/assets/js/atomic/blocks/product-elements/price/block.tsx index 93b6b424fd5..2e436e19edf 100644 --- a/assets/js/atomic/blocks/product-elements/price/block.tsx +++ b/assets/js/atomic/blocks/product-elements/price/block.tsx @@ -1,7 +1,6 @@ /** * External dependencies */ -import PropTypes from 'prop-types'; import classnames from 'classnames'; import ProductPrice from '@woocommerce/base-components/product-price'; import { getCurrencyFromPriceResponse } from '@woocommerce/price-format'; @@ -12,6 +11,7 @@ import { import { useColorProps, useTypographyProps } from '@woocommerce/base-hooks'; import { withProductDataContext } from '@woocommerce/shared-hocs'; import type { HTMLAttributes } from 'react'; +import { CurrencyCode } from '@woocommerce/type-defs/currency'; /** * Internal dependencies @@ -20,6 +20,20 @@ import type { BlockAttributes } from './types'; type Props = BlockAttributes & HTMLAttributes< HTMLDivElement >; +interface PriceProps { + currency_code: CurrencyCode; + currency_symbol: string; + currency_minor_unit: number; + currency_decimal_separator: string; + currency_thousand_separator: string; + currency_prefix: string; + currency_suffix: string; + price: string; + regular_price: string; + sale_price: string; + price_range: null | { min_amount: string; max_amount: string }; +} + export const Block = ( props: Props ): JSX.Element | null => { const { className, textAlign } = props; const { parentClassName } = useInnerBlockLayoutContext(); @@ -48,7 +62,7 @@ export const Block = ( props: Props ): JSX.Element | null => { ); } - const prices = product.prices; + const prices: PriceProps = product.prices; const currency = getCurrencyFromPriceResponse( prices ); const isOnSale = prices.price !== prices.regular_price; const priceClassName = classnames( { @@ -78,10 +92,4 @@ export const Block = ( props: Props ): JSX.Element | null => { ); }; -Block.propTypes = { - className: PropTypes.string, - product: PropTypes.object, - textAlign: PropTypes.oneOf( [ 'left', 'right', 'center' ] ), -}; - export default withProductDataContext( Block ); diff --git a/assets/js/settings/shared/settings-init.ts b/assets/js/settings/shared/settings-init.ts index 1f22e0d7938..655a899de28 100644 --- a/assets/js/settings/shared/settings-init.ts +++ b/assets/js/settings/shared/settings-init.ts @@ -1,7 +1,7 @@ /** * External dependencies */ -import { SymbolPosition } from '@woocommerce/type-defs/currency'; +import { SymbolPosition, CurrencyCode } from '@woocommerce/type-defs/currency'; declare global { interface Window { @@ -11,7 +11,7 @@ declare global { export interface WooCommerceSiteCurrency { // The ISO code for the currency. - code: string; + code: CurrencyCode; // The precision (decimal places). precision: number; // The symbol for the currency (eg '$') @@ -84,15 +84,19 @@ const defaults: WooCommerceSharedSettings = { const globalSharedSettings = typeof window.wcSettings === 'object' ? window.wcSettings : {}; +interface AllSettings extends Record< string, unknown > { + currency: WooCommerceSiteCurrency; +} + // Use defaults or global settings, depending on what is set. -const allSettings: Record< string, unknown > = { +const allSettings: AllSettings = { ...defaults, ...globalSharedSettings, }; allSettings.currency = { ...defaults.currency, - ...( allSettings.currency as Record< string, unknown > ), + ...( allSettings.currency as WooCommerceSiteCurrency ), }; allSettings.locale = { From f1789ce229a4d1678834e8ee013bb894abc18f7b Mon Sep 17 00:00:00 2001 From: Niels Lange Date: Fri, 18 Nov 2022 14:17:33 +0700 Subject: [PATCH 27/58] Apply feedback from #7095 to this PR From 6fc405b7eb630597dc3fb64683411614e8a5aeb3 Mon Sep 17 00:00:00 2001 From: Niels Lange Date: Fri, 18 Nov 2022 14:17:47 +0700 Subject: [PATCH 28/58] Export block due to Cross-Sells dependency From 48607ed66c0476ee2382874722cebaee8045d9ee Mon Sep 17 00:00:00 2001 From: Niels Lange Date: Fri, 18 Nov 2022 14:18:05 +0700 Subject: [PATCH 29/58] Apply review feedback From 96e2f1a9d82d4a394ec0f9c247acd0313f4d5722 Mon Sep 17 00:00:00 2001 From: Niels Lange Date: Fri, 18 Nov 2022 14:18:16 +0700 Subject: [PATCH 30/58] Update assets/js/atomic/blocks/product-elements/price/edit.tsx Co-authored-by: Manish Menaria From b0dc7c392bffcc11fe26549282ae9ebf000bd512 Mon Sep 17 00:00:00 2001 From: Niels Lange Date: Fri, 18 Nov 2022 14:18:27 +0700 Subject: [PATCH 31/58] bot: update checkstyle.xml From a27b66d48d3f15aef73e476ab12feaa5090c8e3b Mon Sep 17 00:00:00 2001 From: Niels Lange Date: Fri, 18 Nov 2022 14:18:33 +0700 Subject: [PATCH 32/58] bot: update checkstyle.xml From bc901de00de335d2aa1f864c8203e41acadace33 Mon Sep 17 00:00:00 2001 From: Niels Lange Date: Tue, 15 Nov 2022 13:51:25 +0700 Subject: [PATCH 33/58] Solve TS error in cart-cross-sells-product.tsx --- assets/js/atomic/blocks/product-elements/price/types.ts | 8 ++++---- .../js/atomic/blocks/product-elements/sale-badge/types.ts | 4 ++-- 2 files changed, 6 insertions(+), 6 deletions(-) diff --git a/assets/js/atomic/blocks/product-elements/price/types.ts b/assets/js/atomic/blocks/product-elements/price/types.ts index 17e552cfd7d..81631b9698e 100644 --- a/assets/js/atomic/blocks/product-elements/price/types.ts +++ b/assets/js/atomic/blocks/product-elements/price/types.ts @@ -1,6 +1,6 @@ export interface BlockAttributes { - productId: number; - className: string; - textAlign: 'left' | 'center' | 'right'; - isDescendentOfQueryLoop: boolean; + productId?: number; + className?: string; + textAlign?: 'left' | 'center' | 'right'; + isDescendentOfQueryLoop?: boolean; } diff --git a/assets/js/atomic/blocks/product-elements/sale-badge/types.ts b/assets/js/atomic/blocks/product-elements/sale-badge/types.ts index a95b28e08e9..f81f3b00f43 100644 --- a/assets/js/atomic/blocks/product-elements/sale-badge/types.ts +++ b/assets/js/atomic/blocks/product-elements/sale-badge/types.ts @@ -1,4 +1,4 @@ export interface BlockAttributes { - productId: number; - align: 'left' | 'center' | 'right'; + productId?: number; + align?: 'left' | 'center' | 'right'; } From 3f8be3fe6ffead67c37fa1a21620fcbe129a69b2 Mon Sep 17 00:00:00 2001 From: Niels Lange Date: Fri, 18 Nov 2022 14:18:42 +0700 Subject: [PATCH 34/58] bot: update checkstyle.xml From 250b5619f1a42eb8164950280728d7b078ec85d3 Mon Sep 17 00:00:00 2001 From: Niels Lange Date: Fri, 18 Nov 2022 14:18:48 +0700 Subject: [PATCH 35/58] bot: update checkstyle.xml From 7bf8194749b212119c2fc209d0bd62f19e317654 Mon Sep 17 00:00:00 2001 From: Niels Lange Date: Fri, 18 Nov 2022 14:19:13 +0700 Subject: [PATCH 36/58] Solve TS error regarding min_amount and max_amount --- assets/js/shared/context/product-data-context.js | 5 +---- 1 file changed, 1 insertion(+), 4 deletions(-) diff --git a/assets/js/shared/context/product-data-context.js b/assets/js/shared/context/product-data-context.js index 9b2dc5f2a86..a81cc16e913 100644 --- a/assets/js/shared/context/product-data-context.js +++ b/assets/js/shared/context/product-data-context.js @@ -28,10 +28,7 @@ const defaultProductData = { price: '0', regular_price: '0', sale_price: '0', - price_range: { - min_amount: '0', - max_amount: '0', - }, + price_range: null, }, price_html: '', average_rating: '0', From a4efbd21f7ef25a759e9c46f2354e72966f8db71 Mon Sep 17 00:00:00 2001 From: Niels Lange Date: Wed, 16 Nov 2022 14:47:45 +0700 Subject: [PATCH 37/58] Empty-Commit From 30bd5b35e5afeff5b39daec184289929ea63526d Mon Sep 17 00:00:00 2001 From: Niels Lange Date: Fri, 18 Nov 2022 14:19:32 +0700 Subject: [PATCH 38/58] bot: update checkstyle.xml From f8d870ba14bd60b24a63a64a7d5413a6e4041edb Mon Sep 17 00:00:00 2001 From: Niels Lange Date: Wed, 16 Nov 2022 15:59:03 +0700 Subject: [PATCH 39/58] Fix TS problems in product-elements/price/block.tsx --- assets/js/atomic/blocks/product-elements/price/block.tsx | 2 +- assets/js/base/components/product-price/index.tsx | 6 +++--- 2 files changed, 4 insertions(+), 4 deletions(-) diff --git a/assets/js/atomic/blocks/product-elements/price/block.tsx b/assets/js/atomic/blocks/product-elements/price/block.tsx index 2e436e19edf..42c7f20567d 100644 --- a/assets/js/atomic/blocks/product-elements/price/block.tsx +++ b/assets/js/atomic/blocks/product-elements/price/block.tsx @@ -63,7 +63,7 @@ export const Block = ( props: Props ): JSX.Element | null => { } const prices: PriceProps = product.prices; - const currency = getCurrencyFromPriceResponse( prices ); + const currency = getCurrencyFromPriceResponse( { ...prices } ); const isOnSale = prices.price !== prices.regular_price; const priceClassName = classnames( { [ `${ parentClassName }__product-price__value` ]: parentClassName, diff --git a/assets/js/base/components/product-price/index.tsx b/assets/js/base/components/product-price/index.tsx index 6a1bbd8018a..bc54bbb206e 100644 --- a/assets/js/base/components/product-price/index.tsx +++ b/assets/js/base/components/product-price/index.tsx @@ -183,7 +183,7 @@ export interface ProductPriceProps { * Applies the `wc-block-components-product-price--align-${ align }` utility * class to the wrapper. */ - align?: 'left' | 'center' | 'right'; + align?: 'left' | 'center' | 'right' | undefined; /** * CSS class for the wrapper */ @@ -216,14 +216,14 @@ export interface ProductPriceProps { * If both `maxPrice` and `minPrice` are set, the component will be rendered * as a `PriceRange` component, otherwise, this value will be ignored. */ - maxPrice?: number | string; + maxPrice?: number | string | undefined; /** * The minimum price in a range * * If both `maxPrice` and `minPrice` are set, the component will be rendered * as a `PriceRange` component, otherwise, this value will be ignored. */ - minPrice?: number | string; + minPrice?: number | string | undefined; /** * The regular price if the item is currently on sale * From 787d4b8e8f97cb3a9924e446bcb90df336b64d51 Mon Sep 17 00:00:00 2001 From: Niels Lange Date: Fri, 18 Nov 2022 14:21:09 +0700 Subject: [PATCH 40/58] bot: update checkstyle.xml --- checkstyle.xml | 8 ++++++++ 1 file changed, 8 insertions(+) diff --git a/checkstyle.xml b/checkstyle.xml index cf75274f51d..82ed8d23468 100644 --- a/checkstyle.xml +++ b/checkstyle.xml @@ -1097,6 +1097,7 @@ +<<<<<<< HEAD +======= + + + + + +>>>>>>> 864d6ac04 (bot: update checkstyle.xml) - - - - - + + + + - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + - - - - - + + + - - - + + - - - - - - - - + + + + + + + - - - + - - - - - - - - - - - - - - - - - - - - - - + + + + + + + + + + + + + + + + + + + - - - - + + - - - - - - - - - - - - + + + + + + + + + + - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + - - - - - - - - - - - - - - - - - - - - - - - - + + + + + + + + + + + + + + + + + + + + + - - - - + + + - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + - - - - - - - + + + + - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + - - - - - - - - + + + + + + + - - - - - - - + + + + + - - - - + - - - - - - - - - - + + + + + - - - - - - - - - - - - - - - - + + + + + + + + + + + + + + + - - - - - - - - - - - - - - - - - - - + + + + + + + + + + + + + + + + + + - - - - - - - - - - - + + + + + + + + + - - - - - + + + - - - - - - - - - - - - - - - - - - - - - - - - - - - + + + + + + + + + + + + + + + + + + + + + + + + + + - - - - - - - - - - - - - + + + + + + + + + + + - - - + - - - - - - + + + + - - - - + + + - - - - + + - - - - - - - + - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + - - - - - - - + + + + + + - - - - - - - - - - - - - - + + + + + + + + + + + + + - - - - + + - - - - - - - - - - + + + + + + + + - - - - - - - - - - - - - - - - + + + + + + + + + + + + + + - - - - - - - - - - - - - + + + + + + + + + + + + - - - - - - - - - - - - - + + + + + + + + + + + - - - - - - - - + + + + + + + - - + - - - - - - - - - - - - - - - - - - - + + + + + + + + + + + + + + + + + - - - - - - - - + - - - + + - - - - + - - + - - + - - + - - - + + - - + - - - - + + + - - - - - - + + + + + - - + - - + - - + - - - + + - - - - + + + - - - - - - + + + + + - - + - - + - - + - - + - - + - - + - - - - - - - - - - + + + + + + + + - - + - - + - - - - + - - - + - - - + - - - + - - + - - - - - - - - - - - - - - - - - - + + + + + + + + + + + + + + + - - - - - - -<<<<<<< HEAD - - - + + + + + + + + - - - -======= - - - - - ->>>>>>> 864d6ac04 (bot: update checkstyle.xml) - - - + + + + + - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + - - - + - - - - - - - + + + + + - - - - - - - - - - - + + + + + + + + + - - - - + + - - - - - - - - - + + + + + + - - - - - - - - - - - - + + + + + + + + + - - - - - - + + + + - - - - - - - - - - - - + + + + + + + + + + - - - - - - - - - - - + + + + + + + + + - - - - - - - + + + + + + - - - - - + + + - - - - + + - - - + - - - - - - - - - - + + + + + + + + + - - - + - - - - - - - - - - - - - - - - - - - - + + + + + + + + + + + + + + + + - - - - - - - - - + + + + + + + - - - - + + + - - - - - - - - + + + + + + - - - + - - - - - - - - + + + + + + - - - - - - + + + + - - - + - - - - - - + + + - - - - - - - - - - - - - - - - - - - - - - - - - + + + + + + + + + + + + + + + + + + + + + + + - - - - + + - - - - - - + + + + - - - - + - - - + - - - + - - - + - - - - + - - - + - - - - - - + + + + - - - + - - - + - - - + - - - - - - - - - - - - - - - - - + + + + + + + + + + + + + + + + - - - - - - - - - - + + + + + + + + - - + - - - - - - - - - - + + + + + + + + + - - - - - + + + + - - - + - - - + - - + - - - + - - - + - - - - - + - - - - - - + + + + + - - - - - - - - - - - - - - + + + + + + + + + + - - - + + - - - + + - - - - + + - - - - - - - + + + + - - - - - - - + + + - - - - - - + + + - - - + - - - - - - - - - - + + + + + + + + + - - - - - - - - - - - - - - - - - - - - - - - - - + + + + + + + + + + + + + + + + + + + + + + + - - - - - - - - - - - - - - - - - - - - - - - - - - + + + + + + + + + + + + + + + + + + + + + + + + - - - - - - - - - - - - + + + + - - - - - + + + + - - - - - + + + + - - - - + + + - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + - - - - - - - - - + + + + + + + + - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + - - - - - - - - - - - - - - - - - - + + + + + + + + + + + + + + + + + - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + - - - - - - - - - - - - - - - - - + + + + + + + + + + + + + + - - - - - - - - - + + + + + + + + - - - - - - - - - - - - + + + + + + + + + + + - - - - - - - - - - - - - - - - - - - - - - - + + + + + + + + + + + + + + + + + + + + + + - - - - - - - - - - - - - - - - - - - + + + + + + + + + + + + + + + + + + - - - - - - - - - - + + + + + + + + - - - + - - - + - - - - - + + + - - - - + + + - - - - - - - - - - - - - - - - - - - - - + + + + + + + + + + + + + + + + + + + - - - - - - + + + - - - - - - + + - - - - - - - - - - - + + + + + + + + - - - + - - - - - - - - - - + + + + + + + - - - + - - - + - - - + - - - + - - - + - - - + - - - - - + + + - - - + - - + - - - - - - + + + + - - - - - - + + + + - - - + - - - - - - - + + + + + - - - - + - - - - - - + + + + - - - + - - - + - - - + - - - + - - - + - - - + - - - + - - - + - - - + - - - + - - - + - - - - - - - + + + + + - - - - + + + - - - + - - - + - - - - - - - - - - - - - - - - - - - - - - - - - - - - + + + + + + + + + + + - - - - - - - - - - - - - - + + + + + + + + + + + + - - - - - - - - - + + + + + + + + - - - - + + + - - - - + + + - - - - - + + + + - - - - - - - - - - - - - - - - - - - - - + + + + + + + + + + + + + + + + + + + + - - - - + - - - + - - - + - - - + - - - - + + - - - + - - - + - - - + - - - + - - - + - - - + - - - + - - - + - - - + - - - + - - - + - - - + - - - + - - - + - - - + - - - + - - - + - - - + - - - + - - - + - - - + - - - - - - + + + + - - - + - - - - - - - - - - - - - - + - - - + - - - - - - - - - - - - - - - - - - - - + + + + + + + + + + + + + + + + + + - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + - - - - - - + + + + - - - - + + + - - - + - - - + - - - + - - - + - - - + - - - - - + + + - - - - - - - - - - - - + + + + + + + + + + + - - - - - - - - - + + + + + + + - - + - - - + - - - - - - - - - - + + + + + + + + - - - + - - - - + + - - - - + - - - - - - - - - + - - - + - - - - + + - - - - - - - - + + + + + + - - - + - - - - - - + + + + - - - + - - - + - - - + - - - - - - + + + + - - - - - - - - - - - - - - - - + + + + + + + + + + + + + + - - - - + + - - - + - - - - + - - - + - - - + - - - - - - - - - - - + + + + + + + + + + - - - - + + + - - - - + + + - - - - - - + - - - - - - - - + + + + + + - - - + - - - - + + + - - - + - - - - + + + - - - - - - - - - - + + + + + + + + - - - - + + - - - - + + - - - + - - - - + + + - - - - + + - - - - - - + + + + + - - - + - - - - - - - - + + + + + + + - - - - + + + - - - + - - - - + + + - - - - - - - - - - - - - - - - - - - - - - - - - - + + + + + + + + + + + + + + + + + + + + + + + + - - - - - - - + + + + + - - - - + + + - - - - - - - + + + + + - - - + - - - + - - - - - - - - - - - - - - - - - - - - - - - - + + + + + + + + + + + + + + + + + + + + + + - - - - + + + - - - - + + + - - - + - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + - - - - - - - - - - - - - - - - - + + + + + + + + + + + + + + + + - - - - - - - - - - - - - - + + + + + + + + + + + + + - - - + + - - + - - - + - - - - - - - - + + + + + + + - - - - - - - - + + + + + + - - - - + + + - - - - - - + + + + + - - - - - - - + + + + - - - - - - - - - - - - - + + + + + + + + + + + - - - - - - - - - - - - - - - - - - - + + + + + + + + + + + + + + + + + + - - - - - - - - - - - - - - + + + + + + + + + + + + - - - - - - - - - - + + + + + + + + + - - - - - - - - - - - - - - - - - - - - - + + + + + + + + + + + + + + + + - - - - - - - - - - - - - - - - - - - - + + + + + + + + + + + + + + + + + + + - - - - - - - - - - + + + + + + + + - - - - - - - - - + + + + + + + - - - + - - - + - - - - - - - - - - - + + + + + + + + + - - - - - - - - - - + + + + + + + + + - - - - - + + - - - - - + + + - - - - - + - - - - - - - + + + + + + - - - + + - - - - - - - + + + + + + - - - - + + - - - - - - - - - - - - - - - + + + + + + + + + + + + + + - - - - - - - - - + + + + + + + + - - - - - - - - - - - + + + + + + + + + + - - - - + + + - - - - - + + + + - - - - - + + + + - - - - - - - + + + + + + - - - - + + + - - - - - - + + + + + - - - - + + + - - - - - - - - + + + + - - - - + + + - - - - - + + + + - - - - - + + + + - - - - - - - + + + + + + - - - - - - - - + + + + + + + - - - - - - - - + + + + + + + - - + - - - - - - - - - - - - - + + + + + + + + + + - - - - - - - - - + + + + + + + + - - - - - - - - - - - - - - - + + + + + + + + + + + + + - - - + + - - - - - - - - - - - - - - - - - - - - - - - - - - - - - + + + + + + + + + + + + + + + + + + + + + + + + + + + + - - - - - - - + + + + + + + From 1e877ccb094579b3cd2d6b24d65089639ee0e86f Mon Sep 17 00:00:00 2001 From: Niels Lange Date: Wed, 16 Nov 2022 20:38:47 +0700 Subject: [PATCH 42/58] Solve TS errors --- .../formatted-monetary-amount/index.tsx | 2 +- .../base/components/product-price/index.tsx | 24 +++++++++---------- packages/prices/utils/price.ts | 2 +- 3 files changed, 14 insertions(+), 14 deletions(-) diff --git a/assets/js/base/components/formatted-monetary-amount/index.tsx b/assets/js/base/components/formatted-monetary-amount/index.tsx index 5c8d4033740..99439193722 100644 --- a/assets/js/base/components/formatted-monetary-amount/index.tsx +++ b/assets/js/base/components/formatted-monetary-amount/index.tsx @@ -24,7 +24,7 @@ interface FormattedMonetaryAmountProps value: number | string; // Value of money amount. currency: Currency | Record< string, never >; // Currency configuration object. onValueChange?: ( unit: number ) => void; // Function to call when value changes. - style?: React.CSSProperties; + style?: React.CSSProperties | undefined; renderText?: ( value: string ) => JSX.Element; } diff --git a/assets/js/base/components/product-price/index.tsx b/assets/js/base/components/product-price/index.tsx index bc54bbb206e..cf4dc87ae74 100644 --- a/assets/js/base/components/product-price/index.tsx +++ b/assets/js/base/components/product-price/index.tsx @@ -31,13 +31,13 @@ interface PriceRangeProps { * * **Note:** this excludes the dash in between the elements */ - priceClassName?: string; + priceClassName?: string | undefined; /** * Any custom style to be applied to each of the elements containing the prices * * **Note:** this excludes the dash in between the elements */ - priceStyle?: React.CSSProperties; + priceStyle?: React.CSSProperties | undefined; } const PriceRange = ( { @@ -95,13 +95,13 @@ interface SalePriceProps { * * i.e. `` element */ - regularPriceClassName?: string; + regularPriceClassName?: string | undefined; /** * Custom style to be applied to the regular price container * * i.e. `` element */ - regularPriceStyle?: React.CSSProperties; + regularPriceStyle?: React.CSSProperties | undefined; /** * The regular price before the sale */ @@ -111,13 +111,13 @@ interface SalePriceProps { * * i.e. `` element */ - priceClassName?: string; + priceClassName?: string | undefined; /** * Custom style to be applied to the regular price container * * i.e. `` element */ - priceStyle?: React.CSSProperties; + priceStyle?: React.CSSProperties | undefined; /** * The new price during the sale */ @@ -183,7 +183,7 @@ export interface ProductPriceProps { * Applies the `wc-block-components-product-price--align-${ align }` utility * class to the wrapper. */ - align?: 'left' | 'center' | 'right' | undefined; + align?: 'left' | 'center' | 'right'; /** * CSS class for the wrapper */ @@ -191,17 +191,17 @@ export interface ProductPriceProps { /** * Currency configuration object */ - currency?: Currency | Record< string, never >; + currency: Currency | Record< string, never >; /** * The string version of the element to use for the price interpolation * * **Note:** It should contain `` (which is also the default value) */ - format?: string; + format: string; /** * The current price */ - price?: number | string; + price: number | string; /** * CSS class for the current price wrapper */ @@ -216,14 +216,14 @@ export interface ProductPriceProps { * If both `maxPrice` and `minPrice` are set, the component will be rendered * as a `PriceRange` component, otherwise, this value will be ignored. */ - maxPrice?: number | string | undefined; + maxPrice?: number | string; /** * The minimum price in a range * * If both `maxPrice` and `minPrice` are set, the component will be rendered * as a `PriceRange` component, otherwise, this value will be ignored. */ - minPrice?: number | string | undefined; + minPrice?: number | string; /** * The regular price if the item is currently on sale * diff --git a/packages/prices/utils/price.ts b/packages/prices/utils/price.ts index de00bd8cb80..54a7779d744 100644 --- a/packages/prices/utils/price.ts +++ b/packages/prices/utils/price.ts @@ -73,7 +73,7 @@ export const getCurrencyFromPriceResponse = ( // Currency data object, for example an API response containing currency formatting data. currencyData?: | CurrencyResponse - | Record< string, never | unknown > + | Record< string, never > | CartShippingPackageShippingRate ): Currency => { if ( ! currencyData?.currency_code ) { From cf485094fd883ca89ab6df8bd28f6b72cc622ce5 Mon Sep 17 00:00:00 2001 From: Niels Lange Date: Wed, 16 Nov 2022 21:01:12 +0700 Subject: [PATCH 43/58] Solve TS errors --- .../blocks/product-elements/price/block.tsx | 2 +- .../base/components/product-price/index.tsx | 22 +++++++++---------- ...ta-context.js => product-data-context.tsx} | 11 ++++++++-- 3 files changed, 21 insertions(+), 14 deletions(-) rename assets/js/shared/context/{product-data-context.js => product-data-context.tsx} (88%) diff --git a/assets/js/atomic/blocks/product-elements/price/block.tsx b/assets/js/atomic/blocks/product-elements/price/block.tsx index 42c7f20567d..2e436e19edf 100644 --- a/assets/js/atomic/blocks/product-elements/price/block.tsx +++ b/assets/js/atomic/blocks/product-elements/price/block.tsx @@ -63,7 +63,7 @@ export const Block = ( props: Props ): JSX.Element | null => { } const prices: PriceProps = product.prices; - const currency = getCurrencyFromPriceResponse( { ...prices } ); + const currency = getCurrencyFromPriceResponse( prices ); const isOnSale = prices.price !== prices.regular_price; const priceClassName = classnames( { [ `${ parentClassName }__product-price__value` ]: parentClassName, diff --git a/assets/js/base/components/product-price/index.tsx b/assets/js/base/components/product-price/index.tsx index cf4dc87ae74..98dd0eb416b 100644 --- a/assets/js/base/components/product-price/index.tsx +++ b/assets/js/base/components/product-price/index.tsx @@ -183,25 +183,25 @@ export interface ProductPriceProps { * Applies the `wc-block-components-product-price--align-${ align }` utility * class to the wrapper. */ - align?: 'left' | 'center' | 'right'; + align?: 'left' | 'center' | 'right' | undefined; /** * CSS class for the wrapper */ - className?: string; + className?: string | undefined; /** * Currency configuration object */ - currency: Currency | Record< string, never >; + currency?: Currency | Record< string, never >; /** * The string version of the element to use for the price interpolation * * **Note:** It should contain `` (which is also the default value) */ - format: string; + format?: string; /** * The current price */ - price: number | string; + price?: number | string; /** * CSS class for the current price wrapper */ @@ -209,36 +209,36 @@ export interface ProductPriceProps { /** * Custom style for the current price */ - priceStyle?: React.CSSProperties; + priceStyle?: React.CSSProperties | undefined; /** * The maximum price in a range * * If both `maxPrice` and `minPrice` are set, the component will be rendered * as a `PriceRange` component, otherwise, this value will be ignored. */ - maxPrice?: number | string; + maxPrice?: number | string | undefined; /** * The minimum price in a range * * If both `maxPrice` and `minPrice` are set, the component will be rendered * as a `PriceRange` component, otherwise, this value will be ignored. */ - minPrice?: number | string; + minPrice?: number | string | undefined; /** * The regular price if the item is currently on sale * * If this property exists and is different from the current price, then the * component will be rendered as a `SalePrice` component. */ - regularPrice?: number | string; + regularPrice?: number | string | undefined; /** * CSS class to apply to the regular price wrapper */ - regularPriceClassName?: string; + regularPriceClassName?: string | undefined; /** * Custom style to apply to the regular price wrapper. */ - regularPriceStyle?: React.CSSProperties; + regularPriceStyle?: React.CSSProperties | undefined; } const ProductPrice = ( { diff --git a/assets/js/shared/context/product-data-context.js b/assets/js/shared/context/product-data-context.tsx similarity index 88% rename from assets/js/shared/context/product-data-context.js rename to assets/js/shared/context/product-data-context.tsx index a81cc16e913..0a95dcc7408 100644 --- a/assets/js/shared/context/product-data-context.js +++ b/assets/js/shared/context/product-data-context.tsx @@ -1,12 +1,13 @@ /** * External dependencies */ +import { ProductResponseItem } from '@woocommerce/types'; import { createContext, useContext } from '@wordpress/element'; /** * Default product shape matching API response. */ -const defaultProductData = { +const defaultProductData: ProductResponseItem = { id: 0, name: '', parent: 0, @@ -67,6 +68,12 @@ const ProductDataContext = createContext( { export const useProductDataContext = () => useContext( ProductDataContext ); +interface ProductDataContextProviderProps { + product: ProductResponseItem | null; + children: JSX.Element; + isLoading: boolean; +} + /** * This context is used to pass product data down to all children blocks in a given tree. * @@ -79,7 +86,7 @@ export const ProductDataContextProvider = ( { product = null, children, isLoading, -} ) => { +}: ProductDataContextProviderProps ) => { const contextValue = { product: product || defaultProductData, isLoading, From 3f87035179328ece3ec64a6d4e6bd0160eea1a51 Mon Sep 17 00:00:00 2001 From: Niels Lange Date: Fri, 18 Nov 2022 14:21:31 +0700 Subject: [PATCH 44/58] bot: update checkstyle.xml From 99ccf6098a1f2b98c00175fe36c92c1407a06e31 Mon Sep 17 00:00:00 2001 From: Niels Lange Date: Wed, 16 Nov 2022 21:29:44 +0700 Subject: [PATCH 45/58] Solve TS errors --- .../stock-indicator/block.tsx | 2 +- .../formatted-monetary-amount/index.tsx | 19 +++++++++++++------ .../base/components/product-price/index.tsx | 6 +++--- .../shared/context/product-data-context.tsx | 2 +- assets/js/types/type-defs/product-response.ts | 8 +------- 5 files changed, 19 insertions(+), 18 deletions(-) diff --git a/assets/js/atomic/blocks/product-elements/stock-indicator/block.tsx b/assets/js/atomic/blocks/product-elements/stock-indicator/block.tsx index d30c2b7037d..c933a74fe33 100644 --- a/assets/js/atomic/blocks/product-elements/stock-indicator/block.tsx +++ b/assets/js/atomic/blocks/product-elements/stock-indicator/block.tsx @@ -17,7 +17,7 @@ import type { HTMLAttributes } from 'react'; import './style.scss'; import type { BlockAttributes } from './types'; -const lowStockText = ( lowStock: string ): string => { +const lowStockText = ( lowStock: number ): string => { return sprintf( /* translators: %d stock amount (number of items in stock for product) */ __( '%d left in stock', 'woo-gutenberg-products-block' ), diff --git a/assets/js/base/components/formatted-monetary-amount/index.tsx b/assets/js/base/components/formatted-monetary-amount/index.tsx index 99439193722..a6378ab084b 100644 --- a/assets/js/base/components/formatted-monetary-amount/index.tsx +++ b/assets/js/base/components/formatted-monetary-amount/index.tsx @@ -35,16 +35,23 @@ const currencyToNumberFormat = ( currency: FormattedMonetaryAmountProps[ 'currency' ] ) => { return { - thousandSeparator: currency.thousandSeparator, - decimalSeparator: currency.decimalSeparator, - decimalScale: currency.minorUnit, + thousandSeparator: currency?.thousandSeparator, + decimalSeparator: currency?.decimalSeparator, + decimalScale: currency?.minorUnit, fixedDecimalScale: true, - prefix: currency.prefix, - suffix: currency.suffix, + prefix: currency?.prefix, + suffix: currency?.suffix, isNumericString: true, }; }; +type CustomFormattedMonetaryAmountProps = Omit< + FormattedMonetaryAmountProps, + 'currency' +> & { + currency?: Currency | Record< string, never > | undefined; +}; + /** * FormattedMonetaryAmount component. * @@ -57,7 +64,7 @@ const FormattedMonetaryAmount = ( { onValueChange, displayType = 'text', ...props -}: FormattedMonetaryAmountProps ): ReactElement | null => { +}: CustomFormattedMonetaryAmountProps ): ReactElement | null => { const value = typeof rawValue === 'string' ? parseInt( rawValue, 10 ) : rawValue; diff --git a/assets/js/base/components/product-price/index.tsx b/assets/js/base/components/product-price/index.tsx index 98dd0eb416b..bf02a763b89 100644 --- a/assets/js/base/components/product-price/index.tsx +++ b/assets/js/base/components/product-price/index.tsx @@ -17,7 +17,7 @@ interface PriceRangeProps { /** * Currency configuration object */ - currency: Currency | Record< string, never >; + currency: Currency | Record< string, never > | undefined; /** * The maximum price for the range */ @@ -89,7 +89,7 @@ interface SalePriceProps { /** * Currency configuration object */ - currency: Currency | Record< string, never >; + currency: Currency | Record< string, never > | undefined; /** * CSS class to be applied to the regular price container * @@ -121,7 +121,7 @@ interface SalePriceProps { /** * The new price during the sale */ - price: number | string; + price: number | string | undefined; } const SalePrice = ( { diff --git a/assets/js/shared/context/product-data-context.tsx b/assets/js/shared/context/product-data-context.tsx index 0a95dcc7408..deb6f2d8d0e 100644 --- a/assets/js/shared/context/product-data-context.tsx +++ b/assets/js/shared/context/product-data-context.tsx @@ -70,7 +70,7 @@ export const useProductDataContext = () => useContext( ProductDataContext ); interface ProductDataContextProviderProps { product: ProductResponseItem | null; - children: JSX.Element; + children: JSX.Element | JSX.Element[]; isLoading: boolean; } diff --git a/assets/js/types/type-defs/product-response.ts b/assets/js/types/type-defs/product-response.ts index c12ae4b1a2f..f875cf42eee 100644 --- a/assets/js/types/type-defs/product-response.ts +++ b/assets/js/types/type-defs/product-response.ts @@ -8,12 +8,6 @@ export interface ProductResponseItemPrices extends CurrencyResponse { regular_price: string; sale_price: string; price_range: null | { min_amount: string; max_amount: string }; - raw_prices: { - precision: number; - price: string; - regular_price: string; - sale_price: string; - }; } export interface ProductResponseItemBaseData { @@ -74,7 +68,7 @@ export interface ProductResponseItem { on_sale: boolean; prices: ProductResponseItemPrices; price_html: string; - average_rating: number; + average_rating: string; review_count: number; images: Array< ProductResponseImageItem >; categories: Array< ProductResponseTermItem >; From bfd2c9e094e77d1b1280417277319b4683ddd8ac Mon Sep 17 00:00:00 2001 From: Niels Lange Date: Fri, 18 Nov 2022 14:21:41 +0700 Subject: [PATCH 46/58] bot: update checkstyle.xml --- checkstyle.xml | 202 +++++++++++++++++++++++++++++++++++++++++++++++++ 1 file changed, 202 insertions(+) diff --git a/checkstyle.xml b/checkstyle.xml index cdd2bfd45a1..9fe909283be 100644 --- a/checkstyle.xml +++ b/checkstyle.xml @@ -756,6 +756,7 @@ No index signature with a parameter of type 'string' was found on type 'Object'." source="TS7053" /> +<<<<<<< HEAD + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + @@ -1091,6 +1154,7 @@ +<<<<<<< HEAD @@ -1155,6 +1219,68 @@ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + @@ -1385,6 +1511,7 @@ +<<<<<<< HEAD @@ -1410,6 +1537,40 @@ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + @@ -2167,11 +2328,21 @@ Argument of type 'string' is not assignable to parameter of type 'BlockConfiguration<{}>'. Type 'string' is not assignable to type 'Pick<Block<{}>, "title" | "category" | "attributes">'. Overload 2 of 2, '(name: string, settings: BlockConfiguration<{}>): Block<{}> | undefined', gave the following error. +<<<<<<< HEAD Argument of type '{ icon: { src: JSX.Element; }; edit: () => JSX.Element; save: () => JSX.Element; }' is not assignable to parameter of type 'BlockConfiguration<{}>'. Type '{ icon: { src: Element; }; edit: () => Element; save: () => Element; }' is missing the following properties from type 'Pick<Block<{}>, "title" | "category" | "attributes">': title, category, attributes" source="TS2769" /> + + + + + + +<<<<<<< HEAD + + + @@ -3694,6 +3872,7 @@ Type '{ productId: { type: "number"; }; editMode: { type: string; default: boolean; }; imageType: { type: string; default: string; }; orderby: { type: string; default: string; }; reviewsOnLoadMore: { type: string; default: number; }; ... 8 more ...; previewReviews: { ...; }; }' is not assignable to type '{ readonly productId: BlockAttribute<unknown>; readonly editMode: BlockAttribute<unknown>; readonly imageType: BlockAttribute<unknown>; readonly orderby: BlockAttribute<unknown>; ... 9 more ...; readonly previewReviews: BlockAttribute<...>; }'. Types of property 'editMode' are incompatible. Type '{ type: string; default: boolean; }' is not assignable to type 'BlockAttribute<unknown>'." source="TS2769" /> +<<<<<<< HEAD @@ -3702,6 +3881,19 @@ + + + + + + + + + @@ -3713,10 +3905,20 @@ +<<<<<<< HEAD + + + + + From 011f66e5daa4b32bbcc9f891e53dc5828d9c39ed Mon Sep 17 00:00:00 2001 From: Niels Lange Date: Fri, 18 Nov 2022 14:21:48 +0700 Subject: [PATCH 47/58] bot: update checkstyle.xml From d67011a200f795703922a03b25c955b91f46b126 Mon Sep 17 00:00:00 2001 From: Niels Lange Date: Fri, 18 Nov 2022 14:21:54 +0700 Subject: [PATCH 48/58] bot: update checkstyle.xml From 1a3df0d757e7ab13974a6c3cd6adfa5bd34b1e66 Mon Sep 17 00:00:00 2001 From: Niels Lange Date: Fri, 18 Nov 2022 14:23:19 +0700 Subject: [PATCH 49/58] Empty checkstyle.xml --- checkstyle.xml | 4387 ------------------------------------------------ 1 file changed, 4387 deletions(-) diff --git a/checkstyle.xml b/checkstyle.xml index 9fe909283be..e69de29bb2d 100644 --- a/checkstyle.xml +++ b/checkstyle.xml @@ -1,4387 +0,0 @@ - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -<<<<<<< HEAD - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -<<<<<<< HEAD - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -<<<<<<< HEAD - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -<<<<<<< HEAD - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -<<<<<<< HEAD - - - - - - - - - - - - - - - - - - - - - - - - - -<<<<<<< HEAD - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - From 65cecfaa370bcb87bc005ef9647f747d2aee4ded Mon Sep 17 00:00:00 2001 From: "github-actions[bot]" <41898282+github-actions[bot]@users.noreply.github.com> Date: Fri, 18 Nov 2022 07:26:46 +0000 Subject: [PATCH 50/58] bot: update checkstyle.xml --- checkstyle.xml | 4165 ++++++++++++++++++++++++++++++++++++++++++++++++ 1 file changed, 4165 insertions(+) diff --git a/checkstyle.xml b/checkstyle.xml index e69de29bb2d..0eba81a24d0 100644 --- a/checkstyle.xml +++ b/checkstyle.xml @@ -0,0 +1,4165 @@ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + From 37884b2bb66a17a8ea41ec0d4a95e4c57fe4b4b0 Mon Sep 17 00:00:00 2001 From: Niels Lange Date: Fri, 18 Nov 2022 14:38:53 +0700 Subject: [PATCH 51/58] Solve TS errors --- .../image/test/{block.test.js => block.test.tsx} | 0 .../blocks/single-product/{block.js => block.tsx} | 10 ++++++++-- .../edit/{layout-editor.js => layout-editor.tsx} | 13 ++++++++++++- 3 files changed, 20 insertions(+), 3 deletions(-) rename assets/js/atomic/blocks/product-elements/image/test/{block.test.js => block.test.tsx} (100%) rename assets/js/blocks/single-product/{block.js => block.tsx} (86%) rename assets/js/blocks/single-product/edit/{layout-editor.js => layout-editor.tsx} (90%) diff --git a/assets/js/atomic/blocks/product-elements/image/test/block.test.js b/assets/js/atomic/blocks/product-elements/image/test/block.test.tsx similarity index 100% rename from assets/js/atomic/blocks/product-elements/image/test/block.test.js rename to assets/js/atomic/blocks/product-elements/image/test/block.test.tsx diff --git a/assets/js/blocks/single-product/block.js b/assets/js/blocks/single-product/block.tsx similarity index 86% rename from assets/js/blocks/single-product/block.js rename to assets/js/blocks/single-product/block.tsx index ea5b59f4cfc..6125bbeefeb 100644 --- a/assets/js/blocks/single-product/block.js +++ b/assets/js/blocks/single-product/block.tsx @@ -9,14 +9,20 @@ import { } from '@woocommerce/shared-context'; import { StoreNoticesContainer } from '@woocommerce/blocks-checkout'; import { useStoreEvents } from '@woocommerce/base-context/hooks'; +import { ProductResponseItem } from '@woocommerce/types'; /** * Internal dependencies */ import { BLOCK_NAME } from './constants'; -/** @typedef {import('react')} React */ +interface BlockProps { + isLoading: boolean; + product: ProductResponseItem; + children: JSX.Element[]; +} +/** @typedef {import('react')} React */ /** * The Single Product Block. * @@ -25,7 +31,7 @@ import { BLOCK_NAME } from './constants'; * @param {Object} props.product * @param {React.ReactChildren} props.children */ -const Block = ( { isLoading, product, children } ) => { +const Block = ( { isLoading, product, children }: BlockProps ) => { const { dispatchStoreEvent } = useStoreEvents(); const className = 'wc-block-single-product wc-block-layout'; const noticeContext = `woocommerce/single-product/${ product?.id || 0 }`; diff --git a/assets/js/blocks/single-product/edit/layout-editor.js b/assets/js/blocks/single-product/edit/layout-editor.tsx similarity index 90% rename from assets/js/blocks/single-product/edit/layout-editor.js rename to assets/js/blocks/single-product/edit/layout-editor.tsx index ca896e470e7..f2dfb9fd1cb 100644 --- a/assets/js/blocks/single-product/edit/layout-editor.js +++ b/assets/js/blocks/single-product/edit/layout-editor.tsx @@ -12,6 +12,7 @@ import { import { createBlocksFromTemplate } from '@woocommerce/atomic-utils'; import { PanelBody, Button } from '@wordpress/components'; import { Icon, backup } from '@wordpress/icons'; +import { ProductResponseItem } from '@woocommerce/types'; /** * Internal dependencies @@ -22,6 +23,12 @@ import { ALLOWED_INNER_BLOCKS, } from '../constants'; +interface LayoutEditorProps { + isLoading: boolean; + product: ProductResponseItem; + clientId: string; +} + /** * Component to handle edit mode of the "Single Product Block". * @@ -30,7 +37,11 @@ import { * @param {Object} props.product * @param {string} props.clientId */ -const LayoutEditor = ( { isLoading, product, clientId } ) => { +const LayoutEditor = ( { + isLoading, + product, + clientId, +}: LayoutEditorProps ) => { const baseClassName = 'wc-block-single-product wc-block-layout'; const { replaceInnerBlocks } = useDispatch( 'core/block-editor' ); From fb12f2d5dec0fe30cb674037e086a97edfa8c5a8 Mon Sep 17 00:00:00 2001 From: "github-actions[bot]" <41898282+github-actions[bot]@users.noreply.github.com> Date: Fri, 18 Nov 2022 07:43:32 +0000 Subject: [PATCH 52/58] bot: update checkstyle.xml --- checkstyle.xml | 23 +++++++++-------------- 1 file changed, 9 insertions(+), 14 deletions(-) diff --git a/checkstyle.xml b/checkstyle.xml index 0eba81a24d0..fc6c33ecd94 100644 --- a/checkstyle.xml +++ b/checkstyle.xml @@ -1360,7 +1360,7 @@ - + @@ -3672,16 +3672,11 @@ Type '{ type: string; default: boolean; }' is not assignable to type 'BlockAttribute<unknown>'." source="TS2769" /> - - - - - + @@ -3693,13 +3688,11 @@ Property 'showVariations' does not exist on type 'IntrinsicAttributes & { selected: number[]; } & { children?: ReactNode; }'." source="TS2322" /> - - - + - + @@ -3711,6 +3704,8 @@ Property 'text' is missing in type '{ children: Element[]; header: string; }' but required in type 'Readonly<BlockErrorBoundaryProps>'." source="TS2769" /> + From 2b86d961910bfe56ab8ab6a29bfd340d9ab20549 Mon Sep 17 00:00:00 2001 From: Niels Lange Date: Fri, 18 Nov 2022 16:39:21 +0700 Subject: [PATCH 53/58] Solve TS errors --- assets/js/blocks/single-product/edit/{index.js => index.tsx} | 0 1 file changed, 0 insertions(+), 0 deletions(-) rename assets/js/blocks/single-product/edit/{index.js => index.tsx} (100%) diff --git a/assets/js/blocks/single-product/edit/index.js b/assets/js/blocks/single-product/edit/index.tsx similarity index 100% rename from assets/js/blocks/single-product/edit/index.js rename to assets/js/blocks/single-product/edit/index.tsx From 0cfec2807bd96c2922ed95b182f84052e61d2447 Mon Sep 17 00:00:00 2001 From: "github-actions[bot]" <41898282+github-actions[bot]@users.noreply.github.com> Date: Fri, 18 Nov 2022 09:44:28 +0000 Subject: [PATCH 54/58] bot: update checkstyle.xml --- checkstyle.xml | 14 +++++++++----- 1 file changed, 9 insertions(+), 5 deletions(-) diff --git a/checkstyle.xml b/checkstyle.xml index fc6c33ecd94..064044bfefa 100644 --- a/checkstyle.xml +++ b/checkstyle.xml @@ -3694,9 +3694,15 @@ Target requires 1 element(s) but source may have fewer." source="TS2322" /> - - - + + + + + + + + + - From edd5ecf7fb66f4bda40dffafe786250771c95686 Mon Sep 17 00:00:00 2001 From: Niels Lange Date: Wed, 21 Dec 2022 14:58:16 +0700 Subject: [PATCH 55/58] Use BlockAttributes from @wordpress/blocks --- .../blocks/product-elements/price/attributes.ts | 15 +-------------- 1 file changed, 1 insertion(+), 14 deletions(-) diff --git a/assets/js/atomic/blocks/product-elements/price/attributes.ts b/assets/js/atomic/blocks/product-elements/price/attributes.ts index 7c5d185f7a8..d52d8097b47 100644 --- a/assets/js/atomic/blocks/product-elements/price/attributes.ts +++ b/assets/js/atomic/blocks/product-elements/price/attributes.ts @@ -1,20 +1,7 @@ /** * External dependencies */ - -interface BlockAttributes { - productId: { - type: string; - default: number; - }; - isDescendentOfQueryLoop: { - type: string; - default: boolean; - }; - textAlign?: { - type: string; - }; -} +import { BlockAttributes } from '@wordpress/blocks'; export const blockAttributes: BlockAttributes = { productId: { From 308d901d9e7fe3f6a0f0188ce540b735a92e1692 Mon Sep 17 00:00:00 2001 From: Niels Lange Date: Wed, 21 Dec 2022 15:07:23 +0700 Subject: [PATCH 56/58] Fix TS error --- assets/js/previews/cart.ts | 246 +++++++++++++++++++++++++++++-------- 1 file changed, 197 insertions(+), 49 deletions(-) diff --git a/assets/js/previews/cart.ts b/assets/js/previews/cart.ts index 1c5d5a7a823..576a390a62d 100644 --- a/assets/js/previews/cart.ts +++ b/assets/js/previews/cart.ts @@ -38,7 +38,9 @@ export const previewCart: CartResponse = { key: '1', id: 1, quantity: 2, + catalog_visibility: 'visible', name: __( 'Beanie', 'woo-gutenberg-products-block' ), + summary: __( 'Beanie', 'woo-gutenberg-products-block' ), short_description: __( 'Warm hat for winter', 'woo-gutenberg-products-block' @@ -89,6 +91,7 @@ export const previewCart: CartResponse = { price: displayWithTax ? '12000' : '10000', regular_price: displayWithTax ? '12000' : '10000', sale_price: displayWithTax ? '12000' : '10000', + price_range: null, raw_prices: { precision: 6, price: displayWithTax ? '12000000' : '10000000', @@ -110,12 +113,15 @@ export const previewCart: CartResponse = { line_total_tax: '400', }, extensions: {}, + item_data: [], }, { key: '2', id: 2, quantity: 1, + catalog_visibility: 'visible', name: __( 'Cap', 'woo-gutenberg-products-block' ), + summary: __( 'Cap', 'woo-gutenberg-products-block' ), short_description: __( 'Lightweight baseball cap', 'woo-gutenberg-products-block' @@ -123,6 +129,7 @@ export const previewCart: CartResponse = { description: 'Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Vestibulum tortor quam, feugiat vitae, ultricies eget, tempor sit amet, ante. Donec eu libero sit amet quam egestas semper. Aenean ultricies mi vitae est. Mauris placerat eleifend leo.', sku: 'woo-cap', + low_stock_remaining: null, permalink: 'https://example.org', backorders_allowed: false, show_backorder_badge: false, @@ -161,6 +168,7 @@ export const previewCart: CartResponse = { price: displayWithTax ? '2400' : '2000', regular_price: displayWithTax ? '2400' : '2000', sale_price: displayWithTax ? '2400' : '2000', + price_range: null, raw_prices: { precision: 6, price: displayWithTax ? '24000000' : '20000000', @@ -182,13 +190,21 @@ export const previewCart: CartResponse = { line_total_tax: '400', }, extensions: {}, + item_data: [], }, ], cross_sells: [ { id: 1, name: __( 'Polo', 'woo-gutenberg-products-block' ), + parent: 0, + type: 'simple', + variation: '', permalink: 'https://example.org', + sku: 'woo-polo', + short_description: __( 'Polo', 'woo-gutenberg-products-block' ), + description: __( 'Polo', 'woo-gutenberg-products-block' ), + on_sale: false, prices: { currency_code: 'USD', currency_symbol: '$', @@ -200,13 +216,11 @@ export const previewCart: CartResponse = { price: displayWithTax ? '24000' : '20000', regular_price: displayWithTax ? '24000' : '20000', sale_price: displayWithTax ? '12000' : '10000', - raw_prices: { - precision: 6, - price: displayWithTax ? '24000000' : '20000000', - regular_price: displayWithTax ? '24000000' : '20000000', - sale_price: displayWithTax ? '12000000' : '10000000', - }, + price_range: null, }, + price_html: '', + average_rating: '4.5', + review_count: 2, images: [ { id: 17, @@ -218,12 +232,42 @@ export const previewCart: CartResponse = { alt: '', }, ], - average_rating: 4.5, + categories: [], + tags: [], + attributes: [], + variations: [], + has_options: false, + is_purchasable: true, + is_in_stock: true, + is_on_backorder: false, + low_stock_remaining: null, + sold_individually: false, + add_to_cart: { + text: '', + description: '', + url: '', + minimum: 1, + maximum: 99, + multiple_of: 1, + }, }, { id: 2, name: __( 'Long Sleeve Tee', 'woo-gutenberg-products-block' ), + parent: 0, + type: 'simple', + variation: '', permalink: 'https://example.org', + sku: 'woo-long-sleeve-tee', + short_description: __( + 'Long Sleeve Tee', + 'woo-gutenberg-products-block' + ), + description: __( + 'Long Sleeve Tee', + 'woo-gutenberg-products-block' + ), + on_sale: false, prices: { currency_code: 'USD', currency_symbol: '$', @@ -235,13 +279,11 @@ export const previewCart: CartResponse = { price: displayWithTax ? '30000' : '25000', regular_price: displayWithTax ? '30000' : '25000', sale_price: displayWithTax ? '30000' : '25000', - raw_prices: { - precision: 6, - price: displayWithTax ? '30000000' : '25000000', - regular_price: displayWithTax ? '30000000' : '25000000', - sale_price: displayWithTax ? '30000000' : '25000000', - }, + price_range: null, }, + price_html: '', + average_rating: '4', + review_count: 2, images: [ { id: 17, @@ -254,12 +296,41 @@ export const previewCart: CartResponse = { alt: '', }, ], - average_rating: 4, + categories: [], + tags: [], + attributes: [], + variations: [], + has_options: false, + is_purchasable: true, + is_in_stock: true, + is_on_backorder: false, + low_stock_remaining: null, + sold_individually: false, + add_to_cart: { + text: '', + description: '', + url: '', + minimum: 1, + maximum: 99, + multiple_of: 1, + }, }, { id: 3, name: __( 'Hoodie with Zipper', 'woo-gutenberg-products-block' ), + parent: 0, + type: 'simple', + variation: '', permalink: 'https://example.org', + sku: 'woo-hoodie-with-zipper', + short_description: __( + 'Hoodie with Zipper', + 'woo-gutenberg-products-block' + ), + description: __( + 'Hoodie with Zipper', + 'woo-gutenberg-products-block' + ), on_sale: true, prices: { currency_code: 'USD', @@ -272,13 +343,11 @@ export const previewCart: CartResponse = { price: displayWithTax ? '15000' : '12500', regular_price: displayWithTax ? '30000' : '25000', sale_price: displayWithTax ? '15000' : '12500', - raw_prices: { - precision: 6, - price: displayWithTax ? '15000000' : '12500000', - regular_price: displayWithTax ? '30000000' : '25000000', - sale_price: displayWithTax ? '15000000' : '12500000', - }, + price_range: null, }, + price_html: '', + average_rating: '1', + review_count: 2, images: [ { id: 17, @@ -292,12 +361,35 @@ export const previewCart: CartResponse = { alt: '', }, ], - average_rating: 1, + categories: [], + tags: [], + attributes: [], + variations: [], + has_options: false, + is_purchasable: true, + is_in_stock: true, + is_on_backorder: false, + low_stock_remaining: null, + sold_individually: false, + add_to_cart: { + text: '', + description: '', + url: '', + minimum: 1, + maximum: 99, + multiple_of: 1, + }, }, { id: 4, name: __( 'Hoodie with Logo', 'woo-gutenberg-products-block' ), + parent: 0, + type: 'simple', + variation: '', permalink: 'https://example.org', + sku: 'woo-hoodie-with-logo', + short_description: __( 'Polo', 'woo-gutenberg-products-block' ), + description: __( 'Polo', 'woo-gutenberg-products-block' ), on_sale: false, prices: { currency_code: 'USD', @@ -310,13 +402,11 @@ export const previewCart: CartResponse = { price: displayWithTax ? '4500' : '4250', regular_price: displayWithTax ? '4500' : '4250', sale_price: displayWithTax ? '4500' : '4250', - raw_prices: { - precision: 6, - price: displayWithTax ? '45000000' : '42500000', - regular_price: displayWithTax ? '45000000' : '42500000', - sale_price: displayWithTax ? '45000000' : '42500000', - }, + price_range: null, }, + price_html: '', + average_rating: '5', + review_count: 2, images: [ { id: 17, @@ -329,12 +419,41 @@ export const previewCart: CartResponse = { alt: '', }, ], - average_rating: 5, + categories: [], + tags: [], + attributes: [], + variations: [], + has_options: false, + is_purchasable: true, + is_in_stock: true, + is_on_backorder: false, + low_stock_remaining: null, + sold_individually: false, + add_to_cart: { + text: '', + description: '', + url: '', + minimum: 1, + maximum: 99, + multiple_of: 1, + }, }, { id: 5, name: __( 'Hoodie with Pocket', 'woo-gutenberg-products-block' ), + parent: 0, + type: 'simple', + variation: '', permalink: 'https://example.org', + sku: 'woo-hoodie-with-pocket', + short_description: __( + 'Hoodie with Pocket', + 'woo-gutenberg-products-block' + ), + description: __( + 'Hoodie with Pocket', + 'woo-gutenberg-products-block' + ), on_sale: true, prices: { currency_code: 'USD', @@ -347,13 +466,11 @@ export const previewCart: CartResponse = { price: displayWithTax ? '3500' : '3250', regular_price: displayWithTax ? '4500' : '4250', sale_price: displayWithTax ? '3500' : '3250', - raw_prices: { - precision: 6, - price: displayWithTax ? '35000000' : '32500000', - regular_price: displayWithTax ? '45000000' : '42500000', - sale_price: displayWithTax ? '35000000' : '32500000', - }, + price_range: null, }, + price_html: '', + average_rating: '3.75', + review_count: 4, images: [ { id: 17, @@ -367,12 +484,35 @@ export const previewCart: CartResponse = { alt: '', }, ], - average_rating: 3.75, + categories: [], + tags: [], + attributes: [], + variations: [], + has_options: false, + is_purchasable: true, + is_in_stock: true, + is_on_backorder: false, + low_stock_remaining: null, + sold_individually: false, + add_to_cart: { + text: '', + description: '', + url: '', + minimum: 1, + maximum: 99, + multiple_of: 1, + }, }, { id: 6, name: __( 'T-Shirt', 'woo-gutenberg-products-block' ), + parent: 0, + type: 'simple', + variation: '', permalink: 'https://example.org', + sku: 'woo-t-shirt', + short_description: __( 'T-Shirt', 'woo-gutenberg-products-block' ), + description: __( 'T-Shirt', 'woo-gutenberg-products-block' ), on_sale: false, prices: { currency_code: 'USD', @@ -385,13 +525,11 @@ export const previewCart: CartResponse = { price: displayWithTax ? '1800' : '1500', regular_price: displayWithTax ? '1800' : '1500', sale_price: displayWithTax ? '1800' : '1500', - raw_prices: { - precision: 6, - price: displayWithTax ? '1800000' : '1500000', - regular_price: displayWithTax ? '1800000' : '1500000', - sale_price: displayWithTax ? '1800000' : '1500000', - }, + price_range: null, }, + price_html: '', + average_rating: '3', + review_count: 2, images: [ { id: 17, @@ -403,7 +541,24 @@ export const previewCart: CartResponse = { alt: '', }, ], - average_rating: 3, + categories: [], + tags: [], + attributes: [], + variations: [], + has_options: false, + is_purchasable: true, + is_in_stock: true, + is_on_backorder: false, + low_stock_remaining: null, + sold_individually: false, + add_to_cart: { + text: '', + description: '', + url: '', + minimum: 1, + maximum: 99, + multiple_of: 1, + }, }, ], fees: [ @@ -420,13 +575,6 @@ export const previewCart: CartResponse = { currency_suffix: '', total: '100', total_tax: '20', - tax_lines: [ - { - name: __( 'Sales tax', 'woo-gutenberg-products-block' ), - rate: '20%', - price: '20', - }, - ], }, }, ], From 989e955a0dd2e299434d50870a839a8f7fc78a3f Mon Sep 17 00:00:00 2001 From: Niels Lange Date: Wed, 21 Dec 2022 15:43:49 +0700 Subject: [PATCH 57/58] Fix TS errors --- .../components/block-error-boundary/types.ts | 6 +++--- .../js/blocks/single-product/edit/index.tsx | 20 ++++++++++++++++++- .../edit-product-link/{index.js => index.tsx} | 7 ++++++- 3 files changed, 28 insertions(+), 5 deletions(-) rename assets/js/editor-components/edit-product-link/{index.js => index.tsx} (88%) diff --git a/assets/js/base/components/block-error-boundary/types.ts b/assets/js/base/components/block-error-boundary/types.ts index b15f4c50d53..2c8069eb9eb 100644 --- a/assets/js/base/components/block-error-boundary/types.ts +++ b/assets/js/base/components/block-error-boundary/types.ts @@ -4,19 +4,19 @@ interface BlockErrorBase { * If it's `null` or an empty string, no image will be displayed. * If it's not defined, the default image will be used. */ - imageUrl?: string; + imageUrl?: string | undefined; /** * Text to display as the heading of the error block. * If it's `null` or an empty string, no header will be displayed. * If it's not defined, the default header will be used. */ - header?: string; + header?: string | undefined; /** * Text to display in the error block below the header. * If it's `null` or an empty string, nothing will be displayed. * If it's not defined, the default text will be used. */ - text: React.ReactNode; + text?: React.ReactNode | undefined; /** * Text preceeding the error message. */ diff --git a/assets/js/blocks/single-product/edit/index.tsx b/assets/js/blocks/single-product/edit/index.tsx index ae3f921243d..fc1f0dea6e3 100644 --- a/assets/js/blocks/single-product/edit/index.tsx +++ b/assets/js/blocks/single-product/edit/index.tsx @@ -9,6 +9,7 @@ import BlockErrorBoundary from '@woocommerce/base-components/block-error-boundar import EditProductLink from '@woocommerce/editor-components/edit-product-link'; import { singleProductBlockPreview } from '@woocommerce/resource-previews'; import { InspectorControls } from '@wordpress/block-editor'; +import { ProductResponseItem } from '@woocommerce/types'; /** * Internal dependencies @@ -20,6 +21,23 @@ import EditorBlockControls from './editor-block-controls'; import LayoutEditor from './layout-editor'; import { BLOCK_TITLE, BLOCK_ICON, BLOCK_DESCRIPTION } from '../constants'; +interface EditorProps { + className: string; + attributes: { + productId: number; + isPreview: boolean; + }; + setAttributes: ( attributes: { + productId: number; + isPreview: boolean; + } ) => void; + error: string; + getProduct: () => void; + product: ProductResponseItem; + isLoading: boolean; + clientId: string; +} + /** * Component to handle edit mode of the "Single Product Block". * @@ -42,7 +60,7 @@ const Editor = ( { product, isLoading, clientId, -} ) => { +}: EditorProps ) => { const { productId, isPreview } = attributes; const [ isEditing, setIsEditing ] = useState( ! productId ); diff --git a/assets/js/editor-components/edit-product-link/index.js b/assets/js/editor-components/edit-product-link/index.tsx similarity index 88% rename from assets/js/editor-components/edit-product-link/index.js rename to assets/js/editor-components/edit-product-link/index.tsx index e0a201eff9e..2397962324f 100644 --- a/assets/js/editor-components/edit-product-link/index.js +++ b/assets/js/editor-components/edit-product-link/index.tsx @@ -7,12 +7,17 @@ import { ADMIN_URL } from '@woocommerce/settings'; import { InspectorControls } from '@wordpress/block-editor'; import { useProductDataContext } from '@woocommerce/shared-context'; +interface EditProductLinkProps { + id?: number | undefined; + productId?: number | undefined; +} + /** * Component to render an edit product link in the sidebar. * * @param {Object} props Component props. */ -const EditProductLink = ( props ) => { +const EditProductLink = ( props: EditProductLinkProps ): JSX.Element | null => { const productDataContext = useProductDataContext(); const product = productDataContext.product || {}; const productId = product.id || props.productId || 0; From 270f1d6a75abed38973a6a5a5c22b3a80b282050 Mon Sep 17 00:00:00 2001 From: Niels Lange Date: Thu, 22 Dec 2022 18:43:51 +0700 Subject: [PATCH 58/58] Fix TS error --- assets/js/base/components/formatted-monetary-amount/index.tsx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/assets/js/base/components/formatted-monetary-amount/index.tsx b/assets/js/base/components/formatted-monetary-amount/index.tsx index a6378ab084b..f13aa03da01 100644 --- a/assets/js/base/components/formatted-monetary-amount/index.tsx +++ b/assets/js/base/components/formatted-monetary-amount/index.tsx @@ -49,7 +49,7 @@ type CustomFormattedMonetaryAmountProps = Omit< FormattedMonetaryAmountProps, 'currency' > & { - currency?: Currency | Record< string, never > | undefined; + currency: Currency | Record< string, never >; }; /**