ActionFetchButton.js
2 years ago
ActionMessages.js
2 years ago
ActionMessagesSlotFills.js
2 years ago
FetchAjaxButton.js
2 years ago
FetchApiButton.js
2 years ago
PlaceholderMessage.js
2 years ago
RequestButton.js
2 years ago
RequestLoadingButton.js
2 years ago
UseGlobalControl.js
2 years ago
ValidateButton.js
2 years ago
ValidateButtonWithStore.js
2 years ago
ValidateButton.js
50 lines
| 1 | import RequestButton from './RequestButton'; |
| 2 | import useStateValidClasses from '../../hooks/useStateValidClasses'; |
| 3 | |
| 4 | const { |
| 5 | useState, |
| 6 | } = wp.element; |
| 7 | |
| 8 | function ValidateButton( { |
| 9 | initialValid = null, |
| 10 | label, |
| 11 | ajaxArgs = {}, |
| 12 | onValid = () => {}, |
| 13 | onInvalid = () => {}, |
| 14 | } ) { |
| 15 | |
| 16 | const [ buttonProps, setButtonProps ] = useState( {} ); |
| 17 | |
| 18 | const [ |
| 19 | className, |
| 20 | setValidClass, |
| 21 | setInvalidClass, |
| 22 | setLoadingClass, |
| 23 | ] = useStateValidClasses( initialValid || null ); |
| 24 | |
| 25 | const setValid = response => { |
| 26 | setValidClass(); |
| 27 | onValid( response ); |
| 28 | setButtonProps( {} ); |
| 29 | }; |
| 30 | |
| 31 | const setInvalid = () => { |
| 32 | setInvalidClass(); |
| 33 | onInvalid(); |
| 34 | setButtonProps( { isDestructive: true } ); |
| 35 | }; |
| 36 | |
| 37 | return <RequestButton |
| 38 | ajaxArgs={ ajaxArgs } |
| 39 | label={ label } |
| 40 | onLoading={ setLoadingClass } |
| 41 | onSuccessRequest={ setValid } |
| 42 | onFailRequest={ setInvalid } |
| 43 | className={ className } |
| 44 | { ...buttonProps } |
| 45 | > |
| 46 | <i className="dashicons"/> |
| 47 | </RequestButton>; |
| 48 | } |
| 49 | |
| 50 | export default ValidateButton; |