controls.js
4 weeks ago
edit.js
4 weeks ago
fields-filters.js
4 weeks ago
fields-html-markup.js
4 weeks ago
fields-main.js
4 weeks ago
fields-post-settings.js
4 weeks ago
fields-stats-tag.js
4 weeks ago
controls.js
29 lines
| 1 | const { useState } = wp.element; |
| 2 | const { BlockControls } = wp.blockEditor; |
| 3 | const { ToolbarGroup, ToolbarButton } = wp.components; |
| 4 | const { __ } = wp.i18n; |
| 5 | |
| 6 | export function Controls({ attributes, setAttributes }) { |
| 7 | const [editMode, setEditMode] = useState(!!attributes._editMode); |
| 8 | |
| 9 | const changeRenderMode = () => { |
| 10 | const newEditMode = ! editMode; |
| 11 | setEditMode(newEditMode); |
| 12 | setAttributes({ _editMode: newEditMode }); |
| 13 | }; |
| 14 | |
| 15 | const toolbarLabel = editMode ? __('Preview', 'wordpress-popular-posts') : __('Edit', 'wordpress-popular-posts'); |
| 16 | const toolbarIcon = editMode ? 'format-image' : 'edit'; |
| 17 | |
| 18 | return ( |
| 19 | <BlockControls> |
| 20 | <ToolbarGroup> |
| 21 | <ToolbarButton |
| 22 | label={ toolbarLabel } |
| 23 | icon={ toolbarIcon } |
| 24 | onClick={ changeRenderMode } |
| 25 | /> |
| 26 | </ToolbarGroup> |
| 27 | </BlockControls> |
| 28 | ); |
| 29 | } |