Skip to content

Commit b499838

Browse files
ajaydsouzaajaydsouza
committed
New Products block
1 parent 1e18383 commit b499838

File tree

10 files changed

+437
-4
lines changed

10 files changed

+437
-4
lines changed

‎includes/blocks/build/products/block.json‎

Lines changed: 44 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,44 @@
1+
{
2+
"$schema": "https://schemas.wp.org/trunk/block.json",
3+
"apiVersion": 3,
4+
"name": "knowledgebase/products",
5+
"version": "3.0.0",
6+
"title": "Knowledge Base Products",
7+
"category": "design",
8+
"icon": "products",
9+
"keywords": [
10+
"knowledgebase",
11+
"kb",
12+
"products"
13+
],
14+
"description": "Display sections under a selected product for the Knowledge Base",
15+
"supports": {
16+
"html": false
17+
},
18+
"attributes": {
19+
"title": {
20+
"type": "string",
21+
"default": ""
22+
},
23+
"productId": {
24+
"type": "number",
25+
"default": 0
26+
},
27+
"depth": {
28+
"type": "number",
29+
"default": 0
30+
},
31+
"beforeLiItem": {
32+
"type": "string",
33+
"default": ""
34+
},
35+
"afterLiItem": {
36+
"type": "string",
37+
"default": ""
38+
}
39+
},
40+
"example": {},
41+
"textdomain": "knowledgebase",
42+
"editorScript": "file:./index.js",
43+
"editorStyle": "file:./index.css"
44+
}

‎includes/blocks/build/products/index.asset.php‎

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1 @@
1+
<?php return array('dependencies' => array('react-jsx-runtime', 'wp-block-editor', 'wp-blocks', 'wp-components', 'wp-data', 'wp-i18n', 'wp-server-side-render'), 'version' => '9d08fb178f9d7c35a256');

‎includes/blocks/build/products/index.js‎

Lines changed: 1 addition & 0 deletions
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

‎includes/blocks/class-blocks.php‎

Lines changed: 52 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -46,6 +46,7 @@ public function register_blocks() {
4646
'articles' => 'render_articles_block',
4747
'breadcrumb' => 'render_breadcrumb_block',
4848
'sections' => 'render_sections_block',
49+
'products' => 'render_products_block',
4950
);
5051

5152
foreach ( $blocks as $block_name => $render_callback ) {
@@ -107,7 +108,7 @@ public function render_kb_block( $attributes ) {
107108
$arguments = wp_parse_args( $attributes['other_attributes'], $arguments );
108109

109110
/**
110-
* Filters arguments passed to get_wzkb for the block.
111+
* Filters arguments passed to wzkb_knowledge for the block.
111112
*
112113
* @since 2.0.0
113114
*
@@ -249,4 +250,54 @@ public function render_sections_block( $attributes ) {
249250

250251
return $output;
251252
}
253+
254+
/**
255+
* Renders the `knowledgebase/products` block on server.
256+
*
257+
* @since 3.0.0
258+
*
259+
* @param array $attributes The block attributes.
260+
*
261+
* @return string Returns the rendered product sections list.
262+
*/
263+
public function render_products_block( $attributes ) {
264+
$mappings = array(
265+
'product_id' => 'productId',
266+
'depth' => 'depth',
267+
'before_li_item' => 'beforeLiItem',
268+
'after_li_item' => 'afterLiItem',
269+
);
270+
271+
$attributes = $this->map_attributes( $attributes, $mappings );
272+
273+
$arguments = array(
274+
'is_block' => 1,
275+
'depth' => ( ! empty( $attributes['depth'] ) ) ? (int) $attributes['depth'] : 0,
276+
'before_li_item' => ( ! empty( $attributes['before_li_item'] ) ) ? $attributes['before_li_item'] : '',
277+
'after_li_item' => ( ! empty( $attributes['after_li_item'] ) ) ? $attributes['after_li_item'] : '',
278+
);
279+
280+
$product_id = ! empty( $attributes['product_id'] ) ? (int) $attributes['product_id'] : 0;
281+
282+
/**
283+
* Filters arguments passed to wzkb_get_product_sections_list for the block.
284+
*
285+
* @since 3.0.0
286+
*
287+
* @param array $arguments Knowledge Base block options array.
288+
* @param array $attributes Block attributes array.
289+
*/
290+
$arguments = apply_filters( 'wzkb_products_block_options', $arguments, $attributes );
291+
292+
$wrapper_attributes = get_block_wrapper_attributes();
293+
294+
$output = sprintf(
295+
'<div %1$s>%2$s%3$s</div>',
296+
$wrapper_attributes,
297+
! empty( $attributes['title'] ) ? '<h2 class="wzkb-products-title">' . esc_html( $attributes['title'] ) . '</h2>' : '',
298+
wzkb_get_product_sections_list( $product_id, $arguments )
299+
);
300+
301+
return $output;
302+
}
252303
}

‎includes/blocks/src/products/block.json‎

Lines changed: 40 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,40 @@
1+
{
2+
"$schema": "https://schemas.wp.org/trunk/block.json",
3+
"apiVersion": 3,
4+
"name": "knowledgebase/products",
5+
"version": "3.0.0",
6+
"title": "Knowledge Base Products",
7+
"category": "design",
8+
"icon": "products",
9+
"keywords": ["knowledgebase", "kb", "products"],
10+
"description": "Display sections under a selected product for the Knowledge Base",
11+
"supports": {
12+
"html": false
13+
},
14+
"attributes": {
15+
"title": {
16+
"type": "string",
17+
"default": ""
18+
},
19+
"productId": {
20+
"type": "number",
21+
"default": 0
22+
},
23+
"depth": {
24+
"type": "number",
25+
"default": 0
26+
},
27+
"beforeLiItem": {
28+
"type": "string",
29+
"default": ""
30+
},
31+
"afterLiItem": {
32+
"type": "string",
33+
"default": ""
34+
}
35+
},
36+
"example": {},
37+
"textdomain": "knowledgebase",
38+
"editorScript": "file:./index.js",
39+
"editorStyle": "file:./index.css"
40+
}

‎includes/blocks/src/products/edit.js‎

Lines changed: 160 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,160 @@
1+
/**
2+
* WordPress dependencies
3+
*/
4+
import { __ } from '@wordpress/i18n';
5+
import { useBlockProps, InspectorControls } from '@wordpress/block-editor';
6+
import {
7+
PanelBody,
8+
TextControl,
9+
SelectControl,
10+
RangeControl,
11+
Placeholder,
12+
Button,
13+
} from '@wordpress/components';
14+
import { useSelect } from '@wordpress/data';
15+
import ServerSideRender from '@wordpress/server-side-render';
16+
import { Disabled } from '@wordpress/components';
17+
18+
/**
19+
* Edit function for the Knowledge Base Products block.
20+
*
21+
* @param {Object} props Block props.
22+
* @param {Object} props.attributes Block attributes.
23+
* @param {Object} props.setAttributes Block setAttributes function.
24+
* @return {WPElement} Element to render.
25+
*/
26+
export default function Edit({ attributes, setAttributes }) {
27+
const blockProps = useBlockProps();
28+
const { title, productId, depth, beforeLiItem, afterLiItem } = attributes;
29+
30+
// Get products using the REST API
31+
const { products } = useSelect((select) => {
32+
const { getEntityRecords } = select('core');
33+
return {
34+
products: getEntityRecords('taxonomy', 'wzkb_product', {
35+
per_page: -1,
36+
orderby: 'name',
37+
order: 'asc',
38+
_fields: ['id', 'name'],
39+
}),
40+
};
41+
}, []);
42+
43+
// Create options array for SelectControl
44+
const productOptions = products
45+
? [
46+
{ value: 0, label: __('Select a product', 'knowledgebase') },
47+
...products.map((product) => ({
48+
value: product.id,
49+
label: product.name,
50+
})),
51+
]
52+
: [{ value: 0, label: __('Loading...', 'knowledgebase') }];
53+
54+
// If no product is selected, show the placeholder
55+
if (!productId) {
56+
return (
57+
<>
58+
<InspectorControls>
59+
<PanelBody title={__('Settings', 'knowledgebase')}>
60+
<TextControl
61+
label={__('Title', 'knowledgebase')}
62+
value={title}
63+
onChange={(value) =>
64+
setAttributes({ title: value })
65+
}
66+
/>
67+
<SelectControl
68+
label={__('Product', 'knowledgebase')}
69+
value={productId}
70+
options={productOptions}
71+
onChange={(value) =>
72+
setAttributes({ productId: parseInt(value) })
73+
}
74+
/>
75+
</PanelBody>
76+
</InspectorControls>
77+
78+
<div {...blockProps}>
79+
<Placeholder
80+
icon="products"
81+
label={__('Knowledge Base Products', 'knowledgebase')}
82+
instructions={__(
83+
'Select a product to display its sections.',
84+
'knowledgebase'
85+
)}
86+
>
87+
<SelectControl
88+
value={productId}
89+
options={productOptions}
90+
onChange={(value) =>
91+
setAttributes({ productId: parseInt(value) })
92+
}
93+
/>
94+
</Placeholder>
95+
</div>
96+
</>
97+
);
98+
}
99+
100+
return (
101+
<>
102+
<InspectorControls>
103+
<PanelBody title={__('Settings', 'knowledgebase')}>
104+
<TextControl
105+
label={__('Title', 'knowledgebase')}
106+
value={title}
107+
onChange={(value) => setAttributes({ title: value })}
108+
/>
109+
<SelectControl
110+
label={__('Product', 'knowledgebase')}
111+
value={productId}
112+
options={productOptions}
113+
onChange={(value) =>
114+
setAttributes({ productId: parseInt(value) })
115+
}
116+
/>
117+
<RangeControl
118+
label={__('Max Depth', 'knowledgebase')}
119+
value={depth}
120+
onChange={(value) => setAttributes({ depth: value })}
121+
min={0}
122+
max={10}
123+
help={__('0 for unlimited depth', 'knowledgebase')}
124+
/>
125+
<TextControl
126+
label={__('Before list item', 'knowledgebase')}
127+
value={beforeLiItem}
128+
onChange={(value) =>
129+
setAttributes({ beforeLiItem: value })
130+
}
131+
help={__(
132+
'HTML/text to add before each list item',
133+
'knowledgebase'
134+
)}
135+
/>
136+
<TextControl
137+
label={__('After list item', 'knowledgebase')}
138+
value={afterLiItem}
139+
onChange={(value) =>
140+
setAttributes({ afterLiItem: value })
141+
}
142+
help={__(
143+
'HTML/text to add after each list item',
144+
'knowledgebase'
145+
)}
146+
/>
147+
</PanelBody>
148+
</InspectorControls>
149+
150+
<div {...blockProps}>
151+
<Disabled>
152+
<ServerSideRender
153+
block="knowledgebase/products"
154+
attributes={attributes}
155+
/>
156+
</Disabled>
157+
</div>
158+
</>
159+
);
160+
}

0 commit comments

Comments
 (0)