Как отправить запрос GraphQL на Monday.com, используя ReactJS и Apollo?

Question

Я использую Клиент Apollo с React для взаимодействия с API GraphQL * Monday.com , следуя этой документации .

Несмотря на то, что я успешно создал соединение ( см. Codeandbox ), результаты API неверны. Например, на снимке экрана ниже, взятом с онлайн-платформы Monday.com, показаны три задания с тремя разными статусами и тремя разными датами.

Однако, ответ с использованием API GraphQL в понедельник показывает следующее: все три задачи имеют одинаковые даты и статусы, что не соответствует моему скриншоту платформы

"items": [
            {
                "name": "Figure out GraphQL",
                "id": "445896429",
                "column_values": [
                    {
                        "id": "person",
                        "text": "StackOverflow",
                        "__typename": "ColumnValue"
                    },
                    {
                        "id": "status",
                        "text": "Working on it",
                        "__typename": "ColumnValue"
                    },
                    {
                        "id": "date4",
                        "text": "2020-02-02",
                        "__typename": "ColumnValue"
                    },
                    {
                        "id": "status1",
                        "text": null,
                        "__typename": "ColumnValue"
                    }
                ],
                "__typename": "Item"
            },
            {
                "name": "StackOverflow",
                "id": "445896430",
                "column_values": [
                    {
                        "id": "person",
                        "text": "StackOverflow",
                        "__typename": "ColumnValue"
                    },
                    {
                        "id": "status",
                        "text": "Working on it",
                        "__typename": "ColumnValue"
                    },
                    {
                        "id": "date4",
                        "text": "2020-02-02",
                        "__typename": "ColumnValue"
                    },
                    {
                        "id": "status1",
                        "text": null,
                        "__typename": "ColumnValue"
                    }
                ],
                "__typename": "Item"
            },
            {
                "name": "New Example",
                "id": "445908263",
                "column_values": [
                    {
                        "id": "person",
                        "text": "StackOverflow",
                        "__typename": "ColumnValue"
                    },
                    {
                        "id": "status",
                        "text": "Working on it",
                        "__typename": "ColumnValue"
                    },
                    {
                        "id": "date4",
                        "text": "2020-02-02",
                        "__typename": "ColumnValue"
                    },
                    {
                        "id": "status1",
                        "text": null,
                        "__typename": "ColumnValue"
                    }
                ],
                "__typename": "Item"
            }
        ]

Мой код можно увидеть ниже

import React, { Fragment, useState, useEffect } from "react";
import { gql } from "apollo-boost";
import {
  ApolloClient,
  ApolloLink,
  InMemoryCache,
  HttpLink
} from "apollo-boost";

function defineMondayClient() {
  const httpLink = new HttpLink({ uri: "https://api.monday.com/v2/" });
  const authLink = new ApolloLink((operation, forward) => {
    const token = API_TOKEN_PROVIDED_FROM_MONDAY

    operation.setContext({
      headers: {
        authorization: token ? `Bearer ${token}` : ""
      }
    });
    return forward(operation);
  });

  const client = new ApolloClient({
    link: authLink.concat(httpLink), // Chain it with the HttpLink
    cache: new InMemoryCache()
  });

  return client;
}

const useQuerResultShow = () => {
  const client = defineMondayClient();
  const [monday_query_result, updateMondayQueryResult] = useState([]);

  const MONDAY_QUERY = gql`
    query {
      items {
        name
        id
        column_values {
          id
          text
        }
      }
    }
  `;

  useEffect(() => {
    client
      .query({
        query: MONDAY_QUERY
      })
      .then(result => updateMondayQueryResult(result));
  }, []);

  return monday_query_result;
};

const App = () => {
  const monday_query_result = useQuerResultShow();

  useEffect(() => {
    const json_prettified = JSON.stringify(monday_query_result, undefined, 4);
    document.body.appendChild(
      document.createElement("pre")
    ).innerHTML = json_prettified;
  }, [monday_query_result]);

  console.log({ monday_query_result });
  return <div className="App">{}</div>;
};
export default App;

Почему ответ понедельника GraphQL API не согласуется с тем, что находится в платформе?

Я должен также упомяните, что я также пытался использовать Query из @ apollo / реагировать на этот вопрос с тем же результатом

см. коды и поле для моего рабочего кода