Dynamic rendering of repeating form fields not working reliably.

Hi :slightly_smiling_face: I’m trying to dynamically render a few repeated form fields based on a state $state.articleArray which defaults to [0] .
The fields are rendered based on the repeat element functionality and the given parameters:
collection: $state.articleArray
indexName: currentIndex
elementName: currentElement (didn’t use it for anything here)
I have one button adding to this array by using:
onClick -> action: update state -> state: $state.articleArray -> operation: Add element -> value: 0
(So by clicking twice I add 2 elements to this array, which will then look as follows: [0,0,0]
And a button rendered for each of the repeated fields which is supposed to delete the given field:
onClick -> action: update state -> state: $state.articleArray
operation: Remove elements, start index: currentIndex, number of elements to remove: 1
It works, but:

  1. The element deleted is the last one in the array, not the ‘currently clicked’ one
  2. After deleting a field and then adding a field, the old (deleted) field reappears filled with the previous data
  3. Submitting such and logging the form body shows all the elements that were ever added to the array, even if they were later deleted
    Am I missing something there and could improve the repetition so the mechanism works in a more reliable way?

I even tried this verbose code from below to overwrite the variable but it works exactly as the functionality provided by Plasmic

console.log("LOGGING the array", $state.articleArray);
const tempArray = [...$state.articleArray];
console.log("logging the temp array:", tempArray);
console.log("logging the current index:", currentIndex);
console.log("manipulating the data");
const outputArray = tempArray.filter((_, idx) => {
  return idx !== currentIndex;
console.log("logging the output array:", outputArray);
$state.articleArray = outputArray;
console.log("new data:");

Thanks for reporting this! CC @samuel