diff --git a/docs/components/icons.tsx b/docs/components/icons.tsx index 1a16eff9..c1ce838a 100644 --- a/docs/components/icons.tsx +++ b/docs/components/icons.tsx @@ -267,32 +267,129 @@ export const Icons = { height="1.2em" viewBox="0 0 100 100" > - - + + - - - - - - - - - - - - - - - - - - - - - - + + + + + + + + + + + + + + + + + + + + + + - ) + ), }; diff --git a/docs/components/techstack-icons.tsx b/docs/components/techstack-icons.tsx index 2fb0195f..da186d56 100644 --- a/docs/components/techstack-icons.tsx +++ b/docs/components/techstack-icons.tsx @@ -37,5 +37,5 @@ export const techStackIcons: TechStackIconType = { tanstack: { name: "TanStack Start", icon: , - } + }, }; diff --git a/examples/tanstack-example/app/api.ts b/examples/tanstack-example/app/api.ts index f1324764..b1921c07 100644 --- a/examples/tanstack-example/app/api.ts +++ b/examples/tanstack-example/app/api.ts @@ -1,6 +1,6 @@ import { - createStartAPIHandler, - defaultAPIFileRouteHandler, + createStartAPIHandler, + defaultAPIFileRouteHandler, } from "@tanstack/start/api"; export default createStartAPIHandler(defaultAPIFileRouteHandler); diff --git a/examples/tanstack-example/app/components/ui/avatar.tsx b/examples/tanstack-example/app/components/ui/avatar.tsx index 05e961cd..f3c7d6ec 100644 --- a/examples/tanstack-example/app/components/ui/avatar.tsx +++ b/examples/tanstack-example/app/components/ui/avatar.tsx @@ -1,50 +1,50 @@ -"use client" +"use client"; -import * as React from "react" -import * as AvatarPrimitive from "@radix-ui/react-avatar" +import * as React from "react"; +import * as AvatarPrimitive from "@radix-ui/react-avatar"; -import { cn } from "~/lib/utils" +import { cn } from "~/lib/utils"; const Avatar = React.forwardRef< - React.ElementRef, - React.ComponentPropsWithoutRef + React.ElementRef, + React.ComponentPropsWithoutRef >(({ className, ...props }, ref) => ( - -)) -Avatar.displayName = AvatarPrimitive.Root.displayName + +)); +Avatar.displayName = AvatarPrimitive.Root.displayName; const AvatarImage = React.forwardRef< - React.ElementRef, - React.ComponentPropsWithoutRef + React.ElementRef, + React.ComponentPropsWithoutRef >(({ className, ...props }, ref) => ( - -)) -AvatarImage.displayName = AvatarPrimitive.Image.displayName + +)); +AvatarImage.displayName = AvatarPrimitive.Image.displayName; const AvatarFallback = React.forwardRef< - React.ElementRef, - React.ComponentPropsWithoutRef + React.ElementRef, + React.ComponentPropsWithoutRef >(({ className, ...props }, ref) => ( - -)) -AvatarFallback.displayName = AvatarPrimitive.Fallback.displayName + +)); +AvatarFallback.displayName = AvatarPrimitive.Fallback.displayName; -export { Avatar, AvatarImage, AvatarFallback } +export { Avatar, AvatarImage, AvatarFallback }; diff --git a/examples/tanstack-example/app/components/ui/dialog.tsx b/examples/tanstack-example/app/components/ui/dialog.tsx index 9850daa4..96a4c5ca 100644 --- a/examples/tanstack-example/app/components/ui/dialog.tsx +++ b/examples/tanstack-example/app/components/ui/dialog.tsx @@ -1,122 +1,122 @@ -"use client" +"use client"; -import * as React from "react" -import * as DialogPrimitive from "@radix-ui/react-dialog" -import { X } from "lucide-react" +import * as React from "react"; +import * as DialogPrimitive from "@radix-ui/react-dialog"; +import { X } from "lucide-react"; -import { cn } from "~/lib/utils" +import { cn } from "~/lib/utils"; -const Dialog = DialogPrimitive.Root +const Dialog = DialogPrimitive.Root; -const DialogTrigger = DialogPrimitive.Trigger +const DialogTrigger = DialogPrimitive.Trigger; -const DialogPortal = DialogPrimitive.Portal +const DialogPortal = DialogPrimitive.Portal; -const DialogClose = DialogPrimitive.Close +const DialogClose = DialogPrimitive.Close; const DialogOverlay = React.forwardRef< - React.ElementRef, - React.ComponentPropsWithoutRef + React.ElementRef, + React.ComponentPropsWithoutRef >(({ className, ...props }, ref) => ( - -)) -DialogOverlay.displayName = DialogPrimitive.Overlay.displayName + +)); +DialogOverlay.displayName = DialogPrimitive.Overlay.displayName; const DialogContent = React.forwardRef< - React.ElementRef, - React.ComponentPropsWithoutRef + React.ElementRef, + React.ComponentPropsWithoutRef >(({ className, children, ...props }, ref) => ( - - - - {children} - - - Close - - - -)) -DialogContent.displayName = DialogPrimitive.Content.displayName + + + + {children} + + + Close + + + +)); +DialogContent.displayName = DialogPrimitive.Content.displayName; const DialogHeader = ({ - className, - ...props + className, + ...props }: React.HTMLAttributes) => ( -
-) -DialogHeader.displayName = "DialogHeader" +
+); +DialogHeader.displayName = "DialogHeader"; const DialogFooter = ({ - className, - ...props + className, + ...props }: React.HTMLAttributes) => ( -
-) -DialogFooter.displayName = "DialogFooter" +
+); +DialogFooter.displayName = "DialogFooter"; const DialogTitle = React.forwardRef< - React.ElementRef, - React.ComponentPropsWithoutRef + React.ElementRef, + React.ComponentPropsWithoutRef >(({ className, ...props }, ref) => ( - -)) -DialogTitle.displayName = DialogPrimitive.Title.displayName + +)); +DialogTitle.displayName = DialogPrimitive.Title.displayName; const DialogDescription = React.forwardRef< - React.ElementRef, - React.ComponentPropsWithoutRef + React.ElementRef, + React.ComponentPropsWithoutRef >(({ className, ...props }, ref) => ( - -)) -DialogDescription.displayName = DialogPrimitive.Description.displayName + +)); +DialogDescription.displayName = DialogPrimitive.Description.displayName; export { - Dialog, - DialogPortal, - DialogOverlay, - DialogClose, - DialogTrigger, - DialogContent, - DialogHeader, - DialogFooter, - DialogTitle, - DialogDescription, -} + Dialog, + DialogPortal, + DialogOverlay, + DialogClose, + DialogTrigger, + DialogContent, + DialogHeader, + DialogFooter, + DialogTitle, + DialogDescription, +}; diff --git a/examples/tanstack-example/app/components/ui/label.tsx b/examples/tanstack-example/app/components/ui/label.tsx index 8f407389..3ab18d4e 100644 --- a/examples/tanstack-example/app/components/ui/label.tsx +++ b/examples/tanstack-example/app/components/ui/label.tsx @@ -1,26 +1,26 @@ -"use client" +"use client"; -import * as React from "react" -import * as LabelPrimitive from "@radix-ui/react-label" -import { cva, type VariantProps } from "class-variance-authority" +import * as React from "react"; +import * as LabelPrimitive from "@radix-ui/react-label"; +import { cva, type VariantProps } from "class-variance-authority"; -import { cn } from "~/lib/utils" +import { cn } from "~/lib/utils"; const labelVariants = cva( - "text-sm font-medium leading-none peer-disabled:cursor-not-allowed peer-disabled:opacity-70" -) + "text-sm font-medium leading-none peer-disabled:cursor-not-allowed peer-disabled:opacity-70", +); const Label = React.forwardRef< - React.ElementRef, - React.ComponentPropsWithoutRef & - VariantProps + React.ElementRef, + React.ComponentPropsWithoutRef & + VariantProps >(({ className, ...props }, ref) => ( - -)) -Label.displayName = LabelPrimitive.Root.displayName + +)); +Label.displayName = LabelPrimitive.Root.displayName; -export { Label } +export { Label }; diff --git a/examples/tanstack-example/app/lib/auth-client.ts b/examples/tanstack-example/app/lib/auth-client.ts index d90fce6f..cb191462 100644 --- a/examples/tanstack-example/app/lib/auth-client.ts +++ b/examples/tanstack-example/app/lib/auth-client.ts @@ -1,9 +1,12 @@ import { twoFactorClient } from "better-auth/plugins"; import { createAuthClient } from "better-auth/react"; -export const { useSession, signIn, signOut, signUp, twoFactor } = createAuthClient({ - baseURL: "http://localhost:3000", - plugins: [twoFactorClient({ - twoFactorPage: "/auth/two-factor", - })] -}); +export const { useSession, signIn, signOut, signUp, twoFactor } = + createAuthClient({ + baseURL: "http://localhost:3000", + plugins: [ + twoFactorClient({ + twoFactorPage: "/auth/two-factor", + }), + ], + }); diff --git a/examples/tanstack-example/app/lib/auth.ts b/examples/tanstack-example/app/lib/auth.ts index 8cea4375..6d13f109 100644 --- a/examples/tanstack-example/app/lib/auth.ts +++ b/examples/tanstack-example/app/lib/auth.ts @@ -1,4 +1,4 @@ -import { twoFactor } from 'better-auth/plugins'; +import { twoFactor } from "better-auth/plugins"; import { betterAuth } from "better-auth"; import Database from "better-sqlite3"; @@ -19,5 +19,5 @@ export const auth = betterAuth({ clientSecret: process.env.GITHUB_CLIENT_SECRET!, }, }, - plugins: [twoFactor()] + plugins: [twoFactor()], }); diff --git a/examples/tanstack-example/app/lib/icons/X.tsx b/examples/tanstack-example/app/lib/icons/X.tsx index f3ba2a48..45e8f9eb 100644 --- a/examples/tanstack-example/app/lib/icons/X.tsx +++ b/examples/tanstack-example/app/lib/icons/X.tsx @@ -1,4 +1,4 @@ -import { X } from 'lucide-react-native'; -import { iconWithClassName } from './iconWithClassName'; +import { X } from "lucide-react-native"; +import { iconWithClassName } from "./iconWithClassName"; iconWithClassName(X); -export { X }; \ No newline at end of file +export { X }; diff --git a/examples/tanstack-example/app/lib/icons/iconWithClassName.ts b/examples/tanstack-example/app/lib/icons/iconWithClassName.ts index aec4575d..4d317b1a 100644 --- a/examples/tanstack-example/app/lib/icons/iconWithClassName.ts +++ b/examples/tanstack-example/app/lib/icons/iconWithClassName.ts @@ -1,14 +1,14 @@ -import type { LucideIcon } from 'lucide-react-native'; -import { cssInterop } from 'nativewind'; +import type { LucideIcon } from "lucide-react-native"; +import { cssInterop } from "nativewind"; export function iconWithClassName(icon: LucideIcon) { -cssInterop(icon, { - className: { - target: 'style', - nativeStyleToProp: { - color: true, - opacity: true, - }, - }, -}); -} \ No newline at end of file + cssInterop(icon, { + className: { + target: "style", + nativeStyleToProp: { + color: true, + opacity: true, + }, + }, + }); +} diff --git a/examples/tanstack-example/app/lib/utils.ts b/examples/tanstack-example/app/lib/utils.ts index 365058ce..ac680b30 100644 --- a/examples/tanstack-example/app/lib/utils.ts +++ b/examples/tanstack-example/app/lib/utils.ts @@ -2,5 +2,5 @@ import { type ClassValue, clsx } from "clsx"; import { twMerge } from "tailwind-merge"; export function cn(...inputs: ClassValue[]) { - return twMerge(clsx(inputs)); + return twMerge(clsx(inputs)); } diff --git a/examples/tanstack-example/app/login/page.tsx b/examples/tanstack-example/app/login/page.tsx index d856dbc0..38d47d53 100644 --- a/examples/tanstack-example/app/login/page.tsx +++ b/examples/tanstack-example/app/login/page.tsx @@ -1,9 +1,9 @@ -import { LoginForm } from "~/components/login-form" +import { LoginForm } from "~/components/login-form"; export default function Page() { - return ( -
- -
- ) + return ( +
+ +
+ ); } diff --git a/examples/tanstack-example/app/routeTree.gen.ts b/examples/tanstack-example/app/routeTree.gen.ts index f7087562..dd76a08f 100644 --- a/examples/tanstack-example/app/routeTree.gen.ts +++ b/examples/tanstack-example/app/routeTree.gen.ts @@ -10,123 +10,123 @@ // Import Routes -import { Route as rootRoute } from './routes/__root' -import { Route as IndexImport } from './routes/index' -import { Route as AuthTwoFactorImport } from './routes/auth/two-factor' -import { Route as AuthSignupImport } from './routes/auth/signup' -import { Route as AuthSigninImport } from './routes/auth/signin' +import { Route as rootRoute } from "./routes/__root"; +import { Route as IndexImport } from "./routes/index"; +import { Route as AuthTwoFactorImport } from "./routes/auth/two-factor"; +import { Route as AuthSignupImport } from "./routes/auth/signup"; +import { Route as AuthSigninImport } from "./routes/auth/signin"; // Create/Update Routes const IndexRoute = IndexImport.update({ - id: '/', - path: '/', - getParentRoute: () => rootRoute, -} as any) + id: "/", + path: "/", + getParentRoute: () => rootRoute, +} as any); const AuthTwoFactorRoute = AuthTwoFactorImport.update({ - id: '/auth/two-factor', - path: '/auth/two-factor', - getParentRoute: () => rootRoute, -} as any) + id: "/auth/two-factor", + path: "/auth/two-factor", + getParentRoute: () => rootRoute, +} as any); const AuthSignupRoute = AuthSignupImport.update({ - id: '/auth/signup', - path: '/auth/signup', - getParentRoute: () => rootRoute, -} as any) + id: "/auth/signup", + path: "/auth/signup", + getParentRoute: () => rootRoute, +} as any); const AuthSigninRoute = AuthSigninImport.update({ - id: '/auth/signin', - path: '/auth/signin', - getParentRoute: () => rootRoute, -} as any) + id: "/auth/signin", + path: "/auth/signin", + getParentRoute: () => rootRoute, +} as any); // Populate the FileRoutesByPath interface -declare module '@tanstack/react-router' { - interface FileRoutesByPath { - '/': { - id: '/' - path: '/' - fullPath: '/' - preLoaderRoute: typeof IndexImport - parentRoute: typeof rootRoute - } - '/auth/signin': { - id: '/auth/signin' - path: '/auth/signin' - fullPath: '/auth/signin' - preLoaderRoute: typeof AuthSigninImport - parentRoute: typeof rootRoute - } - '/auth/signup': { - id: '/auth/signup' - path: '/auth/signup' - fullPath: '/auth/signup' - preLoaderRoute: typeof AuthSignupImport - parentRoute: typeof rootRoute - } - '/auth/two-factor': { - id: '/auth/two-factor' - path: '/auth/two-factor' - fullPath: '/auth/two-factor' - preLoaderRoute: typeof AuthTwoFactorImport - parentRoute: typeof rootRoute - } - } +declare module "@tanstack/react-router" { + interface FileRoutesByPath { + "/": { + id: "/"; + path: "/"; + fullPath: "/"; + preLoaderRoute: typeof IndexImport; + parentRoute: typeof rootRoute; + }; + "/auth/signin": { + id: "/auth/signin"; + path: "/auth/signin"; + fullPath: "/auth/signin"; + preLoaderRoute: typeof AuthSigninImport; + parentRoute: typeof rootRoute; + }; + "/auth/signup": { + id: "/auth/signup"; + path: "/auth/signup"; + fullPath: "/auth/signup"; + preLoaderRoute: typeof AuthSignupImport; + parentRoute: typeof rootRoute; + }; + "/auth/two-factor": { + id: "/auth/two-factor"; + path: "/auth/two-factor"; + fullPath: "/auth/two-factor"; + preLoaderRoute: typeof AuthTwoFactorImport; + parentRoute: typeof rootRoute; + }; + } } // Create and export the route tree export interface FileRoutesByFullPath { - '/': typeof IndexRoute - '/auth/signin': typeof AuthSigninRoute - '/auth/signup': typeof AuthSignupRoute - '/auth/two-factor': typeof AuthTwoFactorRoute + "/": typeof IndexRoute; + "/auth/signin": typeof AuthSigninRoute; + "/auth/signup": typeof AuthSignupRoute; + "/auth/two-factor": typeof AuthTwoFactorRoute; } export interface FileRoutesByTo { - '/': typeof IndexRoute - '/auth/signin': typeof AuthSigninRoute - '/auth/signup': typeof AuthSignupRoute - '/auth/two-factor': typeof AuthTwoFactorRoute + "/": typeof IndexRoute; + "/auth/signin": typeof AuthSigninRoute; + "/auth/signup": typeof AuthSignupRoute; + "/auth/two-factor": typeof AuthTwoFactorRoute; } export interface FileRoutesById { - __root__: typeof rootRoute - '/': typeof IndexRoute - '/auth/signin': typeof AuthSigninRoute - '/auth/signup': typeof AuthSignupRoute - '/auth/two-factor': typeof AuthTwoFactorRoute + __root__: typeof rootRoute; + "/": typeof IndexRoute; + "/auth/signin": typeof AuthSigninRoute; + "/auth/signup": typeof AuthSignupRoute; + "/auth/two-factor": typeof AuthTwoFactorRoute; } export interface FileRouteTypes { - fileRoutesByFullPath: FileRoutesByFullPath - fullPaths: '/' | '/auth/signin' | '/auth/signup' | '/auth/two-factor' - fileRoutesByTo: FileRoutesByTo - to: '/' | '/auth/signin' | '/auth/signup' | '/auth/two-factor' - id: '__root__' | '/' | '/auth/signin' | '/auth/signup' | '/auth/two-factor' - fileRoutesById: FileRoutesById + fileRoutesByFullPath: FileRoutesByFullPath; + fullPaths: "/" | "/auth/signin" | "/auth/signup" | "/auth/two-factor"; + fileRoutesByTo: FileRoutesByTo; + to: "/" | "/auth/signin" | "/auth/signup" | "/auth/two-factor"; + id: "__root__" | "/" | "/auth/signin" | "/auth/signup" | "/auth/two-factor"; + fileRoutesById: FileRoutesById; } export interface RootRouteChildren { - IndexRoute: typeof IndexRoute - AuthSigninRoute: typeof AuthSigninRoute - AuthSignupRoute: typeof AuthSignupRoute - AuthTwoFactorRoute: typeof AuthTwoFactorRoute + IndexRoute: typeof IndexRoute; + AuthSigninRoute: typeof AuthSigninRoute; + AuthSignupRoute: typeof AuthSignupRoute; + AuthTwoFactorRoute: typeof AuthTwoFactorRoute; } const rootRouteChildren: RootRouteChildren = { - IndexRoute: IndexRoute, - AuthSigninRoute: AuthSigninRoute, - AuthSignupRoute: AuthSignupRoute, - AuthTwoFactorRoute: AuthTwoFactorRoute, -} + IndexRoute: IndexRoute, + AuthSigninRoute: AuthSigninRoute, + AuthSignupRoute: AuthSignupRoute, + AuthTwoFactorRoute: AuthTwoFactorRoute, +}; export const routeTree = rootRoute - ._addFileChildren(rootRouteChildren) - ._addFileTypes() + ._addFileChildren(rootRouteChildren) + ._addFileTypes(); /* prettier-ignore-end */ diff --git a/examples/tanstack-example/app/routes/__root.tsx b/examples/tanstack-example/app/routes/__root.tsx index 80123496..ae24e706 100644 --- a/examples/tanstack-example/app/routes/__root.tsx +++ b/examples/tanstack-example/app/routes/__root.tsx @@ -44,7 +44,7 @@ function RootComponent() { const [theme, setTheme] = useState<"light" | "dark">("light"); const { data, isPending, error } = useSession(); const { navigate } = useRouter(); - console.log() + console.log(); useEffect(() => { if (!data?.user) { @@ -61,7 +61,6 @@ function RootComponent() { ); }, [data, navigate]); - useEffect(() => { const root = window.document.documentElement; @@ -73,228 +72,228 @@ function RootComponent() { return ( <> - - - + )} + +
+ + + ); diff --git a/examples/tanstack-example/app/routes/api/auth/$.ts b/examples/tanstack-example/app/routes/api/auth/$.ts index d096e80c..65ef978e 100644 --- a/examples/tanstack-example/app/routes/api/auth/$.ts +++ b/examples/tanstack-example/app/routes/api/auth/$.ts @@ -2,10 +2,10 @@ import { createAPIFileRoute } from "@tanstack/start/api"; import { auth } from "~/lib/auth"; export const Route = createAPIFileRoute("/api/auth/$")({ - GET: ({ request }) => { - return auth.handler(request); - }, - POST: ({ request }) => { - return auth.handler(request); - }, + GET: ({ request }) => { + return auth.handler(request); + }, + POST: ({ request }) => { + return auth.handler(request); + }, }); diff --git a/examples/tanstack-example/app/routes/auth/two-factor.tsx b/examples/tanstack-example/app/routes/auth/two-factor.tsx index d755284e..50112e5a 100644 --- a/examples/tanstack-example/app/routes/auth/two-factor.tsx +++ b/examples/tanstack-example/app/routes/auth/two-factor.tsx @@ -1,19 +1,25 @@ -import { createFileRoute } from '@tanstack/react-router' -import { AlertCircle, CheckCircle2 } from 'lucide-react' -import { useState } from 'react' -import { Button } from '~/components/ui/button' -import { Card, CardContent, CardDescription, CardFooter, CardHeader, CardTitle } from '~/components/ui/card' -import { Input } from '~/components/ui/input' -import { Label } from '~/components/ui/label' -import { twoFactor } from '~/lib/auth-client' +import { createFileRoute } from "@tanstack/react-router"; +import { AlertCircle, CheckCircle2 } from "lucide-react"; +import { useState } from "react"; +import { Button } from "~/components/ui/button"; +import { + Card, + CardContent, + CardDescription, + CardFooter, + CardHeader, + CardTitle, +} from "~/components/ui/card"; +import { Input } from "~/components/ui/input"; +import { Label } from "~/components/ui/label"; +import { twoFactor } from "~/lib/auth-client"; -export const Route = createFileRoute('/auth/two-factor')({ - component: TwoFactor -}) +export const Route = createFileRoute("/auth/two-factor")({ + component: TwoFactor, +}); - -function TwoFactor(){ - const [totpCode, setTotpCode] = useState(""); +function TwoFactor() { + const [totpCode, setTotpCode] = useState(""); const [error, setError] = useState(""); const [success, setSuccess] = useState(false); @@ -36,8 +42,8 @@ function TwoFactor(){ } }); }; - return ( -
+ return ( +
TOTP Verification @@ -80,5 +86,5 @@ function TwoFactor(){
- ) -} \ No newline at end of file + ); +} diff --git a/examples/tanstack-example/app/routes/index.tsx b/examples/tanstack-example/app/routes/index.tsx index b69b3246..bfcfec00 100644 --- a/examples/tanstack-example/app/routes/index.tsx +++ b/examples/tanstack-example/app/routes/index.tsx @@ -1,215 +1,214 @@ import { - Card, - CardContent, - CardDescription, - CardHeader, - CardTitle, -} from '~/components/ui/card' + Card, + CardContent, + CardDescription, + CardHeader, + CardTitle, +} from "~/components/ui/card"; -import { twoFactor, useSession } from '~/lib/auth-client' -import { UAParser } from 'ua-parser-js' -import { Laptop, Loader2, Phone, ShieldCheck, ShieldOff } from 'lucide-react' -import { useState } from 'react' +import { twoFactor, useSession } from "~/lib/auth-client"; +import { UAParser } from "ua-parser-js"; +import { Laptop, Loader2, Phone, ShieldCheck, ShieldOff } from "lucide-react"; +import { useState } from "react"; import { - Dialog, - DialogContent, - DialogDescription, - DialogFooter, - DialogHeader, - DialogTitle, - DialogTrigger, -} from '~/components/ui/dialog' -import { Button } from '~/components/ui/button' -import { Label } from '~/components/ui/label' -import { Input } from '~/components/ui/input' -import { toast } from 'sonner' -import QRCode from 'react-qr-code' -import { createFileRoute } from '@tanstack/react-router' + Dialog, + DialogContent, + DialogDescription, + DialogFooter, + DialogHeader, + DialogTitle, + DialogTrigger, +} from "~/components/ui/dialog"; +import { Button } from "~/components/ui/button"; +import { Label } from "~/components/ui/label"; +import { Input } from "~/components/ui/input"; +import { toast } from "sonner"; +import QRCode from "react-qr-code"; +import { createFileRoute } from "@tanstack/react-router"; -export const Route = createFileRoute('/')({ - component: Home, -}) +export const Route = createFileRoute("/")({ + component: Home, +}); function Home() { - const { data } = useSession() - const [twoFactorDialog, setTwoFactorDialog] = useState(false) - const [twoFaPassword, setTwoFaPassword] = useState('') - const [isPendingTwoFa, setIsPendingTwoFa] = useState(false) - const [twoFactorVerifyURI, setTwoFactorVerifyURI] = useState('') - return ( -
- - {data?.user && ( - <> - - Welcome, {data.user.name}! - - You are signed in as {data.user.email}. - - - -
-
- {new UAParser(data.session.userAgent).getDevice().type === - 'mobile' ? ( - - ) : ( - - )} - {new UAParser(data.session.userAgent).getOS().name},{' '} - {new UAParser(data.session.userAgent).getBrowser().name} -
-
-
-
- - - - - - - - {data?.user.twoFactorEnabled - ? 'Disable 2FA' - : 'Enable 2FA'} - - - {data?.user.twoFactorEnabled - ? 'Disable the second factor authentication from your account' - : 'Enable 2FA to secure your account'} - - + const { data } = useSession(); + const [twoFactorDialog, setTwoFactorDialog] = useState(false); + const [twoFaPassword, setTwoFaPassword] = useState(""); + const [isPendingTwoFa, setIsPendingTwoFa] = useState(false); + const [twoFactorVerifyURI, setTwoFactorVerifyURI] = useState(""); + return ( +
+ + {data?.user && ( + <> + + Welcome, {data.user.name}! + + You are signed in as {data.user.email}. + + + +
+
+ {new UAParser(data.session.userAgent).getDevice().type === + "mobile" ? ( + + ) : ( + + )} + {new UAParser(data.session.userAgent).getOS().name},{" "} + {new UAParser(data.session.userAgent).getBrowser().name} +
+
+
+
+ + + + + + + + {data?.user.twoFactorEnabled + ? "Disable 2FA" + : "Enable 2FA"} + + + {data?.user.twoFactorEnabled + ? "Disable the second factor authentication from your account" + : "Enable 2FA to secure your account"} + + - {twoFactorVerifyURI ? ( -
-
- -
- - setTwoFaPassword(e.target.value)} - placeholder="Enter OTP" - /> -
- ) : ( -
- - setTwoFaPassword(e.target.value)} - /> -
- )} - - - -
-
-
-
-
- - )} -
-
- ) + {twoFactorVerifyURI ? ( +
+
+ +
+ + setTwoFaPassword(e.target.value)} + placeholder="Enter OTP" + /> +
+ ) : ( +
+ + setTwoFaPassword(e.target.value)} + /> +
+ )} + + + +
+
+
+
+
+ + )} +
+
+ ); } diff --git a/examples/tanstack-example/components.json b/examples/tanstack-example/components.json index e69e3be1..1e447671 100644 --- a/examples/tanstack-example/components.json +++ b/examples/tanstack-example/components.json @@ -1,16 +1,16 @@ { - "$schema": "https://ui.shadcn.com/schema.json", - "style": "default", - "rsc": true, - "tsx": true, - "tailwind": { - "config": "tailwind.config.js", - "css": "app/lib/style/global.css", - "baseColor": "slate", - "cssVariables": true - }, - "aliases": { - "components": "~/components", - "utils": "~/lib/utils" - } -} \ No newline at end of file + "$schema": "https://ui.shadcn.com/schema.json", + "style": "default", + "rsc": true, + "tsx": true, + "tailwind": { + "config": "tailwind.config.js", + "css": "app/lib/style/global.css", + "baseColor": "slate", + "cssVariables": true + }, + "aliases": { + "components": "~/components", + "utils": "~/lib/utils" + } +} diff --git a/examples/tanstack-example/postcss.config.js b/examples/tanstack-example/postcss.config.js index 2e7af2b7..7b75c83a 100644 --- a/examples/tanstack-example/postcss.config.js +++ b/examples/tanstack-example/postcss.config.js @@ -1,6 +1,6 @@ export default { - plugins: { - tailwindcss: {}, - autoprefixer: {}, - }, -} + plugins: { + tailwindcss: {}, + autoprefixer: {}, + }, +}; diff --git a/packages/better-auth/src/client/plugins/index.ts b/packages/better-auth/src/client/plugins/index.ts index 24fe7738..767fa9f7 100644 --- a/packages/better-auth/src/client/plugins/index.ts +++ b/packages/better-auth/src/client/plugins/index.ts @@ -11,4 +11,4 @@ export * from "../../plugins/admin/client"; export * from "../../plugins/generic-oauth/client"; export * from "../../plugins/jwt/client"; export * from "../../plugins/multi-session/client"; -export * from "../../plugins/email-otp/client"; \ No newline at end of file +export * from "../../plugins/email-otp/client"; diff --git a/packages/better-auth/src/plugins/jwt/index.ts b/packages/better-auth/src/plugins/jwt/index.ts index 52179465..cb2776e6 100644 --- a/packages/better-auth/src/plugins/jwt/index.ts +++ b/packages/better-auth/src/plugins/jwt/index.ts @@ -137,12 +137,10 @@ export const jwt = (options?: JwtOptions) => { publicKey: JSON.stringify(publicWebKey), privateKey: privateKeyEncryptionEnabled ? JSON.stringify( - await symmetricEncrypt( - { - key: ctx.context.options.secret!, - data: stringifiedPrivateWebKey, - } - ), + await symmetricEncrypt({ + key: ctx.context.options.secret!, + data: stringifiedPrivateWebKey, + }), ) : stringifiedPrivateWebKey, createdAt: new Date(), @@ -152,12 +150,10 @@ export const jwt = (options?: JwtOptions) => { } let privateWebKey = privateKeyEncryptionEnabled - ? await symmetricDecrypt( - { - key: ctx.context.options.secret!, - data: JSON.parse(key.privateKey), - } - ) + ? await symmetricDecrypt({ + key: ctx.context.options.secret!, + data: JSON.parse(key.privateKey), + }) : key.privateKey; const privateKey = await importJWK(JSON.parse(privateWebKey));