Added registration functionality

This commit is contained in:
keannu125 2023-04-16 13:52:19 +08:00
parent c3fe00f8f5
commit b1c26ba992

View file

@ -1,56 +1,72 @@
import * as React from 'react'; import * as React from "react";
import {View, Text, TextInput} from 'react-native'; import { View, Text, TextInput } from "react-native";
import styles from '../../styles'; import styles from "../../styles";
import Background from '../../Components/Background/Background'; import Background from "../../Components/Background/Background";
import { SafeAreaView } from 'react-native-safe-area-context'; import { SafeAreaView } from "react-native-safe-area-context";
import { useState } from "react"; import { useState } from "react";
import {TouchableOpacity} from "react-native"; import { TouchableOpacity } from "react-native";
import { UserRegister } from "../../Components/Api/Api";
export default function Register() { export default function Register() {
const [username, setUsername] = useState(""); const [username, setUsername] = useState("");
const [email, setEmail] = useState(""); const [email, setEmail] = useState("");
const [password, setPassword] = useState(""); const [password, setPassword] = useState("");
const [feedback, setFeedback] = useState("");
return ( return (
<Background> <Background>
<Text style={{...styles.text_white, ...{fontSize: 32}}}></Text> <Text style={{ ...styles.text_white, ...{ fontSize: 32 } }}></Text>
<SafeAreaView> <SafeAreaView>
<View style={styles.container}> <View style={styles.container}>
<Text style ={styles.loginlabel}>Create an Account</Text> <Text style={styles.loginlabel}>Create an Account</Text>
<View style={styles.inputView}>
<TextInput
style={styles.TextInput}
placeholder="Email"
placeholderTextColor="white"
onChangeText={setEmail}
value={email}
/>
</View>
<View style={styles.inputView}> <View style={styles.inputView}>
<TextInput <TextInput
style={styles.TextInput} style={styles.TextInput}
placeholder="Username" placeholder="Email"
placeholderTextColor="white" placeholderTextColor="white"
onChangeText={setUsername} onChangeText={setEmail}
value={username} value={email}
/> />
</View> </View>
<View style={styles.inputView}> <View style={styles.inputView}>
<TextInput <TextInput
style={styles.TextInput} style={styles.TextInput}
placeholder="Password" placeholder="Username"
placeholderTextColor="white" placeholderTextColor="white"
secureTextEntry={true} onChangeText={setUsername}
onChangeText={setPassword} value={username}
value={password} />
/> </View>
</View> <View style={styles.inputView}>
<TouchableOpacity style={styles.registerbtn}> <TextInput
<Text style={styles.registertext}>REGISTER</Text> style={styles.TextInput}
</TouchableOpacity> placeholder="Password"
</View> placeholderTextColor="white"
secureTextEntry={true}
onChangeText={setPassword}
value={password}
/>
</View>
<TouchableOpacity
onPress={async () => {
setUsername("");
setPassword("");
console.log("heh");
if (await UserRegister({ username, email, password })) {
setFeedback(
"Registration success. Please check your email address for activation"
);
} else {
setFeedback("Invalid credentials specified");
}
}}
style={styles.registerbtn}
>
<Text style={styles.registertext}>REGISTER</Text>
</TouchableOpacity>
<Text style={styles.registertext}>{feedback}</Text>
</View>
</SafeAreaView> </SafeAreaView>
</Background> </Background>
); );
} }