Add commit buttons in form instead of on navigation (#5419)
* Add commit buttons in form instead of on navigation * Fix style
This commit is contained in:
parent
9fafc3be5b
commit
f0c9aa75fc
2 changed files with 34 additions and 23 deletions
|
|
@ -88,24 +88,17 @@ export function doAppCall<Res=unknown>(call: AppCallRequest, type: AppCallType,
|
|||
const showAppForm = async (form: AppForm, call: AppCallRequest, theme: Theme) => {
|
||||
const closeButton = await CompassIcon.getImageSource('close', 24, theme.sidebarHeaderTextColor);
|
||||
|
||||
let submitButtons = [{
|
||||
id: 'submit-form',
|
||||
showAsAction: 'always',
|
||||
text: 'Submit',
|
||||
}];
|
||||
if (form.submit_buttons) {
|
||||
const options = form.fields.find((f) => f.name === form.submit_buttons)?.options;
|
||||
const newButtons = options?.map((o) => {
|
||||
return {
|
||||
id: 'submit-form_' + o.value,
|
||||
showAsAction: 'always',
|
||||
text: o.label,
|
||||
};
|
||||
});
|
||||
if (newButtons && newButtons.length > 0) {
|
||||
submitButtons = newButtons;
|
||||
}
|
||||
let submitButtons;
|
||||
const customSubmitButtons = form.submit_buttons && form.fields.find((f) => f.name === form.submit_buttons)?.options;
|
||||
|
||||
if (!customSubmitButtons?.length) {
|
||||
submitButtons = [{
|
||||
id: 'submit-form',
|
||||
showAsAction: 'always',
|
||||
text: 'Submit',
|
||||
}];
|
||||
}
|
||||
|
||||
const options = {
|
||||
topBar: {
|
||||
leftButtons: [{
|
||||
|
|
|
|||
|
|
@ -3,9 +3,10 @@
|
|||
|
||||
import {intlShape} from 'react-intl';
|
||||
import React, {PureComponent} from 'react';
|
||||
import {ScrollView, View} from 'react-native';
|
||||
import {ScrollView, Text, View} from 'react-native';
|
||||
import {EventSubscription, Navigation} from 'react-native-navigation';
|
||||
import {SafeAreaView} from 'react-native-safe-area-context';
|
||||
import Button from 'react-native-button';
|
||||
|
||||
import {AppCallResponseTypes} from '@mm-redux/constants/apps';
|
||||
import {AppCallRequest, AppField, AppForm, AppFormValue, AppFormValues, AppLookupResponse, AppSelectOption, FormResponseData} from '@mm-redux/types/apps';
|
||||
|
|
@ -22,6 +23,7 @@ import {getMarkdownBlockStyles, getMarkdownTextStyles} from '@utils/markdown';
|
|||
import {preventDoubleTap} from '@utils/tap';
|
||||
import {changeOpacity, makeStyleSheetFromTheme} from '@utils/theme';
|
||||
import {DoAppCallResult} from 'types/actions/apps';
|
||||
import {GlobalStyles} from 'app/styles';
|
||||
|
||||
import AppsFormField from './apps_form_field';
|
||||
import DialogIntroductionText from './dialog_introduction_text';
|
||||
|
|
@ -107,11 +109,6 @@ export default class AppsFormComponent extends PureComponent<Props, State> {
|
|||
return;
|
||||
case 'close-dialog':
|
||||
this.handleHide();
|
||||
return;
|
||||
}
|
||||
|
||||
if (buttonId.startsWith('submit-form_')) {
|
||||
this.handleSubmit(buttonId.substr('submit-form_'.length));
|
||||
}
|
||||
}
|
||||
|
||||
|
|
@ -333,6 +330,8 @@ export default class AppsFormComponent extends PureComponent<Props, State> {
|
|||
const {formError, fieldErrors, values} = this.state;
|
||||
const style = getStyleFromTheme(theme);
|
||||
|
||||
const submitButtons = fields && fields.find((f) => f.name === form.submit_buttons);
|
||||
|
||||
return (
|
||||
<SafeAreaView
|
||||
testID='interactive_dialog.screen'
|
||||
|
|
@ -373,6 +372,19 @@ export default class AppsFormComponent extends PureComponent<Props, State> {
|
|||
/>
|
||||
);
|
||||
})}
|
||||
<View
|
||||
style={{marginHorizontal: 5}}
|
||||
>
|
||||
{submitButtons?.options?.map((o) => (
|
||||
<Button
|
||||
key={o.value}
|
||||
onPress={() => this.handleSubmit(o.value)}
|
||||
containerStyle={GlobalStyles.signupButton}
|
||||
>
|
||||
<Text style={GlobalStyles.signupButtonText}>{o.label}</Text>
|
||||
</Button>
|
||||
))}
|
||||
</View>
|
||||
</ScrollView>
|
||||
</SafeAreaView>
|
||||
);
|
||||
|
|
@ -403,6 +415,12 @@ const getStyleFromTheme = makeStyleSheetFromTheme((theme: Theme) => {
|
|||
marginBottom: 20,
|
||||
marginTop: 10,
|
||||
},
|
||||
button: {
|
||||
alignSelf: 'stretch',
|
||||
backgroundColor: theme.sidebarHeaderBg,
|
||||
borderRadius: 3,
|
||||
padding: 15,
|
||||
},
|
||||
errorLabel: {
|
||||
fontSize: 12,
|
||||
textAlign: 'left',
|
||||
|
|
|
|||
Loading…
Reference in a new issue