notes, tablet sort, grocery list and other fixes

This commit is contained in:
ivic00
2024-12-02 18:46:36 +01:00
parent 12b4ce3a70
commit c86a355b97
8 changed files with 94 additions and 56 deletions

View File

@ -1,11 +1,13 @@
import { View, Text } from "react-native-ui-lib";
import React, { useEffect } from "react";
import React, { useEffect, useMemo } from "react";
import { useGetFamilyMembers } from "@/hooks/firebase/useGetFamilyMembers";
import { ImageBackground, StyleSheet } from "react-native";
import { colorMap } from "@/constants/colorMap";
import { ProfileType } from "@/contexts/AuthContext";
import { ProfileType, useAuthContext } from "@/contexts/AuthContext";
import { ScrollView } from "react-native-gesture-handler";
const UsersList = () => {
const { user: currentUser } = useAuthContext();
const { data: familyMembers, refetch: refetchFamilyMembers } =
useGetFamilyMembers();
@ -13,17 +15,34 @@ const UsersList = () => {
refetchFamilyMembers();
}, []);
const sortedMembers = useMemo(() => {
return familyMembers
?.filter((member) => member.userType !== ProfileType.FAMILY_DEVICE)
.sort((a, b) => {
// Current user first
if (a.uid === currentUser?.uid) return -1;
if (b.uid === currentUser?.uid) return 1;
// Then sort by user type priority
const typePriority = {
[ProfileType.PARENT]: 0,
[ProfileType.CHILD]: 1,
[ProfileType.CAREGIVER]: 2,
};
return typePriority[a.userType] - typePriority[b.userType];
});
}, [familyMembers, currentUser]);
const capitalizeFirstLetter = (str: string) => {
if (!str) return "";
return str.charAt(0).toUpperCase() + str.slice(1).toLowerCase();
};
return (
<View centerH paddingT-10>
{familyMembers
?.filter((member) => member.userType !== ProfileType.FAMILY_DEVICE)
.map((member, index) => (
<>
<View centerH paddingT-10 marginB-70>
{sortedMembers?.map((member, index) => (
<React.Fragment key={member.uid}>
{member.pfp ? (
<ImageBackground
key={index}
@ -38,19 +57,18 @@ const UsersList = () => {
style={styles.pfp}
center
backgroundColor={member.eventColor || colorMap.teal}
children={
<Text color="white">
{member.firstName.at(0)}
{member.lastName.at(0)}
</Text>
}
/>
>
<Text color="white">
{member.firstName.at(0)}
{member.lastName.at(0)}
</Text>
</View>
)}
<Text style={styles.fName}>{member.firstName}</Text>
<Text style={styles.role}>
{capitalizeFirstLetter(member.userType)}
</Text>
</>
</React.Fragment>
))}
</View>
);