create-lumen 2.0.0-beta.1 → 2.0.0-beta.3

package/templates/conditional/next/route-groups/js/src/app/(public)/page.jsx

@@ -0,0 +1,38 @@
+import Link from "next/link";
+
+export default function PublicPage() {
+  return (
+    <div className="max-w-4xl mx-auto py-12 px-6">
+      <h1 className="text-4xl font-extrabold tracking-tight mb-4">
+        Welcome to Route Groups Preset
+      </h1>
+      <p className="text-lg text-gray-600 mb-8">
+        This application is organized using Next.js App Router route groups:
+        (public), (auth), (private), and (admin).
+      </p>
+      <div className="grid grid-cols-1 md:grid-cols-3 gap-6">
+        <div className="border rounded-lg p-6 shadow-sm">
+          <h2 className="text-xl font-semibold mb-2">Auth Group</h2>
+          <p className="text-gray-500 mb-4">Authentication screens and login layouts.</p>
+          <Link href="/login" className="text-blue-600 hover:underline">
+            Go to Login &rarr;
+          </Link>
+        </div>
+        <div className="border rounded-lg p-6 shadow-sm">
+          <h2 className="text-xl font-semibold mb-2">Private Group</h2>
+          <p className="text-gray-500 mb-4">Protected routes guarded by auth proxy middleware.</p>
+          <Link href="/dashboard" className="text-blue-600 hover:underline">
+            Go to Dashboard &rarr;
+          </Link>
+        </div>
+        <div className="border rounded-lg p-6 shadow-sm">
+          <h2 className="text-xl font-semibold mb-2">Admin Group</h2>
+          <p className="text-gray-500 mb-4">Elevated management section requiring admin role.</p>
+          <Link href="/admin" className="text-blue-600 hover:underline">
+            Go to Admin &rarr;
+          </Link>
+        </div>
+      </div>
+    </div>
+  );
+}

package/templates/conditional/next/route-groups/js/src/middleware.js

@@ -0,0 +1,48 @@
+import { NextResponse } from "next/server";
+
+/**
+ * Auth Proxy / Route Guard Middleware
+ *
+ * Enforces role-based access control and session verification:
+ * - Unauthenticated requests to private or admin routes redirect to /login
+ * - Authenticated requests lacking the "admin" role redirect away from /admin
+ */
+export function middleware(request) {
+  const { pathname } = request.nextUrl;
+
+  const authToken = request.cookies.get("auth-token")?.value;
+  const userRole = request.cookies.get("user-role")?.value || "user";
+
+  const isAuthRoute = pathname.startsWith("/login") || pathname.startsWith("/register");
+  const isPrivateRoute = pathname.startsWith("/dashboard") || pathname.startsWith("/settings");
+  const isAdminRoute = pathname.startsWith("/admin");
+
+  // If unauthenticated user tries to access protected areas, redirect to /login
+  if ((isPrivateRoute || isAdminRoute) && !authToken) {
+    const loginUrl = new URL("/login", request.url);
+    loginUrl.searchParams.set("from", pathname);
+    return NextResponse.redirect(loginUrl);
+  }
+
+  // If authenticated user without admin role accesses admin area, forbid or redirect to dashboard
+  if (isAdminRoute && userRole !== "admin") {
+    return NextResponse.redirect(new URL("/dashboard", request.url));
+  }
+
+  // If already authenticated user visits auth routes, redirect to dashboard
+  if (isAuthRoute && authToken) {
+    return NextResponse.redirect(new URL("/dashboard", request.url));
+  }
+
+  return NextResponse.next();
+}
+
+export const config = {
+  matcher: [
+    "/dashboard/:path*",
+    "/settings/:path*",
+    "/admin/:path*",
+    "/login",
+    "/register",
+  ],
+};

package/templates/conditional/next/route-groups/ts/src/app/(admin)/layout.tsx

@@ -0,0 +1,28 @@
+import type { ReactNode } from "react";
+import Link from "next/link";
+
+export default function AdminLayout({
+  children,
+}: Readonly<{
+  children: ReactNode;
+}>) {
+  return (
+    <div className="min-h-screen flex flex-col">
+      <header className="bg-red-700 text-white px-6 py-3 flex items-center justify-between text-sm">
+        <div className="font-semibold flex items-center gap-2">
+          <span className="inline-block w-2 h-2 rounded-full bg-white animate-pulse" />
+          Admin Panel (Restricted Access)
+        </div>
+        <nav className="flex gap-4">
+          <Link href="/admin" className="underline hover:no-underline">
+            Management
+          </Link>
+          <Link href="/dashboard" className="underline hover:no-underline">
+            Exit to Dashboard
+          </Link>
+        </nav>
+      </header>
+      <main className="flex-1 p-8 bg-gray-100 dark:bg-gray-900">{children}</main>
+    </div>
+  );
+}

package/templates/conditional/next/route-groups/ts/src/app/(auth)/layout.tsx

@@ -0,0 +1,22 @@
+import type { ReactNode } from "react";
+import Link from "next/link";
+
+export default function AuthLayout({
+  children,
+}: Readonly<{
+  children: ReactNode;
+}>) {
+  return (
+    <div className="min-h-screen flex flex-col justify-center items-center bg-gray-50 dark:bg-gray-950 p-4">
+      <div className="w-full max-w-md bg-white dark:bg-gray-900 shadow-md rounded-lg p-6 border border-gray-200 dark:border-gray-800">
+        <div className="mb-6 text-center">
+          <Link href="/" className="text-xl font-bold">
+            Lumen Authentication
+          </Link>
+          <p className="text-sm text-gray-500 mt-1">Sign in to your account</p>
+        </div>
+        {children}
+      </div>
+    </div>
+  );
+}

package/templates/conditional/next/route-groups/ts/src/app/(private)/layout.tsx

@@ -0,0 +1,32 @@
+import type { ReactNode } from "react";
+import Link from "next/link";
+
+export default function PrivateLayout({
+  children,
+}: Readonly<{
+  children: ReactNode;
+}>) {
+  return (
+    <div className="min-h-screen flex">
+      <aside className="w-64 border-r bg-gray-50 dark:bg-gray-950 p-6 flex flex-col justify-between">
+        <div>
+          <div className="font-bold text-lg mb-6">
+            <Link href="/dashboard">Private Dashboard</Link>
+          </div>
+          <nav className="flex flex-col gap-3 text-sm">
+            <Link href="/dashboard" className="text-gray-700 dark:text-gray-200 hover:text-black">
+              Overview
+            </Link>
+            <Link href="/settings" className="text-gray-700 dark:text-gray-200 hover:text-black">
+              Settings
+            </Link>
+          </nav>
+        </div>
+        <div className="text-xs text-gray-400">
+          Protected Area &bull; Authenticated
+        </div>
+      </aside>
+      <main className="flex-1 p-8">{children}</main>
+    </div>
+  );
+}

package/templates/conditional/next/route-groups/ts/src/app/(public)/layout.tsx

@@ -0,0 +1,33 @@
+import type { ReactNode } from "react";
+import Link from "next/link";
+
+export default function PublicLayout({
+  children,
+}: Readonly<{
+  children: ReactNode;
+}>) {
+  return (
+    <div className="min-h-screen flex flex-col">
+      <header className="border-b px-6 py-4 flex items-center justify-between">
+        <div className="font-bold text-lg">
+          <Link href="/">Lumen App</Link>
+        </div>
+        <nav className="flex gap-4 text-sm">
+          <Link href="/login" className="hover:underline">
+            Sign In
+          </Link>
+          <Link href="/dashboard" className="hover:underline">
+            Dashboard
+          </Link>
+          <Link href="/admin" className="hover:underline">
+            Admin
+          </Link>
+        </nav>
+      </header>
+      <main className="flex-1">{children}</main>
+      <footer className="border-t px-6 py-4 text-center text-sm text-gray-500">
+        Public Area &copy; {new Date().getFullYear()}
+      </footer>
+    </div>
+  );
+}

package/templates/conditional/next/route-groups/ts/src/app/(public)/page.tsx

@@ -0,0 +1,38 @@
+import Link from "next/link";
+
+export default function PublicPage() {
+  return (
+    <div className="max-w-4xl mx-auto py-12 px-6">
+      <h1 className="text-4xl font-extrabold tracking-tight mb-4">
+        Welcome to Route Groups Preset
+      </h1>
+      <p className="text-lg text-gray-600 mb-8">
+        This application is organized using Next.js App Router route groups:
+        (public), (auth), (private), and (admin).
+      </p>
+      <div className="grid grid-cols-1 md:grid-cols-3 gap-6">
+        <div className="border rounded-lg p-6 shadow-sm">
+          <h2 className="text-xl font-semibold mb-2">Auth Group</h2>
+          <p className="text-gray-500 mb-4">Authentication screens and login layouts.</p>
+          <Link href="/login" className="text-blue-600 hover:underline">
+            Go to Login &rarr;
+          </Link>
+        </div>
+        <div className="border rounded-lg p-6 shadow-sm">
+          <h2 className="text-xl font-semibold mb-2">Private Group</h2>
+          <p className="text-gray-500 mb-4">Protected routes guarded by auth proxy middleware.</p>
+          <Link href="/dashboard" className="text-blue-600 hover:underline">
+            Go to Dashboard &rarr;
+          </Link>
+        </div>
+        <div className="border rounded-lg p-6 shadow-sm">
+          <h2 className="text-xl font-semibold mb-2">Admin Group</h2>
+          <p className="text-gray-500 mb-4">Elevated management section requiring admin role.</p>
+          <Link href="/admin" className="text-blue-600 hover:underline">
+            Go to Admin &rarr;
+          </Link>
+        </div>
+      </div>
+    </div>
+  );
+}

package/templates/conditional/next/route-groups/ts/src/middleware.ts

@@ -0,0 +1,49 @@
+import { NextResponse } from "next/server";
+import type { NextRequest } from "next/server";
+
+/**
+ * Auth Proxy / Route Guard Middleware
+ *
+ * Enforces role-based access control and session verification:
+ * - Unauthenticated requests to private or admin routes redirect to /login
+ * - Authenticated requests lacking the "admin" role redirect away from /admin
+ */
+export function middleware(request: NextRequest) {
+  const { pathname } = request.nextUrl;
+
+  const authToken = request.cookies.get("auth-token")?.value;
+  const userRole = request.cookies.get("user-role")?.value || "user";
+
+  const isAuthRoute = pathname.startsWith("/login") || pathname.startsWith("/register");
+  const isPrivateRoute = pathname.startsWith("/dashboard") || pathname.startsWith("/settings");
+  const isAdminRoute = pathname.startsWith("/admin");
+
+  // If unauthenticated user tries to access protected areas, redirect to /login
+  if ((isPrivateRoute || isAdminRoute) && !authToken) {
+    const loginUrl = new URL("/login", request.url);
+    loginUrl.searchParams.set("from", pathname);
+    return NextResponse.redirect(loginUrl);
+  }
+
+  // If authenticated user without admin role accesses admin area, forbid or redirect to dashboard
+  if (isAdminRoute && userRole !== "admin") {
+    return NextResponse.redirect(new URL("/dashboard", request.url));
+  }
+
+  // If already authenticated user visits auth routes, redirect to dashboard
+  if (isAuthRoute && authToken) {
+    return NextResponse.redirect(new URL("/dashboard", request.url));
+  }
+
+  return NextResponse.next();
+}
+
+export const config = {
+  matcher: [
+    "/dashboard/:path*",
+    "/settings/:path*",
+    "/admin/:path*",
+    "/login",
+    "/register",
+  ],
+};

package/templates/conditional/testing/jest/next/app-router/src/__tests__/page.test.jsx

@@ -0,0 +1,10 @@
+import "@testing-library/jest-dom";
+import { render, screen } from "@testing-library/react";
+import Home from "@/app/page";
+
+describe("Home", () => {
+  it("renders a heading", () => {
+    render(<Home />);
+    expect(screen.getByRole("heading", { level: 1 })).toBeInTheDocument();
+  });
+});

package/templates/conditional/testing/jest/next/app-router/src/__tests__/page.test.tsx

@@ -0,0 +1,10 @@
+import "@testing-library/jest-dom";
+import { render, screen } from "@testing-library/react";
+import Home from "@/app/page";
+
+describe("Home", () => {
+  it("renders a heading", () => {
+    render(<Home />);
+    expect(screen.getByRole("heading", { level: 1 })).toBeInTheDocument();
+  });
+});

package/templates/conditional/testing/jest/next/jest.config.mjs

@@ -0,0 +1,20 @@
+import nextJest from "next/jest.js";
+
+const createJestConfig = nextJest({
+  // Provide the path to your Next.js app to load next.config.js and .env files in your test environment
+  dir: "./",
+});
+
+// Add any custom config to be passed to Jest
+/** @type {import('jest').Config} */
+const config = {
+  coverageProvider: "v8",
+  testEnvironment: "jsdom",
+  setupFilesAfterEnv: ["<rootDir>/jest.setup.js"],
+  moduleNameMapper: {
+    "^@/(.*)$": "<rootDir>/src/$1",
+  },
+};
+
+// createJestConfig is exported this way to ensure that next/jest can load the Next.js config which is async
+export default createJestConfig(config);

package/templates/conditional/testing/jest/next/jest.config.ts

@@ -0,0 +1,20 @@
+import type { Config } from "jest";
+import nextJest from "next/jest.js";
+
+const createJestConfig = nextJest({
+  // Provide the path to your Next.js app to load next.config.js and .env files in your test environment
+  dir: "./",
+});
+
+// Add any custom config to be passed to Jest
+const config: Config = {
+  coverageProvider: "v8",
+  testEnvironment: "jsdom",
+  setupFilesAfterEnv: ["<rootDir>/jest.setup.ts"],
+  moduleNameMapper: {
+    "^@/(.*)$": "<rootDir>/src/$1",
+  },
+};
+
+// createJestConfig is exported this way to ensure that next/jest can load the Next.js config which is async
+export default createJestConfig(config);

package/templates/conditional/testing/jest/next/pages-router/src/__tests__/index.test.jsx

@@ -0,0 +1,10 @@
+import "@testing-library/jest-dom";
+import { render, screen } from "@testing-library/react";
+import Home from "@/pages/index";
+
+describe("Home", () => {
+  it("renders a heading", () => {
+    render(<Home />);
+    expect(screen.getByRole("heading", { level: 1 })).toBeInTheDocument();
+  });
+});

package/templates/conditional/testing/jest/next/pages-router/src/__tests__/index.test.tsx

@@ -0,0 +1,10 @@
+import "@testing-library/jest-dom";
+import { render, screen } from "@testing-library/react";
+import Home from "@/pages/index";
+
+describe("Home", () => {
+  it("renders a heading", () => {
+    render(<Home />);
+    expect(screen.getByRole("heading", { level: 1 })).toBeInTheDocument();
+  });
+});

package/templates/conditional/testing/vitest/next/app-router/src/__tests__/page.test.jsx

@@ -0,0 +1,11 @@
+import "@testing-library/jest-dom/vitest";
+import { render, screen } from "@testing-library/react";
+import { describe, it, expect } from "vitest";
+import Home from "@/app/page";
+
+describe("Home", () => {
+  it("renders a heading", () => {
+    render(<Home />);
+    expect(screen.getByRole("heading", { level: 1 })).toBeInTheDocument();
+  });
+});

package/templates/conditional/testing/vitest/next/app-router/src/__tests__/page.test.tsx

@@ -0,0 +1,11 @@
+import "@testing-library/jest-dom/vitest";
+import { render, screen } from "@testing-library/react";
+import { describe, it, expect } from "vitest";
+import Home from "@/app/page";
+
+describe("Home", () => {
+  it("renders a heading", () => {
+    render(<Home />);
+    expect(screen.getByRole("heading", { level: 1 })).toBeInTheDocument();
+  });
+});

package/templates/conditional/testing/vitest/next/pages-router/src/__tests__/index.test.jsx

@@ -0,0 +1,11 @@
+import "@testing-library/jest-dom/vitest";
+import { render, screen } from "@testing-library/react";
+import { describe, it, expect } from "vitest";
+import Home from "@/pages/index";
+
+describe("Home", () => {
+  it("renders a heading", () => {
+    render(<Home />);
+    expect(screen.getByRole("heading", { level: 1 })).toBeInTheDocument();
+  });
+});

package/templates/conditional/testing/vitest/next/pages-router/src/__tests__/index.test.tsx

@@ -0,0 +1,11 @@
+import "@testing-library/jest-dom/vitest";
+import { render, screen } from "@testing-library/react";
+import { describe, it, expect } from "vitest";
+import Home from "@/pages/index";
+
+describe("Home", () => {
+  it("renders a heading", () => {
+    render(<Home />);
+    expect(screen.getByRole("heading", { level: 1 })).toBeInTheDocument();
+  });
+});

package/templates/conditional/testing/vitest/next/vitest.config.js

@@ -0,0 +1,16 @@
+import path from "node:path";
+import { defineConfig } from "vitest/config";
+
+export default defineConfig({
+  resolve: {
+    alias: {
+      "@": path.resolve(__dirname, "./src"),
+    },
+  },
+  test: {
+    globals: true,
+    environment: "jsdom",
+    setupFiles: "./src/test/setup.js",
+    css: true,
+  },
+});

package/templates/conditional/testing/vitest/next/vitest.config.ts

@@ -0,0 +1,16 @@
+import path from "node:path";
+import { defineConfig } from "vitest/config";
+
+export default defineConfig({
+  resolve: {
+    alias: {
+      "@": path.resolve(__dirname, "./src"),
+    },
+  },
+  test: {
+    globals: true,
+    environment: "jsdom",
+    setupFiles: "./src/test/setup.ts",
+    css: true,
+  },
+});

package/templates/css/tailwind/postcss.config.mjs

@@ -1,5 +1,7 @@
-export default {
+const config = {
   plugins: {
     "@tailwindcss/postcss": {},
   },
 };
+
+export default config;

package/schema/fixtures/v2/valid/next-app-router-hybrid.json

@@ -1,35 +0,0 @@
-{
-  "$schema": "https://lumen-sh.github.io/create-lumen/schema/lumen.config.v2.json",
-  "manifestVersion": 2,
-  "framework": {
-    "name": "next",
-    "variant": "app-router",
-    "bundler": "turbopack",
-    "adapter": "node"
-  },
-  "styling": {
-    "engine": "tailwind"
-  },
-  "architecture": {
-    "type": "hybrid"
-  },
-  "ui": {
-    "kit": "none"
-  },
-  "docs": {
-    "language": "en"
-  },
-  "paths": {
-    "features": "src/features",
-    "components": "src/shared/components",
-    "services": "src/shared/services",
-    "hooks": "src/shared/hooks",
-    "pages": "app",
-    "ui": "src/shared/components/ui"
-  },
-  "tooling": {
-    "language": "ts",
-    "linter": "eslint",
-    "formatter": "prettier"
-  }
-}

package/schema/fixtures/v2/valid/next-pages-router-hybrid.json

@@ -1,35 +0,0 @@
-{
-  "$schema": "https://lumen-sh.github.io/create-lumen/schema/lumen.config.v2.json",
-  "manifestVersion": 2,
-  "framework": {
-    "name": "next",
-    "variant": "pages-router",
-    "bundler": "turbopack",
-    "adapter": "static"
-  },
-  "styling": {
-    "engine": "tailwind"
-  },
-  "architecture": {
-    "type": "hybrid"
-  },
-  "ui": {
-    "kit": "none"
-  },
-  "docs": {
-    "language": "es"
-  },
-  "paths": {
-    "features": "src/features",
-    "components": "src/shared/components",
-    "services": "src/shared/services",
-    "hooks": "src/shared/hooks",
-    "pages": "pages",
-    "ui": "src/shared/components/ui"
-  },
-  "tooling": {
-    "language": "js",
-    "linter": "eslint",
-    "formatter": "prettier"
-  }
-}

package/templates/architectures/hybrid/main.jsx

@@ -1,10 +0,0 @@
-import React from "react";
-import ReactDOM from "react-dom/client";
-import App from "./App";
-import "./shared/styles/globals.css";
-
-ReactDOM.createRoot(document.getElementById("root")).render(
-  <React.StrictMode>
-    <App />
-  </React.StrictMode>
-);

package/templates/architectures/hybrid/main.tsx

@@ -1,10 +0,0 @@
-import React from "react";
-import ReactDOM from "react-dom/client";
-import App from "./App";
-import "./shared/styles/globals.css";
-
-ReactDOM.createRoot(document.getElementById("root")!).render(
-  <React.StrictMode>
-    <App />
-  </React.StrictMode>
-);

package/templates/architectures/hybrid/src/App.jsx

@@ -1,20 +0,0 @@
-import { Button } from "@/shared/components/ui/Button";
-
-export default function App() {
-  return (
-    <div
-      style={{
-        minHeight: "100vh",
-        display: "flex",
-        flexDirection: "column",
-        alignItems: "center",
-        justifyContent: "center",
-        backgroundColor: "var(--color-bg, #ffffff)",
-      }}
-    >
-      <h1>Welcome to Lumen</h1>
-      <p>Hybrid architecture (src/features + src/shared).</p>
-      <Button>Click me</Button>
-    </div>
-  );
-}

package/templates/architectures/hybrid/src/App.tsx

@@ -1,20 +0,0 @@
-import { Button } from "@/shared/components/ui/Button";
-
-export default function App() {
-  return (
-    <div
-      style={{
-        minHeight: "100vh",
-        display: "flex",
-        flexDirection: "column",
-        alignItems: "center",
-        justifyContent: "center",
-        backgroundColor: "var(--color-bg, #ffffff)",
-      }}
-    >
-      <h1>Welcome to Lumen</h1>
-      <p>Hybrid architecture (src/features + src/shared).</p>
-      <Button>Click me</Button>
-    </div>
-  );
-}

package/templates/architectures/hybrid/src/features/.gitkeep

@@ -1 +0,0 @@
-

package/templates/architectures/hybrid/src/shared/components/ui/Button.jsx

@@ -1,31 +0,0 @@
-export function Button({
-  variant = "primary",
-  children,
-  className,
-  ...props
-}) {
-  const styles = {
-    primary: { backgroundColor: "var(--color-primary)", color: "white" },
-    secondary: {
-      backgroundColor: "var(--color-border)",
-      color: "var(--color-fg)",
-    },
-  };
-
-  return (
-    <button
-      style={{
-        padding: "8px 16px",
-        borderRadius: "8px",
-        fontWeight: 500,
-        border: "none",
-        cursor: "pointer",
-        ...styles[variant],
-      }}
-      className={className}
-      {...props}
-    >
-      {children}
-    </button>
-  );
-}