/* Rule Name: ucMultiFileUploadResizeArray*/
=if(
  /* Do we need to add?                              */
  and(
    /* Yes, if the value isn't null                  */
    not(isnull(ri!value)),
    /* and we're at the end of the list              */         
    ri!index = 1 + length(ri!array)
  ),
  append(
    ri!array,
    /* Append the new value to the end of the list   */
    ri!value
  ),
  if(
    /* Do we need to remove?                         */
    /* Only if value is now null (value was removed) */
    isnull(ri!value),
    /* Remove: remove the list item for this field   */
    remove(ri!array, ri!index),
    /* Neither add nor remove, so insert at index    */
    insert(
      ri!array,
      ri!value,
      ri!index
    )
  )
)

/* Rule Name: ucMultiFileUploadRenderField*/
= with(
  local!paddedArray: append(
    ri!files,
    null
  ),
  a!fileUploadField(
    label: if(
      ri!index = 1,
      ri!label,
      ""
    ),
    labelPosition: "ADJACENT",
    target: ri!target,
    value: local!paddedArray[ri!index],
    saveInto: {
      a!save(
        ri!files,
        rule!ucMultiFileUploadResizeArray(
          ri!files,
          ri!index,
          local!paddedArray[ri!index]
        )
      )
    }
  )
)

/* Rule Name : test*/
=load(
  local!files: {},
  /* Update the target to a real folder to actually persist the files! */
  local!target: tofolder(-1),
  a!formLayout(
    label: "SAIL Example: Multiple File Upload",
    firstColumnContents: {
      a!applyComponents(
        function: rule!ucMultiFileUploadRenderField(label: "Upload Files", files: local!files, target: local!target, index: _),
        array: 1 + fn!enumerate(1 + length(local!files))
      ),
      a!textField(
        label: "local!files value",
        value: local!files,
        readOnly: true
      )
    },
    buttons: a!buttonLayout(
      primaryButtons: a!buttonWidgetSubmit(
        label: "Submit"
      )
    )
  )
)