|
@@ -1,8 +1,14 @@
|
|
|
import React, { useEffect, useState } from 'react';
|
|
|
-import { FlatList, Text, View } from 'react-native';
|
|
|
+import { FlatList, Text, TouchableOpacity, View } from 'react-native';
|
|
|
import { Image } from 'expo-image';
|
|
|
|
|
|
-import { Header, HorizontalTabView, Loading, PageWrapper } from '../../../../components';
|
|
|
+import {
|
|
|
+ Header,
|
|
|
+ HorizontalTabView,
|
|
|
+ Loading,
|
|
|
+ PageWrapper,
|
|
|
+ WarningModal
|
|
|
+} from '../../../../components';
|
|
|
import {
|
|
|
getMastersByCountryOfOrigin,
|
|
|
getMastersByType,
|
|
@@ -16,11 +22,14 @@ import { UNMastersListStyles } from './styles';
|
|
|
import type { Master } from '../../../../database/unMastersService';
|
|
|
import { Colors } from '../../../../theme';
|
|
|
import { getFontSize } from '../../../../utils';
|
|
|
+import { useNavigation } from '@react-navigation/native';
|
|
|
+import { NAVIGATION_PAGES } from 'src/types';
|
|
|
|
|
|
const UNMastersScreen = () => {
|
|
|
const [index, setIndex] = useState(0);
|
|
|
const [routes, setRoutes] = useState<{ key: string; title: string }[]>([]);
|
|
|
const [loading, setLoading] = useState(true);
|
|
|
+ const navigation = useNavigation();
|
|
|
|
|
|
useEffect(() => {
|
|
|
const types = getUNMastersTypes();
|
|
@@ -48,15 +57,16 @@ const UNMastersScreen = () => {
|
|
|
setIndex={setIndex}
|
|
|
routes={routes}
|
|
|
renderScene={({ route }: { route: { key: string; title: string } }) => (
|
|
|
- <UNMastersList type={route.key} />
|
|
|
+ <UNMastersList type={route.key} navigation={navigation} />
|
|
|
)}
|
|
|
/>
|
|
|
</PageWrapper>
|
|
|
);
|
|
|
};
|
|
|
|
|
|
-const UNMastersList = React.memo(({ type }: { type: string }) => {
|
|
|
+const UNMastersList = React.memo(({ type, navigation }: { type: string; navigation: any }) => {
|
|
|
const [isLoading, setIsLoading] = useState(true);
|
|
|
+ const [modalVisible, setModalVisible] = useState(false);
|
|
|
const [masters, setMasters] = useState<
|
|
|
| Master[]
|
|
|
| { country: string; count: number; masters: Master[] }[]
|
|
@@ -84,14 +94,25 @@ const UNMastersList = React.memo(({ type }: { type: string }) => {
|
|
|
|
|
|
if (isLoading) return <Loading />;
|
|
|
|
|
|
+ const handlePress = (userId: number | null) => {
|
|
|
+ if (userId) {
|
|
|
+ navigation.navigate(NAVIGATION_PAGES.PUBLIC_PROFILE_VIEW, {
|
|
|
+ userId
|
|
|
+ } as never);
|
|
|
+ } else {
|
|
|
+ setModalVisible(true);
|
|
|
+ }
|
|
|
+ };
|
|
|
+
|
|
|
const renderItem = ({ item }: { item: any }) => {
|
|
|
const UserItem = ({ user }: { user: Master }) => {
|
|
|
return (
|
|
|
- <View
|
|
|
+ <TouchableOpacity
|
|
|
style={[
|
|
|
UNMastersListStyles.wrapper,
|
|
|
{ backgroundColor: Colors.FILL_LIGHT, borderRadius: 8, padding: 6 }
|
|
|
]}
|
|
|
+ onPress={() => handlePress(user.user_id)}
|
|
|
>
|
|
|
<View style={{ gap: 3, marginLeft: 5 }}>
|
|
|
<Text style={UNMastersListStyles.firstAndLastName}>{user.full_name}</Text>
|
|
@@ -120,7 +141,7 @@ const UNMastersList = React.memo(({ type }: { type: string }) => {
|
|
|
/>
|
|
|
</View>
|
|
|
</View>
|
|
|
- </View>
|
|
|
+ </TouchableOpacity>
|
|
|
);
|
|
|
};
|
|
|
|
|
@@ -194,14 +215,22 @@ const UNMastersList = React.memo(({ type }: { type: string }) => {
|
|
|
};
|
|
|
|
|
|
return (
|
|
|
- <FlatList
|
|
|
- contentContainerStyle={{ gap: 10 }}
|
|
|
- style={{ marginVertical: 8 }}
|
|
|
- horizontal={false}
|
|
|
- data={masters}
|
|
|
- renderItem={renderItem}
|
|
|
- showsVerticalScrollIndicator={false}
|
|
|
- />
|
|
|
+ <>
|
|
|
+ <FlatList
|
|
|
+ contentContainerStyle={{ gap: 10 }}
|
|
|
+ style={{ marginVertical: 8 }}
|
|
|
+ horizontal={false}
|
|
|
+ data={masters}
|
|
|
+ renderItem={renderItem}
|
|
|
+ showsVerticalScrollIndicator={false}
|
|
|
+ />
|
|
|
+ <WarningModal
|
|
|
+ type="success"
|
|
|
+ isVisible={modalVisible}
|
|
|
+ onClose={() => setModalVisible(false)}
|
|
|
+ message="This person does not have a profile on NomadMania."
|
|
|
+ />
|
|
|
+ </>
|
|
|
);
|
|
|
});
|
|
|
|