Skip to content

[DRAFT] mapDataToProps

Thom van Kalkeren edited this page Aug 13, 2019 · 7 revisions

So, this isn't how the current mapDataToProps interface works, but an effort to design a less flexible but more powerful and consistent interface.

const collectionMembers = [NS.as('pages'), NS.as('items'), NS.rdfs('member')];

const Component = ({
  somePropName,
  customProp,
  someNestedContainer,
  someDeeplyNestedProperty,
  deeplyNestedWhereMatches,
  person,
}) => {
  console.log(somePropName);                 // 'name value'
  console.log(customProp);                   // [Statement(NamedNode(s), p, o, g), ...]
  console.log(someNestedContainer);          // [NamedNode('seq 1'), NamedNode('seq 2')]
  console.log(someDeeplyNestedProperty);     // [NamedNode('closed member'), NamedNode('open member'), ...]
  console.log(deeplyNestedWhereMatches);     // [NamedNode('open member'), ...]
  console.log(person)                        // { name: new Literal('Bob'), country: { subject: NN(<atlantis>), flag: NN(<flag.jpeg>) } } 
}

Component.mapDataToProps = {
  name: value(NS.schema.name),
  // The raw interface the other helper functions boil down to
  customProp: {
    transform: (i) => i,
    label: NS.ex('prop'),
    limit: Infinity,
    returnType: 'statement'
  },
  // arr can resolve native rdf container types (rdf:Bag/Seq, rdf:List)
  someNestedContainer: arr(NS.ex('somePropWithRDFSRangeRDFContainer')),
  // Like LRS.dig for finding values at the end of the path
  someDeeplyNestedProperty: dig(collectionMembers),
  // Like LRS.findSubject for finding subjects at the end of the path matching a value
  deeplyNestedWhereMatches: findSubject(collectionMembers, NS.ex('state/open')),
  // Nesting link components for advanced querying
  person: link(NS.schema.author, {
    name: NS.schema.name,
    country: link(NS.schema.nationality, {
        subject,
        flag: NS.schema.logo
    })
  })
}

Arr

Component.mapDataToProps = {
  // arr can resolve native rdf container types (rdf:Bag/Seq, rdf:List)
  someNestedContainer: arr(NS.ex('somePropWithRDFSRangeRDFContainer')),
  arr2: arr({
    label: NS.schema.comments,
    sort: (a, b) => Number(a.value) - Number(b.value),
  })
}
Clone this wiki locally