From 0c6366123d8d26b5dd026e12ab6f05d2542bb278 Mon Sep 17 00:00:00 2001 From: Pooya Parsa Date: Tue, 13 Jan 2026 17:46:28 +0100 Subject: [PATCH 1/2] wip --- examples/vite-better-auth/.gitignore | 1 + examples/vite-better-auth/app/app.tsx | 33 + .../app/components/loading.tsx | 12 + .../vite-better-auth/app/components/nav.tsx | 18 + .../app/components/ui/button.tsx | 62 + .../app/components/ui/card.tsx | 92 ++ .../app/components/ui/checkbox.tsx | 30 + .../app/components/ui/input.tsx | 21 + .../app/components/ui/label.tsx | 22 + .../app/components/ui/tabs.tsx | 64 ++ .../vite-better-auth/app/entry/client.tsx | 6 + .../vite-better-auth/app/entry/server.tsx | 47 + .../app/routes/auth/sign-in.tsx | 123 ++ .../app/routes/auth/sign-up.tsx | 204 ++++ .../vite-better-auth/app/routes/index.tsx | 15 + examples/vite-better-auth/app/styles.css | 81 ++ examples/vite-better-auth/app/utils/auth.ts | 5 + .../vite-better-auth/app/utils/tailwindcss.ts | 6 + examples/vite-better-auth/auth.ts | 12 + .../2026-01-09T16-38-12.413Z.sql | 13 + examples/vite-better-auth/components.json | 21 + examples/vite-better-auth/package.json | 29 + examples/vite-better-auth/tsconfig.json | 11 + examples/vite-better-auth/vite.config.ts | 29 + pnpm-lock.yaml | 1013 +++++++++++++++-- 25 files changed, 1899 insertions(+), 71 deletions(-) create mode 100644 examples/vite-better-auth/.gitignore create mode 100644 examples/vite-better-auth/app/app.tsx create mode 100644 examples/vite-better-auth/app/components/loading.tsx create mode 100644 examples/vite-better-auth/app/components/nav.tsx create mode 100644 examples/vite-better-auth/app/components/ui/button.tsx create mode 100644 examples/vite-better-auth/app/components/ui/card.tsx create mode 100644 examples/vite-better-auth/app/components/ui/checkbox.tsx create mode 100644 examples/vite-better-auth/app/components/ui/input.tsx create mode 100644 examples/vite-better-auth/app/components/ui/label.tsx create mode 100644 examples/vite-better-auth/app/components/ui/tabs.tsx create mode 100644 examples/vite-better-auth/app/entry/client.tsx create mode 100644 examples/vite-better-auth/app/entry/server.tsx create mode 100644 examples/vite-better-auth/app/routes/auth/sign-in.tsx create mode 100644 examples/vite-better-auth/app/routes/auth/sign-up.tsx create mode 100644 examples/vite-better-auth/app/routes/index.tsx create mode 100644 examples/vite-better-auth/app/styles.css create mode 100644 examples/vite-better-auth/app/utils/auth.ts create mode 100644 examples/vite-better-auth/app/utils/tailwindcss.ts create mode 100644 examples/vite-better-auth/auth.ts create mode 100644 examples/vite-better-auth/better-auth_migrations/2026-01-09T16-38-12.413Z.sql create mode 100644 examples/vite-better-auth/components.json create mode 100644 examples/vite-better-auth/package.json create mode 100644 examples/vite-better-auth/tsconfig.json create mode 100644 examples/vite-better-auth/vite.config.ts diff --git a/examples/vite-better-auth/.gitignore b/examples/vite-better-auth/.gitignore new file mode 100644 index 0000000000..9b1dffd90f --- /dev/null +++ b/examples/vite-better-auth/.gitignore @@ -0,0 +1 @@ +*.sqlite diff --git a/examples/vite-better-auth/app/app.tsx b/examples/vite-better-auth/app/app.tsx new file mode 100644 index 0000000000..88264b9657 --- /dev/null +++ b/examples/vite-better-auth/app/app.tsx @@ -0,0 +1,33 @@ +import React from "react"; +import "./styles.css"; + +import { Route, Switch } from "wouter"; +import { LoadingSkeleton } from "./components/loading"; + +const Homepage = React.lazy(() => import("./routes/index")); +const AuthSignIn = React.lazy(() => import("./routes/auth/sign-in")); +const AuthSignUp = React.lazy(() => import("./routes/auth/sign-up")); + +export const App = () => { + return ( + <> + + }> +
+ + + + + +
+
+ + ); +}; diff --git a/examples/vite-better-auth/app/components/loading.tsx b/examples/vite-better-auth/app/components/loading.tsx new file mode 100644 index 0000000000..4f91c81e00 --- /dev/null +++ b/examples/vite-better-auth/app/components/loading.tsx @@ -0,0 +1,12 @@ +export const LoadingSkeleton = () => ( +
+
+
+
+
+
+
+
+
+
+); diff --git a/examples/vite-better-auth/app/components/nav.tsx b/examples/vite-better-auth/app/components/nav.tsx new file mode 100644 index 0000000000..6924e8973e --- /dev/null +++ b/examples/vite-better-auth/app/components/nav.tsx @@ -0,0 +1,18 @@ +import { useSession } from "../utils/auth"; + +export default () => { + const session = useSession(); + + return ( + <> + + + ); +}; diff --git a/examples/vite-better-auth/app/components/ui/button.tsx b/examples/vite-better-auth/app/components/ui/button.tsx new file mode 100644 index 0000000000..13a7453511 --- /dev/null +++ b/examples/vite-better-auth/app/components/ui/button.tsx @@ -0,0 +1,62 @@ +import * as React from "react"; +import { Slot } from "@radix-ui/react-slot"; +import { cva, type VariantProps } from "class-variance-authority"; + +import { cn } from "@/app/utils/tailwindcss"; + +const buttonVariants = cva( + "inline-flex items-center justify-center gap-2 whitespace-nowrap rounded-md text-sm font-medium transition-all disabled:pointer-events-none disabled:opacity-50 [&_svg]:pointer-events-none [&_svg:not([class*='size-'])]:size-4 shrink-0 [&_svg]:shrink-0 outline-none focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px] aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive", + { + variants: { + variant: { + default: "bg-primary text-primary-foreground hover:bg-primary/90", + destructive: + "bg-destructive text-white hover:bg-destructive/90 focus-visible:ring-destructive/20 dark:focus-visible:ring-destructive/40 dark:bg-destructive/60", + outline: + "border bg-background shadow-xs hover:bg-accent hover:text-accent-foreground dark:bg-input/30 dark:border-input dark:hover:bg-input/50", + secondary: + "bg-secondary text-secondary-foreground hover:bg-secondary/80", + ghost: + "hover:bg-accent hover:text-accent-foreground dark:hover:bg-accent/50", + link: "text-primary underline-offset-4 hover:underline", + }, + size: { + default: "h-9 px-4 py-2 has-[>svg]:px-3", + sm: "h-8 rounded-md gap-1.5 px-3 has-[>svg]:px-2.5", + lg: "h-10 rounded-md px-6 has-[>svg]:px-4", + icon: "size-9", + "icon-sm": "size-8", + "icon-lg": "size-10", + }, + }, + defaultVariants: { + variant: "default", + size: "default", + }, + } +); + +function Button({ + className, + variant = "default", + size = "default", + asChild = false, + ...props +}: React.ComponentProps<"button"> & + VariantProps & { + asChild?: boolean; + }) { + const Comp = asChild ? Slot : "button"; + + return ( + + ); +} + +export { Button, buttonVariants }; diff --git a/examples/vite-better-auth/app/components/ui/card.tsx b/examples/vite-better-auth/app/components/ui/card.tsx new file mode 100644 index 0000000000..ea85afeff7 --- /dev/null +++ b/examples/vite-better-auth/app/components/ui/card.tsx @@ -0,0 +1,92 @@ +import * as React from "react"; + +import { cn } from "@/app/utils/tailwindcss"; + +function Card({ className, ...props }: React.ComponentProps<"div">) { + return ( +
+ ); +} + +function CardHeader({ className, ...props }: React.ComponentProps<"div">) { + return ( +
+ ); +} + +function CardTitle({ className, ...props }: React.ComponentProps<"div">) { + return ( +
+ ); +} + +function CardDescription({ className, ...props }: React.ComponentProps<"div">) { + return ( +
+ ); +} + +function CardAction({ className, ...props }: React.ComponentProps<"div">) { + return ( +
+ ); +} + +function CardContent({ className, ...props }: React.ComponentProps<"div">) { + return ( +
+ ); +} + +function CardFooter({ className, ...props }: React.ComponentProps<"div">) { + return ( +
+ ); +} + +export { + Card, + CardHeader, + CardFooter, + CardTitle, + CardAction, + CardDescription, + CardContent, +}; diff --git a/examples/vite-better-auth/app/components/ui/checkbox.tsx b/examples/vite-better-auth/app/components/ui/checkbox.tsx new file mode 100644 index 0000000000..e5d9c82020 --- /dev/null +++ b/examples/vite-better-auth/app/components/ui/checkbox.tsx @@ -0,0 +1,30 @@ +import * as React from "react" +import * as CheckboxPrimitive from "@radix-ui/react-checkbox" +import { CheckIcon } from "lucide-react" + +import { cn } from "@/app/utils/tailwindcss" + +function Checkbox({ + className, + ...props +}: React.ComponentProps) { + return ( + + + + + + ) +} + +export { Checkbox } diff --git a/examples/vite-better-auth/app/components/ui/input.tsx b/examples/vite-better-auth/app/components/ui/input.tsx new file mode 100644 index 0000000000..0cb11058b4 --- /dev/null +++ b/examples/vite-better-auth/app/components/ui/input.tsx @@ -0,0 +1,21 @@ +import * as React from "react"; + +import { cn } from "@/app/utils/tailwindcss"; + +function Input({ className, type, ...props }: React.ComponentProps<"input">) { + return ( + + ); +} + +export { Input }; diff --git a/examples/vite-better-auth/app/components/ui/label.tsx b/examples/vite-better-auth/app/components/ui/label.tsx new file mode 100644 index 0000000000..facd1bc3ce --- /dev/null +++ b/examples/vite-better-auth/app/components/ui/label.tsx @@ -0,0 +1,22 @@ +import * as React from "react"; +import * as LabelPrimitive from "@radix-ui/react-label"; + +import { cn } from "@/app/utils/tailwindcss"; + +function Label({ + className, + ...props +}: React.ComponentProps) { + return ( + + ); +} + +export { Label }; diff --git a/examples/vite-better-auth/app/components/ui/tabs.tsx b/examples/vite-better-auth/app/components/ui/tabs.tsx new file mode 100644 index 0000000000..5b5ea268b8 --- /dev/null +++ b/examples/vite-better-auth/app/components/ui/tabs.tsx @@ -0,0 +1,64 @@ +import * as React from "react" +import * as TabsPrimitive from "@radix-ui/react-tabs" + +import { cn } from "@/app/utils/tailwindcss" + +function Tabs({ + className, + ...props +}: React.ComponentProps) { + return ( + + ) +} + +function TabsList({ + className, + ...props +}: React.ComponentProps) { + return ( + + ) +} + +function TabsTrigger({ + className, + ...props +}: React.ComponentProps) { + return ( + + ) +} + +function TabsContent({ + className, + ...props +}: React.ComponentProps) { + return ( + + ) +} + +export { Tabs, TabsList, TabsTrigger, TabsContent } diff --git a/examples/vite-better-auth/app/entry/client.tsx b/examples/vite-better-auth/app/entry/client.tsx new file mode 100644 index 0000000000..7ce1f42d4d --- /dev/null +++ b/examples/vite-better-auth/app/entry/client.tsx @@ -0,0 +1,6 @@ +import "@vitejs/plugin-react/preamble"; +import { hydrateRoot } from "react-dom/client"; + +import { App } from "@/app/app.tsx"; + +hydrateRoot(document.querySelector("#app")!, ); diff --git a/examples/vite-better-auth/app/entry/server.tsx b/examples/vite-better-auth/app/entry/server.tsx new file mode 100644 index 0000000000..4c6fe9c51b --- /dev/null +++ b/examples/vite-better-auth/app/entry/server.tsx @@ -0,0 +1,47 @@ +import { renderToReadableStream } from "react-dom/server.edge"; + +import { App } from "@/app/app.tsx"; + +import clientAssets from "./client?assets=client"; +import serverAssets from "./server?assets=ssr"; +import { Router } from "wouter"; + +export default { + async fetch(req: Request) { + const assets = clientAssets.merge(serverAssets); + + const ssrContext = {}; + + const url = new URL(req.url); + + return new Response( + await renderToReadableStream( + + + + {assets.css.map((attr: any) => ( + + ))} + {assets.js.map((attr: any) => ( + + ))} +