javascript - Relay.js is not resolving composed fragment correctly -

i'm working on converting flux app relay.js , i'm running issues. can't seem component fragment composition work properly. correct data comes server, composed data never passed props of parent component reason.

here's code far:

librarylongdescription.js

import react, {component, proptypes} 'react'; import relay 'react-relay'; import documenttitle 'react-document-title'; import address '../components/address'; import orders '../pages/orders';  export default class librarylongdescription extends component {     constructor(props)     {         super(props);          this.state = {             library: {}         };          console.log(props);         if(props.library){             this.state.library = props.library;         }     }      render()     {         return (             <documenttitle title="libraries">                 <div>                     {this.state.library.name}                     <div classname="row">                         <address type={"address"} address={this.state.library.address} />                     </div>                      <div classname="top-space-60">                         <h3>orders</h3>                         <orders />                     </div>                   </div>             </documenttitle>         );     } }   export default relay.createcontainer(librarylongdescription, {     fragments: {         library: () => relay.ql`fragment on library {             id,             name,             address{                 id                 sannumber,                 addressline1,                 addressline2,                 city,                 state,                 zip             },             ${orders.getfragment('orders')}         }`,     } }); 

orders.js

import react, {component, proptypes} 'react'; import relay 'react-relay';  class orders extends component {     constructor(props)     {         super(props);         console.log(props);     }      render()     {         return (<h1>this order goes</h1>);     } }  export default relay.createcontainer(orders, {     fragments: {         orders: () => relay.ql`fragment on library {             orders(first: 10){                 edges{                     node{                         id,                         message_number,                         order_total                     }                 }                 pageinfo{                     haspreviouspage,                     hasnextpage                 }             }         }`     } }); 

this not resolve correctly. when console log props in librarylongdescription.js values query, don't orders fragment. when see came on network data in form:

{      "data":{         "library":{            "id":"valid",          "name":"valid",          "address":{               correct data          },          "_orders1mpmpx":{               "edges":[                  {                     "node":{                        correct data                   },                   "cursor":"correct data"                },             ],             "pageinfo":{                  correct data             }          }       }    } } 

but when console log props library long description don't see orders. property: __fragment__ seems not have useful on it. appreciated. i've been searching internet solutions hours. if there's info did not provide of use let me know.

after spending stupid amount of time trying solve issue have discovered relay not defining type field in fragment query. here's mean... library query changed this:

export default relay.createcontainer(librarylongdescription, {     fragments: {         library: () => relay.ql`             fragment on library {                 id,                 name,                 address{                     id                     sannumber,                     addressline1,                     addressline2,                     city,                     state,                     zip                 },                 orders(first: 500){                     ${orders.getfragment('orders')}                 }             }         `,     } }); 

and orders query changed this:

export default relay.createcontainer(orders, {     fragments: {         orders: () => relay.ql`fragment on orderconnection {             edges{                 node{                     id                     purchasedate                 }             }             pageinfo{                 haspreviouspage                 hasnextpage             }         }`     }, }); 

if don't have sort of root field orders defined on parent, relay won't know how resolve field parent passed child component. doing this: orders(first: 500) declaring name dependency relay pass component. without name relay not see component requiring name , won't pass it. hope helps else out someday. spent more full day trying figure 1 out.