Browse Source

ConfirmationModal in Account screen

master
GabrielTrettel 3 years ago
parent
commit
3e974fbc34
  1. 68
      src/app/components/ConfirmationModal.js

68
src/app/components/ConfirmationModal.js

@ -1,20 +1,12 @@
import React from "react"; import React from "react";
import {
Modal,
StyleSheet,
Text,
TouchableHighlight,
View,
} from "react-native";
import { MaterialCommunityIcons } from "@expo/vector-icons";
import { Modal, StyleSheet, Text, TouchableOpacity, View } from "react-native";
import colors from "../config/colors"; import colors from "../config/colors";
import { dimensions } from "../config/dimensions"; import { dimensions } from "../config/dimensions";
import { TouchableOpacity } from "react-native-gesture-handler";
function Btn({ label, onPress, bgColor, txtColor }) { function Btn({ label, onPress, bgColor, txtColor }) {
console.log("pimba");
return ( return (
<TouchableOpacity onPress={() => onPress()}>
<TouchableOpacity onPress={onPress}>
<View <View
style={{ style={{
paddingHorizontal: 30, paddingHorizontal: 30,
@ -46,32 +38,44 @@ export default function ConfirmationModal({
visible={show} visible={show}
supportedOrientations={["portrait"]} supportedOrientations={["portrait"]}
> >
<View style={styles.container}>
<View style={{ flex: 1 }}>
<Text style={[styles.text, { fontSize: dimensions.text.secondary }]}>
{title}
</Text>
</View>
<Text style={styles.text}>{description}</Text>
<TouchableOpacity onPress={onDecline}>
<View <View
style={{ style={{
flexDirection: "row",
justifyContent: "space-evenly",
marginTop: 24,
width: "100%",
height: "100%",
justifyContent: "center",
}} }}
> >
<Btn
label={confirmationLabel}
onPress={onConfirm}
bgColor={colors.secondary}
/>
<Btn
label={declineLabel}
onPress={onDecline}
bgColor={colors.lightGray}
/>
<View style={styles.container}>
<View style={{ flex: 1 }}>
<Text
style={[styles.text, { fontSize: dimensions.text.secondary }]}
>
{title}
</Text>
</View>
<Text style={styles.text}>{description}</Text>
<View
style={{
flexDirection: "row",
justifyContent: "space-evenly",
marginTop: 24,
}}
>
<Btn
label={confirmationLabel}
onPress={onConfirm}
bgColor={colors.secondary}
/>
<Btn
label={declineLabel}
onPress={onDecline}
bgColor={colors.lightGray}
/>
</View>
</View>
</View> </View>
</View>
</TouchableOpacity>
</Modal> </Modal>
); );
} }

Loading…
Cancel
Save