form-transactor.component.js

// :: ReactComponent -> ReactComponent -> ReactComponent
const concatR = A => B =>
  ({ ...props, children }) =>
    <>
      <A { ...props } { ...children } />
      <B { ...props } { ...children } />
    </>

// :: ReactComponent
const EmptyComponent = <></>;

// :: ReactComponent
export const FormTransactor =
  pipe([                             // Some notes about what happens here:
    reduce(concatR, EmptyComponent), // 1. Take the input list of components and concat them (as siblings)
    lift2(nest)(enhance(<form />),   // 2. *lift* a binary nest fn, passing in the enhanced form as the first arg
    name('FormTransactor'),          // 3. name the entire thing (enhanced form with nested children)
  ])([
    Administration,
    FieldList,
    FormTransactorControls,
  ]);
                
// Renders something like:
//                
// <FormTransactor>
//   <Administration { ...props } { ...children } />
//   <FieldList { ...props } { ...children } />
//   <FormTransactorControls { ...props } { ...children } />
// </FormTransactor>