Theo's Typesafe Cult•12mo 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•12mo ago

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

Bad Questions

An article by Josh

XENOXOP•12mo ago

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

Josh•12mo 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

XENOXOP•12mo 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•12mo ago

format that plz

XENOXOP•12mo 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•12mo ago

yur

XENOXOP•12mo ago

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

Josh•12mo ago

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

XENOXOP•12mo ago

yea from client

Josh•12mo ago

why that's a terrible idea

XENOXOP•12mo ago

Josh•12mo ago

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

XENOXOP•12mo ago

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

Josh•12mo 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

XENOXOP•12mo ago

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

Josh•12mo ago

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

XENOXOP•12mo 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•12mo ago

yessir

XENOXOP•12mo ago

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

Gaming

Programming

How do you timeout a server action?