Convex Mutation & Action Chaining
Guys I would like to create a function that checks if the user has a stripeID in the db, if not create a stripeID and store it in the db.
After use the ID to add a new card to the users account.
I've attached the code below given I am not sure if I am following the best practices.
Also how do I handle loading state in the frontend? Would the loading state only be for the first mutation or the whole chain?
Here isthe code: https://pastebin.com/Y5exEf3a
Please help me understand this a little better.
Pastebin
import { internalAction, mutation } from "./_generated/server";impo...
Pastebin.com is the number one paste tool since 2002. Pastebin is a website where you can store text online for a set period of time.
5 Replies
Thanks for posting in <#1088161997662724167>.
Reminder: If you have a Convex Pro account, use the Convex Dashboard to file support tickets.
- Provide context: What are you trying to achieve, what is the end-user interaction, what are you seeing? (full error message, command output, etc.)
- Use search.convex.dev to search Docs, Stack, and Discord all at once.
- Additionally, you can post your questions in the Convex Community's <#1228095053885476985> channel to receive a response from AI.
- Avoid tagging staff unless specifically instructed.
Thank you!
export const kickoffWorkflow = action({
handler: async (ctx) => {
const workflowId = await workflow.start(
ctx,
internal.example.exampleWorkflow,
{ name: "James" },
);
await new Promise((resolve) => setTimeout(resolve, 1000));
const status = await workflow.status(ctx, workflowId);
console.log("Workflow status after 1s", status);
},
});
You'd want to use useQuery to subscribe to the workflow's status in the frontend based on the mutation creating a workflowID
Convex
Workflow
Simplify programming long running code flows. Workflows execute durably with configurable retries and delays.
Again, leverage workflows as these are the best way to handle tasks such as this that have multiple sub-tasks
@envy — are you always updating the payment method id in this case? And creating the Stripe is just a backend detail?
Either way, you have a couple options:
- the easiest way is to add new field on your user to track status. You can use this in your UI to showing a loading state (or anything else). Eg user.status === “updatingPaymentMethod”
And status === “idle”
Probably better to be more specific than “status”… maybe something more generic, like a boolean “user.isUpdating”.
Set that status via your first mutation. Then update it as required (use ctx.runMutation if it’s from an action).
On the client, you have your user already… it will be updated in realtime and you can use useEffect on the user flag to then set your loading state.
Be sure to manage your errors too. The short version is show a loading state when some user flag is set. That’s it. Then just toggle the flag via Convex functions as needed.
The second way involves returning the scheduled job ids and polling for their status. That is less fun.
Sorry for the formatting, I’m on mobile.