Web Dev CodyW
Convex Community•2y ago•
14 replies
Web Dev Cody

Trying to get a loader working correctly

I'm trying to setup logic in my front end to show skeleton loaders when a page is loading on a query, but I'm not sure the best practice

right now my query looks like this

export const getUserPlans = query({
  handler: async (ctx) => {
    const userId = await getUserId(ctx);

    if (!userId) {
      return {
        error: 'no user id was found',
      };
    }

    return await ctx.db
      .query('plans')
      .withIndex('by_userId', (q) => q.eq('userId', userId))
      .collect();
})


and in the front end I do something like this

  const plans = useQuery(api.plans.queries.getUserPlans);

if (isError(plans) || plans === undefined) {
  return <Loader />
}


but I'm seeing some behavior where the convex endpoint is invoked before the user is actually authenticated, so it returns the error. I'm wondering if there is a better way to setup the front end to never invoke my convex backend until my auth is all 100% setup
Was this page helpful?