If you have any project questions, concerns, or contribution ideas, join our #pwa Slack channel. Find out how to create an account by visiting Community Resources

useQueryResult

Functions

useQueryResult()Array.<Object>

A React Hook that contains logic for handling a query result. It returns the state of the query result and an API object for managing that state object.

Typedefs

QueryResultState : Object

The current state of a query result.

QueryResultAction : Object

An Action object similar to a Redux Action.

API : Object

The API for managing the query results state. Use this API to update the various parts of the query result state.

This object should never change.

useQueryResult() ⇒ Array.<Object>

A React Hook that contains logic for handling a query result. It returns the state of the query result and an API object for managing that state object.

Kind: global function
Returns: Array.<Object> - An array with two entries containing the following content: [ QueryResultState, API]

QueryResultState : Object

The current state of a query result.

Kind: global typedef
Properties

Name Type Description
data Object The query data or null if it is not available.
error Object Error object that is set when there is an error getting the query.
loading Boolean True if the query is still being loaded. False otherwise.

QueryResultAction : Object

An Action object similar to a Redux Action.

Kind: global typedef
Properties

Name Type Description
payload Object The data payload for an action
type String The type of action associated with this object

API : Object

The API for managing the query results state. Use this API to update the various parts of the query result state.

This object should never change.

Kind: global typedef

API.dispatch(state, action)

A function for dispatching actions specific to this module. This is similar to the dispatch() function in Redux

Kind: static method of API

Param Type Description
state QueryResultState The current state
action QueryResultAction A QueryResultAction object

API.setData(data)

Set the state data

Kind: static method of API

Param Type Description
data Object The updated state data

API.setError(errorData)

Set the error state

Kind: static method of API

Param Type Description
errorData Object The error data for the state

API.setLoading(isLoading)

Set the loading state

Kind: static method of API

Param Type Description
isLoading Boolean New value for the loading state

API.receiveResponse(payload)

Updates the state using the response payload.

Kind: static method of API

Param Type Description
payload Object The query response payload

API.resetState()

Resets the state to its initial value.

Kind: static method of API

For implementation details View Source.

Examples

Example 1

Extracting the state and API objects from the array:

let [queryResultState, useQueryResultApi] = useQueryResult();

Updating the queryResultState with new payload data:


import { useApolloContext } from "./useApolloContext";

import PRODUCT_SEARCH from '../../queries/productSearch.graphql';

const apolloClient = useApolloContext();

let payload = await apolloClient.query({ PRODUCT_SEARCH, variables  });

useQueryResultApi.receiveResponse(payload);

Example 2