Fakultas Ilmu Komputer UI

Commit ee3a7eab authored by Bagus Prabowo's avatar Bagus Prabowo
Browse files

Merge branch 'auth-navigate' into 'dev'

Auth navigate

See merge request !39
parents 07b62656 412d13ef
......@@ -2,9 +2,12 @@ import { createNativeStackNavigator } from "@react-navigation/native-stack";
import React from "react";
import LoginScreen from "../screens/auth/LoginScreen";
import { AuthStackParamList } from "../types/navigation";
import RegisterGoogleFacebookScreen from "../screens/auth/RegisterGoogleFacebookScreen";
import RegisterScreen from "../screens/auth/RegisterScreen";
import ForgetPasswordScreen from "../screens/auth/ForgetPasswordScreen";
import OnBoardingScreen from "../screens/auth/OnBoardingScreen";
import LandingScreen from "../screens/auth/LandingScreen";
const AuthStack = createNativeStackNavigator<AuthStackParamList>();
const AuthStackNavigator = () => {
return (
<AuthStack.Navigator>
......@@ -13,6 +16,31 @@ const AuthStackNavigator = () => {
component={LoginScreen}
options={{ headerShown: false }}
/>
<AuthStack.Screen
name="onboarding"
component={OnBoardingScreen}
options={{ headerShown: false }}
/>
<AuthStack.Screen
name="landing"
component={LandingScreen}
options={{ headerShown: false }}
/>
<AuthStack.Screen
name="RegisterGoogle"
component={RegisterGoogleFacebookScreen}
options={{ title: "Register Google/Facebook" }}
/>
<AuthStack.Screen
name="RegisterScreen"
component={RegisterScreen}
options={{ title: "Register" }}
/>
<AuthStack.Screen
name="ForgetPassword"
component={ForgetPasswordScreen}
options={{ title: "Forget Password" }}
/>
</AuthStack.Navigator>
);
};
......
......@@ -4,7 +4,6 @@ import { StyleSheet } from "react-native";
import { TouchableOpacity } from "react-native-gesture-handler";
import MainButton from "../components/button/MainButton";
import SmallButton from "../components/button/SmallButton";
import { Text, View } from "../components/Themed";
import Colors from "../constants/Colors";
import { RootTabScreenProps } from "../types/navigation";
......
import React from "react";
import { StyleSheet } from "react-native";
import { Text, View } from "../../components/Themed";
import { RootTabScreenProps } from "../../types/navigation";
import { useNavigation } from "@react-navigation/core";
const ForgetPasswordScreen = ({ navigation }: RootTabScreenProps<"TabOne">) => {
const nav = useNavigation();
return (
<View style={styles.container}>
<Text>Forget Password Screen</Text>
</View>
);
};
const styles = StyleSheet.create({
container: {
flex: 1,
alignItems: "center",
justifyContent: "center",
},
});
export default ForgetPasswordScreen;
......@@ -2,7 +2,6 @@ import { useNavigation } from "@react-navigation/core";
import * as React from "react";
import { StyleSheet, Image } from "react-native";
import { TouchableOpacity } from "react-native-gesture-handler";
import { View } from "../../components/Themed";
import Colors from "../../constants/Colors";
import { RootTabScreenProps } from "../../types/navigation";
......
......@@ -5,13 +5,13 @@ import { StyleSheet } from "react-native";
import MainButton from "../../components/button/MainButton";
import PlainForm from "../../components/Forms/PlainForm";
import IconForm from "../../components/Forms/IconForm";
import { Text, View } from "../../components/Themed";
import Colors from "../../constants/Colors";
import { RootTabScreenProps } from "../../types/navigation";
import Spacer from "../../components/Spacer/Spacer";
const LoginScreen = () => {
const LoginScreen = ({ navigation }: RootTabScreenProps<"TabOne">) => {
const nav = useNavigation();
const [email, setEmail] = useState("");
const [password, setPassword] = useState("");
return (
......@@ -43,7 +43,10 @@ const LoginScreen = () => {
/>
<Spacer variant={"m"} />
<View style={[styles.textWrapper]}>
<Text style={styles.forgot} onPress={() => {}}>
<Text
style={styles.forgot}
onPress={() => nav.navigate("ForgetPassword")}
>
Lupa password anda?
</Text>
</View>
......@@ -71,7 +74,10 @@ const LoginScreen = () => {
<View style={[styles.textWrapper, { alignItems: "center" }]}>
<Text style={styles.unregistered}>
Belum Punya akun?
<Text style={styles.register} onPress={() => {}}>
<Text
style={styles.register}
onPress={() => nav.navigate("RegisterScreen")}
>
{" "}
Daftar disini
</Text>
......
......@@ -7,8 +7,13 @@ import Spacer from "../../components/Spacer/Spacer";
import MainButton from "../../components/button/MainButton";
import Colors from "../../constants/Colors";
import DropdownForm from "../../components/Forms/DropdownForm";
import { RootTabScreenProps } from "../../types/navigation";
import { useNavigation } from "@react-navigation/core";
const RegisterGoogleFacebookScreen = () => {
const RegisterGoogleFacebookScreen = ({
navigation,
}: RootTabScreenProps<"TabOne">) => {
const nav = useNavigation();
const [firstName, setFirstName] = useState("");
const [lastName, setLastName] = useState("");
const [phoneNo, setPhoneNo] = useState("");
......
......@@ -8,8 +8,11 @@ import IconForm from "../../components/Forms/IconForm";
import Spacer from "../../components/Spacer/Spacer";
import MainButton from "../../components/button/MainButton";
import DropdownForm from "../../components/Forms/DropdownForm";
import { RootTabScreenProps } from "../../types/navigation";
import { useNavigation } from "@react-navigation/core";
const RegisterScreen = () => {
const RegisterScreen = ({ navigation }: RootTabScreenProps<"TabOne">) => {
const nav = useNavigation();
const [firstName, setFirstName] = useState("");
const [lastName, setLastName] = useState("");
const [email, setEmail] = useState("");
......
import { useNavigation } from "@react-navigation/core";
import * as React from "react";
import { Button, StyleSheet } from "react-native";
import { TouchableOpacity } from "react-native-gesture-handler";
import { Button, StyleSheet, Image } from "react-native";
import { ScrollView, TouchableOpacity } from "react-native-gesture-handler";
import PlainForm from "../../components/Forms/PlainForm";
import { useState } from "react";
import { Text, View } from "../../components/Themed";
import Colors from "../../constants/Colors";
import { RootTabScreenProps } from "../../types/navigation";
import Spacer from "../../components/Spacer/Spacer";
export default function AccountSettingsScreen({
navigation,
}: RootTabScreenProps<"Profile">) {
const [namaDepan, setNamaDepan] = useState("");
const [namaBelakang, setNamaBelakang] = useState("");
const [email, setEmail] = useState("");
const [hp, setHp] = useState("");
const [bisnis, setBisnis] = useState("");
const nav = useNavigation();
return (
<View style={styles.container}>
<ScrollView>
{/* <TouchableOpacity onPress={() => nav.navigate("ChangePassword")}>
<Text>Ganti Password</Text>
</TouchableOpacity> */}
<Button
onPress={() => nav.navigate("ChangePassword")}
title="Change Password"
/>
</View>
<View style={styles.container}>
<View style={styles.profileImage}>{/* <Image></Image> */}</View>
<View>
<TouchableOpacity>
<Text style={styles.text}>Ganti Foto</Text>
</TouchableOpacity>
</View>
<Spacer variant="l" />
<View style={{ width: "100%" }}>
<PlainForm
formTitle={"Nama Depan"}
text={namaDepan}
setText={setNamaDepan}
placeholder=""
/>
<Spacer variant="l" />
<PlainForm
formTitle={"Nama Belakang"}
text={namaBelakang}
setText={setNamaBelakang}
placeholder=""
/>
<Spacer variant="l" />
<PlainForm
formTitle={"Email"}
text={email}
setText={setEmail}
placeholder=""
/>
<Spacer variant="l" />
<PlainForm
formTitle={"No. Handphone"}
text={hp}
setText={setHp}
placeholder=""
phone
/>
<Spacer variant="l" />
<PlainForm
formTitle={"Kategori Bisnis"}
text={bisnis}
setText={setBisnis}
placeholder=""
/>
</View>
<Spacer variant="xl" />
<Button
onPress={() => nav.navigate("ChangePassword")}
title="Change Password"
/>
</View>
</ScrollView>
);
}
const styles = StyleSheet.create({
container: {
flex: 1,
alignItems: "center",
justifyContent: "center",
backgroundColor: Colors.background,
padding: 24,
alignItems: "center",
},
title: {
fontSize: 20,
......@@ -40,4 +94,25 @@ const styles = StyleSheet.create({
height: 1,
width: "80%",
},
profileImage: {
alignItems: "center",
width: 100,
height: 100,
borderRadius: 100,
overflow: "hidden",
borderColor: Colors.button.primary.bg,
borderWidth: 2,
marginBottom: 8,
},
image: {
flex: 1,
height: undefined,
width: undefined,
},
text: {
fontSize: 16,
fontWeight: "300",
fontStyle: "normal",
color: Colors.text.link,
},
});
/**
/***
* Learn more about using TypeScript with React Navigation:
* https://reactnavigation.org/docs/typescript/
*/
......@@ -6,6 +6,11 @@ import { NativeStackScreenProps } from "@react-navigation/native-stack";
export type AuthStackParamList = {
Login: undefined;
RegisterGoogle: undefined;
RegisterScreen: undefined;
ForgetPassword: undefined;
onboarding: undefined;
landing: undefined;
};
export type AuthStackScreenProps<Screen extends keyof AuthStackParamList> =
......
......@@ -6,9 +6,10 @@ import { NativeStackScreenProps } from "@react-navigation/native-stack";
export type ProfileStackParamList = {
ChangePassword: undefined;
ProfileScreen: undefined;
AccountSettings: undefined;
TabTwoScreen: undefined;
};
export type ProfileStackScreenProps<
Screen extends keyof ProfileStackParamList
> = NativeStackScreenProps<ProfileStackParamList, Screen>;
......@@ -2668,7 +2668,7 @@
"@react-navigation/native-stack@^6.1.0":
version "6.1.0"
resolved "https://registry.yarnpkg.com/@react-navigation/native-stack/-/native-stack-6.1.0.tgz"
resolved "https://registry.yarnpkg.com/@react-navigation/native-stack/-/native-stack-6.1.0.tgz#32e50d07bc8d9669d65f72dc4ffec2a6cc9ef379"
integrity sha512-ta8JQ9n6e7pxrXJ9/MYH57g0xhlV8rzGvQtni6KvBdWqqk0M5QDqIXaUkzXp2wvLMZp7LQmnD4FI/TGG2mQOKA==
dependencies:
"@react-navigation/elements" "^1.1.0"
......@@ -9250,7 +9250,7 @@ react-timer-mixin@^0.13.4:
react@16.13.1:
version "16.13.1"
resolved "https://registry.yarnpkg.com/react/-/react-16.13.1.tgz"
resolved "https://registry.yarnpkg.com/react/-/react-16.13.1.tgz#2e818822f1a9743122c063d6410d85c1e3afe48e"
integrity sha512-YMZQQq32xHLX0bz5Mnibv1/LHb3Sqzngu7xstSM+vrkE5Kzr9xE0yMByK5kMoTK30YVJE61WfbxIFFvfeDKT1w==
dependencies:
loose-envify "^1.1.0"
......@@ -9328,7 +9328,7 @@ regex-not@^1.0.0, regex-not@^1.0.2:
regexp.prototype.flags@^1.3.1:
version "1.3.1"
resolved "https://registry.npmjs.org/regexp.prototype.flags/-/regexp.prototype.flags-1.3.1.tgz"
resolved "https://registry.yarnpkg.com/regexp.prototype.flags/-/regexp.prototype.flags-1.3.1.tgz#7ef352ae8d159e758c0eadca6f8fcb4eef07be26"
integrity sha512-JiBdRBq91WlY7uRJ0ds7R+dU02i6LKi8r3BuQhNXn+kmeLN+EfHhfjqMRis1zJxnlu88hq/4dx0P2OP3APRTOA==
dependencies:
call-bind "^1.0.2"
......
Supports Markdown
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment