75 lines
3.0 KiB
TypeScript
75 lines
3.0 KiB
TypeScript
import {View, Text, SafeAreaView, ScrollView, Image, TouchableOpacity, ImageSourcePropType, Alert} from "react-native";
|
|
import React from "react";
|
|
import icons from "@/constants/icons"
|
|
import images from "@/constants/images";
|
|
import {settings} from "@/constants/data";
|
|
import {useGlobalContext} from "@/lib/globalProvider";
|
|
import {logOut} from "@/lib/appwrite";
|
|
import {parseJson} from "ajv/dist/runtime/parseJson";
|
|
|
|
interface SettingsItemsProps{
|
|
icon: ImageSourcePropType,
|
|
title: string,
|
|
onPress?: () => void,
|
|
textStyle?: string,
|
|
showArrow?: boolean,
|
|
}
|
|
const SettingsItems = ({icon, title, onPress, textStyle, showArrow = true } : SettingsItemsProps) => (
|
|
<TouchableOpacity onPress={onPress} className={'flex flex-row justify-between py-3'}>
|
|
<View className={'flex flex-row items-center gap-3'}>
|
|
<Image source={icon} className={'size-6'}/>
|
|
<Text>{title}</Text>
|
|
</View>
|
|
{showArrow && <Image source={icons.rightArrow} className={'size-5'}/>}
|
|
</TouchableOpacity>
|
|
)
|
|
|
|
const Profile = () => {
|
|
const {user, refetch} = useGlobalContext();
|
|
const handleLogout = async () => {
|
|
const result = await logOut();
|
|
if(result) {
|
|
Alert.alert('logged out')
|
|
refetch();
|
|
}
|
|
};
|
|
return (
|
|
<SafeAreaView className={'h-full bg-white'}>
|
|
<ScrollView
|
|
showsVerticalScrollIndicator={false}
|
|
contentContainerClassName={'pb-32 px-7'}>
|
|
<View className={'flex flex-row items-center justify-between mt-5'}>
|
|
<Text className={'text-2xl text-bold'}>Profile</Text>
|
|
<Image source={icons.bell} className={'size-5'}/>
|
|
</View>
|
|
<View className={'flex flex-row justify-center mt-5'}>
|
|
<View className={'flex flex-col items-center relative mt-5'}>
|
|
<Image source={{uri: user?.avatar}}className={'size-44 relative rounded-full'}/>
|
|
<TouchableOpacity className={'absolute bottom-11 right-2'}>
|
|
<Image source={icons.edit} className={'size-9'}/>
|
|
</TouchableOpacity>
|
|
<Text>{ user?.name}</Text>
|
|
</View>
|
|
</View>
|
|
|
|
<View className={'flex flex-col mt-10'}>
|
|
<SettingsItems icon = {icons.calendar} title={'MyCars - Возила'}/>
|
|
<SettingsItems icon = {icons.wallet} title={'Payments- Плаќања'}/>
|
|
</View>
|
|
|
|
<View className={'flex flex-col mt-5 border-t pt-5 border-blue-200'}>
|
|
{settings.slice(2).map((item, index ) => (
|
|
<SettingsItems key={index} {...item}/>
|
|
) )}
|
|
</View>
|
|
|
|
<View className={'flex flex-col mt-5 border-t pt-5 border-blue-200'}>
|
|
<SettingsItems icon={icons.logout} title={'Logout - Одјависе'} onPress={handleLogout} showArrow={false}/>
|
|
</View>
|
|
</ScrollView>
|
|
</SafeAreaView>
|
|
);
|
|
};
|
|
|
|
export default Profile;
|