Neutral Political Machine

    use-redux-graphql
    TypeScript icon, indicating that this package has built-in type declarations

    0.0.2 • Public • Published

    use-redux-graphql

    Connect to your Redux state with a React hook that does a client-side GraphQL query via the lightweight graphql-object utility.

    ⚛️😎⚛️

    Use Apollo? See use-redux-graphql-apollo.

    This can help as you migrate an existing application from storing API response data in Redux and accessing through selectors toward fetching it from a GraphQL server via React Hooks.

    Queries will automatically re-execute whenever state changes to get the latest data.

    Table of Contents

    Usage in Components

    Here's how you use the React hook it in a component:

    import * as React from "react";
    import gql from "graphql-tag";
    import { useReduxGraphQuery } from "use-redux-graphql";
    import { ReduxGQLQuery } from "./__generated__/reduxGQL";
     
    const COMP_QUERY = gql`
      {
        redux {
          name
          nested {
            flag
          }
        }
      }
    `;
     
    export const Comp = () => {
      const { data } = useReduxGraphQuery<ReduxGQLQuery>(COMP_QUERY);
     
      return <h1>name: {data?.redux?.name}</h1>;
    };

    TypeScript

    If you want to generate TypeScript types from a Redux GraphQL schema you maintain, you can write a schema in an external file, e.g., src/graphql/redux.graphql:

    type Place {
      kind: String
    }
     
    type Nested {
      flag: Boolean
      place: Place
    }
     
    type Redux {
      name: String
      nested: Nested
    }
     
    type Query {
      redux: Redux
    }

    And here's how you can build the types:

    mkdir -p src/__generated__
    npm install --save-dev graphql-schema-typescript
    npx graphql-schema-typescript generate-ts src/graphql --typePrefix ReduxGQL --output src/__generated__/reduxGQL.d.ts

    You can add that last command to a build:types:graphql script in your package.json.

    Install

    npm i use-redux-graphql

    DownloadsWeekly Downloads

    1

    Version

    0.0.2

    License

    none

    Unpacked Size

    3.81 kB

    Total Files

    6

    Last publish

    Collaborators

    • andersdjohnson