Form - FormData - > obiekt - przygotowanie pod Api

Znowu problem ...
Piszę bo walczyłem dzisiaj cały dzień. Chodzi o kwestie pobierania danych z forma poprzez FormData(form).
Dzięki Array.from(); - moge zrobić tablicę
a dzięki Object.fromEntries() obiekt z tej tablicy.

Potrzebuję zrobić obiekt który ma wygląda mniej więcej tak:

const obj = {
        title: newObj.title,
        description: newObj.description,
        source_url: newObj.sourceUrl,
        list1:   <<<<--array from inputs [list1.name1,list1.nam2,list1.name3]
          };

z title nie ma problemu jest name oraz value, podobnie z descrtiption i url.
Schody zaczynają się w momencie listy.
Może być tych list np 10 ==> Array(10) a w środku listy obiekt z trzema inputami z forma.
czyli np:
Array(10) [ {} {} {} {} ... ] .
gdzie: {} to np {5, kg, masła}

mając 3 takie obiekty w tablicy wyglądałoby tak:
array (3) [ {5, kg, masła}
{5, kg, masła}
{5, kg, masła}]

w htmlu w formie mam label: lista1 i do tego 3 inputy każdy ma osobny name.

Podsumowując nie wiem czy jest jakiś sposób aby lepiej przygotować form w html żeby dane mi wpadały jakoś do tabeli.
Czy po prostu mam to oprawiać żeby to tak wyglądało. Próbowałem różnymi metodami, poprzez startwith i inne,.

To kwestia metod oprawiania i pracy na tablicy czy można to lepiej ubrać w formie ?

udało mi się kiepską metodą to zrobić i mam kilka pytań, bo możliwe że problem jest w konstrukcji Form.
label--- ing1
input name: quantity-1
input name: unit-1
input name: description-1

label--- ing2
input name: quantity-2
input name: unit-2
input name: description-2

.. może być ich np z 10.

Zbieram wszystko przy użyciu form data.

Obiekt gotowy do wysłania przez fetch / post z tą datą ma wyglądać tak.:
cały obiekt { ing t: [
{quantity,unit,desc}
{quantity,unit,desc}
{quantity,unit,desc}
{quantity,unit,desc}
{quantity,unit,desc}
]}

Tutaj kod: po kolei robię sobie tablicę z quant, unit i desc.
Później w pętli iteruję elementy 0.0.0 do obiektu, następnie 1,1,1 z każdej z tablic.

    const quantities = Object.entries(newRecipe)
      .filter(q => q[0].startsWith('quanitity') && q[1] !== '')
      .map(q => q[1]);
    //array of  unit
    const unit = Object.entries(newRecipe)
      .filter(u => u[0].startsWith('unit') && u[1] !== '')
      .map(u => u[1]);
    //array of description
    const description = Object.entries(newRecipe)
      .filter(des => des[0].startsWith('description') && des[1] !== '')
      .map(des => des[1]);

    const ingredients = [];
    for (let i = 0; i < quantities.length; i++) {
      const obj = {
        quantity: +quantities[i],
        unit: unit[i],
        description: description[i],
      };
      ingredients.push(obj);
    }

    console.log('ingredients');
    console.log(ingredients);



Da radę to jakoś lepiej wymyślić ? Próbowałem wymyślić lepszą strukturę tego formularza, ale lipa.
Czytałem dość o modyfikacji formData.
że można dodać po submicie lub usunąć input - ale to chyba zły trop