diff --git a/src/components/FormAlertWithSubmitButton.js b/src/components/FormAlertWithSubmitButton.js index 82cff4bf3838..15ae0facabef 100644 --- a/src/components/FormAlertWithSubmitButton.js +++ b/src/components/FormAlertWithSubmitButton.js @@ -17,46 +17,53 @@ import networkPropTypes from './networkPropTypes'; import {withNetwork} from './OnyxProvider'; const propTypes = { + /** Text for the button */ + buttonText: PropTypes.string, + + /** Allow custom buttons and components to be wrapped by FormAlertWithSubmitButton */ + children: PropTypes.node, + + /** Styles for container element */ + containerStyles: PropTypes.arrayOf(PropTypes.object), + /** Whether to show the alert text */ - isAlertVisible: PropTypes.bool.isRequired, + isAlertVisible: PropTypes.bool, /** Whether the button is disabled */ isDisabled: PropTypes.bool, - /** Submit function */ - onSubmit: PropTypes.func.isRequired, - - /** Text for the button */ - buttonText: PropTypes.string.isRequired, + /** Is the button in a loading state */ + isLoading: PropTypes.bool, - /** Callback fired when the "fix the errors" link is pressed */ - onFixTheErrorsLinkPressed: PropTypes.func, + /** Whether message is in html format */ + isMessageHtml: PropTypes.bool, /** Error message to display above button */ message: PropTypes.string, - /** Whether message is in html format */ - isMessageHtml: PropTypes.bool, + /** Props to detect online status */ + network: networkPropTypes.isRequired, - /** Styles for container element */ - containerStyles: PropTypes.arrayOf(PropTypes.object), + /** Callback fired when the "fix the errors" link is pressed */ + onFixTheErrorsLinkPressed: PropTypes.func, - /** Is the button in a loading state */ - isLoading: PropTypes.bool, + /** Submit function */ + onSubmit: PropTypes.func, ...withLocalizePropTypes, - - /** Props to detect online status */ - network: networkPropTypes.isRequired, }; const defaultProps = { - message: '', - isDisabled: false, - isMessageHtml: false, + buttonText: '', + children: null, containerStyles: [], + isAlertVisible: false, + isDisabled: false, isLoading: false, + isMessageHtml: false, + message: '', onFixTheErrorsLinkPressed: () => {}, + onSubmit: () => {}, }; const FormAlertWithSubmitButton = (props) => { @@ -102,7 +109,8 @@ const FormAlertWithSubmitButton = (props) => { ); } - if (props.network.isOffline) { + // Display generic offline button unless this component is wrapping custom components + if (props.network.isOffline && !props.children) { return (