Button for Duplicating Component not working

[SmolmangoBFX]

Heyo,

So I am working on creating a form that is like a treatment log used in the healthcare/aesthetics field. Essentially, I am trying to make a button that when pressed will create/Duplicate of a certain component. For example, need to create another section to chart in when doing treatment on another body part (take info in 'panel' and duplicate it). Using this code in the custom event of a button:

let pushed = false;
util.eachComponent(form.components, function(c) {

if (pushed) return;
if (c.key === 'panel') {
const panelValues = c.data || {};

c.data = panelValues;
form.components.push(c);
form.redraw();   
pushed = true; 

}
}, true);

---

The Button does the duplicate part well but it clears all data on any previous panels and replace it with the content of the most recently pasted panel. I believe it might have to do with the code referring to the key of the panel so it just copies that.

Could someone guide me on where the error in my code is? For reference, here is the JSON of the form:
Thank you!

Duplicate Button form.txt

[lane-formio]

Have you tried the edit grid or data grid components?

[SmolmangoBFX]

Have you tried the edit grid or data grid components?

Yes but this isnt about adding more rows, its about adding Columns. I want it to remain in the same row.
Ultimately, this will be placed in a data grid but until this is figured out, kind of stuck.

[travist]

If you need to dynamically add new columns, then it may be easier to have the components already there, but conditionally hidden. Then, you can just add the data that "shows" the conditionally hidden column. The user would see dynamic columns added to the panel.