Встроенное приложение Shopify: ошибка регулирования Graphql при получении данных о клиентах - PullRequest
Новая
       13

Встроенное приложение Shopify: ошибка регулирования Graphql при получении данных о клиентах

0 голосов
/ 30 октября 2019

Я пытаюсь получить все данные о клиентах из своего магазина разработки приложений shopify, но при попытке получить данные появляется ошибка регулирования. У меня более 1000 клиентов. Я пытался использовать setTimeout между вызовами fetchMore, но, похоже, ничего не делает. Кто-нибудь знает, как избежать удушения? 

import App from 'next/app';
import Head from 'next/head';
import { AppProvider, Spinner } from '@shopify/polaris';
import '@shopify/polaris/styles.css';
import Cookies from 'js-cookie';
import ApolloClient from 'apollo-boost';
import { ApolloProvider, Query } from 'react-apollo';
import gql from 'graphql-tag';

require('es6-promise').polyfill();
require('isomorphic-fetch');

const client = new ApolloClient({
    fetchOptions: {
        credentials: 'include'
    }
});

const GET_CUSTOMERS_BY_ID = gql`
    query getCustomers($cursor: String) {
        customers(first: 250, after: $cursor) {
            pageInfo {
                hasNextPage
                hasPreviousPage
            }
            edges {
                cursor
                node {
                    id
                    tags
                    email
                    firstName
                    lastName
                }
            }
        }
    }
`;

class MyApp extends App {
    state = {
        shopOrigin: Cookies.get('shopOrigin')
    };

    constructor(props) {
        super(props);
    }

    renderSpinner = () => {
        return (
            <div
                style={{
                    marginTop: 30,
                    marginLeft: 30
                }}
            >
                <Spinner size="large" color="teal" />
            </div>
        );
    };

    renderError = error => {
        return <div className="TEST2">{error.message}</div>;
    };

    render() {
        const { Component, pageProps } = this.props;

        return (
            <React.Fragment>
                <Head>
                    <title>My App</title>
                    <meta charSet="utf-8" />
                </Head>
                <AppProvider
                    shopOrigin={this.state.shopOrigin}
                    forceRedirect
                >
                    <ApolloProvider client={client}>
                        <Query query={GET_CUSTOMERS_BY_ID}>
                            {({ data, loading, error, fetchMore }) => {
                                console.log({ loading });
                                if (loading) return this.renderSpinner();
                                if (error) return this.renderError(error);

                                if (data.customers.pageInfo.hasNextPage) {
                                    fetchMore({
                                        query: GET_CUSTOMERS_BY_ID,
                                        variables: {
                                            cursor:
                                                data.customers.edges[
                                                    data.customers.edges
                                                        .length - 1
                                                ].cursor
                                        },
                                        updateQuery: (
                                            previousResult,
                                            { fetchMoreResult }
                                        ) => {
                                            const combinedData = {
                                                customers: {
                                                    pageInfo: {
                                                        ...fetchMoreResult
                                                            .customers.pageInfo
                                                    },
                                                    edges: [
                                                        ...previousResult
                                                            .customers.edges,
                                                        ...fetchMoreResult
                                                            .customers.edges
                                                    ],
                                                    __typename:
                                                        fetchMoreResult
                                                            .customers
                                                            .__typename
                                                }
                                            };
                                            return combinedData;
                                        }
                                    });
                                } else {
                                    return (
                                        <Component {...pageProps} data={data} />
                                    );
                                }
                                return this.renderSpinner();
                            }}
                        </Query>
                    </ApolloProvider>
                </AppProvider>
            </React.Fragment>
        );
    }
}

export default MyApp;
...