-
Notifications
You must be signed in to change notification settings - Fork 0
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
* feat: caregiver screen * fix: add profile pics to care giver screen --------- Co-authored-by: narayansharma-21 <[email protected]> Co-authored-by: Matt McCoy <[email protected]> Co-authored-by: Matt McCoy <[email protected]>
- Loading branch information
4 people
authored
Apr 19, 2024
1 parent
1dcca45
commit 09525be
Showing
7 changed files
with
219 additions
and
4 deletions.
There are no files selected for viewing
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,20 @@ | ||
| import React from 'react'; | ||
|
|
||
| import { useNavigation } from '@react-navigation/native'; | ||
| import { IconButton } from 'react-native-paper'; | ||
|
|
||
| import Plus from '../../assets/profile/plus.svg'; | ||
| import { AppStackNavigation } from '../../navigation/types'; | ||
|
|
||
| export function AddButtom() { | ||
| const navigation = useNavigation<AppStackNavigation>(); | ||
|
|
||
| return ( | ||
| <IconButton | ||
| className="align-center m-2 flex h-[50px] w-[52px] justify-center rounded-xl bg-carewallet-blue" | ||
| mode="contained" | ||
| icon={({ color }) => <Plus fill={color} />} | ||
| onPress={() => navigation.goBack()} | ||
| /> | ||
| ); | ||
| } |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,50 @@ | ||
| import React from 'react'; | ||
| import { Text, TouchableOpacity, View } from 'react-native'; | ||
|
|
||
| import { useNavigation } from '@react-navigation/native'; | ||
|
|
||
| import { AppStackNavigation } from '../../navigation/types'; | ||
| import { GroupRole, Role } from '../../types/group'; | ||
| import { User } from '../../types/user'; | ||
| import { SmallProfileImage } from './Group'; | ||
|
|
||
| interface CareProps { | ||
| user: User | undefined; | ||
| role: GroupRole | undefined; | ||
| } | ||
|
|
||
| export function CareTaker({ user, role }: CareProps) { | ||
| if (!user) return null; | ||
| const navigation = useNavigation<AppStackNavigation>(); | ||
| // const { user: signedInUser, group } = useCareWalletContext(); | ||
| // const [activeUser, setActiveUser] = useState(signedInUser.userID); | ||
|
|
||
| const handlePress = () => { | ||
| navigation.navigate('Profile'); | ||
| }; | ||
|
|
||
| return ( | ||
| <TouchableOpacity onPress={handlePress}> | ||
| <View className="mb-2 flex flex-row items-center rounded-xl border border-carewallet-lightgray bg-carewallet-white py-3 pl-1"> | ||
| <SmallProfileImage user={user} /> | ||
| <View className="flex h-fit max-h-fit min-h-fit flex-row items-center"> | ||
| <View className="ml-8"> | ||
| <Text className="flex-wrap text-left font-carewallet-manrope-semibold text-lg text-carewallet-black"> | ||
| {user.first_name} {user.last_name} | ||
| </Text> | ||
| <View className="flex w-[60vw] flex-row"> | ||
| <View className="flex flex-col"> | ||
| <Text className="items-center justify-center text-left font-carewallet-manrope-semibold text-xs text-carewallet-black"> | ||
| {`${role?.role} ${role?.role !== Role.PATIENT ? 'CARETAKER' : ''}`} | ||
| </Text> | ||
| <Text className="items-center justify-center text-left font-carewallet-manrope text-xs text-carewallet-black"> | ||
| {user.phone ? user.phone : user.email} | ||
| </Text> | ||
| </View> | ||
| </View> | ||
| </View> | ||
| </View> | ||
| </View> | ||
| </TouchableOpacity> | ||
| ); | ||
| } |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,109 @@ | ||
| import React, { useState } from 'react'; | ||
| import { ActivityIndicator, ScrollView, View } from 'react-native'; | ||
|
|
||
| import { TouchableOpacity } from '@gorhom/bottom-sheet'; | ||
| import { useNavigation } from '@react-navigation/native'; | ||
| import { Button, Text } from 'react-native-paper'; | ||
|
|
||
| import Settings from '../../assets/profile/settings.svg'; | ||
| import { BackButton } from '../../components/nav_buttons/BackButton'; | ||
| import { AddButtom } from '../../components/profile/AddButton'; | ||
| import { CareTaker } from '../../components/profile/CareTaker'; | ||
| import { useCareWalletContext } from '../../contexts/CareWalletContext'; | ||
| import { MainLayout } from '../../layouts/MainLayout'; | ||
| import { AppStackNavigation } from '../../navigation/types'; | ||
| import { useGroup } from '../../services/group'; | ||
| import { useUsers } from '../../services/user'; | ||
| import { Role } from '../../types/group'; | ||
|
|
||
| export function CareGroup() { | ||
| const navigation = useNavigation<AppStackNavigation>(); | ||
| const { user: signedInUser, group } = useCareWalletContext(); | ||
| const [activeUser, setActiveUser] = useState(signedInUser.userID); | ||
| const { roles, rolesAreLoading } = useGroup(group.groupID); | ||
| const { users, usersAreLoading } = useUsers( | ||
| roles?.map((role) => role.user_id) ?? [] | ||
| ); | ||
|
|
||
| const patientId = roles?.find((role) => role.role === Role.PATIENT)?.user_id; | ||
|
|
||
| if (rolesAreLoading || usersAreLoading) { | ||
| return ( | ||
| <View className="w-full flex-1 items-center justify-center bg-carewallet-white text-3xl"> | ||
| <ActivityIndicator size="large" /> | ||
| <Text>Loading...</Text> | ||
| </View> | ||
| ); | ||
| } | ||
|
|
||
| if (!roles || !users) { | ||
| return ( | ||
| <View className="w-full flex-1 items-center justify-center bg-carewallet-white text-3xl"> | ||
| <Text className="text-xl">Could Not Load Profile...</Text> | ||
| </View> | ||
| ); | ||
| } | ||
| return ( | ||
| <View> | ||
| <View className="h-[8vh] bg-carewallet-white" /> | ||
| <MainLayout> | ||
| <ScrollView className="mb-36"> | ||
| <View className="flex flex-row items-center border-b border-carewallet-lightgray bg-carewallet-white"> | ||
| <View className="pl-2"> | ||
| <BackButton /> | ||
| </View> | ||
| <View className="mx-auto "> | ||
| <Text className="text-center font-carewallet-manrope-bold text-lg text-carewallet-blue "> | ||
| Care Group | ||
| </Text> | ||
| </View> | ||
| <View className="pr-2"> | ||
| <AddButtom /> | ||
| </View> | ||
| </View> | ||
|
|
||
| <View> | ||
| <View className="flex h-[10vh] items-center"> | ||
| <View className="h-[10vh] scroll-pb-96"> | ||
| <View className="flex w-full flex-row justify-end text-carewallet-black"> | ||
| <Button | ||
| className="mx-auto mt-2 h-[50px] w-[96vw] items-start justify-center rounded-xl border-carewallet-lightgray bg-carewallet-white" | ||
| textColor="#000000" | ||
| mode="outlined" | ||
| icon={() => <Settings />} | ||
| > | ||
| <Text className="font-carewallet-manrope-semibold"> | ||
| Manage Caregiver Capabiities | ||
| </Text> | ||
| </Button> | ||
| </View> | ||
| </View> | ||
| </View> | ||
|
|
||
| <View className="mx-2 mt-2 flex w-[96vw] flex-col items-center rounded-xl"> | ||
| {users | ||
| .filter( | ||
| (user) => | ||
| user.user_id !== patientId && user.user_id !== activeUser | ||
| ) | ||
| .map((user) => ( | ||
| <TouchableOpacity | ||
| key={user.user_id} // <-- Add key prop here | ||
| onPress={() => { | ||
| setActiveUser(user.user_id); | ||
| navigation.navigate('Profile'); | ||
| }} | ||
| > | ||
| <CareTaker | ||
| user={user} | ||
| role={roles.find((role) => role.user_id === user.user_id)} | ||
| /> | ||
| </TouchableOpacity> | ||
| ))} | ||
| </View> | ||
| </View> | ||
| </ScrollView> | ||
| </MainLayout> | ||
| </View> | ||
| ); | ||
| } |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters