| 1 |
import React from 'react'; |
| 2 |
|
| 3 |
import Tooltip from './Tooltip'; |
| 4 |
|
| 5 |
import '../../css/admin/shared/button.scss'; |
| 6 |
|
| 7 |
const Button = (props) => { |
| 8 |
let buttonDisabled = false; |
| 9 |
let tooltipContent = props.help ? props.help : false; |
| 10 |
let className = 'button'; |
| 11 |
|
| 12 |
// Check if there are requirements. |
| 13 |
if ( props.required ) { |
| 14 |
if ( ! wpupg_admin.addons.hasOwnProperty( props.required ) || true !== wpupg_admin.addons[ props.required ] ) { |
| 15 |
buttonDisabled = true; |
| 16 |
const capitalized = props.required[0].toUpperCase() + props.required.substring(1); |
| 17 |
tooltipContent = `WP Ultimate Post Grid ${capitalized} Bundle Only`; |
| 18 |
} |
| 19 |
} |
| 20 |
|
| 21 |
// Extra class if primary button. |
| 22 |
if ( props.isPrimary ) { |
| 23 |
className += ' button-primary'; |
| 24 |
} |
| 25 |
|
| 26 |
// Extra class if disabled. Don't actually use disabled or tooltip won't work. |
| 27 |
if ( buttonDisabled ) { |
| 28 |
className += ' wpupg-button-required'; |
| 29 |
} |
| 30 |
|
| 31 |
return ( |
| 32 |
<Tooltip content={ tooltipContent }> |
| 33 |
<button |
| 34 |
className={ className } |
| 35 |
tabIndex={ props.disableTab ? '-1' : null } |
| 36 |
onClick={ buttonDisabled ? () => { |
| 37 |
if ( confirm( 'Want to learn more about the version required for this feature?' ) ) { |
| 38 |
window.open( 'https://bootstrapped.ventures/wp-ultimate-post-grid/get-the-plugin/', '_blank' ); |
| 39 |
} |
| 40 |
} : props.onClick } |
| 41 |
> |
| 42 |
{ props.children } |
| 43 |
</button> |
| 44 |
</Tooltip> |
| 45 |
); |
| 46 |
} |
| 47 |
|
| 48 |
export default Button; |
