github-starred/better-auth
2
0
Fork 0
mirror of https://github.com/better-auth/better-auth.git synced 2026-05-22 22:32:01 -05:00
Code Issues 2.5k Packages Projects Releases 112 Wiki Activity

Prefetch session on the backend and pass the promise to the frontend #1809

New Issue
Open
opened 2026-03-13 09:05:00 -05:00 by GiteaMirror · 5 comments
GiteaMirror commented 2026-03-13 09:05:00 -05:00
Owner
Copy Link

Originally created by @kaissalha on GitHub (Aug 30, 2025).

Is this suited for github?

  • Yes, this is suited for github

Is your feature request related to a problem? Please describe.

Loading state every time I refresh the page on the FE

Describe the solution you'd like

Basically something similar to react query's prefetch where you initialize on the server then consume on the frontend.

https://tanstack.com/query/latest/docs/framework/react/guides/ssr

The goal is for useSession to have the data available instantly instead of having a loading state.

Describe alternatives you've considered

There are no alternatives right now.

Additional context

No response

Originally created by @kaissalha on GitHub (Aug 30, 2025). ### Is this suited for github? - [x] Yes, this is suited for github ### Is your feature request related to a problem? Please describe. Loading state every time I refresh the page on the FE ### Describe the solution you'd like Basically something similar to react query's prefetch where you initialize on the server then consume on the frontend. https://tanstack.com/query/latest/docs/framework/react/guides/ssr The goal is for useSession to have the data available instantly instead of having a loading state. ### Describe alternatives you've considered There are no alternatives right now. ### Additional context _No response_
GiteaMirror added the enhancement label 2026-03-13 09:05:00 -05:00
GiteaMirror commented 2026-03-13 09:05:02 -05:00
Author
Owner
Copy Link

@himself65 commented on GitHub (Aug 31, 2025):

Good point. We will redesign the client hook plugin to make sure it's best fit the web framework in the future.

@himself65 commented on GitHub (Aug 31, 2025): Good point. We will redesign the client hook plugin to make sure it's best fit the web framework in the future.
GiteaMirror commented 2026-03-13 09:05:03 -05:00
Author
Owner
Copy Link

@Bartek532 commented on GitHub (Sep 16, 2025):

Hi @himself65, any updates on this?

@Bartek532 commented on GitHub (Sep 16, 2025): Hi @himself65, any updates on this?
GiteaMirror commented 2026-03-13 09:05:03 -05:00
Author
Owner
Copy Link

@dosubot[bot] commented on GitHub (Dec 16, 2025):

Hi, @kaissalha. I'm Dosu, and I'm helping the better-auth team manage their backlog and am marking this issue as stale.

Issue Summary:

  • You requested a feature to prefetch session data on the backend and pass the promise to the frontend to avoid loading states, similar to React Query's SSR prefetching.
  • The maintainer, himself65, acknowledged the idea and mentioned plans to redesign the client hook plugin to better fit web frameworks.
  • Other users, like Bartek532, have expressed interest and asked for updates.
  • No further progress or updates have been shared since the initial discussion.
  • The request remains open and under consideration.

Next Steps:

  • Please let me know if this feature is still relevant to the latest version of better-auth by commenting on this issue to keep the discussion open.
  • Otherwise, I will automatically close this issue in 7 days.

Thank you for your understanding and contribution!

@dosubot[bot] commented on GitHub (Dec 16, 2025): Hi, @kaissalha. I'm [Dosu](https://dosu.dev), and I'm helping the better-auth team manage their backlog and am marking this issue as stale. **Issue Summary:** - You requested a feature to prefetch session data on the backend and pass the promise to the frontend to avoid loading states, similar to React Query's SSR prefetching. - The maintainer, himself65, acknowledged the idea and mentioned plans to redesign the client hook plugin to better fit web frameworks. - Other users, like Bartek532, have expressed interest and asked for updates. - No further progress or updates have been shared since the initial discussion. - The request remains open and under consideration. **Next Steps:** - Please let me know if this feature is still relevant to the latest version of better-auth by commenting on this issue to keep the discussion open. - Otherwise, I will automatically close this issue in 7 days. Thank you for your understanding and contribution!
GiteaMirror commented 2026-03-13 09:05:04 -05:00
Author
Owner
Copy Link

@Bartek532 commented on GitHub (Dec 16, 2025):

Hey, it's still relevant on the latest version, do we have any progress on this?

@Bartek532 commented on GitHub (Dec 16, 2025): Hey, it's still relevant on the latest version, do we have any progress on this?
GiteaMirror commented 2026-03-13 09:05:04 -05:00
Author
Owner
Copy Link

@jamiter commented on GitHub (Feb 24, 2026):

To workaround this limitation and have a non-pending session from the server, we use a session context to pass a session to the client. Using a custom useSession hook to process both server and client session.

// auth-client.ts
'use client';

import { createAuthClient } from 'better-auth/react';
import { createContext, useContext } from 'react';

import type { auth } from '@/lib/auth'; // Or wherever you get this from

export const authClient = createAuthClient();

type Session = Awaited<ReturnType<typeof auth.api.getSession>>;

export const SessionContext = createContext<Session | null>(null);

// Custom useSession hook to check both server and client session
export function useSession() {
  const sessionContextData = useContext(SessionContext);

  const session = authClient.useSession();

  return session.isPending && sessionContextData
    ? { ...session, data: sessionContextData, isPending: false }
    : session;
}

Then we create a SessionProvider to use in our Server Components:

// session-provider.ts

'use client';

import { SessionContext } from '@/lib/auth-client';

import type { auth } from '@/lib/auth';

type Session = Awaited<ReturnType<typeof auth.api.getSession>>;

export function SessionProvider({
  session,
  children,
}: {
  session: Session;
  children: React.ReactNode;
}) {
  return <SessionContext value={session}>{children}</SessionContext>;
}

In our Server Component:

// page.tsx
import { auth } from '@/lib/auth'
import { SessionProvider } from '@/lib/components';

export default async function Page() {
  const session = auth.api.getSession({ ... })

  return (
    <SessionProvider session={session}>
      <p>We have a session!</p>
    </SessionProvider>
  );
}

Any feedback is welcome!

@jamiter commented on GitHub (Feb 24, 2026): To workaround this limitation and have a non-pending session from the server, we use a session context to pass a session to the client. Using a custom `useSession` hook to process both server and client session. ```tsx // auth-client.ts 'use client'; import { createAuthClient } from 'better-auth/react'; import { createContext, useContext } from 'react'; import type { auth } from '@/lib/auth'; // Or wherever you get this from export const authClient = createAuthClient(); type Session = Awaited<ReturnType<typeof auth.api.getSession>>; export const SessionContext = createContext<Session | null>(null); // Custom useSession hook to check both server and client session export function useSession() { const sessionContextData = useContext(SessionContext); const session = authClient.useSession(); return session.isPending && sessionContextData ? { ...session, data: sessionContextData, isPending: false } : session; } ``` Then we create a SessionProvider to use in our Server Components: ```tsx // session-provider.ts 'use client'; import { SessionContext } from '@/lib/auth-client'; import type { auth } from '@/lib/auth'; type Session = Awaited<ReturnType<typeof auth.api.getSession>>; export function SessionProvider({ session, children, }: { session: Session; children: React.ReactNode; }) { return <SessionContext value={session}>{children}</SessionContext>; } ``` In our Server Component: ```tsx // page.tsx import { auth } from '@/lib/auth' import { SessionProvider } from '@/lib/components'; export default async function Page() { const session = auth.api.getSession({ ... }) return ( <SessionProvider session={session}> <p>We have a session!</p> </SessionProvider> ); } ``` Any feedback is welcome!
Sign in to join this conversation.
No Branch/Tag Specified
Branches Tags
Labels
Clear labels
adapter
astro
awaiting external contributor
blocked
breaking
breaking change
bug
c-devops
core
credentials
database
dependencies
devops
devtools
docs
documentation
duplicate
elysia
enhancement
enterprise
expo
express
fastify
good first issue
help wanted
hono
identity
infra
integration
invalid
javascript
locked
maintenance
need-more-information
needs: info
needs: repro
nextjs
nuxt
oauth
organization
P0
payments
perf
platform
plugin
pull-request
Mirrored from GitHub Pull Request
 question
ready
regression
remix
security
social-provider
solid
stale
svelte
tanstack-start
tracking
version-bump
vue
wontfix
No Label enhancement
Milestone
No items
No Milestone
Projects
Clear projects
No project
Assignees
Clear assignees
GiteaMirror ninjasurge
No Assignees
1 Participants
Notifications
Due Date
No due date set.
Dependencies

No dependencies set.

Reference: github-starred/better-auth#1809
Delete Branch "%!s()"

Deleting a branch is permanent. Although the deleted branch may continue to exist for a short time before it actually gets removed, it CANNOT be undone in most cases. Continue?