100 lines
2.5 KiB
TypeScript
100 lines
2.5 KiB
TypeScript
import { Link } from "expo-router";
|
|
import { useState } from "react";
|
|
import { Image, ScrollView, Text, View } from "react-native";
|
|
|
|
import { CustomButton } from "@/components/custom-button";
|
|
import { InputField } from "@/components/input-field";
|
|
import { OAuth } from "@/components/oauth";
|
|
import { icons, images } from "@/constants";
|
|
|
|
const SignUp = () => {
|
|
const [form, setForm] = useState({
|
|
name: "",
|
|
email: "",
|
|
password: "",
|
|
});
|
|
|
|
const onSignUpPress = async () => {};
|
|
|
|
return (
|
|
<ScrollView className="flex-1 bg-white">
|
|
<View className="flex-1 bg-white">
|
|
<View className="relative w-full h-[250px]">
|
|
<Image
|
|
source={images.signUpCar}
|
|
alt="Car"
|
|
className="z-0 w-full h-[250px]"
|
|
resizeMode="contain"
|
|
/>
|
|
|
|
<Text className="text-2xl text-black font-JakartaSemiBold absolute bottom-5 left-5">
|
|
Create Your Account
|
|
</Text>
|
|
</View>
|
|
|
|
<View className="p-5">
|
|
<InputField
|
|
label="Name"
|
|
placeholder="Enter your name"
|
|
icon={icons.person}
|
|
value={form.name}
|
|
onChangeText={(value) =>
|
|
setForm((prevForm) => ({
|
|
...prevForm,
|
|
name: value,
|
|
}))
|
|
}
|
|
/>
|
|
|
|
<InputField
|
|
label="Email"
|
|
placeholder="Enter your email"
|
|
icon={icons.email}
|
|
value={form.email}
|
|
onChangeText={(value) =>
|
|
setForm((prevForm) => ({
|
|
...prevForm,
|
|
email: value,
|
|
}))
|
|
}
|
|
/>
|
|
|
|
<InputField
|
|
label="Password"
|
|
placeholder="Enter your password"
|
|
icon={icons.lock}
|
|
secureTextEntry
|
|
value={form.password}
|
|
onChangeText={(value) =>
|
|
setForm((prevForm) => ({
|
|
...prevForm,
|
|
password: value,
|
|
}))
|
|
}
|
|
/>
|
|
|
|
<CustomButton
|
|
title="Sign Up"
|
|
onPress={onSignUpPress}
|
|
className="mt-6"
|
|
/>
|
|
|
|
<OAuth />
|
|
|
|
<Link
|
|
href="/sign-in"
|
|
className="text-lg text-center text-general-200 mt-10"
|
|
>
|
|
<Text>Already have an account? </Text>
|
|
<Text className="text-primary-500">Login</Text>
|
|
</Link>
|
|
</View>
|
|
|
|
{/* Verification Modal */}
|
|
</View>
|
|
</ScrollView>
|
|
);
|
|
};
|
|
|
|
export default SignUp;
|