| 1 |
import { subscribe } from '@wordpress/data' |
| 2 |
import { render } from '@wordpress/element' |
| 3 |
import { CtaButton, MainButtonWrapper } from '@library/components/MainButtons' |
| 4 |
|
| 5 |
const userState = window.extendifyData?.user?.state |
| 6 |
const isAdmin = () => window.extendifyData.user === null || userState?.isAdmin |
| 7 |
|
| 8 |
// Add the MAIN button when Gutenberg is available and ready |
| 9 |
subscribe(() => { |
| 10 |
requestAnimationFrame(() => { |
| 11 |
if (document.getElementById('extendify-templates-inserter')) { |
| 12 |
return |
| 13 |
} |
| 14 |
if ( |
| 15 |
!document.querySelector('.edit-post-header-toolbar') && |
| 16 |
!document.querySelector('.edit-site-header-edit-mode__start') // FSE |
| 17 |
) { |
| 18 |
return |
| 19 |
} |
| 20 |
const buttonContainer = Object.assign(document.createElement('div'), { |
| 21 |
id: 'extendify-templates-inserter', |
| 22 |
}) |
| 23 |
// Standard block editor |
| 24 |
document |
| 25 |
.querySelector('.edit-post-header-toolbar') |
| 26 |
?.append(buttonContainer) |
| 27 |
// FSE block editor |
| 28 |
document |
| 29 |
.querySelector('.edit-site-header-edit-mode__start') |
| 30 |
?.append(buttonContainer) |
| 31 |
|
| 32 |
render(<MainButtonWrapper />, buttonContainer) |
| 33 |
}) |
| 34 |
}) |
| 35 |
|
| 36 |
// The CTA button inside patterns |
| 37 |
subscribe(() => { |
| 38 |
requestAnimationFrame(() => { |
| 39 |
if (!isAdmin()) return |
| 40 |
if (!document.querySelector('[id$=patterns-view]')) return |
| 41 |
if (document.getElementById('extendify-cta-button')) return |
| 42 |
|
| 43 |
const ctaButtonContainer = Object.assign( |
| 44 |
document.createElement('div'), |
| 45 |
{ id: 'extendify-cta-button-container' }, |
| 46 |
) |
| 47 |
|
| 48 |
document |
| 49 |
.querySelector('[id$=patterns-view]') |
| 50 |
.prepend(ctaButtonContainer) |
| 51 |
render(<CtaButton />, ctaButtonContainer) |
| 52 |
}) |
| 53 |
}) |
| 54 |
|
