Loading...
; return{customer?.plan}
; } ``` You may also want to ensure that user is logged in before fetching their billing data to avoid unnecessary API calls. ```tsx title="header.tsx" import { api } from "~/lib/api"; export const User = () => { const { data: { user }, } = useSession(); const { data: customer } = useQuery({ queryKey: ["customer"], queryFn: () => handle(api.billing.customer.$get()), enabled: !!user, // [!code highlight] }); if (!user || !customer) { return null; } return ({user.email}
{customer.plan}
Loading...
; } /* do something with the data... */ return ({JSON.stringify(posts)}
Loading...
; } /* do something with the data... */ return ({JSON.stringify(posts)}
Loading...
; } /* do something with the session data... */ return{user?.email}
; }; ``` That's how you can access user details right in your extension. ## Signing out Signing out from the extension also involves using the well-known `signOut` function that is derived from our [auth client](https://www.better-auth.com/docs/basic-usage#signout): ```tsx title="logout.tsx" import { signOut } from "~/lib/auth"; export const Logout = () => { return ; }; ``` The session is automatically invalidated, so the next use of `useSession` or any other query that depends on the session will return `null`. The UI for both the extension and the web app will be updated to show the user as logged out.Loading...
; } /* do something with the data... */ return{data?.message}
; }; ```My Component Content