user creation flow fix

This commit is contained in:
Milan Paunovic
2024-10-22 01:12:15 +02:00
parent 090f931e3e
commit 275b8bcfad
7 changed files with 425 additions and 595 deletions

View File

@ -48,7 +48,7 @@ export const EventCalendar: React.FC<EventCalendarProps> = React.memo(({calendar
}, [events, mode]);
const handlePressEvent = useCallback((event: CalendarEvent) => {
if (mode === "day") {
if (mode === "day" || mode === "week") {
setEditVisible(true);
console.log({event})
setEventForEdit(event);
@ -60,7 +60,7 @@ export const EventCalendar: React.FC<EventCalendarProps> = React.memo(({calendar
const handlePressCell = useCallback(
(date: Date) => {
if (mode === "day") {
if (mode === "day" || mode === "week") {
setSelectedNewEndDate(date);
} else {
setMode("day")

View File

@ -9,6 +9,7 @@ import ProfileIcon from "@/assets/svgs/ProfileIcon";
import CalendarIcon from "@/assets/svgs/CalendarIcon";
import PrivacyPolicyIcon from "@/assets/svgs/PrivacyPolicyIcon";
import ArrowRightIcon from "@/assets/svgs/ArrowRightIcon";
import {ProfileType, useAuthContext} from "@/contexts/AuthContext";
const pageIndex = {
main: 0,
@ -19,18 +20,22 @@ const pageIndex = {
};
const SettingsPage = () => {
const {profileData} = useAuthContext()
const isntParent = profileData?.userType !== ProfileType.PARENT
const [selectedPage, setSelectedPage] = useState<number>(0);
return (
<View flexG>
{selectedPage == 0 && (
<View flexG centerH marginH-30 marginT-30>
<Button
disabled={isntParent}
backgroundColor="white"
style={styles.mainBtn}
children={
<View row centerV width={"100%"}>
<ProfileIcon style={{marginRight: 10}} color="#07b9c8"/>
<Text style={styles.label} color="#07b8c7">
<Text style={[styles.label, isntParent && styles.disabledText]}>
Manage My Profile
</Text>
<ArrowRightIcon style={{marginLeft: "auto"}}/>
@ -39,12 +44,13 @@ const SettingsPage = () => {
onPress={() => setSelectedPage(pageIndex.user)}
/>
<Button
disabled={isntParent}
backgroundColor="white"
style={styles.mainBtn}
children={
<View row centerV width={"100%"}>
<CalendarIcon style={{marginRight: 10}}/>
<Text style={styles.label} color="#fd1775">
<Text style={[styles.label, isntParent && styles.disabledText]}>
Calendar Settings
</Text>
<ArrowRightIcon style={{marginLeft: "auto"}}/>
@ -55,6 +61,7 @@ const SettingsPage = () => {
}}
/>
<Button
disabled={isntParent}
backgroundColor="white"
style={styles.mainBtn}
children={
@ -65,7 +72,7 @@ const SettingsPage = () => {
color="#ff9900"
style={{marginRight: 10}}
/>
<Text style={styles.label} color="#ff9900">
<Text style={[styles.label, isntParent && styles.disabledText]}>
To-Do Reward Settings
</Text>
<ArrowRightIcon style={{marginLeft: "auto"}}/>
@ -79,7 +86,7 @@ const SettingsPage = () => {
children={
<View row centerV width={"100%"}>
<PrivacyPolicyIcon style={{marginRight: 10}}/>
<Text style={styles.label} color="#6c645b">
<Text style={styles.label}>
Cally Privacy Policy
</Text>
<ArrowRightIcon style={{marginLeft: "auto"}}/>
@ -115,4 +122,7 @@ const styles = StyleSheet.create({
fontSize: 14.71,
textAlignVertical: "center",
},
});
disabledText: {
color: '#A9A9A9', // Example of a gray color for disabled text
},
});

View File

@ -43,7 +43,7 @@ const MyGroup = () => {
const lNameRef = useRef<TextFieldRef>(null);
const emailRef = useRef<TextFieldRef>(null);
const [showQRCodeDialog, setShowQRCodeDialog] = useState("");
const [showQRCodeDialog, setShowQRCodeDialog] = useState<string | boolean>(false);
const {mutateAsync: createSubUser, isLoading, isError} = useCreateSubUser();
const {data: familyMembers} = useGetFamilyMembers(true);
@ -149,7 +149,7 @@ const MyGroup = () => {
<View flex-1/>
<UserMenu
setShowQRCodeDialog={(val) => setShowQRCodeDialog("")}
setShowQRCodeDialog={(val) => setShowQRCodeDialog(val)}
showQRCodeDialog={showQRCodeDialog === member?.uid}
userId={member?.uid!}
/>
@ -187,8 +187,10 @@ const MyGroup = () => {
</Text>
</View>
<View flex-1/>
<UserMenu
setShowQRCodeDialog={(val) => setShowQRCodeDialog("")}
setShowQRCodeDialog={(val) => setShowQRCodeDialog(val)}
showQRCodeDialog={showQRCodeDialog === member?.uid}
userId={member?.uid!}
/>
@ -224,8 +226,10 @@ const MyGroup = () => {
</Text>
</View>
<View flex-1/>
<UserMenu
setShowQRCodeDialog={(val) => setShowQRCodeDialog("")}
setShowQRCodeDialog={(val) => setShowQRCodeDialog(val)}
showQRCodeDialog={showQRCodeDialog === member?.uid}
userId={member?.uid!}
/>
@ -242,7 +246,7 @@ const MyGroup = () => {
visible
button={{
label: "+ Add a user device",
onPress: () => setShowAddUserDialog(true),
onPress: () => setShowNewUserInfoDialog(true),
style: styles.bottomButton,
}}
/>

View File

@ -1,7 +1,8 @@
import React, {useState} from 'react';
import {Button, Card, Colors, Dialog, Hint, ListItem, Text, View} from 'react-native-ui-lib';
import React from 'react';
import {Button, Card, Dialog, Text, TouchableOpacity} from 'react-native-ui-lib';
import QRCode from 'react-native-qrcode-svg';
import {PanningDirectionsEnum} from "react-native-ui-lib/src/components/panningViews/panningProvider";
import Ionicons from "@expo/vector-icons/Ionicons";
const UserMenu = ({
userId,
@ -10,40 +11,20 @@ const UserMenu = ({
}: {
userId: string,
showQRCodeDialog: boolean,
setShowQRCodeDialog: (value: boolean) => void
setShowQRCodeDialog: (value: string | boolean) => void
}) => {
const [showHint, setShowHint] = useState(false);
const handleShowQRCode = () => {
setShowHint(false);
setTimeout(() => {
setShowQRCodeDialog(true);
}, 500);
setShowQRCodeDialog(userId);
};
return (
<>
<Hint
onBackgroundPress={() => setShowHint(false)}
onPress={() => setShowHint(true)}
color={Colors.white}
customContent={
<View height={18}>
<ListItem onPress={handleShowQRCode}>
<Text style={{fontFamily: "Manrope_500Medium"}}>Show Login QR Code</Text>
</ListItem>
</View>
}
enableShadow
visible={showHint}
backdropColor="transparent"
<TouchableOpacity
onPress={handleShowQRCode}
>
<View>
<Button link onPress={() => setShowHint(!showHint)}>
<Text>...</Text>
</Button>
</View>
</Hint>
<Ionicons name="qr-code-outline" size={24} color="black"/>
</TouchableOpacity>
<Dialog
visible={showQRCodeDialog}

View File

@ -6,6 +6,7 @@ import {IToDo} from "@/hooks/firebase/types/todoData";
export const useGetTodos = () => {
const { user, profileData } = useAuthContext();
//TODO: Add role based filtering for todos
return useQuery({
queryKey: ["todos", user?.uid],

View File

@ -117,6 +117,7 @@
<string>$(PRODUCT_BUNDLE_IDENTIFIER).expo.index_route</string>
<string>$(PRODUCT_BUNDLE_IDENTIFIER).expo.index_route</string>
<string>$(PRODUCT_BUNDLE_IDENTIFIER).expo.index_route</string>
<string>$(PRODUCT_BUNDLE_IDENTIFIER).expo.index_route</string>
</array>
<key>UILaunchStoryboardName</key>
<string>SplashScreen</string>

941
yarn.lock

File diff suppressed because it is too large Load Diff