Editable Data Grid Error - Add/Remove rows from data grid whose data is from a query

Dear All,

I created an editable datagrid from sample code found from the SAIL Recipes and it fetches the data fine, and I am happy about that.

However, when I delete a row or add a row to my grid I get the following errors -

In Design Time, I get:
Could not display interface. Please check definition and inputs.
Interface Definition: Expression evaluation error: An error occurred while executing a save: Expression evaluation error at function 'remove' [line 309]: Invalid index (3) for list: valid range is 1...1

During Runtime, I get:
Error Evaluating UI Expression
Expression evaluation error in rule 'cshv_initiator_rework' at function a!forEach [line 207]: Error in a!forEach() expression during iteration 1: Expression evaluation error at function a!textField [line 213]: Invalid index: Cannot index property 'itemName' of type Text into type DataSubset

Here below is the SAIL code for my editable grid.  Can some find where the problem might lie?

Thanks

---

local!lineItemsPagingInfo: a!pagingInfo(
    startIndex: 1,
    batchSize: 10
    ),
 
local!input: a!queryEntity(
  entity:cons!CSHV_LINE_ITEM_CDT,
  query:a!query(
 selection: a!querySelection(columns: {
   a!queryColumn(field: "itemName"),
   a!queryColumn(field: "amount"),
   a!queryColumn(field: "qty"),
   a!queryColumn(field: "total")
 }),
  filter: a!queryFilter(
 field: "cashAdvnaceId.id",
 operator: "=",
 value: ri!CashAdvanceRequestData.id
  ),
  PagingInfo: local!lineItemsPagingInfo
  )
),
 
  local!gridSelection: a!gridSelection(
  selected: {},
  pagingInfo: a!pagingInfo(
    startIndex: 1,
    batchSize: 10,
    sort: a!sortInfo(
      field: "timeStamp",
      ascending: false
    )
  )
),

a!gridLayout(
  totalCount: count(
 local!lineItemsPagingInfo
  ),
  headerCells: {
 a!gridLayoutHeaderCell(
   label: "Item"
 ),
 a!gridLayoutHeaderCell(
   label: "Amount",
   align: "RIGHT"
 ),
 a!gridLayoutHeaderCell(
   label: "Qty",
   align: "RIGHT"
 ),
 a!gridLayoutHeaderCell(
   label: "Total",
   align: "RIGHT"
 ),
 /* For the "Remove" column */
 a!gridLayoutHeaderCell(
   label: ""
 )
  },
  /* Only needed when some columns need to be narrow */
  columnConfigs: {
 a!gridLayoutColumnConfig(
   width: "DISTRIBUTE",
   weight: 7
 ),
 a!gridLayoutColumnConfig(
   width: "DISTRIBUTE",
   weight: 2
 ),
 a!gridLayoutColumnConfig(
   width: "DISTRIBUTE",
   weight: 1
 ),
 a!gridLayoutColumnConfig(
   width: "DISTRIBUTE",
   weight: 2
 ),
 a!gridLayoutColumnConfig(
   width: "ICON"
 )
  },
  rows: a!forEach(
 items: local!input,
 expression: a!gridRowLayout(
   id: fv!index,
   contents: {
  /* For the Item Name Column*/
  a!textField(
    /* Labels are not visible in grid cells but are necessary to meet accessibility requirements */
    label: "item " & fv!index,
    value: fv!item.itemName,
    saveInto: fv!item.itemName,
    required: true
  ),
  /* For the Amount Column*/
  a!floatingPointField(
    label: "Amount " & fv!index,
    labelPosition: "ADJACENT",
    value: fv!item.amount,
    saveInto: {
   fv!item.amount,
   if(
     rule!APN_isBlank(
    fv!item.qty
     ),
     "",
     a!save(
    fv!item.total,
    product(
      fv!item.amount,
      fv!item.qty
    )
     )
   )
    },
    refreshAfter: "UNFOCUS",
    validations: {},
    align: "RIGHT"
  ),
  /* For the Qty Column*/
  a!floatingPointField(
    label: "Qty " & fv!index,
    labelPosition: "ADJACENT",
    value: fv!item.qty,
    saveInto: {
   fv!item.qty,
   if(
     rule!APN_isBlank(
    fv!item.amount
     ),
     "",
     a!save(
    fv!item.total,
    product(
      fv!item.amount,
      fv!item.qty
    )
     )
   )
    },
    refreshAfter: "UNFOCUS",
    validations: {},
    align: "RIGHT"
  ),
  /* For the Total Column*/
  a!floatingPointField(
    label: "Total " & fv!index,
    labelPosition: "ADJACENT",
   
    value: if(
   or(
     rule!APN_isBlank(
    fv!item.amount
     ),
     rule!APN_isBlank(
    fv!item.qty
     )
   ),
   fv!item.total,
   product(
     fv!item.amount,
     fv!item.qty
   )
    ),
    saveInto: fv!item.total,
    refreshAfter: "UNFOCUS",
    validations: {},
    align: "RIGHT"
  ),
  /* For the Removal Column*/
  a!imageField(
    label: "delete " & fv!index,
    images: a!documentImage(
   document: a!iconIndicator(
     "REMOVE"
   ),
   altText: "Remove Line Item",
   caption: "Remove " & fv!item.item & " " & fv!item.lastName,
   link: a!dynamicLink(
     value: fv!index,
     saveInto: {
    a!save(
      local!input,
      remove(
     local!input,
     save!value
      )
    )
     }
   )
    ),
    size: "ICON"
  )
   }
 )
  ),
  addRowlink: a!dynamicLink(
 label: "Add a new line.",
 saveInto: {
   a!save(
  local!input,
  append(
    local!input,
    save!value
  )
   )
 }
  )
)