how to call post api recursively untill array.length condition is false

Here is my question how to call recusive post api function untill array.length condition is false

Here is my code what i tried

const postItemArray =["<eg:cat>"]
var collectionDataContainer = [];



const recurseFunction = i => {
    const [loadingStatus, mainData, addDataToPostItemArray] = useFetch(`http//blabla${postItemArray[i]}variety`);
    console.log(edgeData[i]);

    if (i < postItemArray.length) {
      recurseFunction(i + 1);
    }
     if (addDataToPostItemArray.length !== 0) {
      postItemArray.push(...addDataToPostItemArray);
     }
    if (mainData.length !== 0) {
      collectionDataContainer.push(...demoData);
    }
    console.log(DummyArray);
  };

  recurseFunction(0);

here the parameters in useTetch are

loadingStatus will give true or false condition

mainData will give Data after fetching

addDataToPostItemArray fitered out mainData and will give array of keys if MainData have any keys for next loop recursion

Here is the Example Data format for understanding before calling recursive function

step-1 initially postItemArray = ["<eg:cat>"] after passing postItemArray[i] value to useFetch then we will get data like this

mainData=[
          {key : "<eg:dog>",class : "animal"},
          {key : "<eg:ant>",class : "insect"},
          {key : "<eg:monkey>", category : "jumping"},
          {key : "<eg:fish>", category : "swim"}
         ]

step-2 addDataToPostItemArray this array will find out the class object keys if mainData have class key value pair inside the useFetch and collect the key in the format of below

addDataToPostItemArray =["<eg:dog>","<eg:ant>"]

if mainData array object have class Key it will catch and element store the keys inside the addDataToPostItemArray

here is the logic done in useFetch file for finding keys

axios(config).then(response => {
 let originalResult = response.data.results.bindings
              .filter(ek => ek.Class !== undefined && ek)
              .map(el => el.key);

               setFindClass(originalResult);

but my problem is im able to get the keys from useFetch and pushed into the postItemArray

and postItemArray length will exceeds to 3 as we expected

but in inside the recurseFuction if statement(i < postItemArray.length) condition looping only one time because its cosidering same initial length after pushed some data to postItemArray

so that why im not able to get looping data after array length is increased this is my fail condition

 if (i < postItemArray.length) {
          recurseFunction(i + 1);
        }

please anyone can help me out please im unable to find the solution for this question

just only i want to collect the Data into this container collectionDataContainer = [] looping if mainData have class and key object

if any one have better logic please help me out that is soo appreciatable