🔪Kitchen Sink Examples #130
Conversation
There was a problem hiding this comment.
Thanks for all the effort you put in this block @braginteractive — I have reviewed it and left comments. Let's improve these sections before merging.
Kudos! 👍
| add_action( 'enqueue_block_editor_assets', 'kitchen_sink_cgb_editor_assets' ); | ||
|
|
||
|
|
||
| // Add custom block category |
There was a problem hiding this comment.
Add a period . at the end of comments.
|
|
||
|  | ||
|
|
||
| ### What/How? |
There was a problem hiding this comment.
- This
README.mdfile has a lot of irrelevant info about the a11y example remove that. - Explain what features you have added + docs links
| const { registerBlockType } = wp.blocks; // Import registerBlockType() from wp.blocks | ||
| const { Fragment } = wp.element; // Import Fragment from wp.elements | ||
|
|
||
| // Register editor components |
There was a problem hiding this comment.
Document addition of each new module. Don't be afraid of commenting about everything. This example is meant to teach people.
| }; | ||
|
|
||
| /** | ||
| * Register: aa Gutenberg Block. |
There was a problem hiding this comment.
aa Gutenberg Block. Maybe rename that aa here. Docs should be up to date. :)
| __("create-guten-block") | ||
| ], | ||
| supports: { | ||
| // Adds block supports: https://wordpress.org/gutenberg/handbook/designers-developers/developers/block-api/block-registration/#supports-optional |
There was a problem hiding this comment.
Add Multiline comments explaining everything and then at the end of the comment give docs links. Adds block supports doesn't help anyone. Explain the What/Why/How.
| exampleImageURL, | ||
| exampleImageAlt | ||
| }, | ||
| attributes, |
There was a problem hiding this comment.
attributes is already there? Why including it again?
| { value: "option_2", label: __("Option 2") } | ||
| ]; | ||
|
|
||
| return [ |
There was a problem hiding this comment.
Explain in details how the JSX going to be for the block. The real HTML and the Wrappers. Without this explanation example is not going to be helpful.
| {/* Toggle Switch */} | ||
| <ToggleControl | ||
| label={__("Example Toggle")} | ||
| checked={!!exampleToggle} |
There was a problem hiding this comment.
Explain !! — remember WordPress community is new to JS. :)
| * @link https://wordpress.org/gutenberg/handbook/block-api/block-edit-save/ | ||
| */ | ||
| save: function(props) { | ||
| // Attributes for the frontend |
There was a problem hiding this comment.
Same as above. Detailed docs would be awesome! 💯
| exampleImageURL, | ||
| exampleImageAlt | ||
| }, | ||
| attributes, |
There was a problem hiding this comment.
Again repetition of attributes is wrong — JS objects should have unique keys.
|
One more thing, @braginteractive — kindly use Emoji-log for writing git commits. |
|
@ahmadawais I am learning some of this myself. Any examples and improvements that you can provide would help! |
|
@braginteractive Trust yourself. You're making really good progress. Let's document and ship this Kitchen Sink Example next year. |
|
Also go through the changes requested and resolve all of these 👍 |
Here is the start of the Kitchen Sink example. Let me know what you think/suggestions.