refinedev/refine

[BUG]Unable to populate data using useList with GraphQL in Refine - data remains undefined

Closed this issue · 1 comments

Describe the bug

0

I'm working on a React application using the Refine framework along with GraphQL. I'm trying to insert mock data into a component using the useList hook. The mock data should be fetched from a GraphQL resource (dealStages) that I learned about in a recent YouTube tutorial.

However, I'm encountering an issue where the data variable remains undefined, and I'm unable to retrieve any data. Below is the relevant part of my code:

import { DASHBOARD_DEALS_CHART_QUERY } from '@/graphql/queries';
import { mapDealsData } from '@/utilities/helpers';
import { Area, AreaConfig } from '@ant-design/plots';
import { useList, HttpError } from "@refinedev/core";
import React from 'react';

const DealsChart = () => {
// Use the useList from refine that enables fetching data from our API:
const { data } = useList({
resource: 'dealStages',
meta: {
gqlQuery: DASHBOARD_DEALS_CHART_QUERY,
},
});

console.log(data);

const config: AreaConfig = {
data: [],
};

const dealData = React.useMemo(() => {
return mapDealsData(data?.data);
}, [data?.data]);

// Rest of the component...
};

And here's the DASHBOARD_DEALS_CHART_QUERY:

export const DASHBOARD_DEALS_CHART_QUERY = gqlquery DashboardDealsChart( $filter: DealStageFilter! $sorting: [DealStageSort!] $paging: OffsetPaging ) { dealStages(filter: $filter, sorting: $sorting, paging: $paging) { nodes { id title dealsAggregate { groupBy { closeDateMonth closeDateYear } sum { value } } } totalCount } };

Issue:

The data variable remains undefined when I log it, which means that my component doesn't receive any data to work with. Questions:

Is there something I'm missing in the way I'm using useList with GraphQL in Refine? Could there be an issue with the GraphQL query, or should I be passing additional parameters to the useList hook? What could be the reason for the data not being fetched properly, and how can I resolve it? If there's any other information that might be helpful, please let me know. Thanks in advance for your assistance!

Steps To Reproduce

run the app
wait untill you go back to login page due to auth error.
Query data cannot be undefined. Please make sure to return a value other than undefined from your query function. Affected query key: ["auth","identity"]

Expected behavior

show list of element from graphql mock data.
( i hace checke the query inb the graphql playground and its working and fetching the data there.)

Packages

'@refinedev/core

Additional Context

No response

Hey @levir10 you can use chatbot in our documentation and/or discord server for your questions.