create-nextjs-stack 0.1.0 → 0.1.2

package/templates/admin/app/actions/upload.ts

@@ -30,13 +30,6 @@ export async function uploadImage(formData: FormData) {
     return { error: "No file provided" };
   }
 
-  // Debug: Log config state (safe)
-  const config = cloudinary.config();
-  console.log("Active Cloudinary Config:", {
-    cloud_name: config.cloud_name,
-    api_key: config.api_key ? "HIDDEN (Set)" : "MISSING",
-    api_secret: config.api_secret ? "HIDDEN (Set)" : "MISSING",
-  });
 
   try {
     const arrayBuffer = await file.arrayBuffer();

package/templates/admin/app/globals.css

@@ -1,23 +1,121 @@
 @import "tailwindcss";
 
+@custom-variant dark (&:is(.dark *));
+
+@theme inline {
+  --color-background: var(--background);
+  --color-foreground: var(--foreground);
+  --font-sans: var(--font-geist-sans);
+  --font-mono: var(--font-geist-mono);
+  --color-sidebar-ring: var(--sidebar-ring);
+  --color-sidebar-border: var(--sidebar-border);
+  --color-sidebar-accent-foreground: var(--sidebar-accent-foreground);
+  --color-sidebar-accent: var(--sidebar-accent);
+  --color-sidebar-primary-foreground: var(--sidebar-primary-foreground);
+  --color-sidebar-primary: var(--sidebar-primary);
+  --color-sidebar-foreground: var(--sidebar-foreground);
+  --color-sidebar: var(--sidebar);
+  --color-chart-5: var(--chart-5);
+  --color-chart-4: var(--chart-4);
+  --color-chart-3: var(--chart-3);
+  --color-chart-2: var(--chart-2);
+  --color-chart-1: var(--chart-1);
+  --color-ring: var(--ring);
+  --color-input: var(--input);
+  --color-border: var(--border);
+  --color-destructive: var(--destructive);
+  --color-accent-foreground: var(--accent-foreground);
+  --color-accent: var(--accent);
+  --color-muted-foreground: var(--muted-foreground);
+  --color-muted: var(--muted);
+  --color-secondary-foreground: var(--secondary-foreground);
+  --color-secondary: var(--secondary);
+  --color-primary-foreground: var(--primary-foreground);
+  --color-primary: var(--primary);
+  --color-popover-foreground: var(--popover-foreground);
+  --color-popover: var(--popover);
+  --color-card-foreground: var(--card-foreground);
+  --color-card: var(--card);
+  --radius-sm: calc(var(--radius) - 4px);
+  --radius-md: calc(var(--radius) - 2px);
+  --radius-lg: var(--radius);
+  --radius-xl: calc(var(--radius) + 4px);
+}
+
 :root {
-  --foreground-rgb: 0, 0, 0;
-  --background-start-rgb: 214, 219, 220;
-  --background-end-rgb: 255, 255, 255;
+  --background: oklch(1 0 0);
+  --foreground: oklch(0.141 0.005 285.823);
+  --card: oklch(1 0 0);
+  --card-foreground: oklch(0.141 0.005 285.823);
+  --popover: oklch(1 0 0);
+  --popover-foreground: oklch(0.141 0.005 285.823);
+  --primary: oklch(0.21 0.006 285.885);
+  --primary-foreground: oklch(0.985 0 0);
+  --secondary: oklch(0.967 0.001 286.375);
+  --secondary-foreground: oklch(0.21 0.006 285.885);
+  --muted: oklch(0.967 0.001 286.375);
+  --muted-foreground: oklch(0.552 0.016 285.938);
+  --accent: oklch(0.967 0.001 286.375);
+  --accent-foreground: oklch(0.21 0.006 285.885);
+  --destructive: oklch(0.577 0.245 27.325);
+  --border: oklch(0.92 0.004 286.32);
+  --input: oklch(0.92 0.004 286.32);
+  --ring: oklch(0.705 0.015 286.067);
+  --chart-1: oklch(0.646 0.222 41.116);
+  --chart-2: oklch(0.6 0.118 184.704);
+  --chart-3: oklch(0.398 0.07 227.392);
+  --chart-4: oklch(0.828 0.189 84.429);
+  --chart-5: oklch(0.769 0.188 70.08);
+  --radius: 0.625rem;
+  --sidebar: oklch(0.985 0 0);
+  --sidebar-foreground: oklch(0.141 0.005 285.823);
+  --sidebar-primary: oklch(0.21 0.006 285.885);
+  --sidebar-primary-foreground: oklch(0.985 0 0);
+  --sidebar-accent: oklch(0.967 0.001 286.375);
+  --sidebar-accent-foreground: oklch(0.21 0.006 285.885);
+  --sidebar-border: oklch(0.92 0.004 286.32);
+  --sidebar-ring: oklch(0.705 0.015 286.067);
 }
 
-body {
-  color: rgb(var(--foreground-rgb));
-  background: linear-gradient(
-      to bottom,
-      transparent,
-      rgb(var(--background-end-rgb))
-    )
-    rgb(var(--background-start-rgb));
+.dark {
+  --background: oklch(0.141 0.005 285.823);
+  --foreground: oklch(0.985 0 0);
+  --card: oklch(0.141 0.005 285.823);
+  --card-foreground: oklch(0.985 0 0);
+  --popover: oklch(0.141 0.005 285.823);
+  --popover-foreground: oklch(0.985 0 0);
+  --primary: oklch(0.985 0 0);
+  --primary-foreground: oklch(0.21 0.006 285.885);
+  --secondary: oklch(0.274 0.006 286.033);
+  --secondary-foreground: oklch(0.985 0 0);
+  --muted: oklch(0.274 0.006 286.033);
+  --muted-foreground: oklch(0.705 0.015 286.067);
+  --accent: oklch(0.274 0.006 286.033);
+  --accent-foreground: oklch(0.985 0 0);
+  --destructive: oklch(0.396 0.141 25.723);
+  --border: oklch(0.274 0.006 286.033);
+  --input: oklch(0.274 0.006 286.033);
+  --ring: oklch(0.446 0.043 257.431);
+  --chart-1: oklch(0.488 0.243 264.376);
+  --chart-2: oklch(0.696 0.17 162.48);
+  --chart-3: oklch(0.769 0.188 70.08);
+  --chart-4: oklch(0.627 0.265 303.9);
+  --chart-5: oklch(0.645 0.246 16.439);
+  --sidebar: oklch(0.21 0.006 285.885);
+  --sidebar-foreground: oklch(0.985 0 0);
+  --sidebar-primary: oklch(0.488 0.243 264.376);
+  --sidebar-primary-foreground: oklch(0.985 0 0);
+  --sidebar-accent: oklch(0.274 0.006 286.033);
+  --sidebar-accent-foreground: oklch(0.985 0 0);
+  --sidebar-border: oklch(0.274 0.006 286.033);
+  --sidebar-ring: oklch(0.446 0.043 257.431);
 }
 
-@layer utilities {
-  .text-balance {
-    text-wrap: balance;
+@layer base {
+  * {
+    @apply border-border outline-ring/50;
+  }
+  body {
+    @apply bg-background text-foreground;
   }
 }

package/templates/admin/components/admin/Sidebar.tsx

@@ -5,7 +5,7 @@ import { usePathname } from "next/navigation";
 import { resources } from "@/config/resources";
 import * as Icons from "lucide-react";
 import { LogOut } from "lucide-react";
-import { createBrowserClient } from "@supabase/ssr";
+import { getBrowserClient } from "@/lib/supabase/client";
 import { useRouter } from "next/navigation";
 
 export default function Sidebar() {
@@ -13,10 +13,7 @@ export default function Sidebar() {
   const router = useRouter();
 
   const handleLogout = async () => {
-    const supabase = createBrowserClient(
-      process.env.NEXT_PUBLIC_SUPABASE_URL!,
-      process.env.NEXT_PUBLIC_SUPABASE_ANON_KEY!
-    );
+    const supabase = getBrowserClient();
     await supabase.auth.signOut();
     router.push("/login");
     router.refresh();

package/templates/admin/components.json

@@ -0,0 +1,22 @@
+{
+  "$schema": "https://ui.shadcn.com/schema.json",
+  "style": "new-york",
+  "rsc": true,
+  "tsx": true,
+  "tailwind": {
+    "config": "",
+    "css": "app/globals.css",
+    "baseColor": "zinc",
+    "cssVariables": true,
+    "prefix": ""
+  },
+  "iconLibrary": "lucide",
+  "aliases": {
+    "components": "@/components",
+    "utils": "@/lib/utils",
+    "ui": "@/components/ui",
+    "lib": "@/lib",
+    "hooks": "@/hooks"
+  },
+  "registries": {}
+}

package/templates/admin/hooks/useResource.ts

@@ -56,6 +56,9 @@ export function useResource(config: ResourceConfig) {
   };
 
   const remove = async (id: string) => {    
+    if (!window.confirm("Are you sure you want to delete this record?")) {
+      return false;
+    }
     setIsDeleting(true);
     try {
       const result = await deleteResource(config.table, id);

package/templates/admin/lib/services/resource.service.ts

@@ -2,11 +2,10 @@ import { BaseService } from './base.service';
 import { getServerClient } from "@/lib/supabase/server";
 
 export class ResourceService extends BaseService {
-  constructor(table: string) {
+  constructor(table: string = '') {
     super(table);
   }
 
-  // Fetch options for relation fields (e.g. categories for products)
   async getRelationOptions(table: string, displayField: string) {
     const supabase = await getServerClient();
     const { data, error } = await supabase
@@ -19,8 +18,4 @@ export class ResourceService extends BaseService {
   }
 }
 
-export const resourceService = new ResourceService(''); // Placeholder, instantiated per use really, strictly for static methods if needed or we change design.
-
-// Improved design: We don't export a single instance but rather helper functions or the class itself.
-// But for FormLayout client-side fetching, we need a server action or API route.
-// Let's create a server action for this instead.
+export const resourceService = new ResourceService();

package/templates/admin/lib/supabase/client.ts

@@ -1,9 +1,13 @@
 import { createBrowserClient } from "@supabase/ssr";
 
 export function getBrowserClient() {
-  return createBrowserClient(
-    process.env.NEXT_PUBLIC_SUPABASE_URL!,
-    process.env.NEXT_PUBLIC_SUPABASE_ANON_KEY!,
-  );
+  const supabaseUrl = process.env.NEXT_PUBLIC_SUPABASE_URL;
+  const supabaseKey = process.env.NEXT_PUBLIC_SUPABASE_ANON_KEY;
+
+  if (!supabaseUrl || !supabaseKey) {
+    throw new Error('Missing Supabase credentials. Please check NEXT_PUBLIC_SUPABASE_URL and NEXT_PUBLIC_SUPABASE_ANON_KEY in .env');
+  }
+
+  return createBrowserClient(supabaseUrl, supabaseKey);
 }
 

package/templates/admin/lib/supabase/server.ts

@@ -6,7 +6,7 @@ export async function getServerClient() {
 
   return createServerClient(
     process.env.NEXT_PUBLIC_SUPABASE_URL!,
-    process.env.NEXT_PUBLIC_SUPABASE_ANON_KEY!,
+    process.env.SUPABASE_SERVICE_ROLE_KEY!,
     {
       cookies: {
         getAll() {

package/templates/admin/lib/utils.ts

@@ -0,0 +1,6 @@
+import { type ClassValue, clsx } from "clsx"
+import { twMerge } from "tailwind-merge"
+
+export function cn(...inputs: ClassValue[]) {
+  return twMerge(clsx(inputs))
+}

package/templates/admin/middleware.ts

@@ -2,9 +2,7 @@ import { type NextRequest } from "next/server";
 import { updateSession } from "@/lib/supabase/middleware";
 
 export async function middleware(request: NextRequest) {
-  console.log("Middleware running");
-  console.log("URL:", process.env.NEXT_PUBLIC_SUPABASE_URL ? "Defined" : "Undefined");
-  console.log("Anon Key:", process.env.NEXT_PUBLIC_SUPABASE_ANON_KEY ? "Defined" : "Undefined");
+
   return await updateSession(request);
 }
 

package/templates/admin/next.config.ts

@@ -1,9 +1,17 @@
 import type { NextConfig } from "next";
 
 const nextConfig: NextConfig = {
-  /* config options here */
   images: {
-    domains: ["res.cloudinary.com","picsum.photos"],
+    remotePatterns: [
+      {
+        protocol: "https",
+        hostname: "res.cloudinary.com",
+      },
+      {
+        protocol: "https",
+        hostname: "picsum.photos",
+      },
+    ],
   },
 };
 

package/templates/admin/package-lock.json

@@ -11,12 +11,14 @@
         "@supabase/ssr": "^0.8.0",
         "@supabase/supabase-js": "^2.94.1",
         "cloudinary": "^2.9.0",
+        "clsx": "^2.1.1",
         "lucide-react": "^0.563.0",
         "next": "16.1.6",
         "react": "19.2.3",
         "react-dom": "19.2.3",
         "react-hook-form": "^7.71.1",
-        "react-toastify": "^11.0.3"
+        "react-toastify": "^11.0.3",
+        "tailwind-merge": "^3.5.0"
       },
       "devDependencies": {
         "@tailwindcss/postcss": "^4",
@@ -6228,6 +6230,16 @@
         "url": "https://github.com/sponsors/ljharb"
       }
     },
+    "node_modules/tailwind-merge": {
+      "version": "3.5.0",
+      "resolved": "https://registry.npmjs.org/tailwind-merge/-/tailwind-merge-3.5.0.tgz",
+      "integrity": "sha512-I8K9wewnVDkL1NTGoqWmVEIlUcB9gFriAEkXkfCjX5ib8ezGxtR3xD7iZIxrfArjEsH7F1CHD4RFUtxefdqV/A==",
+      "license": "MIT",
+      "funding": {
+        "type": "github",
+        "url": "https://github.com/sponsors/dcastil"
+      }
+    },
     "node_modules/tailwindcss": {
       "version": "4.1.18",
       "resolved": "https://registry.npmjs.org/tailwindcss/-/tailwindcss-4.1.18.tgz",

package/templates/admin/package.json

@@ -12,12 +12,14 @@
     "@supabase/ssr": "^0.8.0",
     "@supabase/supabase-js": "^2.94.1",
     "cloudinary": "^2.9.0",
+    "clsx": "^2.1.1",
     "lucide-react": "^0.563.0",
     "next": "16.1.6",
     "react": "19.2.3",
     "react-dom": "19.2.3",
     "react-hook-form": "^7.71.1",
-    "react-toastify": "^11.0.3"
+    "react-toastify": "^11.0.3",
+    "tailwind-merge": "^3.5.0"
   },
   "devDependencies": {
     "@tailwindcss/postcss": "^4",

package/templates/web/.env.example

@@ -18,4 +18,8 @@ CLOUDINARY_API_KEY=your_cloudinary_api_key_here
 CLOUDINARY_API_SECRET=your_cloudinary_api_secret_here
 CLOUDINARY_ID=your_cloud_name_here
 NEXT_PUBLIC_CLOUDINARY_CLOUD_NAME=your_cloud_name_here
-CLOUDINARY_URL=cloudinary://your_api_key:your_api_secret@your_cloud_name
+CLOUDINARY_URL=cloudinary://your_api_key:your_api_secret@your_cloud_name
+
+# Site Configuration
+NEXT_PUBLIC_SITE_URL=http://localhost:3000
+NEXT_PUBLIC_GA_ID=your_google_analytics_id_here

package/templates/web/package-lock.json

@@ -15,7 +15,6 @@
         "@supabase/supabase-js": "^2.94.1",
         "@vercel/analytics": "^1.6.1",
         "cloudinary": "^2.9.0",
-        "dotenv": "^17.2.4",
         "framer-motion": "^12.23.26",
         "lucide-react": "^0.562.0",
         "next": "^16.1.6",
@@ -26,9 +25,6 @@
         "react-icons": "^5.5.0",
         "react-redux": "^9.2.0",
         "react-toastify": "^11.0.5",
-        "redux": "^5.0.1",
-        "redux-logger": "^3.0.6",
-        "redux-thunk": "^3.1.0",
         "resend": "^6.6.0",
         "zod": "^4.3.5"
       },
@@ -2814,13 +2810,6 @@
         }
       }
     },
-    "node_modules/deep-diff": {
-      "version": "0.3.8",
-      "resolved": "https://registry.npmjs.org/deep-diff/-/deep-diff-0.3.8.tgz",
-      "integrity": "sha512-yVn6RZmHiGnxRKR9sJb3iVV2XTF1Ghh2DiWRZ3dMnGc43yUdWWF/kX6lQyk3+P84iprfWKU/8zFTrlkvtFm1ug==",
-      "deprecated": "Package no longer supported. Contact Support at https://www.npmjs.com/support for more info.",
-      "license": "MIT"
-    },
     "node_modules/deep-is": {
       "version": "0.1.4",
       "resolved": "https://registry.npmjs.org/deep-is/-/deep-is-0.1.4.tgz",
@@ -2887,18 +2876,6 @@
         "node": ">=0.10.0"
       }
     },
-    "node_modules/dotenv": {
-      "version": "17.2.4",
-      "resolved": "https://registry.npmjs.org/dotenv/-/dotenv-17.2.4.tgz",
-      "integrity": "sha512-mudtfb4zRB4bVvdj0xRo+e6duH1csJRM8IukBqfTRvHotn9+LBXB8ynAidP9zHqoRC/fsllXgk4kCKlR21fIhw==",
-      "license": "BSD-2-Clause",
-      "engines": {
-        "node": ">=12"
-      },
-      "funding": {
-        "url": "https://dotenvx.com"
-      }
-    },
     "node_modules/dunder-proto": {
       "version": "1.0.1",
       "resolved": "https://registry.npmjs.org/dunder-proto/-/dunder-proto-1.0.1.tgz",
@@ -5622,15 +5599,6 @@
       "integrity": "sha512-M9/ELqF6fy8FwmkpnF0S3YKOqMyoWJ4+CS5Efg2ct3oY9daQvd/Pc71FpGZsVsbl3Cpb+IIcjBDUnnyBdQbq4w==",
       "license": "MIT"
     },
-    "node_modules/redux-logger": {
-      "version": "3.0.6",
-      "resolved": "https://registry.npmjs.org/redux-logger/-/redux-logger-3.0.6.tgz",
-      "integrity": "sha512-JoCIok7bg/XpqA1JqCqXFypuqBbQzGQySrhFzewB7ThcnysTO30l4VCst86AuB9T9tuT03MAA56Jw2PNhRSNCg==",
-      "license": "MIT",
-      "dependencies": {
-        "deep-diff": "^0.3.5"
-      }
-    },
     "node_modules/redux-thunk": {
       "version": "3.1.0",
       "resolved": "https://registry.npmjs.org/redux-thunk/-/redux-thunk-3.1.0.tgz",

package/templates/web/package.json

@@ -12,6 +12,7 @@
   "dependencies": {
     "@hookform/resolvers": "^5.2.2",
     "@next/third-parties": "^16.1.1",
+    "@reduxjs/toolkit": "^2.11.2",
     "@supabase/ssr": "^0.8.0",
     "@supabase/supabase-js": "^2.94.1",
     "@vercel/analytics": "^1.6.1",
@@ -24,6 +25,7 @@
     "react-dom": "^19.2.4",
     "react-hook-form": "^7.70.0",
     "react-icons": "^5.5.0",
+    "react-redux": "^9.2.0",
     "react-toastify": "^11.0.5",
     "resend": "^6.6.0",
     "zod": "^4.3.5"

package/templates/web/postcss.config.mjs

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

package/templates/web/src/app/api/revalidate/route.ts

@@ -1,95 +1,54 @@
 import { NextRequest, NextResponse } from 'next/server';
 import { revalidateTag, revalidatePath } from 'next/cache';
-import { categoryService } from '@/lib/services/categoryService';
-import { productService } from '@/lib/services/productService';
-import { clientService } from '@/lib/services/clientService';
-import { projectService } from '@/lib/services/projectService';
 
-/**
- * On-demand Revalidation API
- * 
- * Usage:
- * POST /api/revalidate
- * Body: { secret: "your-secret", tag?: "categories|products|clients|projects", path?: "/some-path" }
- * 
- * Example:
- * curl -X POST http://localhost:3000/api/revalidate \
- *   -H "Content-Type: application/json" \
- *   -d '{"secret":"your-secret","tag":"products"}'
- */
 export async function POST(request: NextRequest) {
-  try {
-    const body = await request.json();
-    const { secret, tag, path } = body;
-
-    // Verify secret
-    if (!secret || secret !== process.env.REVALIDATION_SECRET) {
-      return NextResponse.json(
-        { error: 'Invalid or missing secret' },
-        { status: 401 }
-      );
-    }
-
-    const revalidated: string[] = [];
-
-    // Revalidate by tag
-    if (tag) {
-      revalidateTag(tag, 'max');
-      revalidated.push(`tag:${tag}`);
-
-      // Also invalidate memory cache for the corresponding service
-      switch (tag) {
-        case 'categories':
-          categoryService.invalidateCache();
-          break;
-        case 'products':
-          productService.invalidateCache();
-          break;
-        case 'clients':
-          clientService.invalidateCache();
-          break;
-        case 'projects':
-          projectService.invalidateCache();
-          break;
-        default:
-          console.warn(`[Revalidation] Unknown tag: ${tag}`);
-      }
-    }
-
-    // Revalidate by path
-    if (path) {
-      revalidatePath(path);
-      revalidated.push(`path:${path}`);
+    try {
+        const body = await request.json();
+        const { secret, tag, path } = body;
+
+        if (!secret || secret !== process.env.REVALIDATION_SECRET) {
+            return NextResponse.json(
+                { error: 'Invalid or missing secret' },
+                { status: 401 }
+            );
+        }
+
+        const revalidated: string[] = [];
+
+        if (tag) {
+            revalidateTag(tag, 'everything');
+            revalidated.push(`tag:${tag}`);
+        }
+
+        if (path) {
+            revalidatePath(path);
+            revalidated.push(`path:${path}`);
+        }
+
+        if (revalidated.length === 0) {
+            return NextResponse.json(
+                { error: 'No tag or path specified' },
+                { status: 400 }
+            );
+        }
+
+        return NextResponse.json({
+            revalidated: true,
+            items: revalidated,
+            timestamp: new Date().toISOString(),
+        });
+    } catch (error) {
+        console.error('[Revalidation] Error:', error);
+        return NextResponse.json(
+            { error: 'Error revalidating', message: (error as Error).message },
+            { status: 500 }
+        );
     }
-
-    if (revalidated.length === 0) {
-      return NextResponse.json(
-        { error: 'No tag or path specified' },
-        { status: 400 }
-      );
-    }
-
-    return NextResponse.json({
-      revalidated: true,
-      items: revalidated,
-      timestamp: new Date().toISOString(),
-    });
-  } catch (error) {
-    console.error('[Revalidation] Error:', error);
-    return NextResponse.json(
-      {
-        error: 'Error revalidating',
-        message: (error as Error).message,
-      },
-      { status: 500 }
-    );
-  }
 }
 
-// Optional: GET endpoint to check if the API is working
 export async function GET() {
-  return NextResponse.json({
-    message: 'Revalidation API is running',
-    usage: 'POST with { secret, tag?, path? }',
-  });
-}
+    return NextResponse.json({
+        message: 'Revalidation API is running',
+        usage: 'POST with { secret, tag?, path? }',
+    });
+}

package/templates/web/src/app/globals.css

@@ -50,19 +50,7 @@
   --radius-3xl: calc(var(--radius) + 12px);
   --radius-4xl: calc(var(--radius) + 16px);
 
-  /* Z-Index Hierarchy */
-  --z-base: 1;
-  --z-dropdown: 1000;
-  --z-sticky: 1020;
-  --z-fixed: 1030;
-  --z-modal-backdrop: 1040;
-  --z-modal: 1050;
-  --z-popover: 1060;
-  --z-tooltip: 1070;
-  --z-lightbox: 9999;
-  --z-lightbox-controls: 10000;
-
-  /* Z-Index Utilities */
+  /* Z-Index Scale */
   --z-base: 1;
   --z-dropdown: 1000;
   --z-sticky: 1020;