From fc59f630e0b1a25465e9ca62914f75b1d2e58d2d Mon Sep 17 00:00:00 2001 From: Aman Varshney Date: Sat, 22 Mar 2025 01:52:38 +0530 Subject: [PATCH] Enhance template with improved UI and gitignore handling --- .changeset/free-suns-drop.md | 5 ++ apps/cli/src/helpers/create-project.ts | 14 ++- .../client/{.gitignore => _gitignore} | 0 .../base/packages/client/src/routes/index.tsx | 87 +++++++++++++++++- .../server/{.gitignore => _gitignore} | 0 .../client/src/components/user-menu.tsx | 39 ++------ .../packages/client/src/routes/dashboard.tsx | 5 -- .../packages/client/src/routes/index.tsx | 90 +++++++++++++++++-- .../packages/client/src/routes/login.tsx | 11 +++ .../packages/server/src/with-auth-lib/trpc.ts | 24 +++++ .../packages/server/src/with-auth-lib/trpc.ts | 24 +++++ .../packages/server/src/with-auth-lib/trpc.ts | 24 +++++ .../packages/server/src/with-auth-lib/trpc.ts | 24 +++++ 13 files changed, 297 insertions(+), 50 deletions(-) create mode 100644 .changeset/free-suns-drop.md rename apps/cli/template/base/packages/client/{.gitignore => _gitignore} (100%) rename apps/cli/template/base/packages/server/{.gitignore => _gitignore} (100%) create mode 100644 apps/cli/template/with-auth/packages/client/src/routes/login.tsx create mode 100644 apps/cli/template/with-drizzle-postgres/packages/server/src/with-auth-lib/trpc.ts create mode 100644 apps/cli/template/with-drizzle-sqlite/packages/server/src/with-auth-lib/trpc.ts create mode 100644 apps/cli/template/with-prisma-postgres/packages/server/src/with-auth-lib/trpc.ts create mode 100644 apps/cli/template/with-prisma-sqlite/packages/server/src/with-auth-lib/trpc.ts diff --git a/.changeset/free-suns-drop.md b/.changeset/free-suns-drop.md new file mode 100644 index 0000000..7f3862b --- /dev/null +++ b/.changeset/free-suns-drop.md @@ -0,0 +1,5 @@ +--- +"create-better-t-stack": minor +--- + +Enhance template with improved UI diff --git a/apps/cli/src/helpers/create-project.ts b/apps/cli/src/helpers/create-project.ts index 8620686..c46fef3 100644 --- a/apps/cli/src/helpers/create-project.ts +++ b/apps/cli/src/helpers/create-project.ts @@ -24,9 +24,17 @@ export async function createProject(options: ProjectConfig): Promise { } await fs.copy(templateDir, projectDir); - const gitignorePath = path.join(projectDir, "_gitignore"); - if (await fs.pathExists(gitignorePath)) { - await fs.move(gitignorePath, path.join(projectDir, ".gitignore")); + const gitignorePaths = [ + path.join(projectDir, "_gitignore"), + path.join(projectDir, "packages/client/_gitignore"), + path.join(projectDir, "packages/server/_gitignore"), + ]; + + for (const gitignorePath of gitignorePaths) { + if (await fs.pathExists(gitignorePath)) { + const targetPath = path.join(path.dirname(gitignorePath), ".gitignore"); + await fs.move(gitignorePath, targetPath); + } } if (options.auth) { diff --git a/apps/cli/template/base/packages/client/.gitignore b/apps/cli/template/base/packages/client/_gitignore similarity index 100% rename from apps/cli/template/base/packages/client/.gitignore rename to apps/cli/template/base/packages/client/_gitignore diff --git a/apps/cli/template/base/packages/client/src/routes/index.tsx b/apps/cli/template/base/packages/client/src/routes/index.tsx index 0c29d5a..af1e5f6 100644 --- a/apps/cli/template/base/packages/client/src/routes/index.tsx +++ b/apps/cli/template/base/packages/client/src/routes/index.tsx @@ -1,16 +1,97 @@ import { trpc } from "@/utils/trpc"; import { createFileRoute, Link } from "@tanstack/react-router"; +import { ArrowRight } from "lucide-react"; +import { Button } from "@/components/ui/button"; export const Route = createFileRoute("/")({ component: HomeComponent, }); +const TITLE_TEXT = ` + ██████╗ ███████╗████████╗████████╗███████╗██████╗ + ██╔══██╗██╔════╝╚══██╔══╝╚══██╔══╝██╔════╝██╔══██╗ + ██████╔╝█████╗ ██║ ██║ █████╗ ██████╔╝ + ██╔══██╗██╔══╝ ██║ ██║ ██╔══╝ ██╔══██╗ + ██████╔╝███████╗ ██║ ██║ ███████╗██║ ██║ + ╚═════╝ ╚══════╝ ╚═╝ ╚═╝ ╚══════╝╚═╝ ╚═╝ + + ████████╗ ███████╗████████╗ █████╗ ██████╗██╗ ██╗ + ╚══██╔══╝ ██╔════╝╚══██╔══╝██╔══██╗██╔════╝██║ ██╔╝ + ██║ ███████╗ ██║ ███████║██║ █████╔╝ + ██║ ╚════██║ ██║ ██╔══██║██║ ██╔═██╗ + ██║ ███████║ ██║ ██║ ██║╚██████╗██║ ██╗ + ╚═╝ ╚══════╝ ╚═╝ ╚═╝ ╚═╝ ╚═════╝╚═╝ ╚═╝ + `; + function HomeComponent() { const healthCheck = trpc.healthCheck.useQuery(); + return ( -
-

Welcome Home!

-

healthCheck: {healthCheck.data}

+
+ 
{TITLE_TEXT}
+
+
+

API Status

+
+
+ + {healthCheck.isLoading + ? "Checking..." + : healthCheck.data + ? "Connected" + : "Disconnected"} + +
+
+ +
+

Core Features

+
    + + + + +
+
+ +
+ +
+
); } + +function FeatureItem({ + title, + description, +}: { + title: string; + description: string; +}) { + return ( +
  • +

    {title}

    +

    {description}

    +
    • + ); +} diff --git a/apps/cli/template/base/packages/server/.gitignore b/apps/cli/template/base/packages/server/_gitignore similarity index 100% rename from apps/cli/template/base/packages/server/.gitignore rename to apps/cli/template/base/packages/server/_gitignore diff --git a/apps/cli/template/with-auth/packages/client/src/components/user-menu.tsx b/apps/cli/template/with-auth/packages/client/src/components/user-menu.tsx index 02388b7..3f92e13 100644 --- a/apps/cli/template/with-auth/packages/client/src/components/user-menu.tsx +++ b/apps/cli/template/with-auth/packages/client/src/components/user-menu.tsx @@ -8,62 +8,35 @@ import { } from "@/components/ui/dropdown-menu"; import { authClient } from "@/lib/auth-client"; import { useNavigate } from "@tanstack/react-router"; -import { useEffect } from "react"; import { Button } from "./ui/button"; import { Skeleton } from "./ui/skeleton"; +import { Link } from "@tanstack/react-router"; export default function UserMenu() { const navigate = useNavigate(); const { data: session, isPending } = authClient.useSession(); - useEffect(() => { - if (!session && !isPending) { - navigate({ - to: "/", - }); - } - }, [session, isPending]); - if (isPending) { return ; } if (!session) { return ( - - - - - - My Account - - - - - - + ); } return ( - + My Account - {session?.user.email} + {session.user.email} +
    + ); } + +function FeatureItem({ + title, + description, +}: { + title: string; + description: string; +}) { + return ( +
  • +

    {title}

    +

    {description}

    +
    • + ); +} diff --git a/apps/cli/template/with-auth/packages/client/src/routes/login.tsx b/apps/cli/template/with-auth/packages/client/src/routes/login.tsx new file mode 100644 index 0000000..8d3bdb1 --- /dev/null +++ b/apps/cli/template/with-auth/packages/client/src/routes/login.tsx @@ -0,0 +1,11 @@ +import { createFileRoute } from "@tanstack/react-router"; +import AuthForms from "@/components/auth-forms"; + +export const Route = createFileRoute("/login")({ + component: RouteComponent, +}); + +function RouteComponent() { + return ( + ); +} diff --git a/apps/cli/template/with-drizzle-postgres/packages/server/src/with-auth-lib/trpc.ts b/apps/cli/template/with-drizzle-postgres/packages/server/src/with-auth-lib/trpc.ts new file mode 100644 index 0000000..3affce2 --- /dev/null +++ b/apps/cli/template/with-drizzle-postgres/packages/server/src/with-auth-lib/trpc.ts @@ -0,0 +1,24 @@ +import { initTRPC, TRPCError } from "@trpc/server"; +import type { Context } from "./context"; + +export const t = initTRPC.context().create(); + +export const router = t.router; + +export const publicProcedure = t.procedure; + +export const protectedProcedure = t.procedure.use(({ ctx, next }) => { + if (!ctx.session) { + throw new TRPCError({ + code: "UNAUTHORIZED", + message: "Authentication required", + cause: "No session", + }); + } + return next({ + ctx: { + ...ctx, + session: ctx.session, + }, + }); +}); diff --git a/apps/cli/template/with-drizzle-sqlite/packages/server/src/with-auth-lib/trpc.ts b/apps/cli/template/with-drizzle-sqlite/packages/server/src/with-auth-lib/trpc.ts new file mode 100644 index 0000000..3affce2 --- /dev/null +++ b/apps/cli/template/with-drizzle-sqlite/packages/server/src/with-auth-lib/trpc.ts @@ -0,0 +1,24 @@ +import { initTRPC, TRPCError } from "@trpc/server"; +import type { Context } from "./context"; + +export const t = initTRPC.context().create(); + +export const router = t.router; + +export const publicProcedure = t.procedure; + +export const protectedProcedure = t.procedure.use(({ ctx, next }) => { + if (!ctx.session) { + throw new TRPCError({ + code: "UNAUTHORIZED", + message: "Authentication required", + cause: "No session", + }); + } + return next({ + ctx: { + ...ctx, + session: ctx.session, + }, + }); +}); diff --git a/apps/cli/template/with-prisma-postgres/packages/server/src/with-auth-lib/trpc.ts b/apps/cli/template/with-prisma-postgres/packages/server/src/with-auth-lib/trpc.ts new file mode 100644 index 0000000..3affce2 --- /dev/null +++ b/apps/cli/template/with-prisma-postgres/packages/server/src/with-auth-lib/trpc.ts @@ -0,0 +1,24 @@ +import { initTRPC, TRPCError } from "@trpc/server"; +import type { Context } from "./context"; + +export const t = initTRPC.context().create(); + +export const router = t.router; + +export const publicProcedure = t.procedure; + +export const protectedProcedure = t.procedure.use(({ ctx, next }) => { + if (!ctx.session) { + throw new TRPCError({ + code: "UNAUTHORIZED", + message: "Authentication required", + cause: "No session", + }); + } + return next({ + ctx: { + ...ctx, + session: ctx.session, + }, + }); +}); diff --git a/apps/cli/template/with-prisma-sqlite/packages/server/src/with-auth-lib/trpc.ts b/apps/cli/template/with-prisma-sqlite/packages/server/src/with-auth-lib/trpc.ts new file mode 100644 index 0000000..3affce2 --- /dev/null +++ b/apps/cli/template/with-prisma-sqlite/packages/server/src/with-auth-lib/trpc.ts @@ -0,0 +1,24 @@ +import { initTRPC, TRPCError } from "@trpc/server"; +import type { Context } from "./context"; + +export const t = initTRPC.context().create(); + +export const router = t.router; + +export const publicProcedure = t.procedure; + +export const protectedProcedure = t.procedure.use(({ ctx, next }) => { + if (!ctx.session) { + throw new TRPCError({ + code: "UNAUTHORIZED", + message: "Authentication required", + cause: "No session", + }); + } + return next({ + ctx: { + ...ctx, + session: ctx.session, + }, + }); +});