Is there anything similar like ConvexAuthNextjsServerProvider for Remix?

Using something like below with remix is resulting in below warning

import { ConvexAuthProvider } from '@convex-dev/auth/react'
...
const { ENV } = useLoaderData<typeof loader>();
const [convex] = useState(() => new ConvexReactClient(ENV.CONVEX_URL));
...
<ConvexAuthProvider client={convex}>
  {children}
</ConvexAuthProvider>

import { ConvexAuthProvider } from '@convex-dev/auth/react'
...
const { ENV } = useLoaderData<typeof loader>();
const [convex] = useState(() => new ConvexReactClient(ENV.CONVEX_URL));
...
<ConvexAuthProvider client={convex}>
  {children}
</ConvexAuthProvider>

Warning: useLayoutEffect does nothing on the server, because its effect cannot be encoded into the server renderer's output format. This will lead to a mismatch between the initial, non-hydrated UI and the intended UI. To avoid this, useLayoutEffect should only be used in components that render exclusively on the client. See https://reactjs.org/link/uselayouteffect-ssr for common fixes.
    at ConvexProviderWithAuth (node_modules/convex/dist/esm/react/ConvexAuthState.js:20:3)
    at AuthProvider (node_modules/@convex-dev/auth/dist/react/client.js:13:32)
    at ConvexAuthProvider (node_modules/@convex-dev/auth/dist/react/index.js:43:13)

Warning: useLayoutEffect does nothing on the server, because its effect cannot be encoded into the server renderer's output format. This will lead to a mismatch between the initial, non-hydrated UI and the intended UI. To avoid this, useLayoutEffect should only be used in components that render exclusively on the client. See https://reactjs.org/link/uselayouteffect-ssr for common fixes.
    at ConvexProviderWithAuth (node_modules/convex/dist/esm/react/ConvexAuthState.js:20:3)
    at AuthProvider (node_modules/@convex-dev/auth/dist/react/client.js:13:32)
    at ConvexAuthProvider (node_modules/@convex-dev/auth/dist/react/index.js:43:13)

5 Replies

Michal Srb•5mo ago

That's a bug, will fix But we don't have a bespoke Remix integration yet, so you will only be able to use authentication on the client

Bhanu PrakashOP•5mo ago

got it, thank you.

Michal Srb•5mo ago

We fixed the useLayoutEffect warning in latest @convex-dev/auth and convex

Bhanu PrakashOP•5mo ago

Thank you very much, updated and started working now 👍

fff9999•4mo ago

Is convex team planning on having direct auth integration with remix ?

Is there anything similar like ConvexAuthNextjsServerProvider for Remix?

Did you find this page helpful?