fix(studio-ui-codegen-react): collection items props takes precedent

[dpilch]

Resolves #90

• Explicitly pass items when there is no binding
• items prop take precedent over useDataStoreBinding

See snapshot tests for examples

[cwoolum]

I think we had intended to always allow the items of a collection to be overridden and just not call datastore if so. Might be good to ask at standup.

[dpilch]

Are you saying if items is passed in props then props.items should be used in place of const { boundItems } = useDataStoreBinding...?

So even if we have boundItems defined props.items should take precedent?

[cwoolum]

I believe that is the intended functionality. @renebrandel can you confirm?

[frimfram]

I think we'll have to bring it up as "parking lot item" during standup. @dpilch

[cwoolum]

I just talked with Rene to nail this down. Any component that is a collection will always expose a prop where items can be passed in to be rendered by the collection. If a predicate is provided and that prop is empty, a datastore call should be made and that data used to render.

[dpilch]

I'm looking into the fix for this.

I think it would look something like this.

export type CollectionOfCustomButtonsProps = { 
  items?: any[],
}
export default function CollectionOfCustomButtons(                                                                       
  props: CollectionOfCustomButtonsProps                                                                                  
): JSX.Element {                                                                                                         
  const { items } = props;                                                          
  const buttonUserFilter = {                                                                                             
     and: [                                                                                                               
       { field: "age", operand: "10", operator: "gt" },                                                       
       { field: "lastName", operand: "L", operator: "beginsWith" },                                           
    ],                                                                                                                   
  };
  const displayedItems = items !== undefined
    ? items
    : useDataStoreBinding({                                                                           
      type: "collection",                                                                                              
      model: User,                                                                                                         
      criteria: buttonUserFilter,                                                                                          
    }).buttonUser;        
  return (
    <Collection
      items={displayedItems}
      ...

[cwoolum]

LGTM!

[cwoolum]

LGTM

[frimfram]

LGTM