Fakultas Ilmu Komputer UI

Commit 43bea8ea authored by Ahmad Izzudin Alifyandra's avatar Ahmad Izzudin Alifyandra
Browse files

FEAT: Integrate auth backend actions with FE auth screens

parent 6d2c6e0f
......@@ -4,14 +4,10 @@ import BottomTabNavigator from "./BottomTabNavigator";
import { RootStackParamList } from "../types/navigation";
import AuthStackNavigator from "./AuthStackNavigator";
import SuccessChangePasswordScreen from "../screens/SuccessChangePasswordScreen";
import { IUser } from "../types/firebase/User";
import { RootState } from "../redux/store";
import { IUser } from "../types/firestore/User";
import { useAppDispatch, useAppSelector } from "../hooks/reduxHooks";
import { getCurrentAuthUser } from "../service/firebase/auth";
import { getUser } from "../redux/user/actions";
import OnBoardingScreen from "../screens/auth/OnBoardingScreen";
import LandingScreen from "../screens/auth/LandingScreen";
import { useDispatch } from "react-redux";
import firebase from "firebase";
import { Alert } from "react-native";
......
import { Dispatch } from "react-redux/node_modules/@types/react";
import * as userService from "../../service/firestore/user";
import { IUser } from "../../types/firebase/User";
import { IUser } from "../../types/firestore/User";
import * as authService from "../../service/firebase/auth";
export const getUser = (uid: string) => {
......@@ -23,7 +23,7 @@ export const setProfilePic = (url: string, id: string) => {
try {
await userService.addProfilePic(url, id);
dispatch({ type: "SET_PIC", payload: { ...getState, pic: url } });
dispatch({ type: "SET_PIC", payload: { pic: url } });
} catch (e) {
console.log(e);
}
......@@ -39,7 +39,7 @@ export const loginUser = (email: string, password: string) => {
const uid = userCredential.user.uid;
dispatch(getUser(uid));
return dispatch(getUser(uid));
} catch (e) {
console.log(e);
}
......@@ -65,7 +65,7 @@ export const changePassword = (oldPassword: string, newPassword: string) => {
await authService.reauthenticateUser(credential);
await authService.changePassword(newPassword);
dispatch({ type: "CHANGE_PASSWORD" });
return dispatch({ type: "CHANGE_PASSWORD" });
} catch (e) {
console.log(e);
}
......
import { AnyAction } from "redux";
import { IUser } from "../../types/firebase/User";
import { IUser } from "../../types/firestore/User";
const initialState: IUser = {
id: "",
......@@ -8,6 +8,7 @@ const initialState: IUser = {
phone: "",
email: "",
pic: "",
businessType: "",
};
const userReducer = (state = initialState, action: AnyAction): IUser => {
......@@ -18,7 +19,7 @@ const userReducer = (state = initialState, action: AnyAction): IUser => {
case "LOGOUT":
return initialState;
case "SET_PIC":
return action.payload as IUser;
return { ...state, pic: action.payload } as IUser;
case "CHANGE_PASSWORD":
return state;
case "SIGNUP":
......
......@@ -9,11 +9,19 @@ import { Text, View } from "../../components/Themed";
import Colors from "../../constants/Colors";
import { RootTabScreenProps } from "../../types/navigation";
import Spacer from "../../components/Spacer/Spacer";
import { useAppDispatch } from "../../hooks/reduxHooks";
import { loginUser } from "../../redux/user/actions";
const LoginScreen = ({ navigation }: RootTabScreenProps<"TabOne">) => {
const nav = useNavigation();
const [email, setEmail] = useState("");
const [password, setPassword] = useState("");
const dispatch = useAppDispatch();
const handleSubmit = () => {
dispatch(loginUser(email, password));
};
return (
<View style={styles.container}>
<View style={styles.componentWrapper}>
......@@ -60,11 +68,7 @@ const LoginScreen = ({ navigation }: RootTabScreenProps<"TabOne">) => {
</View>
<Spacer variant={"xl"} />
<View style={styles.componentWrapper}>
<MainButton
text="Masuk"
colors="primary"
onPress={() => nav.navigate("Profile", { screen: "ProfileScreen" })}
/>
<MainButton text="Masuk" colors="primary" onPress={handleSubmit} />
</View>
<Spacer variant={"l"} />
<View style={styles.componentWrapper}>
......
......@@ -15,6 +15,8 @@ import { RootTabScreenProps } from "../../types/navigation";
import { useNavigation } from "@react-navigation/core";
import { validateEmail, validateEmpty } from "../../helpers/Validators";
import RegisterGoogleFacebookScreen from "./RegisterGoogleFacebookScreen";
import { useAppDispatch } from "../../hooks/reduxHooks";
import { signupUser } from "../../redux/user/actions";
const RegisterScreen = ({ navigation }: RootTabScreenProps<"TabOne">) => {
const nav = useNavigation();
......@@ -29,7 +31,7 @@ const RegisterScreen = ({ navigation }: RootTabScreenProps<"TabOne">) => {
{ label: "Agrikultur", value: "B" },
{ label: "Pertanian", value: "D" },
]);
const dispatch = useAppDispatch();
// useEffect(() => {
// getCategories().then((res) =>
// setCategories(ddConverter<ICategory>("name", "id", res))
......@@ -45,12 +47,9 @@ const RegisterScreen = ({ navigation }: RootTabScreenProps<"TabOne">) => {
validateEmpty(password) &&
validateEmpty(picked)
) {
setIsError(true);
dispatch(signupUser(firstName, lastName, email, password));
} else {
setIsError(false);
}
if (!isError) {
//TODO: Register User
setIsError(true);
}
};
......
......@@ -11,21 +11,22 @@ import Spacer from "../../components/Spacer/Spacer";
import { pickImage, uploadImgToFirebase } from "../../helpers/images";
import { ImageInfo } from "expo-image-picker/build/ImagePicker.types";
import { setProfilePic } from "../../redux/user/actions";
import { IUser } from "../../types/firebase/User";
import { IUser } from "../../types/firestore/User";
import { useAppDispatch, useAppSelector } from "../../hooks/reduxHooks";
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 user: IUser = useAppSelector((state) => state.user);
const [namaDepan, setNamaDepan] = useState(user.firstName);
const [namaBelakang, setNamaBelakang] = useState(user.lastName);
const [email, setEmail] = useState(user.email);
const [hp, setHp] = useState(user.phone);
const [bisnis, setBisnis] = useState(user.businessType);
const nav = useNavigation();
const [isLoading, setIsLoading] = useState(false);
const dispatch = useAppDispatch();
const user: IUser = useAppSelector((state) => state.user);
const handlePickImage = () => {
setIsLoading(true);
pickImage().then((res) => {
......
......@@ -6,19 +6,28 @@ import MainButton from "../../components/button/MainButton";
import IconForm from "../../components/Forms/IconForm";
import Spacer from "../../components/Spacer/Spacer";
import Colors from "../../constants/Colors";
import { useAppDispatch } from "../../hooks/reduxHooks";
import { RootTabScreenProps } from "../../types/navigation";
import { useDispatch } from "react-redux";
import { changePassword } from "../../redux/user/actions";
const ChangePasswordScreen = ({
navigation,
}: RootTabScreenProps<"Profile">) => {
const nav = useNavigation();
const dispatch = useDispatch();
const [oldPassword, onChangeOldPassword] = useState("");
const [newPassword, onChangeNewPassword] = useState("");
const dispatch = useAppDispatch();
const handleSubmit = () => {
Keyboard.dismiss();
// eslint-disable-next-line @typescript-eslint/no-unsafe-call
dispatch(changePassword(oldPassword, newPassword)).then(() =>
nav.navigate("SuccessChangePassword")
);
};
return (
<View style={styles.container}>
<Spacer variant={"xl"} />
......@@ -34,7 +43,7 @@ const ChangePasswordScreen = ({
</View>
<Spacer variant={"m"} />
<View style={styles.componentWrapper}>
<TouchableOpacity
<TouchableOpacity
onPress={() => {
nav.navigate("Auth", { screen: "InputForgotPassword" });
}}
......@@ -57,13 +66,7 @@ const ChangePasswordScreen = ({
<View style={styles.componentWrapper}>
<MainButton
text={"Ganti Password"}
onPress={() => {
Keyboard.dismiss();
dispatch(changePassword(oldPassword, newPassword));
onChangeOldPassword("");
onChangeNewPassword("");
nav.navigate("SuccessChangePassword");
}}
onPress={handleSubmit}
colors={"Secondary"}
/>
</View>
......
import { useNavigation } from "@react-navigation/core";
import * as React from "react";
import { useState } from "react";
import { StyleSheet, Image } from "react-native";
import { StyleSheet, Image, TouchableOpacity } from "react-native";
import { Text, View } from "../../components/Themed";
import Colors from "../../constants/Colors";
import { RootTabScreenProps } from "../../types/navigation";
......@@ -9,15 +10,21 @@ import SmallButton from "../../components/button/SmallButton";
import { Title } from "react-native-paper";
import { MaterialIcons } from "@expo/vector-icons";
import Spacer from "../../components/Spacer/Spacer";
import { useSelector } from "react-redux";
import { RootState } from "../../redux/store";
import { IUser } from "../../types/firebase/User";
import { useAppDispatch, useAppSelector } from "../../hooks/reduxHooks";
import { logoutUser } from "../../redux/user/actions";
import { IUser } from "../../types/firestore/User";
export default function ProfileScreen({
navigation,
}: RootTabScreenProps<"Profile">) {
const nav = useNavigation();
const user: IUser = useSelector((state: RootState) => state.user);
const user: IUser = useAppSelector((state) => state.user);
const dispatch = useAppDispatch();
// const [image, setImage] = useState("");
const handleExit = () => {
dispatch(logoutUser());
};
return (
<View style={styles.container}>
<View style={styles.imageWrapper}>
......@@ -57,12 +64,12 @@ export default function ProfileScreen({
</View>
</View>
<Spacer variant={"xl"} />
<View style={styles.imageWrapper}>
<TouchableOpacity style={styles.imageWrapper} onPress={handleExit}>
<MaterialIcons name={"exit-to-app"} style={styles.iconExit} size={30} />
<View style={styles.textWrapper}>
<Text style={styles.textExit}>Keluar</Text>
</View>
</View>
</TouchableOpacity>
</View>
);
}
......
......@@ -5,4 +5,5 @@ export type IUser = {
email: string;
phone: string;
pic: string;
businessType?: string;
};
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