fixed load more than twelve not working

src/Components/TabPanels/PublicUserPageTabs/TabRecursos.js

@@ -21,6 +21,7 @@ import {HeaderGrid, ContainerStyled, Carregados} from '../StyledComponents.js'
 import Grid from '@material-ui/core/Grid';
 import ResourceCardFunction from '../../ResourceCardFunction.js'
 import {ButtonMostrarMaisRecurso} from '../PanelComponents/ButtonsArea'
+import {makeAxiosGetRequest} from '../../HelperFunctions/getAxiosConfig'
 
 export default function TabRecursos (props) {
     const [arr, setArr] = useState([])
@@ -32,9 +33,22 @@ export default function TabRecursos (props) {
         setSlice(props.learningObjs.slice(0,4))
     }, [])
 
+    function handleSuccess (data) {
+        setArr(data)
+        setSlice(data)
+    }
     const showMore = (quantity) => {
         var sliceLength = objsSlice.length
-        handleSlice(arr.slice(0, sliceLength + quantity))
+        var newLength = sliceLength + quantity
+
+        if (newLength > 12) {
+            const url = `/users/${props.id}/learning_objects?limit=${newLength}$offset=4`
+            makeAxiosGetRequest(url,handleSuccess,(error) => {console.log(error)})
+        }
+        else {
+            handleSlice(arr.slice(0, sliceLength + quantity))
+        }
+
     }
 
     return (

src/Pages/PublicUserPage.js

@@ -189,7 +189,7 @@ export default function PublicUserPage (props) {
                         {tabValue === 0 &&
                             <TabInicio id={id} user={userData} learningObjs={learningObjArr} collections={collectionsArr}/>}
                         {tabValue === 1 &&
-                            <TabRecursos count={userData.learning_objects_count} learningObjs={learningObjArr}/>}
+                            <TabRecursos count={userData.learning_objects_count} learningObjs={learningObjArr} id={id}/>}
                         {tabValue === 2 &&
                             <TabColecoes count={userData.collections_count} collections={collectionsArr}
                                 />}