page.tsx
import { useUser } from '@/components/hooks/use-user'

export default function Page() {
  const { user } = useUser()
  return <div>
    <h1>Welcome, {user?.name || 'guys'}!</h1>
  </div>
}

page.tsx
import { Button } from '@/components/ui/button'
import { LemonSqueezy } from '@/lib/payments/lemonsqueezy'
import { hit } from '@/lib/web/hit'

export default function Page() {
  return <div>
    <Button onClick={async () => {
      const resp = await hit('/api/orders', {
        method: 'POST',
        body: JSON.stringify({
          plan: 'pro'
        })
      })
      const order = await resp.json()
      window.location.href = LemonSqueezy.checkout(order, 'https://example.lemonsqueezy.com/buy/xxx-xxx-xxxx-xxxx')
    }}>
      Checkout
    </Button>
  </div>
}