useCustom filters

When I try to use useCustom to get total counts, the filter I define doesn't get applied to the query.
const { data, isLoading, refetch } = useCustom({
url: '',
method: 'get',
meta: {
gqlQuery: TOTAL_COUNTS_QUERY,
},
config: {
filters: [
{
field: 'business.id',
operator: 'eq',
value: sessionStorage.getItem('currentBusiness'),
},
],
},
});
const { data, isLoading, refetch } = useCustom({
url: '',
method: 'get',
meta: {
gqlQuery: TOTAL_COUNTS_QUERY,
},
config: {
filters: [
{
field: 'business.id',
operator: 'eq',
value: sessionStorage.getItem('currentBusiness'),
},
],
},
});
Here is my query for total counts:
export const TOTAL_COUNTS_QUERY = gql`
query TotalCounts {
thisWeekCustomers: businessUsers {
totalCount
}
lastWeekCustomers: businessUsers(
filter: { created: { lte: "${pastDate(1)}" } }
) {
totalCount
}
twoWeeksAgoCustomers: businessUsers(
filter: { created: { lte: "${pastDate(2)}" } }
) {
totalCount
}
thisWeekEvents: events {
totalCount
}
lastWeekEvents: events(
filter: { created: { lte: "${pastDate(1)}" } }
) {
totalCount
}
twoWeeksAgoEvents: events(
filter: { created: { lte: "${pastDate(2)}" } }
) {
totalCount
}
thisWeekMemberships: memberships {
totalCount
}
lastWeekMemberships: memberships(
filter: { created: { lte: "${pastDate(1)}" } }
) {
totalCount
}
twoWeeksAgoMemberships: memberships(
filter: { created: { lte: "${pastDate(2)}" } }
) {
totalCount
}
}
`;
export const TOTAL_COUNTS_QUERY = gql`
query TotalCounts {
thisWeekCustomers: businessUsers {
totalCount
}
lastWeekCustomers: businessUsers(
filter: { created: { lte: "${pastDate(1)}" } }
) {
totalCount
}
twoWeeksAgoCustomers: businessUsers(
filter: { created: { lte: "${pastDate(2)}" } }
) {
totalCount
}
thisWeekEvents: events {
totalCount
}
lastWeekEvents: events(
filter: { created: { lte: "${pastDate(1)}" } }
) {
totalCount
}
twoWeeksAgoEvents: events(
filter: { created: { lte: "${pastDate(2)}" } }
) {
totalCount
}
thisWeekMemberships: memberships {
totalCount
}
lastWeekMemberships: memberships(
filter: { created: { lte: "${pastDate(1)}" } }
) {
totalCount
}
twoWeeksAgoMemberships: memberships(
filter: { created: { lte: "${pastDate(2)}" } }
) {
totalCount
}
}
`;
K
kapa.ai31d ago
Hi @chachi. I'm kapa.ai, your friendly support bot. I will try to answer your question by searching through the knowledge base. :wave: ---------------------- The useCustom hook in Refine is used to send custom query requests. It uses the custom method as the query function from the dataProvider which is passed to <Refine>. The useCustom hook expects the url and method properties, which will be passed to the custom method from the dataProvider as parameters. When properties are changed, the useCustom hook will trigger a new request. In your case, you are trying to apply a filter to the useCustom hook. The filters property is part of the config object and it will be passed to the custom method from the dataProvider as a parameter. It can be used to send the filter query parameters of the request. Here is an example of how to use the filters property in the useCustom hook:
useCustom({
config: {
filters: [
{
field: "title",
operator: "contains",
value: "Foo",
},
],
},
});
useCustom({
config: {
filters: [
{
field: "title",
operator: "contains",
value: "Foo",
},
],
},
});
In your case, you are trying to filter by business.id. Make sure that the business.id field exists in your data and that the value you are trying to filter by is correct. Also, ensure that the custom method in your dataProvider is correctly handling the filters parameter. If you are still having issues, it might be helpful to check how your dataProvider is handling the custom method and how it's processing the filters parameter. You can refer to the Refine documentation on the custom method (https://refine.dev/docs/data/data-provider#custom) for more information. Also, note that useCustom should not be used when creating, updating, or deleting a resource. It does not invalidate queries and therefore will not update the application state. If you need to customize the mutation request, use the useCustomMutation hook instead. Sources: - useCustom Hook (https://refine.dev/docs/data/hooks/use-custom) - custom Method (https://refine.dev/docs/data/data-provider#custom) - useCustom filters (https://refine.dev/docs/data/hooks/use-custom#configfilters) ---------------------- Note: you can ask me a follow up question by @ mentioning me again :speech_balloon: ----------------------
K
kapa.ai31d ago
<@95552725294518272> kapa.ai is still learning and improving, please let us know how it did by reacting below
R
rare-sapphire31d ago
@kapa.ai Where do I apply filters in the custom method?
custom: async ({ url, method, headers, meta, filters }) => {
if (url) {
client.setEndpoint(url);
}

if (headers) {
client.setHeaders(headers);
}

const gqlOperation = meta?.gqlMutation ?? meta?.gqlQuery;

if (gqlOperation) {
const response: any = await client.request(
gqlOperation,
meta?.variables ?? {},
);

return { data: response };
}

if (meta?.rawQuery) {
const response = await client.request<BaseRecord>(
meta.rawQuery,
meta.variables,
);

return { data: response };
}

if (meta) {
if (meta.operation) {
let query, variables;

if (method === 'get') {
const gqlQuery = builder.query({
operation: meta.operation,
fields: meta.fields,
variables: meta.variables,
});

query = gqlQuery.query;
variables = gqlQuery.variables;
} else {
const gqlMutation = builder.mutation({
operation: meta.operation,
fields: meta.fields,
variables: meta.variables,
});

query = gqlMutation.query;
variables = gqlMutation.variables;
}

const response = await client.request<BaseRecord>(query, variables);

return {
data: response[meta.operation],
};
} else {
throw Error('GraphQL operation name required.');
}
} else {
throw Error(
'GraphQL needs operation, fields and variables values in meta object.',
);
}
},
custom: async ({ url, method, headers, meta, filters }) => {
if (url) {
client.setEndpoint(url);
}

if (headers) {
client.setHeaders(headers);
}

const gqlOperation = meta?.gqlMutation ?? meta?.gqlQuery;

if (gqlOperation) {
const response: any = await client.request(
gqlOperation,
meta?.variables ?? {},
);

return { data: response };
}

if (meta?.rawQuery) {
const response = await client.request<BaseRecord>(
meta.rawQuery,
meta.variables,
);

return { data: response };
}

if (meta) {
if (meta.operation) {
let query, variables;

if (method === 'get') {
const gqlQuery = builder.query({
operation: meta.operation,
fields: meta.fields,
variables: meta.variables,
});

query = gqlQuery.query;
variables = gqlQuery.variables;
} else {
const gqlMutation = builder.mutation({
operation: meta.operation,
fields: meta.fields,
variables: meta.variables,
});

query = gqlMutation.query;
variables = gqlMutation.variables;
}

const response = await client.request<BaseRecord>(query, variables);

return {
data: response[meta.operation],
};
} else {
throw Error('GraphQL operation name required.');
}
} else {
throw Error(
'GraphQL needs operation, fields and variables values in meta object.',
);
}
},
K
kapa.ai31d ago
Let me check the knowledge base for you. One moment! :books: ---------------------- The filters parameter in your custom method is not being used in the current implementation. To apply filters, you need to include them in your GraphQL query or mutation. The exact way to do this depends on your GraphQL schema and how it handles filtering. Generally, you would include a filter argument in your GraphQL operation that takes an input type representing your filter criteria. Here's a simplified example of how you might include filters in a GraphQL query:
const gqlQuery = builder.query({
operation: meta.operation,
fields: meta.fields,
variables: {
...meta.variables,
filter: filters,
},
});
const gqlQuery = builder.query({
operation: meta.operation,
fields: meta.fields,
variables: {
...meta.variables,
filter: filters,
},
});
In this example, filters is an array of filter objects, each with a field, operator, and value property. This array is passed as a filter argument to the GraphQL operation. Please note that this is a simplified example and might not work in your specific case. The exact implementation depends on your GraphQL schema and how it handles filtering. You might need to transform the filters array into a format that your GraphQL server can understand. Also, remember to handle the case where filters is undefined, as it is an optional parameter. Sources: - useCustom Hook (https://refine.dev/docs/data/hooks/use-custom) - custom Method (https://refine.dev/docs/data/data-provider#custom) - useCustom filters (https://refine.dev/docs/data/hooks/use-custom#configfilters) ---------------------- Note: you can ask me a follow up question by @ mentioning me again :speech_balloon: ----------------------
K
kapa.ai31d ago
<@95552725294518272> kapa.ai is still learning and improving, please let us know how it did by reacting below
R
rare-sapphire31d ago
@kapa.ai that doesn't work
K
kapa.ai31d ago
Let me check the knowledge base for you. One moment! :books: ---------------------- I'm sorry to hear that the previous suggestion didn't work. The implementation of filters in the custom method largely depends on how your GraphQL server handles filtering. In your custom method, you're using a builder to construct your GraphQL queries and mutations. If this builder supports filters, you would need to pass the filters to it in the appropriate format. However, without more information about your GraphQL schema, the builder you're using, and how they handle filters, it's difficult to provide a more specific solution. I would recommend checking the documentation or source code of the builder you're using to see how it handles filters. You might also want to consult your GraphQL server's documentation or schema to see how it expects filters to be formatted in queries and mutations. If you're still having trouble, you might want to consider asking for help in a more specific context, such as a forum or community related to your builder, GraphQL server, or the refine framework. Sources: - useCustom Hook (https://refine.dev/docs/data/hooks/use-custom) - custom Method (https://refine.dev/docs/data/data-provider#custom) - useCustom filters (https://refine.dev/docs/data/hooks/use-custom#configfilters) ---------------------- Note: you can ask me a follow up question by @ mentioning me again :speech_balloon: ----------------------
K
kapa.ai31d ago
<@95552725294518272> kapa.ai is still learning and improving, please let us know how it did by reacting below
More Posts
Insert field on load for autocomplete componentI cant seem to find issue on the following code block, I can provide more of the edit.tsx if needed:how do I solve this?how do I slove this problem?Hello. My name is Mateo. Handle isHello. My name is Mateo. Handle is Flutterbots. I was introduced to Refine.dev and cannot believe ituseNotification errorI'm trying to use useNotification hook to show some notifications. It is working, but i'm getting thusedatagrid sort on nested dataI want to sort the use data grid based on a nested value eg row?.transaction?.datecustom page as a resourceHello guys, first of all, thx for such a great project! I have a custom page for changing password, Logo and Website TitleHow to change the Logo and the Website Title of react refine, i am using material UI with viteCRM backendHi, I'm stuck while trying to re create the backend for the CRM example (really don't understand wjhHi, I'm stuck while trying to re createHi, I'm stuck while trying to re create the backend for the CRM example (really don't understand wjhMy hook says status initial in the devtools. No request is made when I check the data providerAll of my queries just say status initial in the devtools when I come to see why everything in my apDark Mode not workingDark Mode not working when changing the theme color of the layout ?Use App Bar for NavigationI need to use AppBar for navigation instead of the Sider.Update theme in custom HeaderHow to update theme in custom Header when the Layout component is not in the same place as the useStoptionLabel don't work as a functionI'm trying to use useSelect function with a custom label, for this the documentation says that you DashboardHow to add Dashboard to my custom sider ?Get Length of Data of Posts to use in Dashboard ChartsGet Length of Data of Posts to use in Dashboard ChartsCustom SiderI need to create a custom sider, also the default project does not contain a component for the SiderExport Button Removes Create ButtonWhenever using useExport, it overrides Create, i need both beside each other how can i achieve this.antd dynamic formI am using mern stack suggest code snippets for dynamic row addition in the antd form and also backeHow can i use refine in a existing react project?Hi, I'm new to react and refine. i wanted to know if it's possible to create a react project first a