Auth logic rework

This commit is contained in:
Milan Paunovic
2024-08-21 20:25:15 +02:00
parent 7500b7bdcb
commit 6b42476ef0
6 changed files with 254 additions and 200 deletions
+192 -193
View File
@@ -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;