5 |
6 |
4 |
5 |
6 |
8 | Open Source. Full Stack. Own Your Data. 9 |
10 |
11 |
12 | 
107 |
108 | Thanks to Vercel sponsoring this project by allowing it to be deployed for free for the entire NextAuth.js Team
109 | 110 | ## License 111 | 112 | ISC 113 | -------------------------------------------------------------------------------- /api.ts: -------------------------------------------------------------------------------- 1 | import { Hono } from "hono" 2 | import { authHandler,initAuthConfig,verifyAuth} from "@hono/auth-js" 3 | import GitHub from "@auth/core/providers/github" 4 | 5 | const app = new Hono({ strict: false }).basePath("/") 6 | 7 | 8 | app.use("*", initAuthConfig(c=>({ 9 | secret: c.env.AUTH_SECRET, 10 | providers: [ 11 | GitHub({ 12 | clientId: c.env.GITHUB_ID, 13 | clientSecret: c.env.GITHUB_SECRET 14 | }), 15 | ], 16 | }))) 17 | 18 | app.use("/api/auth/*", authHandler()) 19 | 20 | app.use("/api/*", verifyAuth()) 21 | 22 | app.get("/api/protected", async (c)=> { 23 | const auth = c.get("authUser") 24 | return c.json(auth) 25 | }) 26 | 27 | export default app 28 | -------------------------------------------------------------------------------- /components.json: -------------------------------------------------------------------------------- 1 | { 2 | "$schema": "https://ui.shadcn.com/schema.json", 3 | "style": "default", 4 | "rsc": true, 5 | "tsx": true, 6 | "tailwind": { 7 | "config": "tailwind.config.js", 8 | "css": "app/globals.css", 9 | "baseColor": "slate", 10 | "cssVariables": true 11 | }, 12 | "aliases": { 13 | "components": "@/components", 14 | "utils": "@/lib/utils" 15 | } 16 | } 17 | -------------------------------------------------------------------------------- /components/App.tsx: -------------------------------------------------------------------------------- 1 | import ClientExample from "@/components/client-example"; 2 | import { SessionProvider } from "@hono/auth-js/react"; 3 | import Layout from "./layout"; 4 | import { Route, Switch } from "wouter"; 5 | import { AuthSuccess } from "./auth-success"; 6 | 7 | export default function App() { 8 | return ( 9 |Auth Success
; 27 | } 28 | -------------------------------------------------------------------------------- /components/client-example.tsx: -------------------------------------------------------------------------------- 1 | import { useSession } from "@hono/auth-js/react" 2 | import { Button } from "./ui/button" 3 | import { Input } from "./ui/input" 4 | import { useState } from "react" 5 | import SessionData from "./session-data" 6 | import CustomLink from "./custom-link" 7 | 8 | const UpdateForm = () => { 9 | const { data: session, update } = useSession() 10 | const [name, setName] = useState(session?.user?.name ?? "") 11 | 12 | if (!session?.user) return null 13 | return ( 14 | <> 15 |
48 | This page fetches session data client side using the{" "}
49 | useSession
51 |
10 | In this example, the whole session object is passed to the page, 11 | including the raw user object. Our recommendation is to{" "} 12 | only pass the necessary fields to the page, as the raw user 13 | object may contain sensitive information. 14 |
15 | ) : ( 16 |17 | In this example, only some fields in the user object is passed to 18 | the page to avoid exposing sensitive information. 19 |
20 | )} 21 |{JSON.stringify(session, null, 2)}
22 | 28 | No session data, please Sign In first. 29 |
30 | ) 31 | } 32 | -------------------------------------------------------------------------------- /components/ui/avatar.tsx: -------------------------------------------------------------------------------- 1 | import * as React from "react" 2 | import * as AvatarPrimitive from "@radix-ui/react-avatar" 3 | 4 | import { cn } from "@/lib/utils" 5 | 6 | const Avatar = React.forwardRef< 7 | React.ElementRef58 | {session.user?.name} 59 |
60 |61 | {session?.user?.email} 62 |
63 |