diff --git a/.changeset/olive-mails-eat.md b/.changeset/olive-mails-eat.md new file mode 100644 index 0000000..263cc28 --- /dev/null +++ b/.changeset/olive-mails-eat.md @@ -0,0 +1,5 @@ +--- +"create-better-t-stack": patch +--- + +Improve oRPC templates diff --git a/apps/cli/src/constants.ts b/apps/cli/src/constants.ts index fddbe1e..e191130 100644 --- a/apps/cli/src/constants.ts +++ b/apps/cli/src/constants.ts @@ -100,8 +100,8 @@ export const dependencyVersionMap = { "convex-svelte": "^0.0.11", "@tanstack/svelte-query": "^5.74.4", - "@tanstack/react-query-devtools": "^5.69.0", - "@tanstack/react-query": "^5.69.0", + "@tanstack/react-query-devtools": "^5.80.5", + "@tanstack/react-query": "^5.80.5", "@tanstack/solid-query": "^5.75.0", "@tanstack/solid-query-devtools": "^5.75.0", diff --git a/apps/cli/templates/api/orpc/native/utils/orpc.ts.hbs b/apps/cli/templates/api/orpc/native/utils/orpc.ts.hbs index 2639f92..5cb5137 100644 --- a/apps/cli/templates/api/orpc/native/utils/orpc.ts.hbs +++ b/apps/cli/templates/api/orpc/native/utils/orpc.ts.hbs @@ -1,17 +1,13 @@ import { createORPCClient } from "@orpc/client"; import { RPCLink } from "@orpc/client/fetch"; import { createTanstackQueryUtils } from "@orpc/tanstack-query"; -import type { RouterUtils } from "@orpc/tanstack-query"; import type { RouterClient } from "@orpc/server"; import { QueryCache, QueryClient } from "@tanstack/react-query"; -import { createContext, useContext } from "react"; import type { appRouter } from "../../server/src/routers"; {{#if auth}} import { authClient } from "@/lib/auth-client"; {{/if}} -type ORPCReactUtils = RouterUtils>; - export const queryClient = new QueryClient({ queryCache: new QueryCache({ onError: (error) => { @@ -37,13 +33,3 @@ export const link = new RPCLink({ export const client: RouterClient = createORPCClient(link); export const orpc = createTanstackQueryUtils(client); - -export const ORPCContext = createContext(undefined); - -export function useORPC(): ORPCReactUtils { - const orpc = useContext(ORPCContext); - if (!orpc) { - throw new Error("ORPCContext is not set up properly"); - } - return orpc; -} diff --git a/apps/cli/templates/api/orpc/server/base/src/lib/orpc.ts.hbs b/apps/cli/templates/api/orpc/server/base/src/lib/orpc.ts.hbs index 21e0c9b..973532c 100644 --- a/apps/cli/templates/api/orpc/server/base/src/lib/orpc.ts.hbs +++ b/apps/cli/templates/api/orpc/server/base/src/lib/orpc.ts.hbs @@ -12,7 +12,6 @@ const requireAuth = o.middleware(async ({ context, next }) => { } return next({ context: { - ...context, session: context.session, }, }); diff --git a/apps/cli/templates/api/orpc/web/react/base/src/utils/orpc.ts.hbs b/apps/cli/templates/api/orpc/web/react/base/src/utils/orpc.ts.hbs index 0a77d9b..280252c 100644 --- a/apps/cli/templates/api/orpc/web/react/base/src/utils/orpc.ts.hbs +++ b/apps/cli/templates/api/orpc/web/react/base/src/utils/orpc.ts.hbs @@ -5,10 +5,6 @@ import { QueryCache, QueryClient } from "@tanstack/react-query"; import { toast } from "sonner"; import type { appRouter } from "../../../server/src/routers/index"; import type { RouterClient } from "@orpc/server"; -import { createContext, use } from 'react' -import type { RouterUtils } from '@orpc/tanstack-query' - -type ORPCReactUtils = RouterUtils> export const queryClient = new QueryClient({ queryCache: new QueryCache({ @@ -44,14 +40,3 @@ export const link = new RPCLink({ export const client: RouterClient = createORPCClient(link) export const orpc = createTanstackQueryUtils(client) - - -export const ORPCContext = createContext(undefined) - -export function useORPC(): ORPCReactUtils { - const orpc = use(ORPCContext) - if (!orpc) { - throw new Error('ORPCContext is not set up properly') - } - return orpc -} diff --git a/apps/cli/templates/auth/web/react/tanstack-start/src/routes/dashboard.tsx.hbs b/apps/cli/templates/auth/web/react/tanstack-start/src/routes/dashboard.tsx.hbs index c2f8ccf..32cf329 100644 --- a/apps/cli/templates/auth/web/react/tanstack-start/src/routes/dashboard.tsx.hbs +++ b/apps/cli/templates/auth/web/react/tanstack-start/src/routes/dashboard.tsx.hbs @@ -3,7 +3,7 @@ import { authClient } from "@/lib/auth-client"; import { useTRPC } from "@/utils/trpc"; {{/if}} {{#if (eq api "orpc")}} -import { useORPC } from "@/utils/orpc"; +import { orpc } from "@/utils/orpc"; {{/if}} import { useQuery } from "@tanstack/react-query"; import { createFileRoute } from "@tanstack/react-router"; @@ -19,7 +19,6 @@ function RouteComponent() { const trpc = useTRPC(); {{/if}} {{#if (eq api "orpc")}} - const orpc = useORPC(); {{/if}} const { data: session, isPending } = authClient.useSession(); diff --git a/apps/cli/templates/examples/todo/web/react/tanstack-start/src/routes/todos.tsx.hbs b/apps/cli/templates/examples/todo/web/react/tanstack-start/src/routes/todos.tsx.hbs index 3a4258c..52b71c2 100644 --- a/apps/cli/templates/examples/todo/web/react/tanstack-start/src/routes/todos.tsx.hbs +++ b/apps/cli/templates/examples/todo/web/react/tanstack-start/src/routes/todos.tsx.hbs @@ -19,12 +19,12 @@ import { useMutation } from "convex/react"; import { api } from "@{{projectName}}/backend/convex/_generated/api"; import type { Id } from "@{{projectName}}/backend/convex/_generated/dataModel"; {{else}} - {{#if (eq api "trpc")}} +{{#if (eq api "trpc")}} import { useTRPC } from "@/utils/trpc"; - {{/if}} - {{#if (eq api "orpc")}} -import { useORPC } from "@/utils/orpc"; - {{/if}} +{{/if}} +{{#if (eq api "orpc")}} +import { orpc } from "@/utils/orpc"; +{{/if}} import { useMutation, useQuery } from "@tanstack/react-query"; {{/if}} @@ -77,7 +77,6 @@ function TodosRoute() { const trpc = useTRPC(); {{/if}} {{#if (eq api "orpc")}} - const orpc = useORPC(); {{/if}} {{#if (eq api "trpc")}} diff --git a/apps/cli/templates/frontend/react/next/src/components/providers.tsx.hbs b/apps/cli/templates/frontend/react/next/src/components/providers.tsx.hbs index 700362b..f620cc9 100644 --- a/apps/cli/templates/frontend/react/next/src/components/providers.tsx.hbs +++ b/apps/cli/templates/frontend/react/next/src/components/providers.tsx.hbs @@ -1,28 +1,32 @@ "use client"; {{#if (eq backend "convex")}} - import { ConvexProvider, ConvexReactClient } from "convex/react"; +import { ConvexProvider, ConvexReactClient } from "convex/react"; {{else}} - {{#unless (eq api "none")}} - import { QueryClientProvider } from "@tanstack/react-query"; - import { ReactQueryDevtools } from "@tanstack/react-query-devtools"; - {{#if (eq api "orpc")}} - import { orpc, ORPCContext, queryClient } from "@/utils/orpc"; - {{/if}} - {{#if (eq api "trpc")}} - import { queryClient } from "@/utils/trpc"; - {{/if}} - {{/unless}} +{{#unless (eq api "none")}} +import { QueryClientProvider } from "@tanstack/react-query"; +import { ReactQueryDevtools } from "@tanstack/react-query-devtools"; +{{#if (eq api "orpc")}} +import { queryClient } from "@/utils/orpc"; +{{/if}} +{{#if (eq api "trpc")}} +import { queryClient } from "@/utils/trpc"; +{{/if}} +{{/unless}} {{/if}} - import { ThemeProvider } from "./theme-provider"; import { Toaster } from "./ui/sonner"; {{#if (eq backend "convex")}} - const convex = new ConvexReactClient(process.env.NEXT_PUBLIC_CONVEX_URL!); +const convex = new ConvexReactClient(process.env.NEXT_PUBLIC_CONVEX_URL!); {{/if}} -export default function Providers({ children }: { children: React.ReactNode }) { return ( +export default function Providers({ + children +}: { + children: React.ReactNode +}) { + return ( {{#if (eq backend "convex")}} - {children} + {children} {{else}} - {{#unless (eq api "none")}} - - {{#if (eq api "orpc")}} - - {children} - - {{/if}} - {{#if (eq api "trpc")}} - {children} - {{/if}} - - - {{else}} - {children} - {{/unless}} + {{#unless (eq api "none")}} + + {{#if (eq api "orpc")}} + {children} + {{/if}} + {{#if (eq api "trpc")}} + {children} + {{/if}} + + + {{else}} + {children} + {{/unless}} {{/if}} diff --git a/apps/cli/templates/frontend/react/react-router/src/root.tsx.hbs b/apps/cli/templates/frontend/react/react-router/src/root.tsx.hbs index 54aff33..76ad772 100644 --- a/apps/cli/templates/frontend/react/react-router/src/root.tsx.hbs +++ b/apps/cli/templates/frontend/react/react-router/src/root.tsx.hbs @@ -13,18 +13,18 @@ import { ThemeProvider } from "./components/theme-provider"; import { Toaster } from "./components/ui/sonner"; {{#if (eq backend "convex")}} - import { ConvexProvider, ConvexReactClient } from "convex/react"; +import { ConvexProvider, ConvexReactClient } from "convex/react"; {{else}} - {{#unless (eq api "none")}} - import { QueryClientProvider } from "@tanstack/react-query"; - import { ReactQueryDevtools } from "@tanstack/react-query-devtools"; - {{#if (eq api "orpc")}} - import { orpc, ORPCContext, queryClient } from "./utils/orpc"; - {{/if}} - {{#if (eq api "trpc")}} - import { queryClient } from "./utils/trpc"; - {{/if}} - {{/unless}} +{{#unless (eq api "none")}} +import { QueryClientProvider } from "@tanstack/react-query"; +import { ReactQueryDevtools } from "@tanstack/react-query-devtools"; +{{#if (eq api "orpc")}} +import { queryClient } from "./utils/orpc"; +{{/if}} +{{#if (eq api "trpc")}} +import { queryClient } from "./utils/trpc"; +{{/if}} +{{/unless}} {{/if}} export const links: Route.LinksFunction = () => [ @@ -62,57 +62,12 @@ export function Layout({ children }: { children: React.ReactNode }) { } {{#if (eq backend "convex")}} - export default function App() { - const convex = new ConvexReactClient( - import.meta.env.VITE_CONVEX_URL as string, - ); - return ( - - -
-
- -
- -
-
- ); - } -{{else if (eq api "orpc")}} - export default function App() { - return ( - - - -
-
- -
- -
-
- -
- ); - } -{{else if (eq api "trpc")}} - export default function App() { - return ( - - -
-
- -
- -
- -
- ); - } -{{else}} - export default function App() { - return ( +export default function App() { + const convex = new ConvexReactClient( + import.meta.env.VITE_CONVEX_URL as string, + ); + return ( +
@@ -120,8 +75,51 @@ export function Layout({ children }: { children: React.ReactNode }) {
- ); - } +
+ ); +} +{{else if (eq api "orpc")}} +export default function App() { + return ( + + +
+
+ +
+ +
+ +
+ ); +} +{{else if (eq api "trpc")}} +export default function App() { + return ( + + +
+
+ +
+ +
+ +
+ ); +} +{{else}} +export default function App() { + return ( + +
+
+ +
+ +
+ ); +} {{/if}} export function ErrorBoundary({ error }: Route.ErrorBoundaryProps) { diff --git a/apps/cli/templates/frontend/react/tanstack-router/src/routes/__root.tsx.hbs b/apps/cli/templates/frontend/react/tanstack-router/src/routes/__root.tsx.hbs index 078e756..9caa32a 100644 --- a/apps/cli/templates/frontend/react/tanstack-router/src/routes/__root.tsx.hbs +++ b/apps/cli/templates/frontend/react/tanstack-router/src/routes/__root.tsx.hbs @@ -75,7 +75,6 @@ function RootComponent() { <> {{#if (eq api "orpc")}} -
@@ -83,7 +82,6 @@ function RootComponent() {
-
{{else}}
diff --git a/apps/cli/templates/frontend/react/tanstack-start/package.json b/apps/cli/templates/frontend/react/tanstack-start/package.json index 1b36b82..3bdb55c 100644 --- a/apps/cli/templates/frontend/react/tanstack-start/package.json +++ b/apps/cli/templates/frontend/react/tanstack-start/package.json @@ -14,18 +14,18 @@ "@radix-ui/react-label": "^2.1.2", "@radix-ui/react-slot": "^1.1.2", "@tanstack/react-form": "^1.0.5", - "@tailwindcss/vite": "^4.0.6", - "@tanstack/react-query": "^5.71.10", - "@tanstack/react-router": "^1.114.3", - "@tanstack/react-router-with-query": "^1.114.3", - "@tanstack/react-start": "^1.114.3", - "@tanstack/router-plugin": "^1.114.3", + "@tailwindcss/vite": "^4.1.8", + "@tanstack/react-query": "^5.80.5", + "@tanstack/react-router": "^1.120.15", + "@tanstack/react-router-with-query": "^1.120.15", + "@tanstack/react-start": "^1.120.15", + "@tanstack/router-plugin": "^1.120.15", "class-variance-authority": "^0.7.1", "clsx": "^2.1.1", "lucide-react": "^0.473.0", "next-themes": "^0.4.6", - "react": "^19.0.0", - "react-dom": "^19.0.0", + "react": "^19.1.0", + "react-dom": "^19.1.0", "sonner": "^2.0.3", "tailwindcss": "^4.1.3", "tailwind-merge": "^2.6.0", @@ -35,15 +35,15 @@ "zod": "^3.25.16" }, "devDependencies": { - "@tanstack/react-router-devtools": "^1.114.3", + "@tanstack/react-router-devtools": "^1.120.15", "@testing-library/dom": "^10.4.0", "@testing-library/react": "^16.2.0", - "@types/react": "^19.0.8", - "@types/react-dom": "^19.0.3", + "@types/react": "^19.1.6", + "@types/react-dom": "^19.1.6", "@vitejs/plugin-react": "^4.3.4", "jsdom": "^26.0.0", "typescript": "^5.7.2", - "vite": "^6.1.0", + "vite": "^6.3.5", "web-vitals": "^4.2.4" } } diff --git a/apps/cli/templates/frontend/react/tanstack-start/src/router.tsx.hbs b/apps/cli/templates/frontend/react/tanstack-start/src/router.tsx.hbs index 839ba06..983fc47 100644 --- a/apps/cli/templates/frontend/react/tanstack-start/src/router.tsx.hbs +++ b/apps/cli/templates/frontend/react/tanstack-start/src/router.tsx.hbs @@ -20,8 +20,8 @@ import { toast } from "sonner"; import type { AppRouter } from "../../server/src/routers"; import { TRPCProvider } from "./utils/trpc"; {{else if (eq api "orpc")}} -import { QueryClient, QueryClientProvider } from "@tanstack/react-query"; -import { orpc, ORPCContext, queryClient as orpcQueryClient } from "./utils/orpc"; +import { QueryClientProvider } from "@tanstack/react-query"; +import { orpc, queryClient } from "./utils/orpc"; {{/if}} {{/if}} @@ -99,7 +99,6 @@ const trpc = createTRPCOptionsProxy({ queryClient: queryClient, }); {{else if (eq api "orpc")}} - const queryClient = orpcQueryClient; {{/if}} export const createRouter = () => { @@ -127,9 +126,7 @@ export const createRouter = () => { {{else if (eq api "orpc")}} Wrap: ({ children }) => ( - - {children} - + {children} ), {{else}} diff --git a/apps/cli/templates/frontend/react/tanstack-start/src/routes/index.tsx.hbs b/apps/cli/templates/frontend/react/tanstack-start/src/routes/index.tsx.hbs index d666d5d..390677a 100644 --- a/apps/cli/templates/frontend/react/tanstack-start/src/routes/index.tsx.hbs +++ b/apps/cli/templates/frontend/react/tanstack-start/src/routes/index.tsx.hbs @@ -9,7 +9,7 @@ import { useQuery } from "@tanstack/react-query"; import { useTRPC } from "@/utils/trpc"; {{/if}} {{#if (eq api "orpc")}} -import { useORPC } from "@/utils/orpc"; +import { orpc } from "@/utils/orpc"; {{/if}} {{/if}} @@ -40,7 +40,6 @@ function HomeComponent() { const trpc = useTRPC(); const healthCheck = useQuery(trpc.healthCheck.queryOptions()); {{else if (eq api "orpc")}} - const orpc = useORPC(); const healthCheck = useQuery(orpc.healthCheck.queryOptions()); {{/if}} diff --git a/apps/cli/templates/frontend/solid/package.json b/apps/cli/templates/frontend/solid/package.json index 86dff15..4e686f1 100644 --- a/apps/cli/templates/frontend/solid/package.json +++ b/apps/cli/templates/frontend/solid/package.json @@ -9,17 +9,11 @@ "test": "vitest run" }, "dependencies": { - "@orpc/client": "^1.1.1", - "@orpc/server": "^1.1.1", - "@orpc/solid-query": "^1.1.1", "@tailwindcss/vite": "^4.0.6", "@tanstack/router-plugin": "^1.109.2", "@tanstack/solid-form": "^1.9.0", - "@tanstack/solid-query": "^5.75.0", - "@tanstack/solid-query-devtools": "^5.75.0", "@tanstack/solid-router": "^1.110.0", "@tanstack/solid-router-devtools": "^1.109.2", - "better-auth": "^1.2.7", "lucide-solid": "^0.507.0", "solid-js": "^1.9.4", "tailwindcss": "^4.0.6", diff --git a/bun.lock b/bun.lock index 6df6b06..2d9ff11 100644 --- a/bun.lock +++ b/bun.lock @@ -14,7 +14,7 @@ }, "apps/cli": { "name": "create-better-t-stack", - "version": "2.14.4", + "version": "2.16.0", "bin": { "create-better-t-stack": "dist/index.js", },