Migrate On Sale Badge to `block.json` (#50908)

* Migrate On Sale Badge to block.json

* Add changelog

* Fix types

* Update block references

* Update block references and doc manifest
This commit is contained in:
Karol Manijak 2024-08-28 16:26:21 +02:00 committed by GitHub
parent 91b6e972e3
commit d9a47a15a9
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
10 changed files with 69 additions and 75 deletions

View File

@ -51,7 +51,7 @@ Display a product's description, attributes, and reviews.
- **Ancestor:**
- **Parent:**
- **Supports:** align, spacing (margin)
- **Attributes:**
- **Attributes:** hideTabTitle
## Product Image Gallery - woocommerce/product-image-gallery
@ -130,6 +130,17 @@ Display related products.
- **Supports:** align, ~~reusable~~
- **Attributes:**
## On-Sale Badge - woocommerce/product-sale-badge
Displays an on-sale badge if the product is on-sale.
- **Name:** woocommerce/product-sale-badge
- **Category:** woocommerce-product-elements
- **Ancestor:**
- **Parent:**
- **Supports:**
- **Attributes:** isDescendentOfQueryLoop, isDescendentOfSingleProductTemplate, productId
## Active Filters Controls - woocommerce/active-filters
Display the currently active filters.

View File

@ -74,7 +74,7 @@
"post_title": "Blocks reference",
"menu_title": "Blocks Reference",
"edit_url": "https://github.com/woocommerce/woocommerce/edit/trunk/docs/building-a-woo-store/block-references.md",
"hash": "b6cd78cba78be8846621f27b9d4a408c713e1915bdbb7fc27b6247b3ff8610f1",
"hash": "5e36472952cdb8639fc4cb63d44a43276d14bb59624ac3dd19d846c5b6358315",
"url": "https://raw.githubusercontent.com/woocommerce/woocommerce/trunk/docs/building-a-woo-store/block-references.md",
"id": "1fbe91d7fa4fafaf35f0297e4cee1e7958756aed"
},
@ -1804,5 +1804,5 @@
"categories": []
}
],
"hash": "df3de404fdaf0f5edbc84ef82a7e492c5bf95c862aecadf9643229b7d10cc2eb"
"hash": "771d75cfb29dbd077e0af2234e1bbe0e99360ec6974519f02e8c70c656ac1763"
}

View File

@ -1,21 +0,0 @@
/**
* External dependencies
*/
import type { BlockAttributes } from '@wordpress/blocks';
export const blockAttributes: BlockAttributes = {
productId: {
type: 'number',
default: 0,
},
isDescendentOfQueryLoop: {
type: 'boolean',
default: false,
},
isDescendentOfSingleProductTemplate: {
type: 'boolean',
default: false,
},
};
export default blockAttributes;

View File

@ -0,0 +1,20 @@
{
"name": "woocommerce/product-sale-badge",
"version": "1.0.0",
"title": "On-Sale Badge",
"description": "Displays an on-sale badge if the product is on-sale.",
"category": "woocommerce-product-elements",
"attributes": {
"productId": { "type": "number", "default": 0 },
"isDescendentOfQueryLoop": { "type": "boolean", "default": false },
"isDescendentOfSingleProductTemplate": {
"type": "boolean",
"default": false
}
},
"usesContext": [ "query", "queryId", "postId" ],
"keywords": [ "WooCommerce" ],
"textdomain": "woocommerce",
"apiVersion": 3,
"$schema": "https://schemas.wp.org/trunk/block.json"
}

View File

@ -18,7 +18,8 @@ import type { HTMLAttributes } from 'react';
import './style.scss';
import type { BlockAttributes } from './types';
type Props = BlockAttributes & HTMLAttributes< HTMLDivElement >;
type Props = BlockAttributes &
HTMLAttributes< HTMLDivElement > & { align: boolean };
export const Block = ( props: Props ): JSX.Element | null => {
const { className, align } = props;

View File

@ -1,14 +0,0 @@
/**
* External dependencies
*/
import { __ } from '@wordpress/i18n';
import { percent, Icon } from '@wordpress/icons';
export const BLOCK_TITLE: string = __( 'On-Sale Badge', 'woocommerce' );
export const BLOCK_ICON: JSX.Element = (
<Icon icon={ percent } className="wc-block-editor-components-block-icon" />
);
export const BLOCK_DESCRIPTION: string = __(
'Displays an on-sale badge if the product is on-sale.',
'woocommerce'
);

View File

@ -1,35 +0,0 @@
/**
* External dependencies
*/
import { registerBlockType } from '@wordpress/blocks';
import type { BlockConfiguration } from '@wordpress/blocks';
/**
* Internal dependencies
*/
import sharedConfig from '../shared/config';
import attributes from './attributes';
import edit from './edit';
import {
BLOCK_TITLE as title,
BLOCK_ICON as icon,
BLOCK_DESCRIPTION as description,
} from './constants';
import { supports } from './support';
const blockConfig: BlockConfiguration = {
...sharedConfig,
title,
description,
icon: { src: icon },
supports,
attributes,
edit,
usesContext: [ 'query', 'queryId', 'postId' ],
ancestor: [
...( sharedConfig.ancestor || [] ),
'woocommerce/product-gallery',
],
};
registerBlockType( 'woocommerce/product-sale-badge', { ...blockConfig } );

View File

@ -0,0 +1,29 @@
/**
* External dependencies
*/
import { registerBlockType } from '@wordpress/blocks';
import { percent, Icon } from '@wordpress/icons';
/**
* Internal dependencies
*/
import sharedConfig from '../shared/config';
import edit from './edit';
import { supports } from './support';
import metadata from './block.json';
registerBlockType( metadata, {
...sharedConfig,
icon: (
<Icon
icon={ percent }
className="wc-block-editor-components-block-icon"
/>
),
supports,
edit,
ancestor: [
...( sharedConfig.ancestor || [] ),
'woocommerce/product-gallery',
],
} );

View File

@ -1,6 +1,5 @@
export interface BlockAttributes {
productId: number;
align: 'left' | 'center' | 'right';
isDescendentOfQueryLoop?: boolean | undefined;
isDescendentOfSingleProductTemplate?: boolean;
}

View File

@ -0,0 +1,4 @@
Significance: patch
Type: dev
On Sale Badge: Migrate to block.json