python - Graphene-django - How to catch response of query? -

i use django , django graphene make graphql api.

in view of application, use reactjs , react-bootstrap-table. react-bootstrap-table expects pass object array not support nested objects.

i created query in schema.py:

class applicationnode(djangoobjecttype):     class meta:         model = application         filter_fields = ['name', 'sonarqube_url']         interfaces = (relay.node,)  class query(objecttype):     application = relay.node.field(applicationnode)     all_applications = djangofilterconnectionfield(applicationnode) 

the answers these queries json nested objects this:

{   "data": {     "allapplications": {       "edges": [         {           "node": {             "id": "qxbwbgljyxrpb25ob2rloje=",             "name": "foo",             "sonarqubeurl": "foo.com",             "flow":{                  "id": "qybwbgljyxrpb45ob2rloje=",                 "name": "flow_foo"             }           }         },         {           "node": {             "id": "qxbwbgljyxrpb25ob2rloji=",             "name": "bar",             "sonarqubeurl": "bar.com"             "flow":{                  "id": "qxbwbgljyxrpb26ob2rloja=",                 "name": "flow_bar"             }           }         }       ]     }   } } 

i have put them flat before giving them react-bootstrap-table.

what better way, intercept results of graphene-django queries put them flat or make job in reactjs view?

if first way better, how intercept results of graphene-django queries put them flat?

the best thing wrap react-bootstrap-table in new component. in component massage relay props flat structure needed react bootstrap table.

for example:

myreacttable = ({allapplications}) => {   let flatapplications = allapplications.edges.map(({node: app}) => {     return {       name: app.name,       sonarqubeurl: app.sonarqubeurl,       flowname: app.flow.name     };   });   return (     <bootstraptable data={flatapplications} striped={true} hover={true}>       <tableheadercolumn datafield="name" iskey={true} dataalign="center" datasort={true}>name</tableheadercolumn>       <tableheadercolumn datafield="sonarqubeurl" datasort={true}>sonar qube url</tableheadercolumn>       <tableheadercolumn datafield="flowname" dataformat={priceformatter}>flow name</tableheadercolumn>     </bootstraptable>   ); };