Corrige feita de requisições a cada mudança de aba na tela de atividades

app/src/Navigation/MainNavigation/GivenHelps/index.jsx

@@ -16,7 +16,11 @@ export const NavigationGivenHelps = () => {
             screenOptions={screenOptions}
         >
             {isEntity ? OngGivenHelps() : UserGivenHelps()}
-            <TopTab.Screen name="Interações" component={History} />
+            <TopTab.Screen
+                name="Interações"
+                component={History}
+                initialParams={{ shouldUpdate: true }}
+            />
         </TopTab.Navigator>
     );
 };
@@ -28,6 +32,10 @@ const OngGivenHelps = () => (
 const UserGivenHelps = () => (
     <>
         <TopTab.Screen name="Minhas ofertas" component={myOfferedHelp} />
-        <TopTab.Screen name="Meus pedidos" component={myRequestedHelp} />
+        <TopTab.Screen
+            name="Meus pedidos"
+            component={myRequestedHelp}
+            initialParams={{ shouldUpdate: true }}
+        />
     </>
 );

app/src/Navigation/MainNavigation/screenOptions.js

@@ -13,7 +13,7 @@ export const screenOptions = ({ route }) => {
                 ...fonts.body,
                 color: colors.dark,
                 fontSize: RFValue(14, 640),
-                width: Dimensions.get('screen').width * 0.3,
+                width: Dimensions.get('screen').width * 0.25,
                 textAlign: 'center',
             };
             const style = focused
@@ -29,12 +29,10 @@ export const screenOptions = ({ route }) => {
             shadowColor: 'transparent',
             borderBottomWidth: 1,
             borderColor: '#BCCBCA',
-            paddingHorizontal: 8,
         },
         tabBarIndicatorStyle: {
             backgroundColor: colors.primary.DEFAULT,
-            borderRadius: 16,
-            padding: 1,
+            borderRadius: 100,
         },
     };
 };

app/src/components/molecules/MyActivitiesFlatList/index.jsx

@@ -0,0 +1,61 @@
+import React, { useState } from 'react';
+import { FlatList, TouchableOpacity } from 'react-native';
+import MyRequestCard from '../../MyRequestCard';
+
+export function MyActivitiesFlatList({
+    data,
+    loadOnGoingActivity,
+    navigation,
+    setConfirmationModalVisible,
+    setHelpToDelete,
+    renderItem,
+    type,
+}) {
+    const [isRefreshing, setIsRefreshing] = useState(false);
+
+    const navigateProps = {
+        offer: {
+            screen: 'myOfferHelpDescription',
+            routeId: 'HelpOffer',
+        },
+        help: {
+            screen: 'myRequestHelpDescription',
+            routeId: 'Help',
+        },
+    };
+
+    const renderCards = ({ item }) => {
+        const possibleInterestedList =
+            type == 'help'
+                ? item.possibleHelpers
+                : [...item.possibleHelpedUsers, ...item.helpedUserId];
+        return (
+            <TouchableOpacity
+                key={item._id}
+                onPress={() =>
+                    navigation.navigate(navigateProps[type].screen, {
+                        helpId: item._id,
+                        routeId: navigateProps[type].routeId,
+                    })
+                }
+            >
+                <MyRequestCard
+                    object={item}
+                    setConfirmationModalVisible={setConfirmationModalVisible}
+                    setSelectedHelp={setHelpToDelete}
+                    possibleInterestedList={possibleInterestedList}
+                />
+            </TouchableOpacity>
+        );
+    };
+
+    return (
+        <FlatList
+            data={data}
+            renderItem={renderItem || renderCards}
+            key={(item) => item._id}
+            refreshing={isRefreshing}
+            onRefresh={() => loadOnGoingActivity(setIsRefreshing)}
+        />
+    );
+}

app/src/pages/ActivitiesPages/History/index.jsx

@@ -1,5 +1,5 @@
-import React, { useContext, useEffect, useState } from 'react';
-import { View, ScrollView } from 'react-native';
+import React, { useCallback, useContext, useState } from 'react';
+import { View } from 'react-native';
 import { UserContext } from '../../../store/contexts/userContext';
 import styles from '../styles';
 import callService from '../../../services/callService';
@@ -8,22 +8,25 @@ import NoHelps from '../../../components/NoHelps';
 import HistoricCard from '../../../components/HistoricCard';
 import { TouchableOpacity } from 'react-native-gesture-handler';
 import { LoadingContext } from '../../../store/contexts/loadingContext';
+import { MyActivitiesFlatList } from '../../../components/molecules/MyActivitiesFlatList';
+import { useFocusEffect } from '@react-navigation/native';
 
-const OfferHelpPage = ({ navigation }) => {
+const OfferHelpPage = ({ navigation, route }) => {
     const { user } = useContext(UserContext);
     const { isLoading, setIsLoading } = useContext(LoadingContext);
 
     const [myOfferedHelp, setMyOfferedHelps] = useState([]);
 
-    useEffect(() => {
-        const unsubscribe = navigation.addListener('focus', () => {
-            getHelps();
-        });
-        return unsubscribe;
-    }, [navigation]);
+    useFocusEffect(
+        useCallback(() => {
+            if (route.params.shouldUpdate) {
+                getHelps(setIsLoading);
+            }
+        }, [route.params.shouldUpdate]),
+    );
 
-    async function getHelps() {
-        setIsLoading(true);
+    async function getHelps(loadingSetter) {
+        loadingSetter(true);
         const filteredHelps = await callService(
             helpService,
             'getHelpMultipleStatus',
@@ -32,32 +35,30 @@ const OfferHelpPage = ({ navigation }) => {
         if (!filteredHelps.error) {
             setMyOfferedHelps(filteredHelps);
         }
-        setIsLoading(false);
+        loadingSetter(false);
+        navigation.setParams({ shouldUpdate: false });
     }
 
     const renderHelpRequestsList = () => {
         if (myOfferedHelp.length > 0) {
             return (
-                <ScrollView>
-                    {myOfferedHelp.map((help) => {
-                        return (
-                            <TouchableOpacity
-                                key={help._id}
-                                onPress={() =>
-                                    navigation.navigate(
-                                        'myOfferHelpDescription',
-                                        {
-                                            helpId: help._id,
-                                            routeId: 'Help',
-                                        },
-                                    )
-                                }
-                            >
-                                <HistoricCard object={help} />
-                            </TouchableOpacity>
-                        );
-                    })}
-                </ScrollView>
+                <MyActivitiesFlatList
+                    data={myOfferedHelp}
+                    renderItem={({ item }) => (
+                        <TouchableOpacity
+                            key={item._id}
+                            onPress={() =>
+                                navigation.navigate('myOfferHelpDescription', {
+                                    helpId: item._id,
+                                    routeId: 'Help',
+                                })
+                            }
+                        >
+                            <HistoricCard object={item} />
+                        </TouchableOpacity>
+                    )}
+                    loadOnGoingActivity={getHelps}
+                />
             );
         } else {
             return (

app/src/pages/ActivitiesPages/MyOfferedHelp/index.jsx

@@ -1,16 +1,15 @@
-import React, { useState, useContext, useCallback } from 'react';
-import { View, ScrollView, TouchableOpacity } from 'react-native';
-import MyRequestHelpCard from '../../../components/MyRequestCard';
+import React, { useState, useContext, useEffect } from 'react';
+import { View } from 'react-native';
 import { UserContext } from '../../../store/contexts/userContext';
 import helpService from '../../../services/Help';
 import styles from '../styles';
 import NoHelps from '../../../components/NoHelps';
-import { useFocusEffect } from '@react-navigation/native';
 import callService from '../../../services/callService';
 import PlusIconTextButton from '../../../components/PlusIconTextButton';
 import createInteraction from '../../../utils/createInteraction';
 import { LoadingContext } from '../../../store/contexts/loadingContext';
 import { Dialog } from '../../../components/molecules/Dialog';
+import { MyActivitiesFlatList } from '../../../components/molecules/MyActivitiesFlatList';
 
 export default function HelpsFinished({ navigation }) {
     const { user, userPosition } = useContext(UserContext);
@@ -20,15 +19,14 @@ export default function HelpsFinished({ navigation }) {
     const [confirmationModalVisible, setConfirmationModalVisible] =
         useState(false);
     const [helpToDelete, setHelpToDelete] = useState(null);
+    const [shouldUpdate, setShouldUpdate] = useState(true);
 
-    useFocusEffect(
-        useCallback(() => {
-            loadOnGoingOffers();
-        }, [navigation]),
-    );
+    useEffect(() => {
+        if (shouldUpdate) loadOnGoingOffers(setIsLoading);
+    }, []);
 
-    async function loadOnGoingOffers() {
-        setIsLoading(true);
+    async function loadOnGoingOffers(loadingSetter) {
+        loadingSetter(true);
         const { _id: userId } = user;
         const resFinished = await callService(helpService, 'listHelpOffer', [
             userId,
@@ -38,11 +36,11 @@ export default function HelpsFinished({ navigation }) {
         if (!resFinished.error) {
             setFinishedHelpList(resFinished);
         }
-        setIsLoading(false);
+        loadingSetter(false);
+        setShouldUpdate(false);
     }
 
     async function excludeHelp() {
-        setIsLoading(true);
         const validDeleteRequest = await callService(
             helpService,
             'deleteHelp',
@@ -54,45 +52,25 @@ export default function HelpsFinished({ navigation }) {
             });
             setFinishedHelpList(updatedArray);
         }
-        setIsLoading(false);
         setConfirmationModalVisible(false);
+        setShouldUpdate(true);
     }
 
     const renderHelpList = () => {
         if (finishedHelpList.length > 0) {
             return (
-                <ScrollView>
-                    <View style={styles.helpList}>
-                        {finishedHelpList.map((help) => {
-                            return (
-                                <TouchableOpacity
-                                    key={help._id}
-                                    onPress={() =>
-                                        navigation.navigate(
-                                            'myOfferHelpDescription',
-                                            {
-                                                helpId: help._id,
-                                                routeId: 'HelpOffer',
-                                            },
-                                        )
-                                    }
-                                >
-                                    <MyRequestHelpCard
-                                        object={help}
-                                        possibleInterestedList={[
-                                            ...help.possibleHelpedUsers,
-                                            ...help.helpedUserId,
-                                        ]}
-                                        setConfirmationModalVisible={
-                                            setConfirmationModalVisible
-                                        }
-                                        setSelectedHelp={setHelpToDelete}
-                                    />
-                                </TouchableOpacity>
-                            );
-                        })}
-                    </View>
-                </ScrollView>
+                <View style={styles.helpList}>
+                    <MyActivitiesFlatList
+                        data={finishedHelpList}
+                        loadOnGoingActivity={loadOnGoingOffers}
+                        navigation={navigation}
+                        setConfirmationModalVisible={
+                            setConfirmationModalVisible
+                        }
+                        setHelpToDelete={setHelpToDelete}
+                        type="offer"
+                    />
+                </View>
             );
         } else {
             return <NoHelps title={'Você não possui nenhuma oferta criada'} />;