|
@@ -24,6 +24,7 @@ import { Colors } from '../../../../theme';
|
|
|
import { getFontSize } from '../../../../utils';
|
|
|
import { useNavigation } from '@react-navigation/native';
|
|
|
import { NAVIGATION_PAGES } from 'src/types';
|
|
|
+import { FlashList } from '@shopify/flash-list';
|
|
|
|
|
|
const UNMastersScreen = () => {
|
|
|
const [index, setIndex] = useState(0);
|
|
@@ -55,6 +56,7 @@ const UNMastersScreen = () => {
|
|
|
<HorizontalTabView
|
|
|
index={index}
|
|
|
setIndex={setIndex}
|
|
|
+ lazy={true}
|
|
|
routes={routes}
|
|
|
renderScene={({ route }: { route: { key: string; title: string } }) => (
|
|
|
<UNMastersList type={route.key} navigation={navigation} />
|
|
@@ -110,7 +112,7 @@ const UNMastersList = React.memo(({ type, navigation }: { type: string; navigati
|
|
|
<TouchableOpacity
|
|
|
style={[
|
|
|
UNMastersListStyles.wrapper,
|
|
|
- { backgroundColor: Colors.FILL_LIGHT, borderRadius: 8, padding: 6 }
|
|
|
+ { backgroundColor: Colors.FILL_LIGHT, borderRadius: 8, padding: 6, marginVertical: 5 }
|
|
|
]}
|
|
|
onPress={() => handlePress(user.user_id)}
|
|
|
>
|
|
@@ -157,15 +159,14 @@ const UNMastersList = React.memo(({ type, navigation }: { type: string; navigati
|
|
|
if (masters.length === 0) return;
|
|
|
|
|
|
return (
|
|
|
- <View style={UNMastersListStyles.countryAndYearItemWrapper}>
|
|
|
+ <View style={[UNMastersListStyles.countryAndYearItemWrapper, { marginVertical: 5 }]}>
|
|
|
<View style={UNMastersListStyles.countryAndYearHeader}>
|
|
|
<Text style={{ color: Colors.DARK_BLUE, fontSize: getFontSize(18), fontWeight: '700' }}>
|
|
|
{country} ({count})
|
|
|
</Text>
|
|
|
</View>
|
|
|
<FlatList
|
|
|
- contentContainerStyle={{ gap: 10 }}
|
|
|
- style={{ gap: 12 }}
|
|
|
+ scrollEnabled={false}
|
|
|
horizontal={false}
|
|
|
showsVerticalScrollIndicator={false}
|
|
|
data={masters}
|
|
@@ -185,15 +186,14 @@ const UNMastersList = React.memo(({ type, navigation }: { type: string; navigati
|
|
|
count: number;
|
|
|
}) => {
|
|
|
return (
|
|
|
- <View style={UNMastersListStyles.countryAndYearItemWrapper}>
|
|
|
+ <View style={[UNMastersListStyles.countryAndYearItemWrapper, { marginVertical: 5 }]}>
|
|
|
<View style={UNMastersListStyles.countryAndYearHeader}>
|
|
|
<Text style={{ color: Colors.DARK_BLUE, fontSize: getFontSize(18), fontWeight: '700' }}>
|
|
|
{year} ({count})
|
|
|
</Text>
|
|
|
</View>
|
|
|
<FlatList
|
|
|
- contentContainerStyle={{ gap: 10 }}
|
|
|
- style={{ gap: 12 }}
|
|
|
+ scrollEnabled={false}
|
|
|
horizontal={false}
|
|
|
showsVerticalScrollIndicator={false}
|
|
|
data={masters}
|
|
@@ -216,9 +216,13 @@ const UNMastersList = React.memo(({ type, navigation }: { type: string; navigati
|
|
|
|
|
|
return (
|
|
|
<>
|
|
|
- <FlatList
|
|
|
- contentContainerStyle={{ gap: 10 }}
|
|
|
- style={{ marginVertical: 8 }}
|
|
|
+ <FlashList
|
|
|
+ viewabilityConfig={{
|
|
|
+ waitForInteraction: true,
|
|
|
+ itemVisiblePercentThreshold: 50,
|
|
|
+ minimumViewTime: 1000
|
|
|
+ }}
|
|
|
+ estimatedItemSize={100}
|
|
|
horizontal={false}
|
|
|
data={masters}
|
|
|
renderItem={renderItem}
|