From 6b42476ef07a81b3eab4798d97fe5f364512ddc8 Mon Sep 17 00:00:00 2001
From: Milan Paunovic <milan.paunovic@visit.com>
Date: Wed, 21 Aug 2024 20:25:15 +0200
Subject: [PATCH] Auth logic rework

---
 app/(auth)/main/index.tsx                  | 385 ++++++++++-----------
 contexts/AuthContext.tsx                   |   6 +-
 hooks/firebase/useAuth.ts                  |  10 +-
 hooks/firebase/useCreateSubUser.ts         |  15 +-
 hooks/firebase/useGetChildrenByParentId.ts |  34 ++
 hooks/firebase/useSignUp.ts                |   4 +
 6 files changed, 254 insertions(+), 200 deletions(-)
 create mode 100644 hooks/firebase/useGetChildrenByParentId.ts

diff --git a/app/(auth)/main/index.tsx b/app/(auth)/main/index.tsx
index 15e53c6..69bd22a 100644
--- a/app/(auth)/main/index.tsx
+++ b/app/(auth)/main/index.tsx
@@ -1,44 +1,45 @@
-import React, { useEffect, useState } from "react";
-import { Text, Button, TextInput } from "react-native";
-import { View, TextField, Picker, Checkbox } from "react-native-ui-lib";
+import React, {useEffect, useState} from "react";
+import {Button, Text, TextInput} from "react-native";
+import {Checkbox, Picker, TextField, View} from "react-native-ui-lib";
 import useAuth from "@/hooks/firebase/useAuth";
 import useChildren from "@/hooks/firebase/useChildren";
 import useCaregivers from "@/hooks/firebase/useCaregivers";
 import {useCreateSubUser} from "@/hooks/firebase/useCreateSubUser";
-import {email} from "@sideway/address";
 import {UserProfile} from "@/hooks/firebase/types/profileTypes";
 import {uuidv4} from "@firebase/util";
+import {useGetChildrenByParentId} from "@/hooks/firebase/useGetChildrenByParentId";
+import {ProfileType, useAuthContext} from "@/contexts/AuthContext";
 
 const Screen: React.FC = () => {
-  const {
-    user,
-    profileType,
-    email,
-    setEmail,
-    password,
-    setPassword,
-    handleLogin,
-    handleSignOut,
-    handleProfileTypeSelection,
-    handleRegister,
+    const {user, profileType, profileData} = useAuthContext()
 
-  } = useAuth();
+    const {
+        email,
+        setEmail,
+        password,
+        setPassword,
+        handleLogin,
+        handleSignOut,
+        handleProfileTypeSelection,
+        handleRegister,
+    } = useAuth();
 
-  const {
-    children,
-    child,
-    setChild,
-    fetchChildren,
-    handleNewChild,
-  } = useChildren(user);
+    const {
+        children,
+        child,
+        setChild,
+        handleNewChild,
+    } = useChildren(user);
 
-  const {
-    caregivers,
-    caregiver,
-    setCaregiver,
-    fetchCaregivers,
-    handleNewCaregiver,
-  } = useCaregivers();
+    const {data: childrenByParentId} = useGetChildrenByParentId()
+
+    const {
+        caregivers,
+        caregiver,
+        setCaregiver,
+        fetchCaregivers,
+        handleNewCaregiver,
+    } = useCaregivers();
 
     const {mutateAsync: createSubUser} = useCreateSubUser()
 
@@ -52,174 +53,172 @@ const Screen: React.FC = () => {
         //     contact: "+381628334",
         //     ...child
         // })
-        await fetchChildren();
         await fetchCaregivers();
-  }
-
-  useEffect(() => {
-    if (user) {
-      fetchChildren();
-      fetchCaregivers();
     }
-  }, [user]);
 
-  
-  const [isParent, setIsParent] = useState<boolean>(false);
-  const [isChild, setIsChild] = useState<boolean>(false);
-  const [isCaregiver, setIsCaregiver] = useState<boolean>(false);
-  
-  useEffect(() => {
-    if (isParent) handleProfileTypeSelection("parent");
-    if (isChild) handleProfileTypeSelection("child");
-    if (isCaregiver) handleProfileTypeSelection("caregiver");
-  }, [isParent, isChild, isCaregiver]);
-  
-  const renderLogin = () => (
-    <View marginH-20>
-      <TextInput placeholder="Email" value={email} onChangeText={setEmail} />
-      <TextInput
-        placeholder="Password"
-        value={password}
-        onChangeText={setPassword}
-        secureTextEntry
-      />
-      <Button title="Login" onPress={handleLogin} />
-      <Button title="Register" onPress={handleRegister} />
-      <Text>Choose Profile Type:</Text>
-      <Checkbox
-        label="Parent"
-        value={isParent}
-        onValueChange={(value) => {
-          setIsParent(value);
-          if (value) {
-            setIsChild(false);
-            setIsCaregiver(false);
-          }
-        }}
-      />
-      <Checkbox
-        label="Child"
-        value={isChild}
-        onValueChange={(value) => {
-          setIsChild(value);
-          if (value) {
-            setIsParent(false);
-            setIsCaregiver(false);
-          }
-        }}
-      />
-      <Checkbox
-        label="Caregiver"
-        value={isCaregiver}
-        onValueChange={(value) => {
-          setIsCaregiver(value);
-          if (value) {
-            setIsParent(false);
-            setIsChild(false);
-          }
-        }}
-      />
-    </View>
-  );
+    useEffect(() => {
+        if (user) {
+            fetchCaregivers();
+        }
+    }, [user]);
 
-  return (
-    <View>
-      {user ? (
-        <View paddingH-20>
-          {profileType === "parent" && <Text>Parent</Text>}
-          {profileType === "child" && <Text>Child</Text>}
-          {profileType === "caregiver" && <Text>Caregiver</Text>}
-          <Button title="Sign Out" onPress={handleSignOut} />
-          <TextField
-            placeholder={"Child Name"}
-            floatingPlaceholder
-            value={child.name}
-            onChangeText={(value) =>
-              setChild((prevChild) => ({
-                ...prevChild,
-                name: value,
-              }))
-            }
-            enableErrors
-            validate={["required", (value: string) => value.length > 6]}
-            validationMessage={[
-              "Field is required",
-              "Name is too short",
-            ]}
-            showCharCounter
-            maxLength={30}
-          />
-          <Button
-            title="Add Child"
-            onPress={() => {
-                createNewSubUser(child);
-            }}
-          />
-          <TextField
-            placeholder={"Caregiver Name"}
-            floatingPlaceholder
-            value={caregiver.name}
-            onChangeText={(value) =>
-              setCaregiver((prevCaregiver) => ({
-                ...prevCaregiver,
-                name: value,
-              }))
-            }
-            enableErrors
-            validate={["required", (value: string) => value.length > 6]}
-            validationMessage={["Field is required"]}
-            showCharCounter
-            maxLength={30}
-          />
-          <TextField
-            placeholder={"Caregiver Contact"}
-            floatingPlaceholder
-            value={caregiver.contact}
-            onChangeText={(value) =>
-              setCaregiver((prevCaregiver) => ({
-                ...prevCaregiver,
-                contact: value,
-              }))
-            }
-            enableErrors
-            validate={[
-              "number",
-              "required",
-              (value: string) => value.length > 9,
-            ]}
-            validationMessage={["Field is required"]}
-            showCharCounter
-            maxLength={30}
-          />
-          <Button
-            title="Add Caregiver"
-            onPress={() => {
-                createNewSubUser(caregiver);
-            }}
-          />
-          <View margin-20>
-            <Text>Children:</Text>
-            {children.map((child) => (
-              <View key={child.name} row>
-                <Text>Name: {child.name} </Text>
-                <Picker label="Pick Caregiver">
-                  {caregivers.map((item) => (
-                    <Picker.Item
-                      key={item.name}
-                      label={item.name}
-                      value={item.name}
-                    />
-                  ))}
-                </Picker>
-              </View>
-            ))}
-          </View>
+
+    const [isParent, setIsParent] = useState<boolean>(false);
+    const [isChild, setIsChild] = useState<boolean>(false);
+    const [isCaregiver, setIsCaregiver] = useState<boolean>(false);
+
+    useEffect(() => {
+        if (isParent) handleProfileTypeSelection("parent");
+        if (isChild) handleProfileTypeSelection("child");
+        if (isCaregiver) handleProfileTypeSelection("caregiver");
+    }, [isParent, isChild, isCaregiver]);
+
+    const renderLogin = () => (
+        <View marginH-20>
+            <TextInput placeholder="Email" value={email} onChangeText={setEmail}/>
+            <TextInput
+                placeholder="Password"
+                value={password}
+                onChangeText={setPassword}
+                secureTextEntry
+            />
+            <Button title="Login" onPress={handleLogin}/>
+            <Button title="Register" onPress={handleRegister}/>
+            <Text>Choose Profile Type:</Text>
+            <Checkbox
+                label="Parent"
+                value={isParent}
+                onValueChange={(value) => {
+                    setIsParent(value);
+                    if (value) {
+                        setIsChild(false);
+                        setIsCaregiver(false);
+                    }
+                }}
+            />
+            <Checkbox
+                label="Child"
+                value={isChild}
+                onValueChange={(value) => {
+                    setIsChild(value);
+                    if (value) {
+                        setIsParent(false);
+                        setIsCaregiver(false);
+                    }
+                }}
+            />
+            <Checkbox
+                label="Caregiver"
+                value={isCaregiver}
+                onValueChange={(value) => {
+                    setIsCaregiver(value);
+                    if (value) {
+                        setIsParent(false);
+                        setIsChild(false);
+                    }
+                }}
+            />
         </View>
-      ) : (
-        renderLogin()
-      )}
-    </View>
-  );
+    );
+
+    return (
+        <View>
+            {user ? (
+                <View paddingH-20>
+                    {profileType === ProfileType.parent && <Text>Parent</Text>}
+                    {profileType === ProfileType.child && <Text>Child</Text>}
+                    {profileType === ProfileType.caregiver && <Text>Caregiver</Text>}
+                    <Button title="Sign Out" onPress={handleSignOut}/>
+                    <TextField
+                        placeholder={"Child Name"}
+                        floatingPlaceholder
+                        value={child.name}
+                        onChangeText={(value) =>
+                            setChild((prevChild) => ({
+                                ...prevChild,
+                                name: value,
+                            }))
+                        }
+                        enableErrors
+                        validate={["required", (value: string) => value.length > 6]}
+                        validationMessage={[
+                            "Field is required",
+                            "Name is too short",
+                        ]}
+                        showCharCounter
+                        maxLength={30}
+                    />
+                    <Button
+                        title="Add Child"
+                        onPress={() => {
+                            createNewSubUser(child);
+                        }}
+                    />
+                    <TextField
+                        placeholder={"Caregiver Name"}
+                        floatingPlaceholder
+                        value={caregiver.name}
+                        onChangeText={(value) =>
+                            setCaregiver((prevCaregiver) => ({
+                                ...prevCaregiver,
+                                name: value,
+                            }))
+                        }
+                        enableErrors
+                        validate={["required", (value: string) => value.length > 6]}
+                        validationMessage={["Field is required"]}
+                        showCharCounter
+                        maxLength={30}
+                    />
+                    <TextField
+                        placeholder={"Caregiver Contact"}
+                        floatingPlaceholder
+                        value={caregiver.contact}
+                        onChangeText={(value) =>
+                            setCaregiver((prevCaregiver) => ({
+                                ...prevCaregiver,
+                                contact: value,
+                            }))
+                        }
+                        enableErrors
+                        validate={[
+                            "number",
+                            "required",
+                            (value: string) => value.length > 9,
+                        ]}
+                        validationMessage={["Field is required"]}
+                        showCharCounter
+                        maxLength={30}
+                    />
+                    <Button
+                        title="Add Caregiver"
+                        onPress={() => {
+                            createNewSubUser(caregiver);
+                        }}
+                    />
+                    <View margin-20>
+                        <Text>Children:</Text>
+                        {children.map((child) => (
+                            <View key={child.name} row>
+                                <Text>Name: {child.name} </Text>
+                                <Picker label="Pick Caregiver">
+                                    {caregivers.map((item) => (
+                                        <Picker.Item
+                                            key={item.name}
+                                            label={item.name}
+                                            value={item.name}
+                                        />
+                                    ))}
+                                </Picker>
+                            </View>
+                        ))}
+                    </View>
+                </View>
+            ) : (
+                renderLogin()
+            )}
+        </View>
+    );
 };
 
 export default Screen;
diff --git a/contexts/AuthContext.tsx b/contexts/AuthContext.tsx
index bd38cb4..d782178 100644
--- a/contexts/AuthContext.tsx
+++ b/contexts/AuthContext.tsx
@@ -5,7 +5,7 @@ import {useRouter} from "expo-router";
 import firestore from "@react-native-firebase/firestore";
 import {UserProfile} from "@/hooks/firebase/types/profileTypes";
 
-type ProfileType = "parent" | "child" | "caregiver" | null;
+export enum ProfileType { "parent", "child", "caregiver" }
 
 interface IAuthContext {
     user: FirebaseAuthTypes.User | null,
@@ -28,6 +28,8 @@ export const AuthContextProvider: FC<{ children: ReactNode }> = ({children}) =>
     const onAuthStateChanged = async (user: FirebaseAuthTypes.User | null) => {
         setUser(user);
 
+        console.log(user)
+
         if (user) {
             try {
                 const documentSnapshot = await firestore()
@@ -41,7 +43,7 @@ export const AuthContextProvider: FC<{ children: ReactNode }> = ({children}) =>
 
             } catch (error) {
                 console.error("Error fetching user profile type:", error);
-                setProfileType(null);
+                setProfileType(undefined);
             }
         }
 
diff --git a/hooks/firebase/useAuth.ts b/hooks/firebase/useAuth.ts
index 2754898..f05dde2 100644
--- a/hooks/firebase/useAuth.ts
+++ b/hooks/firebase/useAuth.ts
@@ -3,6 +3,7 @@ import {useMutation} from "react-query";
 import auth from "@react-native-firebase/auth";
 import firestore from "@react-native-firebase/firestore";
 import {User,} from "./types/profileTypes";
+import {useSignUp} from "@/hooks/firebase/useSignUp";
 
 type ProfileType = "parent" | "child" | "caregiver" | null;
 
@@ -17,6 +18,8 @@ const useAuth = () => {
         auth().signInWithEmailAndPassword(email, password)
     );
     const signOutMutation = useMutation(() => auth().signOut());
+    const {mutateAsync: signUp } =   useSignUp()
+
     /*const setProfileDataMutation = useMutation((profileData) => {
       const currentUser = auth().currentUser;
       if (currentUser) {
@@ -35,11 +38,12 @@ const useAuth = () => {
     const handleRegister = async () => {
         try {
 
-            await createUserMutation.mutateAsync();
+            await signUp({email, password})
+            // await createUserMutation.mutateAsync();
             console.log("User registered!");
 
-            await signInMutation.mutateAsync();
-            console.log("User signed in!");
+            // await signInMutation.mutateAsync();
+            // console.log("User signed in!");
 
             /*let profileData: ParentProfile | ChildProfile | CaregiverProfile;
             switch (profileType) {
diff --git a/hooks/firebase/useCreateSubUser.ts b/hooks/firebase/useCreateSubUser.ts
index 9adef53..89eaab6 100644
--- a/hooks/firebase/useCreateSubUser.ts
+++ b/hooks/firebase/useCreateSubUser.ts
@@ -1,12 +1,23 @@
-import {useMutation} from "react-query";
+import {useMutation, useQueryClient} from "react-query";
 import {UserProfile} from "@/hooks/firebase/types/profileTypes";
 import functions from '@react-native-firebase/functions';
+import {ProfileType, useAuthContext} from "@/contexts/AuthContext";
 
 export const useCreateSubUser = () => {
+    const queryClient = useQueryClient()
+    const { profileType } = useAuthContext()
+
     return useMutation({
         mutationKey: ["createSubUser"],
         mutationFn: async ({email, password, ...userProfile}: { email: string, password: string } & UserProfile) => {
-            return await functions().httpsCallable("createSubUser")({email, password, ...userProfile})
+            if(profileType === ProfileType.parent) {
+                return await functions().httpsCallable("createSubUser")({email, password, ...userProfile})
+            } else {
+                throw Error("Can't create sub-users as a non-parent.")
+            }
+        },
+        onSuccess: () => {
+            queryClient.invalidateQueries({queryKey: ["getChildrenByParentId"]})
         }
     });
 }
\ No newline at end of file
diff --git a/hooks/firebase/useGetChildrenByParentId.ts b/hooks/firebase/useGetChildrenByParentId.ts
new file mode 100644
index 0000000..493e1fe
--- /dev/null
+++ b/hooks/firebase/useGetChildrenByParentId.ts
@@ -0,0 +1,34 @@
+import {useQuery} from "react-query";
+import {ChildProfile} from "@/hooks/firebase/types/profileTypes";
+import firestore from "@react-native-firebase/firestore";
+import {useAuthContext} from "@/contexts/AuthContext";
+
+export const useGetChildrenByParentId = () => {
+    const {user} = useAuthContext()
+
+    return useQuery({
+            queryKey: ["getChildrenByParentId", user?.uid],
+            queryFn: async (): Promise<ChildProfile[]> => {
+                try {
+                    const snapshot = await firestore()
+                        .collection("Profiles")
+                        .where("userType", "==", "child")
+                        .where("parentId", "==", user?.uid!)
+                        .get();
+
+                    return snapshot.docs.map((doc) => {
+                        const data = doc.data();
+                        return {
+                            ...data,
+                            birthday: data.birthday.toDate(),
+                        } as ChildProfile;
+                    });
+                } catch (error) {
+                    console.error("Error retrieving child users:", error);
+                    return [];
+                }
+            },
+            enabled: !!user?.uid
+        }
+    )
+}
\ No newline at end of file
diff --git a/hooks/firebase/useSignUp.ts b/hooks/firebase/useSignUp.ts
index 50faf94..7e65b6f 100644
--- a/hooks/firebase/useSignUp.ts
+++ b/hooks/firebase/useSignUp.ts
@@ -1,11 +1,15 @@
 import {useMutation} from "react-query";
 import auth from "@react-native-firebase/auth";
+import {useUpdateUserData} from "@/hooks/firebase/useUpdateUserData";
 
 export const useSignUp = () => {
+    const { mutateAsync: updateUserData } = useUpdateUserData()
+
     return useMutation({
         mutationKey: ["signUp"],
         mutationFn: async ({email, password}: { email: string, password: string }) => {
             await auth().createUserWithEmailAndPassword(email, password)
+            await updateUserData({userType: "parent", email, password})
         }
     });
 }
\ No newline at end of file