Skip to content

Commit 2529b14

Browse files
ajaydsouzaajaydsouza
committed
New block to display the snippet
1 parent 09df0c7 commit 2529b14

File tree

14 files changed

+513
-29
lines changed

14 files changed

+513
-29
lines changed

‎includes/admin/settings/class-metabox-api.php

+3
Original file line numberDiff line numberDiff line change
@@ -300,6 +300,9 @@ public function html( $post ) {
300300
'field_class' => '',
301301
'field_attributes' => '',
302302
'placeholder' => '',
303+
'disabled' => false,
304+
'readonly' => false,
305+
'pro' => false,
303306
)
304307
);
305308

‎includes/admin/settings/class-settings-api.php

+2
Original file line numberDiff line numberDiff line change
@@ -528,6 +528,8 @@ public function admin_init() {
528528
'field_attributes' => '',
529529
'placeholder' => '',
530530
'pro' => false,
531+
'disabled' => false,
532+
'readonly' => false,
531533
)
532534
);
533535

‎includes/class-main.php

+10
Original file line numberDiff line numberDiff line change
@@ -69,6 +69,15 @@ final class Main {
6969
*/
7070
public $third_party;
7171

72+
/**
73+
* Blocks.
74+
*
75+
* @since 2.1.0
76+
*
77+
* @var object Blocks.
78+
*/
79+
public $blocks;
80+
7281
/**
7382
* Gets the instance of the class.
7483
*
@@ -104,6 +113,7 @@ private function init() {
104113
$this->shortcodes = new \WebberZone\Snippetz\Frontend\Shortcodes();
105114
$this->site_verification = new \WebberZone\Snippetz\Frontend\Site_Verification();
106115
$this->third_party = new \WebberZone\Snippetz\Frontend\Third_Party();
116+
$this->blocks = new \WebberZone\Snippetz\Frontend\Blocks\Blocks();
107117

108118
if ( \WebberZone\Snippetz\Util\Helpers::is_snippets_enabled() ) {
109119
$this->snippets = new \WebberZone\Snippetz\Snippets\Snippets();

‎includes/frontend/blocks/build/snippetz/block.json

+33
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,33 @@
1+
{
2+
"$schema": "https://schemas.wp.org/trunk/block.json",
3+
"apiVersion": 3,
4+
"name": "webberzone/snippetz",
5+
"version": "2.1.0",
6+
"title": "WebberZone Snippetz",
7+
"category": "widgets",
8+
"icon": "editor-code",
9+
"description": "Display a snippet with this Gutenberg block.",
10+
"keywords": [
11+
"snippet",
12+
"code",
13+
"html",
14+
"css",
15+
"javascript"
16+
],
17+
"attributes": {
18+
"className": {
19+
"type": "string",
20+
"default": ""
21+
},
22+
"snippetId": {
23+
"type": "number",
24+
"default": 0
25+
}
26+
},
27+
"example": {},
28+
"supports": {
29+
"html": false
30+
},
31+
"textdomain": "add-to-all",
32+
"editorScript": "file:./index.js"
33+
}

‎includes/frontend/blocks/build/snippetz/index.asset.php

+1
Original file line numberDiff line numberDiff line change
@@ -0,0 +1 @@
1+
<?php return array('dependencies' => array('react', 'wp-block-editor', 'wp-blocks', 'wp-components', 'wp-core-data', 'wp-data', 'wp-element', 'wp-i18n', 'wp-server-side-render'), 'version' => '3281fd51f710b14222ed');

‎includes/frontend/blocks/build/snippetz/index.js

+2
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

‎includes/frontend/blocks/class-blocks.php

+82
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,82 @@
1+
<?php
2+
/**
3+
* WebberZone Snippetz Blocks.
4+
*
5+
* @since 2.1.0
6+
*
7+
* @package WebberZone\Snippetz
8+
*/
9+
10+
namespace WebberZone\Snippetz\Frontend\Blocks;
11+
12+
use WebberZone\Snippetz\Snippets\Functions;
13+
14+
// If this file is called directly, abort.
15+
if ( ! defined( 'WPINC' ) ) {
16+
die;
17+
}
18+
19+
/**
20+
* Blocks class.
21+
*
22+
* @since 2.1.0
23+
*/
24+
class Blocks {
25+
26+
/**
27+
* Main constructor.
28+
*/
29+
public function __construct() {
30+
add_action( 'init', array( $this, 'register_blocks' ) );
31+
}
32+
33+
/**
34+
* Register blocks.
35+
*
36+
* @since 2.1.0
37+
*/
38+
public function register_blocks() {
39+
40+
$blocks = array(
41+
'snippetz' => 'render_snippetz',
42+
);
43+
44+
foreach ( $blocks as $block => $function ) {
45+
register_block_type(
46+
__DIR__ . "/build/$block",
47+
array(
48+
'render_callback' => array( $this, $function ),
49+
)
50+
);
51+
}
52+
}
53+
54+
/**
55+
* Render snippetz block.
56+
*
57+
* @since 2.1.0
58+
*
59+
* @param array $attributes Block attributes.
60+
* @return \WP_Post|string `WP_Post` instance on success or error message on failure.
61+
*/
62+
public function render_snippetz( $attributes ) {
63+
$id = absint( $attributes['snippetId'] );
64+
$class = isset( $attributes['className'] ) ? $attributes['className'] : '';
65+
66+
$snippet_type = Functions::get_snippet_type( get_post( $id ) );
67+
68+
$output = Functions::get_snippet_content(
69+
$id,
70+
array(
71+
'class' => $class,
72+
'is_block' => true,
73+
)
74+
);
75+
76+
if ( 'js' === $snippet_type || 'css' === $snippet_type ) {
77+
$output = Functions::wrap_output( $output, $snippet_type );
78+
}
79+
80+
return $output;
81+
}
82+
}

‎includes/frontend/blocks/src/snippetz/block.json

+27
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,27 @@
1+
{
2+
"$schema": "https://schemas.wp.org/trunk/block.json",
3+
"apiVersion": 3,
4+
"name": "webberzone/snippetz",
5+
"version": "2.1.0",
6+
"title": "WebberZone Snippetz",
7+
"category": "widgets",
8+
"icon": "editor-code",
9+
"description": "Display a snippet with this Gutenberg block.",
10+
"keywords": ["snippet", "code", "html", "css", "javascript"],
11+
"attributes": {
12+
"className": {
13+
"type": "string",
14+
"default": ""
15+
},
16+
"snippetId": {
17+
"type": "number",
18+
"default": 0
19+
}
20+
},
21+
"example": {},
22+
"supports": {
23+
"html": false
24+
},
25+
"textdomain": "add-to-all",
26+
"editorScript": "file:./index.js"
27+
}

‎includes/frontend/blocks/src/snippetz/components/SnippetSelector.js

+87
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,87 @@
1+
/**
2+
* WordPress dependencies
3+
*/
4+
import { __ } from '@wordpress/i18n';
5+
import { ComboboxControl } from '@wordpress/components';
6+
import { useSelect } from '@wordpress/data';
7+
import { store as coreDataStore } from '@wordpress/core-data';
8+
import { useState } from '@wordpress/element';
9+
10+
/**
11+
* Get formatted label with snippet type
12+
*
13+
* @param {Object} snippet Snippet object with title and meta
14+
* @return {string} Formatted label
15+
*/
16+
const getFormattedLabel = (snippet) => {
17+
const title = snippet.title.rendered || __('(No title)', 'add-to-all');
18+
const type = snippet.meta._ata_snippet_type || 'html';
19+
return `${title} (${type.toUpperCase()})`;
20+
};
21+
22+
/**
23+
* SnippetSelector component for selecting a snippet from the available snippets.
24+
*
25+
* @param {Object} props Component props.
26+
* @param {number} props.value Currently selected snippet ID.
27+
* @param {Function} props.onChange Callback function when selection changes.
28+
* @return {Element} Component to render.
29+
*/
30+
export default function SnippetSelector({ value, onChange }) {
31+
const [searchInput, setSearchInput] = useState('');
32+
33+
const { snippets, selectedSnippet, isLoading } = useSelect(
34+
(select) => {
35+
const { getEntityRecords, getEntityRecord } = select(coreDataStore);
36+
const query = {
37+
per_page: 20,
38+
_fields: ['id', 'title', 'meta'],
39+
orderby: 'title',
40+
order: 'asc',
41+
search: searchInput || undefined,
42+
};
43+
44+
return {
45+
snippets: getEntityRecords('postType', 'ata_snippets', query),
46+
selectedSnippet: value
47+
? getEntityRecord('postType', 'ata_snippets', value, {
48+
_fields: ['id', 'title', 'meta'],
49+
})
50+
: null,
51+
isLoading: select(coreDataStore).isResolving(
52+
'getEntityRecords',
53+
['postType', 'ata_snippets', query]
54+
),
55+
};
56+
},
57+
[searchInput, value]
58+
);
59+
60+
const options = (snippets || []).map((snippet) => ({
61+
value: snippet.id,
62+
label: getFormattedLabel(snippet),
63+
}));
64+
65+
// If we have a selected value but it's not in the current options,
66+
// add it to the options list
67+
if (selectedSnippet && !options.find((option) => option.value === value)) {
68+
options.unshift({
69+
value: selectedSnippet.id,
70+
label: getFormattedLabel(selectedSnippet),
71+
});
72+
}
73+
74+
return (
75+
<ComboboxControl
76+
__next40pxDefaultSize
77+
__nextHasNoMarginBottom
78+
label={__('Choose Snippet', 'add-to-all')}
79+
value={value || 0}
80+
onChange={(newValue) =>
81+
onChange(newValue ? parseInt(newValue, 10) : 0)
82+
}
83+
options={options}
84+
onFilterValueChange={(inputValue) => setSearchInput(inputValue)}
85+
/>
86+
);
87+
}

0 commit comments

Comments
 (0)