21 replies

Authentication in Remix Loader with Convex Auth

I'm using Convex and Convex Auth in a Remix app, and I want to check if a user is authenticated in a Remix loader to redirect unauthenticated users to the login page.

I'm trying this:

export const loader: LoaderFunction = () => {
  const convex = new ConvexClient(CONVEX_URL);
  const currentUser = convex.query(api.users.me, {});

  if (currentUser === null) {
    return redirect("/login");
  }

  return null;
};

export const loader: LoaderFunction = () => {
  const convex = new ConvexClient(CONVEX_URL);
  const currentUser = convex.query(api.users.me, {});

  if (currentUser === null) {
    return redirect("/login");
  }

  return null;
};

But currentUsercurrentUser always returns null.

Using the useConvexAuthuseConvexAuth hook in a component does eventually return isAuthenticatedisAuthenticated as true so I know the login worked.

Here’s my users.meusers.me query:

export const me = query({
  handler: async (ctx) => {
    const userId = await getAuthUserId(ctx);
    if (userId === null) {
      return null;
    }
    return await ctx.db.get(userId);
  },
});

export const me = query({
  handler: async (ctx) => {
    const userId = await getAuthUserId(ctx);
    if (userId === null) {
      return null;
    }
    return await ctx.db.get(userId);
  },
});

How can I correctly check user authentication in the loader?

Or should I handle this redirect logic in remix + convex auth differently?

Thanks in advance

Authentication in Remix Loader with Convex Auth

I'm using Convex and Convex Auth in a Remix app, and I want to check if a user is authenticated in a Remix loader to redirect unauthenticated users to the login page.

I'm trying this:

export const loader: LoaderFunction = () => {
  const convex = new ConvexClient(CONVEX_URL);
  const currentUser = convex.query(api.users.me, {});

  if (currentUser === null) {
    return redirect("/login");
  }

  return null;
};

export const loader: LoaderFunction = () => {
  const convex = new ConvexClient(CONVEX_URL);
  const currentUser = convex.query(api.users.me, {});

  if (currentUser === null) {
    return redirect("/login");
  }

  return null;
};

export const me = query({
  handler: async (ctx) => {
    const userId = await getAuthUserId(ctx);
    if (userId === null) {
      return null;
    }
    return await ctx.db.get(userId);
  },
});

export const me = query({
  handler: async (ctx) => {
    const userId = await getAuthUserId(ctx);
    if (userId === null) {
      return null;
    }
    return await ctx.db.get(userId);
  },
});

How can I correctly check user authentication in the loader?

Or should I handle this redirect logic in remix + convex auth differently?

Thanks in advance

Authentication in Remix Loader with Convex Auth

Authentication in Remix Loader with Convex Auth

Continue the conversation

Convex Community

Continue the conversation

Convex Community

Similar Threads