| 1 |
import { extendifyLogo } from '@library/icons/extendify-logo'; |
| 2 |
import { useGlobalsStore } from '@library/state/global'; |
| 3 |
import { useActivityStore } from '@shared/state/activity'; |
| 4 |
import { __ } from '@wordpress/i18n'; |
| 5 |
import { Icon } from '@wordpress/icons'; |
| 6 |
|
| 7 |
export const MainButton = () => { |
| 8 |
const { setOpen } = useGlobalsStore(); |
| 9 |
const { incrementActivity } = useActivityStore(); |
| 10 |
|
| 11 |
const handleClick = () => { |
| 12 |
// Minimize HC if its open |
| 13 |
window.dispatchEvent(new CustomEvent('extendify-hc:minimize')); |
| 14 |
setOpen(true); |
| 15 |
incrementActivity('library-button-click'); |
| 16 |
}; |
| 17 |
|
| 18 |
return ( |
| 19 |
// biome-ignore lint: allow a button here |
| 20 |
<div |
| 21 |
role="button" |
| 22 |
tabIndex={0} |
| 23 |
onClick={handleClick} |
| 24 |
onKeyDown={(e) => { |
| 25 |
if (!(e.key === 'Enter' || e.key === ' ')) return; |
| 26 |
handleClick(); |
| 27 |
}} |
| 28 |
className="components-button has-icon is-primary h-8 min-w-0 cursor-pointer px-2 xs:h-9 sm:ml-2 xl:pr-3" |
| 29 |
> |
| 30 |
<Icon |
| 31 |
icon={extendifyLogo(__('Design Library', 'extendify-local'))} |
| 32 |
size={24} |
| 33 |
/> |
| 34 |
<span className="ml-1 hidden xl:inline"> |
| 35 |
{__('Design Library', 'extendify-local')} |
| 36 |
</span> |
| 37 |
</div> |
| 38 |
); |
| 39 |
}; |
| 40 |
|
