const [rowData, setRowData] = useState([{organisation:'', name: '', comment}]);const addRow = () => { const newRow: RowData = { organisation: '', name: '', comment: '' }; // Create a new RowData object setRowData([...rowData, newRow]); };const removeByIndex = (indexToRemove: number) => { const updatedArray = rowData.filter((row, index) => index !== indexToRemove); setRowData([...updatedArray]); };I am trying to create a dynamic form with three fields organisation, name and comment. Created two functions adding addRow(to add multiple rows) and removeByIndex(will remove the row as per index will be clicked on). Trying to get the expected output which is mentioned in the image but unable to get it. adding an image for reference enter image description here




