title: How to resolve loop infinite : Http request inside a loop in React js?
body: <p>I have a form where in the properties there is a function, in the main I called this form and I have to pass a function that has an array each element of that array I have to call an http request of type PUT and I have an infinite loop problem. have ideas guys??</p>
  <p><strong>Form.ts:</strong>(it is not complete, I only put the part where the function is)</p>
  <pre><code>interface UserFormProps {
      
      selectedUser?: User | null
      formType: string
      onSave: (val: UserFormData) =&gt; Promise&lt;boolean&gt;
      onDismiss: () =&gt; void
      isVisible: boolean
      GroupFilterSelection?:any
      RoomFilterSelection?:any
      OnAddUser ?:()=&gt;void
  }
  
      &lt;Label &gt;{t('Assegnare Rooms')}&lt;/Label&gt;
                  {boolean?
                  &lt;&gt;
                   &lt;div className=&quot;row&quot;&gt;
                     &lt;div className=&quot;col &quot;&gt;
                       { GroupFilterSelection }
                     &lt;/div&gt;
                     &lt;/div&gt;
                     &lt;div className=&quot;row&quot;&gt;
                     &lt;div className=&quot;col&quot;&gt;
                        { RoomFilterSelection}                 
                     &lt;/div&gt;
                  
                     &lt;div&gt;
                     &lt;PrimaryButton className=&quot;mt-4&quot; onClick={()=&gt;OnAddUser} &gt;{t('Add userRoom')}&lt;/PrimaryButton&gt;
                     &lt;/div&gt;
                     &lt;/div&gt;
                     &lt;/&gt;
                   :null
              
                  }
  </code></pre>
  <p><strong>Function:</strong></p>
  <pre><code>async function AddRoomUser(){
        if(filterrooms&amp;&amp;filterrooms.length&gt;0 &amp;&amp; selectedUser){
          
          for await(let i of filterrooms){
             let item : RoomUser = {
             UsersId :selectedUser.UsersId,
             UsersName : selectedUser.User,
             RoomId :i.RoomId
            }
             await dispatch(AddUserRoom(item))
             
          }
          
        }
      }
  </code></pre>
  <p><strong>Main.ts(code html):</strong></p>
  <pre><code>&lt;UserForm selectedUser={selectedUser} formType={addOrEditUser} isVisible={displayUserForm} onSave={saveUser} onDismiss={dismissForm} GroupFilterSelection={GroupSelectionFilter} RoomFilterSelection={roomSelectionFilter} OnAddUser={()=&gt;AddRoomUser} &gt;&lt;/UserForm&gt;
  </code></pre>