Theo's Typesafe Cult•11mo ago

How do you timeout a server action?

With axios and fetch, you can specify a timeout but how do you do this with server actions?

Solution:

yessir

Jump to solution

20 Replies

Josh•11mo ago

https://imjosh.dev/blog/bad-questions

Bad Questions

An article by Josh

XENOX•11mo ago

I get this but it's a very general question. I'll reframe and add more context

Josh•11mo ago

specifically I'm looking for what are you trying to accomplish? what code have you tried? etc a lot of times the right solution isn't the answer to your question it's a solution to your problem

XENOX•11mo ago

So I know with fetch you can add a timout for api request to fetch data so if the data is not fetched during that time, it will throw an error and you can handle that and show to the user that request took too long Now how do you achieve the same with server actions? It's not an api path, so can't use fetch (I think) adding code ... how do you timeout if the quest is not done in like 10 seconds? const handleButtonClick = async () =>{ const response = await generateBulletList(userMessage || ""); } <Button onClick={handleButtonClick} > button </Button>

Josh•11mo ago

format that plz

XENOX•11mo ago

Yea was trying to do that, sry I don't know the key or shortcut 🥲

  const handleButtonClick = async () => {
    const controller = new AbortController();
    setIsLoading(true);

    const response = await generateBulletList(userMessage || "");
    if (response.code === "error") {
      toast({
        title: response.message,
      });
      setIsLoading(false);
      return;
    }
    const cleanedString = response.message.replace(/ *- */g, "");
    setMessage(cleanedString);

    await updateUserAICalls();

    setIsLoading(false);
  };

    <Button
      onClick={handleButtonClick}
    >
      {isLoading ? <LoadingSpinner /> : <Sparkles className="w-4 h-4" />}
    </Button>

  const handleButtonClick = async () => {
    const controller = new AbortController();
    setIsLoading(true);

    const response = await generateBulletList(userMessage || "");
    if (response.code === "error") {
      toast({
        title: response.message,
      });
      setIsLoading(false);
      return;
    }
    const cleanedString = response.message.replace(/ *- */g, "");
    setMessage(cleanedString);

    await updateUserAICalls();

    setIsLoading(false);
  };

    <Button
      onClick={handleButtonClick}
    >
      {isLoading ? <LoadingSpinner /> : <Sparkles className="w-4 h-4" />}
    </Button>

is this better?

Josh•11mo ago

yur

XENOX•11mo ago

I was trying to use AbortController, but had no idea how to use with server action since it's like a function.

Josh•11mo ago

10 seconds from the client or 10s execution time 10s from client is just not a good idea in general

XENOX•11mo ago

yea from client

Josh•11mo ago

why that's a terrible idea

XENOX•11mo ago

Josh•11mo ago

you're fucking any user trying to use your app with a bad internet connection

XENOX•11mo ago

ahhh haha true sry never done this stuff 😅 this is kinda my first prod level project

Josh•11mo ago

a better option is to not cancel, but show some sort of 'hey, this is taking longer than normal, we are trying' or whatever so you don't have to interact with the request at all, just use a regular setTimeout

XENOX•11mo ago

yup I wanted to do both, so a message in like 10sec and then cancel if it takes 20 sec

Josh•11mo ago

you should never cancel again your fucking users on slow Internet speeds and there is no point in canceling

XENOX•11mo ago

so a set timeout on client side and nothing on server side? and set timeout just shows the message, never cancel the req...

Solution

Josh•11mo ago

yessir

XENOX•11mo ago

Thnx a lot for the help, will give it a shot

Gaming

Programming

How do you timeout a server action?