Update Apollo store after query (not mutation)

Question

I want to update the store after a query (by using the Query component). Similar to the update property on the Mutation component. The Query component does not have the "update" prop. I used the client.writeData(...) but for some reason the stored value is empty.

In the following code, the Lanes props are being correctly displayed, but when I try to access to the processChangeRequests value from the local store, the value is empty.

Dashboard.js

<Query
                            query={GET_ITEMS({  uid: user.uid })}>
                            {({ loading, data: { GetProcessChangeRequests, processChangeRequests }, data, client }) => {    
                                if (loading) return <Segment>  <Icon loading name='spinner' /> Loading items ....</Segment>
                                if (!loading){
                                    client.writeData({ data: { processChangeRequests: Object.assign([], GetProcessChangeRequests)  } })          
                                    return (
                                    <Container>
                                        <div>
                                            { ITEM_TITLE_DICTIONARY[visibilityFilter] }
                                        </div>
                                        <Divider />
                                        <Lanes                                                  
                                                user={user}
                                                visibilityFilter={visibilityFilter}

                                        {...this.props} />                                        

                                    </Container>)
                                }
                            }}
                        </Query>

Lanes.js

<Query

            query={gql(QUERY_DICTIONARY[visibilityFilter])}>
            {({ data, client }) => {

                return (<div>

                    {
                        JSON.stringify(data.processChangeRequests)
                    }


                </div>)

            }}
        </Query>

gql(QUERY_DICTIONARY[visibilityFilter]) value is

`{
processChangeRequests @client {
     summary,
        type,
        created_by,
        created_date,
        modified_by,
        modified_date,
        status,
        projekt,
        assigned_user_overall_responsibility,
        assigned_user_status_im_workflow,
        planned_target_date,           
        description,
        implicated,             
        live_item_id,             
        related_process,             
        to_do,             
        priority,             
        scope
}

} `

Locco0_0 Locco0_0 · Accepted Answer · 2018-05-24T06:09:04

If you really need to update the store after a query, thats the way to go.

As you can see here.

What i would suggest that you do not retrieve the data property from the query result twice. I think this is the problem.

If you try it this way you should get the queried data

{
  ({ loading, data, client }) => {

    ...

    if (!loading) {
      const {
        GetProcessChangeRequests,
        processChangeRequests
      } = data;
      
      client.writeData({
          data: { processChangeRequests: Object.assign([], GetProcessChangeRequests)}
      })

      ...

    }
  }

But i do not understand what you want to try.

Update Apollo store after query (not mutation)

1 Answers