npm - create-nextjs-stack - Versions diffs - 0.1.0 - Mend

create-nextjs-stack 0.1.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (123) hide show

package/LICENSE +21 -0
package/README.md +60 -0
package/bin/cli.js +187 -0
package/package.json +48 -0
package/templates/admin/.env.example +11 -0
package/templates/admin/README.md +82 -0
package/templates/admin/app/(auth)/login/page.tsx +84 -0
package/templates/admin/app/(dashboard)/[resource]/[id]/page.tsx +45 -0
package/templates/admin/app/(dashboard)/[resource]/new/page.tsx +32 -0
package/templates/admin/app/(dashboard)/[resource]/page.tsx +131 -0
package/templates/admin/app/(dashboard)/categories/[id]/page.tsx +22 -0
package/templates/admin/app/(dashboard)/categories/new/page.tsx +5 -0
package/templates/admin/app/(dashboard)/categories/page.tsx +33 -0
package/templates/admin/app/(dashboard)/clients/[id]/page.tsx +22 -0
package/templates/admin/app/(dashboard)/clients/new/page.tsx +5 -0
package/templates/admin/app/(dashboard)/clients/page.tsx +33 -0
package/templates/admin/app/(dashboard)/dashboard/page.tsx +45 -0
package/templates/admin/app/(dashboard)/layout.tsx +13 -0
package/templates/admin/app/(dashboard)/products/[id]/page.tsx +22 -0
package/templates/admin/app/(dashboard)/products/new/page.tsx +5 -0
package/templates/admin/app/(dashboard)/products/page.tsx +33 -0
package/templates/admin/app/(dashboard)/projects/[id]/page.tsx +22 -0
package/templates/admin/app/(dashboard)/projects/new/page.tsx +5 -0
package/templates/admin/app/(dashboard)/projects/page.tsx +33 -0
package/templates/admin/app/(dashboard)/users/[id]/page.tsx +22 -0
package/templates/admin/app/(dashboard)/users/new/page.tsx +5 -0
package/templates/admin/app/(dashboard)/users/page.tsx +33 -0
package/templates/admin/app/actions/resources.ts +46 -0
package/templates/admin/app/actions/upload.ts +58 -0
package/templates/admin/app/favicon.ico +0 -0
package/templates/admin/app/globals.css +23 -0
package/templates/admin/app/layout.tsx +23 -0
package/templates/admin/app/page.tsx +5 -0
package/templates/admin/components/admin/AdminLayoutClient.tsx +22 -0
package/templates/admin/components/admin/DeleteModal.tsx +90 -0
package/templates/admin/components/admin/FormLayout.tsx +113 -0
package/templates/admin/components/admin/ImageUpload.tsx +137 -0
package/templates/admin/components/admin/ResourceFormClient.tsx +62 -0
package/templates/admin/components/admin/Sidebar.tsx +74 -0
package/templates/admin/components/admin/SubmitButton.tsx +34 -0
package/templates/admin/components/admin/ToastProvider.tsx +8 -0
package/templates/admin/components/categories/CategoryForm.tsx +24 -0
package/templates/admin/components/categories/CategoryList.tsx +113 -0
package/templates/admin/components/clients/ClientForm.tsx +24 -0
package/templates/admin/components/clients/ClientList.tsx +113 -0
package/templates/admin/components/products/ProductForm.tsx +24 -0
package/templates/admin/components/products/ProductList.tsx +117 -0
package/templates/admin/components/projects/ProjectForm.tsx +24 -0
package/templates/admin/components/projects/ProjectList.tsx +121 -0
package/templates/admin/components/users/UserForm.tsx +39 -0
package/templates/admin/components/users/UserList.tsx +101 -0
package/templates/admin/config/resources.ts +123 -0
package/templates/admin/eslint.config.mjs +18 -0
package/templates/admin/hooks/useResource.ts +86 -0
package/templates/admin/lib/services/base.service.ts +106 -0
package/templates/admin/lib/services/categories.service.ts +7 -0
package/templates/admin/lib/services/clients.service.ts +7 -0
package/templates/admin/lib/services/index.ts +27 -0
package/templates/admin/lib/services/products.service.ts +9 -0
package/templates/admin/lib/services/projects.service.ts +22 -0
package/templates/admin/lib/services/resource.service.ts +26 -0
package/templates/admin/lib/services/users.service.ts +9 -0
package/templates/admin/lib/supabase/client.ts +9 -0
package/templates/admin/lib/supabase/middleware.ts +57 -0
package/templates/admin/lib/supabase/server.ts +29 -0
package/templates/admin/middleware.ts +15 -0
package/templates/admin/next.config.ts +10 -0
package/templates/admin/package-lock.json +6768 -0
package/templates/admin/package.json +33 -0
package/templates/admin/postcss.config.mjs +7 -0
package/templates/admin/public/file.svg +1 -0
package/templates/admin/public/globe.svg +1 -0
package/templates/admin/public/next.svg +1 -0
package/templates/admin/public/vercel.svg +1 -0
package/templates/admin/public/window.svg +1 -0
package/templates/admin/supabase_mock_data.sql +57 -0
package/templates/admin/supabase_schema.sql +93 -0
package/templates/admin/tsconfig.json +34 -0
package/templates/web/.env.example +21 -0
package/templates/web/README.md +129 -0
package/templates/web/components.json +22 -0
package/templates/web/eslint.config.mjs +25 -0
package/templates/web/next.config.ts +25 -0
package/templates/web/package-lock.json +6778 -0
package/templates/web/package.json +45 -0
package/templates/web/postcss.config.mjs +5 -0
package/templates/web/src/app/api/contact/route.ts +181 -0
package/templates/web/src/app/api/revalidate/route.ts +95 -0
package/templates/web/src/app/error.tsx +28 -0
package/templates/web/src/app/globals.css +838 -0
package/templates/web/src/app/layout.tsx +126 -0
package/templates/web/src/app/loading.tsx +60 -0
package/templates/web/src/app/not-found.tsx +68 -0
package/templates/web/src/app/page.tsx +106 -0
package/templates/web/src/app/robots.ts +12 -0
package/templates/web/src/app/sitemap.ts +66 -0
package/templates/web/src/components/home/StatsGrid.tsx +89 -0
package/templates/web/src/hooks/useIntersectionObserver.ts +39 -0
package/templates/web/src/lib/providers/StoreProvider.tsx +12 -0
package/templates/web/src/lib/seo/index.ts +4 -0
package/templates/web/src/lib/seo/metadata.ts +103 -0
package/templates/web/src/lib/seo/seo.config.ts +161 -0
package/templates/web/src/lib/seo/seo.types.ts +76 -0
package/templates/web/src/lib/services/categories.service.ts +38 -0
package/templates/web/src/lib/services/categoryService.ts +251 -0
package/templates/web/src/lib/services/clientService.ts +132 -0
package/templates/web/src/lib/services/clients.service.ts +20 -0
package/templates/web/src/lib/services/productService.ts +261 -0
package/templates/web/src/lib/services/products.service.ts +38 -0
package/templates/web/src/lib/services/projectService.ts +234 -0
package/templates/web/src/lib/services/projects.service.ts +38 -0
package/templates/web/src/lib/services/users.service.ts +20 -0
package/templates/web/src/lib/supabase/client.ts +42 -0
package/templates/web/src/lib/supabase/constants.ts +25 -0
package/templates/web/src/lib/supabase/server.ts +29 -0
package/templates/web/src/lib/supabase/types.ts +112 -0
package/templates/web/src/lib/utils/cache.ts +98 -0
package/templates/web/src/lib/utils/rate-limiter.ts +102 -0
package/templates/web/src/store/actions/index.ts +2 -0
package/templates/web/src/store/index.ts +13 -0
package/templates/web/src/store/reducers/index.ts +13 -0
package/templates/web/src/store/types/index.ts +2 -0
package/templates/web/tsconfig.json +41 -0

package/templates/web/src/app/layout.tsx ADDED Viewed

@@ -0,0 +1,126 @@
+import type { Metadata, Viewport } from "next";
+import {
+  Geist,
+  Geist_Mono,
+  Inter,
+  Outfit,
+  Raleway,
+  Roboto,
+  Jersey_10,
+} from "next/font/google";
+import "@/app/globals.css";
+import StoreProvider from "@/lib/providers/StoreProvider";
+import { GoogleAnalytics } from "@next/third-parties/google";
+const geistSans = Geist({
+  variable: "--font-geist-sans",
+  subsets: ["latin"],
+});
+const geistMono = Geist_Mono({
+  variable: "--font-geist-mono",
+  subsets: ["latin"],
+});
+const inter = Inter({
+  variable: "--font-inter",
+  subsets: ["latin"],
+  display: "swap",
+});
+const roboto = Roboto({
+  variable: "--font-roboto",
+  subsets: ["latin"],
+  weight: ["100", "300", "400", "500", "700", "900"],
+  display: "swap",
+});
+const outfit = Outfit({
+  variable: "--font-outfit",
+  subsets: ["latin"],
+  display: "swap",
+});
+const raleway = Raleway({
+  variable: "--font-raleway",
+  subsets: ["latin"],
+  display: "swap",
+});
+const jersey10 = Jersey_10({
+  variable: "--font-jersey-10",
+  subsets: ["latin"],
+  weight: "400",
+  display: "swap",
+});
+export const viewport: Viewport = {
+  themeColor: [
+    { media: "(prefers-color-scheme: light)", color: "#ffffff" },
+    { media: "(prefers-color-scheme: dark)", color: "#000000" },
+  ],
+  width: "device-width",
+  initialScale: 1,
+  maximumScale: 1,
+};
+export const metadata: Metadata = {
+  metadataBase: new URL("https://create-nextjs-stack.vercel.app"),
+  title: {
+    default: "Next.js Enterprise Starter",
+    template: "%s | Next.js Enterprise Starter",
+  },
+  description: "A production-ready Next.js starter template with Supabase, Tailwind CSS, and more.",
+  manifest: "/manifest.json",
+  appleWebApp: {
+    capable: true,
+    statusBarStyle: "default",
+    title: "Next.js Starter",
+  },
+  icons: {
+    icon: [
+      { url: "/favicon.png", sizes: "32x32" },
+      { url: "/favicon.png", sizes: "16x16" },
+    ],
+    apple: {
+      url: "/favicon.png",
+      sizes: "180x180",
+    },
+    shortcut: "/favicon.png",
+  },
+  alternates: {
+    canonical: "https://create-nextjs-stack.vercel.app",
+  },
+  openGraph: {
+    locale: "en_US",
+    type: "website",
+    siteName: "Next.js Enterprise Starter",
+    images: [
+      {
+        url: "/logo.png",
+        width: 1200,
+        height: 630,
+        alt: "Next.js Enterprise Starter",
+      },
+    ],
+  },
+};
+export default function RootLayout({
+  children,
+}: {
+  children: React.ReactNode;
+}) {
+  return (
+    <html lang="en">
+      <body
+        className={`${geistSans.variable} ${geistMono.variable} ${inter.variable} ${outfit.variable} ${roboto.variable} ${raleway.variable} ${jersey10.variable} antialiased`}
+      >
+        <StoreProvider>
+          {children}
+          <GoogleAnalytics gaId="G-XYZ1234567" />
+        </StoreProvider>
+      </body>
+    </html>
+  );
+}

package/templates/web/src/app/loading.tsx ADDED Viewed

@@ -0,0 +1,60 @@
+"use client";
+import { motion } from "framer-motion";
+export default function Loading() {
+    return (
+        <div className="flex flex-col items-center justify-center min-h-screen bg-black overflow-hidden relative">
+            {/* Background Grid Effect */}
+            <div className="absolute inset-0 bg-[linear-gradient(rgba(255,255,255,0.02)_1px,transparent_1px),linear-gradient(90deg,rgba(255,255,255,0.02)_1px,transparent_1px)] bg-[size:40px_40px] [mask-image:radial-gradient(ellipse_60%_60%_at_50%_50%,black,transparent)]" />
+            <motion.div
+                className="relative z-10 flex flex-col items-center gap-8"
+                initial={{ opacity: 0 }}
+                animate={{ opacity: 1 }}
+                transition={{ duration: 0.5 }}
+            >
+                {/* Tech Spinner */}
+                <div className="relative w-24 h-24">
+                    <motion.div
+                        className="absolute inset-0 border-4 border-red-600/30 rounded-full"
+                        animate={{ scale: [1, 1.1, 1], opacity: [0.3, 0.6, 0.3] }}
+                        transition={{ duration: 2, repeat: Infinity, ease: "easeInOut" }}
+                    />
+                    <motion.div
+                        className="absolute inset-0 border-4 border-t-red-600 border-r-transparent border-b-transparent border-l-transparent rounded-full"
+                        animate={{ rotate: 360 }}
+                        transition={{ duration: 1, repeat: Infinity, ease: "linear" }}
+                    />
+                    <div className="absolute inset-4 border-2 border-white/10 rounded-full" />
+                    <motion.div
+                        className="absolute inset-[30%] bg-red-600 rounded-full"
+                        animate={{ scale: [0.8, 1.2, 0.8], opacity: [0.8, 1, 0.8] }}
+                        transition={{ duration: 1.5, repeat: Infinity }}
+                    />
+                </div>
+                {/* Text */}
+                <div className="flex flex-col items-center gap-2">
+                    <motion.span
+                        className="font-jersey-10 text-2xl text-white tracking-[0.2em]"
+                        animate={{ opacity: [1, 0.5, 1] }}
+                        transition={{ duration: 1.5, repeat: Infinity }}
+                    >
+                        LOADING
+                    </motion.span>
+                    <div className="flex gap-1 h-1">
+                        {[...Array(3)].map((_, i) => (
+                            <motion.div
+                                key={i}
+                                className="w-8 h-full bg-red-600/50"
+                                animate={{ scaleX: [0, 1, 0], opacity: [0, 1, 0] }}
+                                transition={{ duration: 1, delay: i * 0.2, repeat: Infinity }}
+                            />
+                        ))}
+                    </div>
+                </div>
+            </motion.div>
+        </div>
+    );
+}

package/templates/web/src/app/not-found.tsx ADDED Viewed

@@ -0,0 +1,68 @@
+"use client";
+import Link from 'next/link';
+import { motion } from 'framer-motion';
+export default function NotFound() {
+    return (
+        <div className="flex flex-col items-center justify-center min-h-screen text-center px-4 bg-black text-white relative overflow-hidden">
+            {/* Background Grid Effect */}
+            <div className="absolute inset-0 bg-[linear-gradient(rgba(255,255,255,0.02)_1px,transparent_1px),linear-gradient(90deg,rgba(255,255,255,0.02)_1px,transparent_1px)] bg-[size:40px_40px] [mask-image:radial-gradient(ellipse_60%_60%_at_50%_50%,black,transparent)] pointer-events-none" />
+            <div className="relative z-10">
+                <motion.div
+                    initial={{ opacity: 0, scale: 0.8 }}
+                    animate={{ opacity: 1, scale: 1 }}
+                    transition={{ duration: 0.5 }}
+                    className="relative"
+                >
+                    <h1 className="text-[150px] md:text-[200px] font-jersey-10 font-bold text-red-600 leading-none select-none relative">
+                        <span className="relative z-10">404</span>
+                        <motion.span
+                            className="absolute top-0 left-0 text-red-600/50 z-0"
+                            animate={{ x: [-2, 2, -2], opacity: [0.5, 0.8, 0.5] }}
+                            transition={{ duration: 0.1, repeat: Infinity, repeatType: "mirror" }}
+                        >
+                            404
+                        </motion.span>
+                        <motion.span
+                            className="absolute top-0 left-0 text-white/20 z-0"
+                            animate={{ x: [2, -2, 2], opacity: [0.3, 0.6, 0.3] }}
+                            transition={{ duration: 0.15, repeat: Infinity, repeatType: "mirror" }}
+                        >
+                            404
+                        </motion.span>
+                    </h1>
+                </motion.div>
+                <motion.div
+                    initial={{ opacity: 0, y: 20 }}
+                    animate={{ opacity: 1, y: 0 }}
+                    transition={{ delay: 0.2, duration: 0.5 }}
+                >
+                    <div className="flex items-center justify-center gap-4 mb-6">
+                        <div className="h-[1px] w-12 bg-red-600/50" />
+                        <h2 className="text-xl md:text-2xl font-outfit font-bold tracking-widest uppercase text-white/80">
+                            System Error
+                        </h2>
+                        <div className="h-[1px] w-12 bg-red-600/50" />
+                    </div>
+                    <p className="text-white/60 mb-10 max-w-md mx-auto font-roboto">
+                        An error occurred
+                    </p>
+                    <Link
+                        href="/"
+                        className="group relative inline-flex items-center justify-center px-8 py-4 overflow-hidden font-bold text-white transition-all duration-300 bg-red-600 rounded-sm hover:bg-red-700 focus:outline-none focus:ring focus:ring-red-400 focus:ring-offset-2 focus:ring-offset-gray-900"
+                    >
+                        <span className="absolute inset-0 w-full h-full -mt-1 rounded-lg opacity-30 bg-gradient-to-b from-transparent via-transparent to-black"></span>
+                        <span className="relative font-outfit tracking-wider">
+                            Back to Home Page
+                        </span>
+                    </Link>
+                </motion.div>
+            </div>
+        </div>
+    );
+}

package/templates/web/src/app/page.tsx ADDED Viewed

@@ -0,0 +1,106 @@
+import StatsGrid from "@/components/home/StatsGrid";
+import { Github, Globe } from "lucide-react";
+export default function Home() {
+  return (
+    <main className="min-h-screen bg-black text-white">
+      {/* Hero Section */}
+      <section className="relative py-24 px-6 md:px-12 lg:px-24 flex flex-col items-center text-center">
+        <div className="absolute inset-0 bg-gradient-to-b from-blue-900/20 to-transparent pointer-events-none" />
+        <h1 className="text-5xl md:text-7xl font-bold tracking-tight mb-6 bg-gradient-to-r from-white to-zinc-500 bg-clip-text text-transparent">
+          Next.js Enterprise Stack
+        </h1>
+        <p className="text-lg md:text-xl text-zinc-400 max-w-2xl mb-12">
+          A production-ready starter template featuring Next.js 15, Tailwind CSS 4, Supabase, and a fully integrated Admin Dashboard.
+        </p>
+        <div className="flex flex-col md:flex-row gap-4">
+          <a
+            href="https://github.com/burakz-cn/create-nextjs-stack"
+            target="_blank"
+            className="px-8 py-3 bg-white text-black font-semibold rounded-full hover:bg-zinc-200 transition"
+          >
+            Get Started
+          </a>
+          <a
+            href="#"
+            className="px-8 py-3 border border-zinc-700 text-white font-semibold rounded-full hover:bg-zinc-800 transition"
+          >
+            Documentation
+          </a>
+        </div>
+      </section>
+      {/* Stats Section */}
+      <section className="py-24 px-6 md:px-12 lg:px-24 bg-zinc-950/50 border-t border-zinc-900">
+        <div className="max-w-7xl mx-auto">
+          <div className="flex flex-col md:flex-row justify-between items-end mb-12">
+            <div>
+              <h2 className="text-3xl font-bold mb-2">Live Database Stats</h2>
+              <p className="text-zinc-500">Real-time data fetched from your Supabase instance.</p>
+            </div>
+            <div className="hidden md:block">
+              <span className="flex items-center text-sm text-green-500">
+                <span className="w-2 h-2 bg-green-500 rounded-full mr-2 animate-pulse" />
+                System Online
+              </span>
+            </div>
+          </div>
+          <StatsGrid />
+        </div>
+      </section>
+      {/* Features Grid (Static for demo) */}
+      <section className="py-24 px-6 md:px-12 lg:px-24">
+        <div className="max-w-7xl mx-auto grid grid-cols-1 md:grid-cols-3 gap-12">
+          <div className="space-y-4">
+            <h3 className="text-xl font-bold">Type Safe</h3>
+            <p className="text-zinc-400">End-to-end type safety with TypeScript, Zod, and generated Supabase types.</p>
+          </div>
+          <div className="space-y-4">
+            <h3 className="text-xl font-bold">Admin Panel</h3>
+            <p className="text-zinc-400">Fully functional admin dashboard with CRUD operations, auth, and resource management.</p>
+          </div>
+          <div className="space-y-4">
+            <h3 className="text-xl font-bold">Modern Stack</h3>
+            <p className="text-zinc-400">Built with the latest Next.js 15 App Router, React 19, and Tailwind CSS 4.</p>
+          </div>
+        </div>
+      </section>
+      {/* Footer / Credits */}
+      <footer className="py-12 px-6 md:px-12 lg:px-24 border-t border-zinc-900 bg-zinc-950">
+        <div className="max-w-7xl mx-auto flex flex-col md:flex-row justify-between items-center gap-6">
+          <p className="text-zinc-500 text-sm">
+            © {new Date().getFullYear()} Next.js Enterprise Stack. All rights reserved.
+          </p>
+          <div className="flex items-center gap-6">
+            <a
+              href="https://github.com/mburakaltiparmak"
+              target="_blank"
+              rel="noopener noreferrer"
+              className="group flex items-center gap-2 text-zinc-400 hover:text-white transition-colors"
+            >
+              <Github className="w-5 h-5" />
+              <span className="text-sm font-medium">mburakaltiparmak</span>
+            </a>
+            <a
+              href="https://burakaltiparmak.site"
+              target="_blank"
+              rel="noopener noreferrer"
+              className="group flex items-center gap-2 text-zinc-400 hover:text-white transition-colors"
+            >
+              <Globe className="w-5 h-5" />
+              <span className="text-sm font-medium">burakaltiparmak.site</span>
+            </a>
+          </div>
+        </div>
+      </footer>
+    </main>
+  );
+}

package/templates/web/src/app/robots.ts ADDED Viewed

@@ -0,0 +1,12 @@
+import { MetadataRoute } from 'next';
+export default function robots(): MetadataRoute.Robots {
+    return {
+        rules: {
+            userAgent: '*',
+            allow: '/',
+            disallow: ['/api/', '/_next/'],
+        },
+        sitemap: 'https://www.DOMAIN_PLACEHOLDER.com/sitemap.xml',
+    };
+}

package/templates/web/src/app/sitemap.ts ADDED Viewed

@@ -0,0 +1,66 @@
+import { MetadataRoute } from 'next';
+import { projectService } from '@/lib/services/projectService';
+import { productService } from '@/lib/services/productService';
+export default async function sitemap(): Promise<MetadataRoute.Sitemap> {
+    const baseUrl = 'https://www.DOMAIN_PLACEHOLDER.com';
+    // Static pages - CUSTOMIZE THESE ROUTES FOR YOUR PROJECT
+    const routes = [
+        '',
+        '/about',
+        '/products',
+        '/innovation',
+        '/services',
+        '/investors',
+        '/references',
+        '/contact',
+        '/impressum',
+        '/datenschutz',
+        '/agb'
+    ];
+    const sitemap: MetadataRoute.Sitemap = [];
+    // Generate entries for each route
+    routes.forEach((route) => {
+        sitemap.push({
+            url: `${baseUrl}${route}`,
+            lastModified: new Date(),
+            changeFrequency: route === '' ? 'daily' : 'weekly',
+            priority: route === '' ? 1.0 : (route === '/contact' ? 0.9 : 0.8),
+        });
+    });
+    // Dynamic Projects
+    try {
+        const projectSlugs = await projectService.getAllSlugs();
+        projectSlugs.forEach((slug) => {
+            sitemap.push({
+                url: `${baseUrl}/references/${slug}`,
+                lastModified: new Date(),
+                changeFrequency: 'weekly',
+                priority: 0.7,
+            });
+        });
+    } catch (error) {
+        console.error('[Sitemap] Error fetching project slugs:', error);
+    }
+    // Dynamic Products
+    try {
+        const productSlugs = await productService.getAllSlugs();
+        productSlugs.forEach((slug) => {
+            sitemap.push({
+                url: `${baseUrl}/products/${slug}`,
+                lastModified: new Date(),
+                changeFrequency: 'weekly',
+                priority: 0.8,
+            });
+        });
+    } catch (error) {
+        console.error('[Sitemap] Error fetching product slugs:', error);
+    }
+    return sitemap;
+}

package/templates/web/src/components/home/StatsGrid.tsx ADDED Viewed

@@ -0,0 +1,89 @@
+import { CategoryService } from "@/lib/services/categories.service";
+import { ProductService } from "@/lib/services/products.service";
+import { ProjectService } from "@/lib/services/projects.service";
+import { ClientService } from "@/lib/services/clients.service";
+import { UserService } from "@/lib/services/users.service";
+import {
+  Layers,
+  Package,
+  Briefcase,
+  Users,
+  Settings
+} from "lucide-react";
+export default async function StatsGrid() {
+  const [
+    categories,
+    products,
+    projects,
+    clients,
+    users
+  ] = await Promise.all([
+    CategoryService.getAll(),
+    ProductService.getAll(),
+    ProjectService.getAll(),
+    ClientService.getAll(),
+    UserService.getAll()
+  ]);
+  const stats = [
+    {
+      label: "Total Products",
+      value: products.length,
+      icon: Package,
+      color: "bg-blue-500",
+    },
+    {
+      label: "Total Categories",
+      value: categories.length,
+      icon: Layers,
+      color: "bg-purple-500",
+    },
+    {
+      label: "Total Projects",
+      value: projects.length,
+      icon: Briefcase,
+      color: "bg-indigo-500",
+    },
+    {
+      label: "Total Clients",
+      value: clients.length,
+      icon: Users,
+      color: "bg-pink-500",
+    },
+    {
+      label: "Registered Users",
+      value: users.length,
+      icon: Settings,
+      color: "bg-orange-500",
+    },
+  ];
+  return (
+    <div className="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-5 gap-6">
+      {stats.map((stat) => {
+        const Icon = stat.icon;
+        return (
+          <div
+            key={stat.label}
+            className="bg-zinc-900 border border-zinc-800 rounded-xl p-6 transition hover:border-zinc-700 hover:bg-zinc-800/50"
+          >
+            <div className="flex items-center gap-4">
+              <div className={`p-3 rounded-lg ${stat.color} bg-opacity-10`}>
+                <Icon className={`w-6 h-6 ${stat.color.replace("bg-", "text-")}`} />
+              </div>
+              <div>
+                <p className="text-sm font-medium text-zinc-400">
+                  {stat.label}
+                </p>
+                <p className="text-2xl font-bold text-white mt-1">
+                  {stat.value}
+                </p>
+              </div>
+            </div>
+          </div>
+        );
+      })}
+    </div>
+  );
+}

package/templates/web/src/hooks/useIntersectionObserver.ts ADDED Viewed

@@ -0,0 +1,39 @@
+import { useState, useEffect, RefObject } from 'react';
+interface UseIntersectionObserverOptions {
+    threshold?: number;
+    rootMargin?: string;
+}
+export const useIntersectionObserver = (
+    ref: RefObject<Element | null>, // Modified to accept null which is common with useRef
+    options: UseIntersectionObserverOptions = {}
+): boolean => {
+    const [isVisible, setIsVisible] = useState(false);
+    useEffect(() => {
+        const observer = new IntersectionObserver(
+            ([entry]) => {
+                if (entry.isIntersecting) {
+                    setIsVisible(true);
+                    observer.disconnect(); // Load once, then stop observing
+                }
+            },
+            {
+                threshold: options.threshold || 0,
+                rootMargin: options.rootMargin || '100px' // Default: load 100px before appearing
+            }
+        );
+        const currentRef = ref.current;
+        if (currentRef) {
+            observer.observe(currentRef);
+        }
+        return () => {
+            observer.disconnect();
+        };
+    }, [ref, options.threshold, options.rootMargin]);
+    return isVisible;
+};

package/templates/web/src/lib/providers/StoreProvider.tsx ADDED Viewed

@@ -0,0 +1,12 @@
+"use client";
+import { Provider } from "react-redux";
+import store from "@/store";
+export default function StoreProvider({
+  children,
+}: {
+  children: React.ReactNode;
+}) {
+  return <Provider store={store}>{children}</Provider>;
+}

package/templates/web/src/lib/seo/index.ts ADDED Viewed

@@ -0,0 +1,4 @@
+// SEO Library Barrel Export
+export * from './seo.types';
+export * from './seo.config';
+export * from './metadata';