diff --git a/src/ONYXKEYS.js b/src/ONYXKEYS.js index 21ff401c72c7..b4d3998db100 100755 --- a/src/ONYXKEYS.js +++ b/src/ONYXKEYS.js @@ -172,6 +172,7 @@ export default { ADD_DEBIT_CARD_FORM: 'addDebitCardForm', REQUEST_CALL_FORM: 'requestCallForm', REIMBURSEMENT_ACCOUNT_FORM: 'reimbursementAccount', + WORKSPACE_SETTINGS_FORM: 'workspaceSettingsForm', }, // Whether we should show the compose input or not diff --git a/src/pages/workspace/WorkspacePageWithSections.js b/src/pages/workspace/WorkspacePageWithSections.js index e9e3fce75e91..973a414b6ac3 100644 --- a/src/pages/workspace/WorkspacePageWithSections.js +++ b/src/pages/workspace/WorkspacePageWithSections.js @@ -56,6 +56,9 @@ const propTypes = { name: PropTypes.string, }).isRequired, + /** Option to use the default scroll view */ + shouldUseScrollView: PropTypes.bool, + ...withLocalizePropTypes, }; @@ -65,6 +68,7 @@ const defaultProps = { reimbursementAccount: {}, footer: null, guidesCallTaskID: '', + shouldUseScrollView: false, }; class WorkspacePageWithSections extends React.Component { @@ -103,16 +107,20 @@ class WorkspacePageWithSections extends React.Component { onBackButtonPress={() => Navigation.navigate(ROUTES.getWorkspaceInitialRoute(policyID))} onCloseButtonPress={() => Navigation.dismissModal()} /> - - - - {this.props.children(hasVBA, policyID, isUsingECard)} - - - + {this.props.shouldUseScrollView + ? ( + + + + {this.props.children(hasVBA, policyID, isUsingECard)} + + + + ) + : this.props.children(hasVBA, policyID, isUsingECard)} {this.props.footer} ); diff --git a/src/pages/workspace/WorkspaceSettingsPage.js b/src/pages/workspace/WorkspaceSettingsPage.js index 40c370abb92b..e778ecf89339 100644 --- a/src/pages/workspace/WorkspaceSettingsPage.js +++ b/src/pages/workspace/WorkspaceSettingsPage.js @@ -1,12 +1,11 @@ import React from 'react'; -import {View} from 'react-native'; +import {Keyboard, View} from 'react-native'; import {withOnyx} from 'react-native-onyx'; import _ from 'underscore'; import lodashGet from 'lodash/get'; import ONYXKEYS from '../../ONYXKEYS'; import withLocalize, {withLocalizePropTypes} from '../../components/withLocalize'; import styles from '../../styles/styles'; -import Button from '../../components/Button'; import Text from '../../components/Text'; import compose from '../../libs/compose'; import * as Policy from '../../libs/actions/Policy'; @@ -17,12 +16,12 @@ import defaultTheme from '../../styles/themes/default'; import CONST from '../../CONST'; import Picker from '../../components/Picker'; import TextInput from '../../components/TextInput'; -import FixedFooter from '../../components/FixedFooter'; import WorkspacePageWithSections from './WorkspacePageWithSections'; import withPolicy, {policyPropTypes, policyDefaultProps} from './withPolicy'; import {withNetwork} from '../../components/OnyxProvider'; import OfflineWithFeedback from '../../components/OfflineWithFeedback'; import FullPageNotFoundView from '../../components/BlockingViews/FullPageNotFoundView'; +import Form from '../../components/Form'; const propTypes = { ...policyPropTypes, @@ -37,11 +36,6 @@ class WorkspaceSettingsPage extends React.Component { constructor(props) { super(props); - this.state = { - name: props.policy.name, - currency: props.policy.outputCurrency, - }; - this.submit = this.submit.bind(this); this.getCurrencyItems = this.getCurrencyItems.bind(this); this.validate = this.validate.bind(this); @@ -58,21 +52,22 @@ class WorkspaceSettingsPage extends React.Component { })); } - submit() { - if (this.props.policy.isPolicyUpdating || !this.validate()) { + submit(values) { + if (this.props.policy.isPolicyUpdating) { return; } - const name = this.state.name.trim(); - const outputCurrency = this.state.currency; + const name = values.name.trim(); + const outputCurrency = values.currency; Policy.updateGeneralSettings(this.props.policy.id, name, outputCurrency); + Keyboard.dismiss(); } - validate() { + validate(values) { const errors = {}; - if (!this.state.name.trim().length) { - errors.nameError = true; + if (!values.name || !values.name.trim().length) { + errors.name = this.props.translate('workspace.editor.nameIsRequiredError'); } - return _.size(errors) === 0; + return errors; } render() { @@ -82,25 +77,15 @@ class WorkspaceSettingsPage extends React.Component { headerText={this.props.translate('workspace.common.settings')} route={this.props.route} guidesCallTaskID={CONST.GUIDES_CALL_TASK_IDS.WORKSPACE_SETTINGS} - footer={( - - Policy.clearWorkspaceGeneralSettingsErrors(this.props.policy.id)} - > -