create-nextjs-stack 0.1.0

package/templates/admin/config/resources.ts

@@ -0,0 +1,123 @@
+export interface ResourceConfig {
+  name: string;
+  singular: string;
+  plural: string;
+  icon: string;
+  path: string;
+  table: string;
+  fields: ResourceField[];
+}
+
+export interface ResourceField {
+  name: string;
+  type:
+    | "text"
+    | "textarea"
+    | "number"
+    | "boolean"
+    | "select"
+    | "image"
+    | "date";
+  label: string;
+  required?: boolean;
+  options?: { value: string; label: string }[];
+  relation?: {
+    table: string;
+    display: string;
+  };
+}
+
+export const resources: ResourceConfig[] = [
+  {
+    name: "categories",
+    singular: "Category",
+    plural: "Categories",
+    icon: "Layers",
+    path: "/categories",
+    table: "categories",
+    fields: [
+      { name: "title", type: "text", label: "Title", required: true },
+      { name: "slug", type: "text", label: "Slug", required: true },
+      { name: "description", type: "textarea", label: "Description" },
+      { name: "featured", type: "boolean", label: "Featured" },
+      { name: "published", type: "boolean", label: "Published" },
+    ],
+  },
+  {
+    name: "clients",
+    singular: "Client",
+    plural: "Clients",
+    icon: "Users",
+    path: "/clients",
+    table: "clients",
+    fields: [
+      { name: "name", type: "text", label: "Name", required: true },
+      { name: "logo_url", type: "image", label: "Logo" },
+      { name: "website", type: "text", label: "Website" },
+    ],
+  },
+  {
+    name: "products",
+    singular: "Product",
+    plural: "Products",
+    icon: "Package",
+    path: "/products",
+    table: "products",
+    fields: [
+      { name: "title", type: "text", label: "Title", required: true },
+      { name: "slug", type: "text", label: "Slug", required: true },
+      { name: "description", type: "textarea", label: "Description" },
+      { name: "featured_image_url", type: "image", label: "Featured Image" },
+      {
+        name: "category_id",
+        type: "select",
+        label: "Category",
+        relation: { table: "categories", display: "title" },
+      },
+      { name: "featured", type: "boolean", label: "Featured" },
+      { name: "published", type: "boolean", label: "Published" },
+    ],
+  },
+  {
+    name: "projects",
+    singular: "Project",
+    plural: "Projects",
+    icon: "Briefcase",
+    path: "/projects",
+    table: "projects",
+    fields: [
+      { name: "title", type: "text", label: "Title", required: true },
+      { name: "slug", type: "text", label: "Slug", required: true },
+      { name: "description", type: "textarea", label: "Description" },
+      {
+        name: "client_id",
+        type: "select",
+        label: "Client",
+        relation: { table: "clients", display: "name" },
+      },
+      { name: "featured_image_url", type: "image", label: "Featured Image" },
+      { name: "published", type: "boolean", label: "Published" },
+    ],
+  },
+  {
+    name: "users",
+    singular: "User",
+    plural: "Users",
+    icon: "Settings",
+    path: "/users",
+    table: "users",
+    fields: [
+      { name: "email", type: "text", label: "Email", required: true },
+      { name: "full_name", type: "text", label: "Full Name" },
+      {
+        name: "role",
+        type: "select",
+        label: "Role",
+        options: [
+          { value: "admin", label: "Admin" },
+          { value: "editor", label: "Editor" },
+        ],
+      },
+    ],
+  },
+];

package/templates/admin/eslint.config.mjs

@@ -0,0 +1,18 @@
+import { defineConfig, globalIgnores } from "eslint/config";
+import nextVitals from "eslint-config-next/core-web-vitals";
+import nextTs from "eslint-config-next/typescript";
+
+const eslintConfig = defineConfig([
+  ...nextVitals,
+  ...nextTs,
+  // Override default ignores of eslint-config-next.
+  globalIgnores([
+    // Default ignores of eslint-config-next:
+    ".next/**",
+    "out/**",
+    "build/**",
+    "next-env.d.ts",
+  ]),
+]);
+
+export default eslintConfig;

package/templates/admin/hooks/useResource.ts

@@ -0,0 +1,86 @@
+"use client";
+
+import { useState } from "react";
+import { useRouter } from "next/navigation";
+import { toast } from "react-toastify";
+import { createResource, updateResource, deleteResource } from "@/app/actions/resources";
+import { ResourceConfig } from "@/config/resources";
+
+export function useResource(config: ResourceConfig) {
+  const router = useRouter();
+  const [isSubmitting, setIsSubmitting] = useState(false);
+  const [isDeleting, setIsDeleting] = useState(false);
+
+  // eslint-disable-next-line @typescript-eslint/no-explicit-any
+  const create = async (data: any) => {
+    setIsSubmitting(true);
+    try {
+      const result = await createResource(config.table, data);
+      if (result.error) {
+        toast.error(result.error);
+        return false;
+      }
+      toast.success(`${config.singular} created successfully`);
+      router.push(`/${config.name}`);
+      router.refresh();
+      return true;
+    } catch (error) {
+      console.error(error);
+      toast.error("Something went wrong");
+      return false;
+    } finally {
+      setIsSubmitting(false);
+    }
+  };
+
+  // eslint-disable-next-line @typescript-eslint/no-explicit-any
+  const update = async (id: string, data: any) => {
+    setIsSubmitting(true);
+    try {
+      const result = await updateResource(config.table, id, data);
+      if (result.error) {
+        toast.error(result.error);
+        return false;
+      }
+      toast.success(`${config.singular} updated successfully`);
+      router.push(`/${config.name}`);
+      router.refresh();
+      return true;
+    } catch (error) {
+      console.error(error);
+      toast.error("Something went wrong");
+      return false;
+    } finally {
+      setIsSubmitting(false);
+    }
+  };
+
+  const remove = async (id: string) => {    
+    setIsDeleting(true);
+    try {
+      const result = await deleteResource(config.table, id);
+      if (result.error) {
+        toast.error(result.error);
+        return false;
+      }
+      toast.success("Record deleted");
+      router.push(`/${config.name}`);
+      router.refresh();
+      return true;
+    } catch (error) {
+      console.error(error);
+      toast.error("Failed to delete");
+      return false;
+    } finally {
+      setIsDeleting(false);
+    }
+  };
+
+  return {
+    create,
+    update,
+    remove,
+    isSubmitting,
+    isDeleting
+  };
+}

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

@@ -0,0 +1,106 @@
+import { SupabaseClient } from "@supabase/supabase-js";
+import { getServerClient } from "@/lib/supabase/server";
+
+export class BaseService<T = any> {
+  protected table: string;
+
+  constructor(table: string) {
+    this.table = table;
+  }
+
+  protected async getClient(): Promise<SupabaseClient> {
+    return getServerClient();
+  }
+
+  async getAll() {
+    const supabase = await this.getClient();
+    const { data, error } = await supabase
+      .from(this.table)
+      .select("*")
+      .order("created_at", { ascending: false });
+
+    if (error) {
+      console.error(`Error fetching ${this.table}:`, error);
+      throw error;
+    }
+
+    return data as T[];
+  }
+
+  async getById(id: string) {
+    const supabase = await this.getClient();
+    const { data, error } = await supabase
+      .from(this.table)
+      .select("*")
+      .eq("id", id)
+      .single();
+
+    if (error) {
+      console.error(`Error fetching ${this.table} ${id}:`, error);
+      throw error;
+    }
+
+    return data as T;
+  }
+
+  async create(payload: Partial<T>) {
+    const supabase = await this.getClient();
+    const { data, error } = await supabase
+      .from(this.table)
+      .insert(payload)
+      .select()
+      .single();
+
+    if (error) {
+      console.error(`Error creating ${this.table}:`, error);
+      throw error;
+    }
+
+    return data as T;
+  }
+
+  async update(id: string, payload: Partial<T>) {
+    const supabase = await this.getClient();
+    const { data, error } = await supabase
+      .from(this.table)
+      .update(payload)
+      .eq("id", id)
+      .select()
+      .single();
+
+    if (error) {
+      console.error(`Error updating ${this.table} ${id}:`, error);
+      throw error;
+    }
+
+    return data as T;
+  }
+
+  async delete(id: string) {
+    const supabase = await this.getClient();
+    const { error } = await supabase.from(this.table).delete().eq("id", id);
+
+    if (error) {
+      console.error(`Error deleting ${this.table} ${id}:`, error);
+      throw error;
+    }
+
+    return true;
+  }
+
+  // eslint-disable-next-line @typescript-eslint/no-explicit-any
+  async getOptions(displayField: string): Promise<any[]> {
+    const supabase = await this.getClient();
+    const { data, error } = await supabase
+      .from(this.table)
+      .select(`id, ${displayField}`)
+      .order(displayField);
+
+    if (error) {
+      console.error(`Error fetching options for ${this.table}:`, error);
+      return [];
+    }
+
+    return data || [];
+  }
+}

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

@@ -0,0 +1,7 @@
+import { BaseService } from "./base.service";
+
+export class CategoryService extends BaseService {
+  constructor() {
+    super("categories");
+  }
+}

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

@@ -0,0 +1,7 @@
+import { BaseService } from "./base.service";
+
+export class ClientService extends BaseService {
+  constructor() {
+    super("clients");
+  }
+}

package/templates/admin/lib/services/index.ts

@@ -0,0 +1,27 @@
+import { BaseService } from "./base.service";
+import { ProductService } from "./products.service";
+import { UserService } from "./users.service";
+import { ClientService } from "./clients.service";
+import { ProjectService } from "./projects.service";
+import { CategoryService } from "./categories.service";
+
+// Registry mapping resource names to Service instances
+const services: Record<string, BaseService> = {
+  products: new ProductService(),
+  users: new UserService(),
+  clients: new ClientService(),
+  projects: new ProjectService(),
+  categories: new CategoryService(),
+};
+
+export const getService = (resourceName: string): BaseService => {
+  const service = services[resourceName];
+  if (!service) {
+    // Fallback or throw error. For template flexibility, we can return a generic BaseService
+    // or strictly throw if the resource isn't configured.
+    // For now, let's return a generic BaseService to support new tables added to config/resources.ts
+    // without needing a dedicated file immediately.
+    return new BaseService(resourceName);
+  }
+  return service;
+};

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

@@ -0,0 +1,9 @@
+import { BaseService } from "./base.service";
+
+export class ProductService extends BaseService {
+  constructor() {
+    super("products");
+  }
+
+  // Add custom methods here, e.g. getBySlug(slug: string)
+}

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

@@ -0,0 +1,22 @@
+import { BaseService } from "./base.service";
+
+export class ProjectService extends BaseService {
+  constructor() {
+    super("projects");
+  }
+
+  async getAll() {
+    const supabase = await this.getClient();
+    const { data, error } = await supabase
+      .from(this.table)
+      .select("*, clients(name)")
+      .order("created_at", { ascending: false });
+
+    if (error) {
+      console.error(`Error fetching ${this.table}:`, error);
+      throw error;
+    }
+
+    return data;
+  }
+}

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

@@ -0,0 +1,26 @@
+import { BaseService } from './base.service';
+import { getServerClient } from "@/lib/supabase/server";
+
+export class ResourceService extends BaseService {
+  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
+      .from(table)
+      .select(`id, ${displayField}`)
+      .order(displayField);
+
+    if (error) throw error;
+    return data;
+  }
+}
+
+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.

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

@@ -0,0 +1,9 @@
+import { BaseService } from "./base.service";
+
+export class UserService extends BaseService {
+  constructor() {
+    super("users");
+  }
+
+  // Future: override create() to handle Auth user creation if using Admin API
+}

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

@@ -0,0 +1,9 @@
+import { createBrowserClient } from "@supabase/ssr";
+
+export function getBrowserClient() {
+  return createBrowserClient(
+    process.env.NEXT_PUBLIC_SUPABASE_URL!,
+    process.env.NEXT_PUBLIC_SUPABASE_ANON_KEY!,
+  );
+}
+

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

@@ -0,0 +1,57 @@
+import { createServerClient } from '@supabase/ssr'
+import { NextResponse, type NextRequest } from 'next/server'
+
+export async function updateSession(request: NextRequest) {
+  let supabaseResponse = NextResponse.next({
+    request,
+  })
+
+  const supabase = createServerClient(
+    process.env.NEXT_PUBLIC_SUPABASE_URL!,
+    process.env.NEXT_PUBLIC_SUPABASE_ANON_KEY!,
+    {
+      cookies: {
+        getAll() {
+          return request.cookies.getAll()
+        },
+        setAll(cookiesToSet) {
+          cookiesToSet.forEach(({ name, value, options }) => request.cookies.set(name, value))
+          supabaseResponse = NextResponse.next({
+            request,
+          })
+          cookiesToSet.forEach(({ name, value, options }) =>
+            supabaseResponse.cookies.set(name, value, options)
+          )
+        },
+      },
+    }
+  )
+
+  // IMPORTANT: Avoid writing any logic between createServerClient and
+  // supabase.auth.getUser(). A simple mistake could make it very hard to debug
+  // issues with users being randomly logged out.
+
+  const {
+    data: { user },
+  } = await supabase.auth.getUser()
+
+  if (
+    !user &&
+    !request.nextUrl.pathname.startsWith('/login') &&
+    !request.nextUrl.pathname.startsWith('/auth')
+  ) {
+    // no user, potentially respond by redirecting the user to the login page
+    const url = request.nextUrl.clone()
+    url.pathname = '/login'
+    return NextResponse.redirect(url)
+  }
+
+  // Redirect to dashboard if authenticated and on login page
+  if (user && request.nextUrl.pathname === '/login') {
+    const url = request.nextUrl.clone()
+    url.pathname = '/dashboard'
+    return NextResponse.redirect(url)
+  }
+
+  return supabaseResponse
+}

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

@@ -0,0 +1,29 @@
+import { createServerClient } from "@supabase/ssr";
+import { cookies } from "next/headers";
+
+export async function getServerClient() {
+  const cookieStore = await cookies();
+
+  return createServerClient(
+    process.env.NEXT_PUBLIC_SUPABASE_URL!,
+    process.env.NEXT_PUBLIC_SUPABASE_ANON_KEY!,
+    {
+      cookies: {
+        getAll() {
+          return cookieStore.getAll();
+        },
+        setAll(cookiesToSet) {
+          try {
+            cookiesToSet.forEach(({ name, value, options }) =>
+              cookieStore.set(name, value, options)
+            );
+          } catch {
+            // The `setAll` method was called from a Server Component.
+            // This can be ignored if you have middleware refreshing
+            // user sessions.
+          }
+        },
+      },
+    },
+  );
+}

package/templates/admin/middleware.ts

@@ -0,0 +1,15 @@
+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);
+}
+
+export const config = {
+  matcher: [
+    "/((?!_next/static|_next/image|favicon.ico|.*\\.(?:svg|png|jpg|jpeg|gif|webp)$).*)",
+  ],
+};

package/templates/admin/next.config.ts

@@ -0,0 +1,10 @@
+import type { NextConfig } from "next";
+
+const nextConfig: NextConfig = {
+  /* config options here */
+  images: {
+    domains: ["res.cloudinary.com","picsum.photos"],
+  },
+};
+
+export default nextConfig;