Show\Hide fields is not working based on click

I have below code,

<template for:each={resultData} for:item="acc" for:index="indx">              
     <template if:true={acc.showAll}>
    <tr>
         <td>
            <lightning-input data-id={indx} label="Name" value={acc.Name} onchange={handleNameChange} variant='label-hidden'></lightning-input>                               
             </td>
         <td>           
               <lightning-input data-id={indx} label="Description" value={acc.Description} onchange={handleDescriptionChange} variant='label-hidden'></lightning-input>
         </td>
         <td>
               <lightning-button-icon 
        data-id={indx}       
        alternative-text="Hide"    
                class="slds-m-left_xx-small"
        onclick={hideData} 
        title="Hide"></lightning-button-icon>
         </td>
    </tr>
      </template>
      <template if:true={acc.showRowData}>
         <tr key={acc.key} data-id={indx}>
            <td>
           {acc.Name}
        </td>
            <td>
               {acc.Description}
        </td>
         </tr>
      </template>
</template>
<tr>
   <td><lightning-button label='Add Row' onclick={addRow}></lightning-button></td>
</tr>

@api recordId;
@api fullView;
@api resultData;

connectedCallback(){
        
   this.resultData =[{
    Name: null,
    Description: null,
    ShowAll: true,
    ShowRowData: false
 }];
}

addRow() {
  let newEntry = {
   'Name' : null,
   'Description' : null,
   'ShowAll': true,
   'ShowRowData' : false
  };
  if (this.resultData) {
      this.resultData = [...this.resultData, newEntry ];
  } else {
      this.resultData = [newEntry];
  }
}

hideData( event ) {
  let strIndex = event.currentTarget.dataset.id;
  this.resultData[strIndex].ShowAll = false;
  this.resultData[strIndex].ShowRowData = true;
}

Scenario is to add rows dynamically which contains few fields and when values were entered should be able to minimize and show the data as row, so in order to achieve it I have two variables ShowAll and ShowRowData of resultData will be set to true and false accordingly. When components get loaded was not able to see fields even though setting ShowAll to true. Also trying to set the values to these variables in hideData. Not sure why fields were not displayed even ShowAll is set to true. The reason why I am doing this way is to able to add dynamically and collapse (not to remove from DOM) and need to pass the data of all fields as rows to JS. Please suggest me where I am going wrong.