Server action outside of form loading state
Unanswered
jelte posted this in #help-forum
jelteOP
I am wondering how I can get the loading state for my server action to use in other parts of my application.
I have a business partner select dropdown in my header which is part of my layout which is a client component. The select is not inside a form
In my header I want to call my server action when another businesspartner is selected in the dropdown. The server action that does some api calls and other things to switch businesspartner and at the end I will call revalidateTag to revalidate customer data
Now I want to get the loading state from the server action and user that state in my layout and other places inside my app.
Is there any way to get the loading state form the server action and also use it in other components?
I have a business partner select dropdown in my header which is part of my layout which is a client component. The select is not inside a form
In my header I want to call my server action when another businesspartner is selected in the dropdown. The server action that does some api calls and other things to switch businesspartner and at the end I will call revalidateTag to revalidate customer data
Now I want to get the loading state from the server action and user that state in my layout and other places inside my app.
Is there any way to get the loading state form the server action and also use it in other components?
4 Replies
@jelte I am wondering how I can get the loading state for my server action to use in other parts of my application.
I have a business partner select dropdown in my header which is part of my layout which is a client component. The select is **not** inside a form
In my header I want to call my server action when another businesspartner is selected in the dropdown. The server action that does some api calls and other things to switch businesspartner and at the end I will call revalidateTag to revalidate customer data
Now I want to get the loading state from the server action and user that state in my layout and other places inside my app.
Is there any way to get the loading state form the server action and also use it in other components?
import { useTransition } from "react";
// ...
const [isPending, startTransition] = useTransition();
// ...
startTransition(async () => {
const value = await theServerAction();
// ...
});
// ...
{isPending ? <span>Loading...</span> : null}@joulev tsx
import { useTransition } from "react";
// ...
const [isPending, startTransition] = useTransition();
// ...
startTransition(async () => {
const value = await theServerAction();
// ...
});
// ...
{isPending ? <span>Loading...</span> : null}
jelteOP
Thanks, but I need to get the isPending in other components in my app then where I call my action. For my example in my layout
hmm you have to implement it yourself then. make a global context and whenever you run an action, set that global state
jelteOP
yes that what I was thinking of. But was hoping to get rid of Context providers and useContext 😅