franpcode/create-better-t-stack
1
0
Fork 0
mirror of https://github.com/FranP-code/create-better-t-stack.git synced 2025-10-12 23:52:15 +00:00
Code Issues Packages Projects Releases Wiki Activity

fix: backend none templates (#241)

Browse Source
This commit is contained in:
Aman Varshney
2025-05-10 08:10:23 +05:30
committed by GitHub
parent 4e4ad2b9ee
commit 8209713bd6
29 changed files with 519 additions and 353 deletions
Download Patch File Download Diff File Expand all files Collapse all files

58
apps/cli/templates/frontend/react/tanstack-router/src/routes/__root.tsx.hbs
View File

@@ -31,14 +31,12 @@ export interface RouterAppContext {
orpc: typeof orpc;
queryClient: QueryClient;
}
{{/if}}
{{#if (eq api "trpc")}}
{{else if (eq api "trpc")}}
export interface RouterAppContext {
trpc: typeof trpc;
queryClient: QueryClient;
}
{{/if}}
{{#if (eq backend "convex")}}
{{else}}
export interface RouterAppContext {}
{{/if}}
@@ -63,18 +61,21 @@ export const Route = createRootRouteWithContext<RouterAppContext>()({
}),
});
{{#if (eq api "orpc")}}
function RootComponent() {
const [client] = useState<RouterClient<typeof appRouter>>(() => createORPCClient(link))
const [orpc] = useState(() => createORPCReactQueryUtils(client))
const isFetching = useRouterState({
select: (s) => s.isLoading,
});
{{#if (eq api "orpc")}}
const [client] = useState<RouterClient<typeof appRouter>>(() => createORPCClient(link));
const [orpcUtils] = useState(() => createORPCReactQueryUtils(client));
{{/if}}
return (
<>
<HeadContent />
<ORPCContext.Provider value={orpc}>
{{#if (eq api "orpc")}}
<ORPCContext.Provider value={orpcUtils}>
<ThemeProvider defaultTheme="dark" storageKey="vite-ui-theme">
<div className="grid grid-rows-[auto_1fr] h-svh">
<Header />
@@ -83,20 +84,7 @@ function RootComponent() {
<Toaster richColors />
</ThemeProvider>
</ORPCContext.Provider>
<TanStackRouterDevtools position="bottom-left" />
<ReactQueryDevtools position="bottom" buttonPosition="bottom-right" />
</>
);
}
{{/if}}
{{#if (eq api "trpc")}}
function RootComponent() {
const isFetching = useRouterState({
select: (s) => s.isLoading,
});
return (
<>
<HeadContent />
{{else}}
<ThemeProvider defaultTheme="dark" storageKey="vite-ui-theme">
<div className="grid grid-rows-[auto_1fr] h-svh">
<Header />
@@ -104,29 +92,11 @@ function RootComponent() {
</div>
<Toaster richColors />
</ThemeProvider>
{{/if}}
<TanStackRouterDevtools position="bottom-left" />
{{#if (or (eq api "orpc") (eq api "trpc"))}}
<ReactQueryDevtools position="bottom" buttonPosition="bottom-right" />
{{/if}}
</>
);
}
{{/if}}
{{#if (eq backend "convex")}}
function RootComponent() {
const isFetching = useRouterState({
select: (s) => s.isLoading,
});
return (
<>
<HeadContent />
<ThemeProvider defaultTheme="dark" storageKey="vite-ui-theme">
<div className="grid grid-rows-[auto_1fr] h-svh">
<Header />
{isFetching ? <Loader /> : <Outlet />}
</div>
<Toaster richColors />
</ThemeProvider>
<TanStackRouterDevtools position="bottom-left" />
</>
);
}
{{/if}}

31
apps/cli/templates/frontend/react/tanstack-router/src/routes/index.tsx.hbs
View File

@@ -49,20 +49,8 @@ function HomeComponent() {
<div className="grid gap-6">
<section className="rounded-lg border p-4">
<h2 className="mb-2 font-medium">API Status</h2>
{{#if (eq backend "convex")}}
<div className="flex items-center gap-2">
{{#if (or (eq api "orpc") (eq api "trpc"))}}
<div
className={`h-2 w-2 rounded-full ${healthCheck.data ? "bg-green-500" : "bg-red-500"}`}
/>
<span className="text-sm text-muted-foreground">
{healthCheck.isLoading
? "Checking..."
: healthCheck.data
? "Connected"
: "Disconnected"}
</span>
{{/if}}
{{#if (eq backend "convex")}}
<div
className={`h-2 w-2 rounded-full ${healthCheck === "OK" ? "bg-green-500" : healthCheck === undefined ? "bg-orange-400" : "bg-red-500"}`}
/>
@@ -73,8 +61,23 @@ function HomeComponent() {
? "Connected"
: "Error"}
</span>
{{/if}}
</div>
{{else}}
{{#unless (eq api "none")}}
<div className="flex items-center gap-2">
<div
className={`h-2 w-2 rounded-full ${healthCheck.data ? "bg-green-500" : "bg-red-500"}`}
/>
<span className="text-sm text-muted-foreground">
{healthCheck.isLoading
? "Checking..."
: healthCheck.data
? "Connected"
: "Disconnected"}
</span>
</div>
{{/unless}}
{{/if}}
</section>
</div>
</div>