ratty-blush•5w ago

useCustomMutation timeout

I have a function like this one mutate({ url: ${apiUrl}/strapi-chat/chat, method: "post", values: { data: the_fields } }, { onError: (error, variables, context) => { // An error occurred! console.log( error ); console.log( variables ); console.log( context ); }, onSuccess: (data, variables, context) => { console.log( data ); setter( data.data?.data?.response ); }, }); how can I increase the timeout for the request ?

5 Replies

kapa.ai•5w ago

Hi @DannyWhite. I'm kapa.ai, your friendly support bot. I will try to answer your question by searching through the knowledge base. :wave: ---------------------- To increase the timeout for the request in useCustomMutation, you can use the overtimeOptions property. This allows you to set a custom interval for the request and handle long-running operations. Here's how you can modify your code to include a longer timeout:

const { mutate } = useCustomMutation({
    overtimeOptions: {
        interval: 10000, // Set the interval to 10 seconds (10000 milliseconds)
        onInterval: (elapsedInterval) => {
            console.log(`Request has been running for ${elapsedInterval} ms`);
        },
    },
});

mutate({
    url: `${apiUrl}/strapi-chat/chat`,
    method: "post",
    values: {
        data: the_fields
    }
},
{
    onError: (error, variables, context) => {
        console.log(error);
        console.log(variables);
        console.log(context);
    },
    onSuccess: (data, variables, context) => {
        console.log(data);
        setter(data.data?.data?.response);
    },
});

const { mutate } = useCustomMutation({
    overtimeOptions: {
        interval: 10000, // Set the interval to 10 seconds (10000 milliseconds)
        onInterval: (elapsedInterval) => {
            console.log(`Request has been running for ${elapsedInterval} ms`);
        },
    },
});

mutate({
    url: `${apiUrl}/strapi-chat/chat`,
    method: "post",
    values: {
        data: the_fields
    }
},
{
    onError: (error, variables, context) => {
        console.log(error);
        console.log(variables);
        console.log(context);
    },
    onSuccess: (data, variables, context) => {
        console.log(data);
        setter(data.data?.data?.response);
    },
});

In this example, I've added the overtimeOptions to the useCustomMutation hook. The interval is set to 10000 milliseconds (10 seconds), which means the request will continue running for at least this long before timing out. You can adjust this value as needed. The onInterval function is optional, but it can be useful for logging or handling long-running requests. It will be called every interval milliseconds while the request is still running. Note that this doesn't directly set a "timeout" in the traditional sense, but rather allows the request to continue running for a longer period. If you need a hard timeout, you might need to implement it at the network level or in your API. useCustomMutation Documentation (https://refine.dev/docs/data/hooks/use-custom-mutation/#overtimeoptions) Remember that increasing the timeout might not always be the best solution for long-running requests. Consider optimizing your API or using alternative approaches for handling long operations if they're consistently taking a long time to complete. ---------------------- Note: you can ask me a follow up question by @ mentioning me again :speech_balloon: ----------------------

kapa.ai•5w ago

<@1129002557419827210> Kapa.ai is still learning and improving, please let me know how I did by reacting below.

ratty-blushOP•5w ago

@kapa.ai are there any other methods to extend the call ? i'm using Axios

kapa.ai•5w ago

Let me check the knowledge base for you again. One moment! :books: ---------------------- Yes, since you're using Axios, there are other methods to extend the call and increase the timeout. Refine allows you to customize the Axios instance used for API calls. Here's how you can do it: 1. You can configure the Axios instance globally when setting up your data provider:

import axios from "axios";
import { DataProvider } from "@refinedev/core";
import dataProvider from "@refinedev/simple-rest";

const axiosInstance = axios.create({
  timeout: 30000, // Set timeout to 30 seconds
});

const dataProviderWithCustomAxios = dataProvider("API_URL", axiosInstance);

import axios from "axios";
import { DataProvider } from "@refinedev/core";
import dataProvider from "@refinedev/simple-rest";

const axiosInstance = axios.create({
  timeout: 30000, // Set timeout to 30 seconds
});

const dataProviderWithCustomAxios = dataProvider("API_URL", axiosInstance);

2. Alternatively, you can pass a custom Axios instance to the useCustomMutation hook:

import axios from "axios";

const axiosInstance = axios.create({
  timeout: 30000, // Set timeout to 30 seconds
});

const { mutate } = useCustomMutation({
  config: {
    customAxios: axiosInstance,
  },
});

import axios from "axios";

const axiosInstance = axios.create({
  timeout: 30000, // Set timeout to 30 seconds
});

const { mutate } = useCustomMutation({
  config: {
    customAxios: axiosInstance,
  },
});

Both of these methods allow you to set a custom timeout for your Axios requests, which can be more precise than using the overtimeOptions we discussed earlier. Remember that increasing the timeout might not always be the best solution for long-running requests. Consider optimizing your API or using alternative approaches for handling long operations if they're consistently taking a long time to complete. useCustomMutation API Reference (https://refine.dev/docs/data/hooks/use-custom-mutation/#api-reference) If you need more control over the Axios configuration or want to implement more advanced features like request interceptors, you can refer to the Axios documentation for additional options. ---------------------- Note: you can ask me a follow up question by @ mentioning me again :speech_balloon: ----------------------

kapa.ai•5w ago

<@1129002557419827210> Kapa.ai is still learning and improving, please let me know how I did by reacting below.

useCustomMutation timeout

Did you find this page helpful?