/**
 *
 * @param {import('../../lib/render-rows').FormTabRows} rows
 * @returns {import('../../lib/render-rows').FormTabRows}
 */
export function transformRowsForMobile(rows) {
  const mobileRows = [];
  let columnGroups = {};

  rows.forEach((row) => {
    if (Array.isArray(row)) {
      row[0].forEach((item, index) => {
        if (!columnGroups[index]) {
          columnGroups[index] = [];
        }
        columnGroups[index].push(item);
      });
    } else {
      Object.values(columnGroups).forEach((group) => {
        mobileRows.push([group, { gridTemplateColumns: '1fr' }]);
      });
      columnGroups = {};
      mobileRows.push(row);
    }
  });

  Object.values(columnGroups).forEach((group) => {
    mobileRows.push([group, { gridTemplateColumns: '1fr' }]);
  });

  return mobileRows;
}