@digilogiclabs/create-saas-app 2.0.0 → 2.2.0

package/dist/templates/web/iot-dashboard/template/src/app/dashboard/page.tsx

@@ -0,0 +1,229 @@
+'use client'
+
+import { useState, useEffect } from 'react'
+import { Button, Card } from '@digilogiclabs/saas-factory-ui'
+import { Cpu, Activity, Signal, Bell, AlertTriangle, CheckCircle, Clock, ThermometerSun, Gauge, Wifi, Plus } from 'lucide-react'
+import Link from 'next/link'
+
+// Simulated real-time data
+const generateTelemetryData = () => ({
+  temperature: (20 + Math.random() * 10).toFixed(1),
+  pressure: (100 + Math.random() * 20).toFixed(1),
+  humidity: (40 + Math.random() * 30).toFixed(0),
+  signalStrength: (-50 - Math.random() * 40).toFixed(0),
+})
+
+const DEVICES = [
+  { id: 1, name: 'Sensor Hub A1', type: 'Gateway', status: 'online', lastSeen: '2 min ago' },
+  { id: 2, name: 'Temp Sensor T-001', type: 'Temperature', status: 'online', lastSeen: '1 min ago' },
+  { id: 3, name: 'Pressure Gauge P-001', type: 'Pressure', status: 'online', lastSeen: '3 min ago' },
+  { id: 4, name: 'Motion Detector M-001', type: 'Motion', status: 'offline', lastSeen: '15 min ago' },
+  { id: 5, name: 'Humidity Sensor H-001', type: 'Humidity', status: 'online', lastSeen: '30 sec ago' },
+]
+
+const RECENT_ALERTS = [
+  { id: 1, message: 'Temperature threshold exceeded on T-001', severity: 'warning', time: '5 min ago' },
+  { id: 2, message: 'Motion Detector M-001 offline', severity: 'error', time: '15 min ago' },
+  { id: 3, message: 'System backup completed', severity: 'info', time: '1 hour ago' },
+]
+
+export default function DashboardPage() {
+  const [telemetry, setTelemetry] = useState(generateTelemetryData())
+
+  // Simulate real-time updates
+  useEffect(() => {
+    const interval = setInterval(() => {
+      setTelemetry(generateTelemetryData())
+    }, 3000)
+    return () => clearInterval(interval)
+  }, [])
+
+  const onlineDevices = DEVICES.filter(d => d.status === 'online').length
+  const offlineDevices = DEVICES.filter(d => d.status === 'offline').length
+
+  return (
+    <div className="min-h-screen bg-slate-50 dark:bg-slate-900">
+      {/* Header */}
+      <header className="bg-white dark:bg-slate-800 border-b border-slate-200 dark:border-slate-700 px-6 py-4">
+        <div className="flex items-center justify-between">
+          <div>
+            <h1 className="text-2xl font-bold text-slate-900 dark:text-white">Dashboard</h1>
+            <p className="text-slate-600 dark:text-slate-400 text-sm">Real-time IoT monitoring</p>
+          </div>
+          <Link href="/devices/new">
+            <Button className="bg-emerald-600 hover:bg-emerald-700">
+              <Plus className="w-4 h-4 mr-2" />
+              Add Device
+            </Button>
+          </Link>
+        </div>
+      </header>
+
+      <div className="p-6">
+        {/* Stats */}
+        <div className="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-4 gap-6 mb-8">
+          <Card className="p-6">
+            <div className="flex items-center justify-between">
+              <div>
+                <p className="text-sm text-slate-600 dark:text-slate-400">Total Devices</p>
+                <p className="text-3xl font-bold text-slate-900 dark:text-white">{DEVICES.length}</p>
+              </div>
+              <div className="w-12 h-12 bg-emerald-100 dark:bg-emerald-900/30 rounded-lg flex items-center justify-center">
+                <Cpu className="w-6 h-6 text-emerald-600" />
+              </div>
+            </div>
+          </Card>
+
+          <Card className="p-6">
+            <div className="flex items-center justify-between">
+              <div>
+                <p className="text-sm text-slate-600 dark:text-slate-400">Online</p>
+                <p className="text-3xl font-bold text-green-600">{onlineDevices}</p>
+              </div>
+              <div className="w-12 h-12 bg-green-100 dark:bg-green-900/30 rounded-lg flex items-center justify-center">
+                <CheckCircle className="w-6 h-6 text-green-600" />
+              </div>
+            </div>
+          </Card>
+
+          <Card className="p-6">
+            <div className="flex items-center justify-between">
+              <div>
+                <p className="text-sm text-slate-600 dark:text-slate-400">Offline</p>
+                <p className="text-3xl font-bold text-red-600">{offlineDevices}</p>
+              </div>
+              <div className="w-12 h-12 bg-red-100 dark:bg-red-900/30 rounded-lg flex items-center justify-center">
+                <AlertTriangle className="w-6 h-6 text-red-600" />
+              </div>
+            </div>
+          </Card>
+
+          <Card className="p-6">
+            <div className="flex items-center justify-between">
+              <div>
+                <p className="text-sm text-slate-600 dark:text-slate-400">Active Alerts</p>
+                <p className="text-3xl font-bold text-amber-600">{RECENT_ALERTS.length}</p>
+              </div>
+              <div className="w-12 h-12 bg-amber-100 dark:bg-amber-900/30 rounded-lg flex items-center justify-center">
+                <Bell className="w-6 h-6 text-amber-600" />
+              </div>
+            </div>
+          </Card>
+        </div>
+
+        {/* Live Telemetry */}
+        <div className="grid grid-cols-1 lg:grid-cols-2 gap-6 mb-8">
+          <Card className="p-6">
+            <h2 className="text-lg font-semibold text-slate-900 dark:text-white mb-6 flex items-center">
+              <Activity className="w-5 h-5 mr-2 text-emerald-600" />
+              Live Telemetry
+            </h2>
+            <div className="grid grid-cols-2 gap-4">
+              <div className="p-4 bg-slate-100 dark:bg-slate-700/50 rounded-lg">
+                <div className="flex items-center gap-2 mb-2">
+                  <ThermometerSun className="w-4 h-4 text-orange-500" />
+                  <span className="text-sm text-slate-600 dark:text-slate-400">Temperature</span>
+                </div>
+                <p className="text-2xl font-bold text-slate-900 dark:text-white">{telemetry.temperature}°C</p>
+              </div>
+              <div className="p-4 bg-slate-100 dark:bg-slate-700/50 rounded-lg">
+                <div className="flex items-center gap-2 mb-2">
+                  <Gauge className="w-4 h-4 text-blue-500" />
+                  <span className="text-sm text-slate-600 dark:text-slate-400">Pressure</span>
+                </div>
+                <p className="text-2xl font-bold text-slate-900 dark:text-white">{telemetry.pressure} kPa</p>
+              </div>
+              <div className="p-4 bg-slate-100 dark:bg-slate-700/50 rounded-lg">
+                <div className="flex items-center gap-2 mb-2">
+                  <Activity className="w-4 h-4 text-cyan-500" />
+                  <span className="text-sm text-slate-600 dark:text-slate-400">Humidity</span>
+                </div>
+                <p className="text-2xl font-bold text-slate-900 dark:text-white">{telemetry.humidity}%</p>
+              </div>
+              <div className="p-4 bg-slate-100 dark:bg-slate-700/50 rounded-lg">
+                <div className="flex items-center gap-2 mb-2">
+                  <Signal className="w-4 h-4 text-purple-500" />
+                  <span className="text-sm text-slate-600 dark:text-slate-400">Signal</span>
+                </div>
+                <p className="text-2xl font-bold text-slate-900 dark:text-white">{telemetry.signalStrength} dBm</p>
+              </div>
+            </div>
+          </Card>
+
+          <Card className="p-6">
+            <h2 className="text-lg font-semibold text-slate-900 dark:text-white mb-6 flex items-center">
+              <Bell className="w-5 h-5 mr-2 text-amber-600" />
+              Recent Alerts
+            </h2>
+            <div className="space-y-4">
+              {RECENT_ALERTS.map((alert) => (
+                <div key={alert.id} className="flex items-start gap-3 p-3 bg-slate-100 dark:bg-slate-700/50 rounded-lg">
+                  <div className={`w-2 h-2 rounded-full mt-2 ${
+                    alert.severity === 'error' ? 'bg-red-500' :
+                    alert.severity === 'warning' ? 'bg-amber-500' :
+                    'bg-blue-500'
+                  }`} />
+                  <div className="flex-1">
+                    <p className="text-sm text-slate-900 dark:text-white">{alert.message}</p>
+                    <p className="text-xs text-slate-500 mt-1">{alert.time}</p>
+                  </div>
+                </div>
+              ))}
+            </div>
+          </Card>
+        </div>
+
+        {/* Device List */}
+        <Card className="p-6">
+          <div className="flex items-center justify-between mb-6">
+            <h2 className="text-lg font-semibold text-slate-900 dark:text-white flex items-center">
+              <Cpu className="w-5 h-5 mr-2 text-emerald-600" />
+              Devices
+            </h2>
+            <Link href="/devices">
+              <Button variant="outline" size="sm">View All</Button>
+            </Link>
+          </div>
+          <div className="overflow-x-auto">
+            <table className="w-full">
+              <thead>
+                <tr className="border-b border-slate-200 dark:border-slate-700">
+                  <th className="text-left py-3 px-4 text-sm font-medium text-slate-600 dark:text-slate-400">Name</th>
+                  <th className="text-left py-3 px-4 text-sm font-medium text-slate-600 dark:text-slate-400">Type</th>
+                  <th className="text-left py-3 px-4 text-sm font-medium text-slate-600 dark:text-slate-400">Status</th>
+                  <th className="text-left py-3 px-4 text-sm font-medium text-slate-600 dark:text-slate-400">Last Seen</th>
+                </tr>
+              </thead>
+              <tbody>
+                {DEVICES.map((device) => (
+                  <tr key={device.id} className="border-b border-slate-100 dark:border-slate-800 hover:bg-slate-50 dark:hover:bg-slate-800/50">
+                    <td className="py-3 px-4">
+                      <span className="font-medium text-slate-900 dark:text-white">{device.name}</span>
+                    </td>
+                    <td className="py-3 px-4 text-slate-600 dark:text-slate-400">{device.type}</td>
+                    <td className="py-3 px-4">
+                      <span className={`inline-flex items-center px-2 py-1 rounded-full text-xs ${
+                        device.status === 'online'
+                          ? 'bg-green-100 text-green-700 dark:bg-green-900/30 dark:text-green-400'
+                          : 'bg-red-100 text-red-700 dark:bg-red-900/30 dark:text-red-400'
+                      }`}>
+                        <span className={`w-1.5 h-1.5 rounded-full mr-1.5 ${
+                          device.status === 'online' ? 'bg-green-500' : 'bg-red-500'
+                        }`} />
+                        {device.status}
+                      </span>
+                    </td>
+                    <td className="py-3 px-4 text-slate-600 dark:text-slate-400 flex items-center">
+                      <Clock className="w-3 h-3 mr-1" />
+                      {device.lastSeen}
+                    </td>
+                  </tr>
+                ))}
+              </tbody>
+            </table>
+          </div>
+        </Card>
+      </div>
+    </div>
+  )
+}

package/dist/templates/web/iot-dashboard/template/src/app/globals.css

@@ -0,0 +1,20 @@
+@import "tailwindcss";
+
+@theme {
+  --color-primary: oklch(55% 0.18 160);
+  --color-background: oklch(98% 0.01 256);
+  --color-foreground: oklch(15% 0.02 256);
+  --font-sans: 'Inter', system-ui, sans-serif;
+  --radius: 0.5rem;
+}
+
+.dark {
+  --color-background: oklch(15% 0.02 256);
+  --color-foreground: oklch(95% 0 0);
+}
+
+body {
+  font-family: var(--font-sans);
+  background-color: var(--color-background);
+  color: var(--color-foreground);
+}

package/dist/templates/web/iot-dashboard/template/src/app/layout.tsx

@@ -0,0 +1,27 @@
+import type { Metadata } from 'next'
+import { Inter } from 'next/font/google'
+import './globals.css'
+import { AppProviders } from '@/components/providers/app-providers'
+
+const inter = Inter({ subsets: ['latin'] })
+
+export const metadata: Metadata = {
+  title: '{{titleCaseName}} - IoT Dashboard',
+  description: '{{description}}',
+}
+
+export default function RootLayout({
+  children,
+}: {
+  children: React.ReactNode
+}) {
+  return (
+    <html lang="en" suppressHydrationWarning>
+      <body className={inter.className}>
+        <AppProviders>
+          {children}
+        </AppProviders>
+      </body>
+    </html>
+  )
+}

package/dist/templates/web/iot-dashboard/template/src/app/page.tsx

@@ -0,0 +1,191 @@
+'use client'
+
+import { Button, Card } from '@digilogiclabs/saas-factory-ui'
+import { useAuth } from '@digilogiclabs/app-sdk'
+import { Cpu, Activity, Signal, Bell, Settings, ArrowRight, User, LogOut, Wifi, ThermometerSun, Gauge, Shield } from 'lucide-react'
+import Link from 'next/link'
+
+const FEATURES = [
+  {
+    icon: Cpu,
+    title: 'Device Management',
+    description: 'Monitor and control all your IoT devices from one dashboard',
+  },
+  {
+    icon: Activity,
+    title: 'Real-time Telemetry',
+    description: 'Live data streams with historical analysis and trends',
+  },
+  {
+    icon: Bell,
+    title: 'Smart Alerts',
+    description: 'Configurable alerts and notifications for critical events',
+  },
+  {
+    icon: Shield,
+    title: 'Secure & Scalable',
+    description: 'Enterprise-grade security for your connected devices',
+  },
+]
+
+const DEVICE_TYPES = [
+  { name: 'Temperature Sensors', count: 24, icon: ThermometerSun, status: 'online' },
+  { name: 'Pressure Gauges', count: 12, icon: Gauge, status: 'online' },
+  { name: 'Network Gateways', count: 8, icon: Wifi, status: 'online' },
+  { name: 'Motion Sensors', count: 18, icon: Signal, status: 'partial' },
+]
+
+export default function Home() {
+  const { user, signOut, loading } = useAuth()
+
+  const projectName = "{{titleCaseName}}"
+
+  const handleSignOut = async () => {
+    try {
+      await signOut()
+    } catch (err) {
+      console.error('Sign out error:', err)
+    }
+  }
+
+  return (
+    <main className="min-h-screen bg-slate-50 dark:bg-slate-900">
+      {/* Header */}
+      <header className="bg-white dark:bg-slate-800 border-b border-slate-200 dark:border-slate-700 sticky top-0 z-50">
+        <div className="max-w-7xl mx-auto px-4 py-4">
+          <div className="flex items-center justify-between">
+            <Link href="/" className="flex items-center gap-2">
+              <div className="w-8 h-8 bg-emerald-600 rounded-lg flex items-center justify-center">
+                <Cpu className="w-5 h-5 text-white" />
+              </div>
+              <span className="text-2xl font-bold text-slate-900 dark:text-white">{projectName}</span>
+            </Link>
+
+            <nav className="hidden md:flex items-center gap-6">
+              <Link href="/devices" className="text-slate-600 dark:text-slate-300 hover:text-slate-900 dark:hover:text-white transition">
+                Devices
+              </Link>
+              <Link href="/analytics" className="text-slate-600 dark:text-slate-300 hover:text-slate-900 dark:hover:text-white transition">
+                Analytics
+              </Link>
+              <Link href="/alerts" className="text-slate-600 dark:text-slate-300 hover:text-slate-900 dark:hover:text-white transition">
+                Alerts
+              </Link>
+            </nav>
+
+            <div className="flex items-center gap-4">
+              {loading ? (
+                <div className="text-sm text-slate-600">Loading...</div>
+              ) : user ? (
+                <div className="flex items-center gap-2">
+                  <Link href="/dashboard">
+                    <Button variant="outline" size="sm">
+                      <User className="w-4 h-4 mr-2" />
+                      Dashboard
+                    </Button>
+                  </Link>
+                  <Button variant="ghost" size="sm" onClick={handleSignOut}>
+                    <LogOut className="w-4 h-4" />
+                  </Button>
+                </div>
+              ) : (
+                <div className="flex gap-2">
+                  <Link href="/login">
+                    <Button variant="outline" size="sm">Sign In</Button>
+                  </Link>
+                  <Link href="/signup">
+                    <Button size="sm" className="bg-emerald-600 hover:bg-emerald-700">Get Started</Button>
+                  </Link>
+                </div>
+              )}
+            </div>
+          </div>
+        </div>
+      </header>
+
+      <div className="max-w-7xl mx-auto px-4 py-16">
+        {/* Hero */}
+        <div className="text-center mb-16">
+          <div className="inline-flex items-center px-4 py-2 rounded-full bg-emerald-100 dark:bg-emerald-900/30 text-emerald-700 dark:text-emerald-400 text-sm mb-6">
+            <Signal className="w-4 h-4 mr-2" />
+            IoT Management Platform
+          </div>
+          <h1 className="text-5xl font-bold text-slate-900 dark:text-white mb-6">
+            Monitor Your <span className="text-emerald-600">Connected Devices</span>
+          </h1>
+          <p className="text-xl text-slate-600 dark:text-slate-300 max-w-2xl mx-auto mb-8">
+            Real-time monitoring, analytics, and control for your IoT infrastructure.
+            Built for scale, designed for simplicity.
+          </p>
+          <div className="flex gap-4 justify-center">
+            <Link href="/dashboard">
+              <Button size="lg" className="bg-emerald-600 hover:bg-emerald-700">
+                <Activity className="w-5 h-5 mr-2" />
+                View Dashboard
+              </Button>
+            </Link>
+            <Link href="/devices">
+              <Button size="lg" variant="outline">
+                Manage Devices
+              </Button>
+            </Link>
+          </div>
+        </div>
+
+        {/* Device Overview */}
+        <div className="grid md:grid-cols-2 lg:grid-cols-4 gap-4 mb-16">
+          {DEVICE_TYPES.map((device) => (
+            <Card key={device.name} className="p-6">
+              <div className="flex items-center justify-between mb-3">
+                <div className="w-10 h-10 bg-emerald-100 dark:bg-emerald-900/30 rounded-lg flex items-center justify-center">
+                  <device.icon className="w-5 h-5 text-emerald-600" />
+                </div>
+                <span className={`text-xs px-2 py-1 rounded-full ${
+                  device.status === 'online'
+                    ? 'bg-green-100 text-green-700 dark:bg-green-900/30 dark:text-green-400'
+                    : 'bg-yellow-100 text-yellow-700 dark:bg-yellow-900/30 dark:text-yellow-400'
+                }`}>
+                  {device.status === 'online' ? 'All Online' : 'Partial'}
+                </span>
+              </div>
+              <h3 className="font-semibold text-slate-900 dark:text-white">{device.name}</h3>
+              <p className="text-2xl font-bold text-emerald-600">{device.count}</p>
+            </Card>
+          ))}
+        </div>
+
+        {/* Features */}
+        <div className="mb-16">
+          <h2 className="text-3xl font-bold text-slate-900 dark:text-white text-center mb-12">
+            Everything You Need
+          </h2>
+          <div className="grid md:grid-cols-2 lg:grid-cols-4 gap-6">
+            {FEATURES.map((feature) => (
+              <Card key={feature.title} className="p-6 text-center">
+                <div className="w-12 h-12 bg-emerald-100 dark:bg-emerald-900/30 rounded-lg flex items-center justify-center mx-auto mb-4">
+                  <feature.icon className="w-6 h-6 text-emerald-600" />
+                </div>
+                <h3 className="text-lg font-semibold text-slate-900 dark:text-white mb-2">{feature.title}</h3>
+                <p className="text-slate-600 dark:text-slate-400 text-sm">{feature.description}</p>
+              </Card>
+            ))}
+          </div>
+        </div>
+
+        {/* CTA */}
+        <Card className="p-12 bg-gradient-to-r from-emerald-600 to-teal-600 text-white text-center">
+          <h2 className="text-3xl font-bold mb-4">Ready to Connect?</h2>
+          <p className="text-white/80 mb-8 max-w-md mx-auto">
+            Start monitoring your IoT devices in minutes. Free tier available for up to 10 devices.
+          </p>
+          <Link href="/signup">
+            <Button size="lg" variant="secondary">
+              Get Started Free
+              <ArrowRight className="w-5 h-5 ml-2" />
+            </Button>
+          </Link>
+        </Card>
+      </div>
+    </main>
+  )
+}

package/dist/templates/web/iot-dashboard/template/src/components/providers/app-providers.tsx

@@ -0,0 +1,24 @@
+'use client'
+
+import { ThemeProvider } from 'next-themes'
+import { DLLProvider } from '@digilogiclabs/app-sdk'
+
+interface AppProvidersProps {
+  children: React.ReactNode
+}
+
+export function AppProviders({ children }: AppProvidersProps) {
+  return (
+    <ThemeProvider attribute="class" defaultTheme="system" enableSystem>
+      <DLLProvider
+        config={{
+          auth: {
+            provider: 'supabase',
+          },
+        }}
+      >
+        {children}
+      </DLLProvider>
+    </ThemeProvider>
+  )
+}

package/dist/templates/web/iot-dashboard/template/src/lib/auth-server.ts

@@ -0,0 +1,33 @@
+import { redirect } from 'next/navigation'
+import { createClient } from './supabase/server'
+
+export interface AuthUser {
+  id: string
+  email: string | null
+  name?: string | null
+}
+
+export async function getUser(): Promise<AuthUser | null> {
+  const supabase = await createClient()
+  const { data: { user }, error } = await supabase.auth.getUser()
+
+  if (error || !user) {
+    return null
+  }
+
+  return {
+    id: user.id,
+    email: user.email ?? null,
+    name: user.user_metadata?.name ?? user.user_metadata?.full_name ?? null,
+  }
+}
+
+export async function requireAuth(): Promise<AuthUser> {
+  const user = await getUser()
+
+  if (!user) {
+    redirect('/login')
+  }
+
+  return user
+}

package/dist/templates/web/iot-dashboard/template/src/lib/supabase/client.ts

@@ -0,0 +1,8 @@
+import { createBrowserClient } from '@supabase/ssr'
+
+export function createClient() {
+  return createBrowserClient(
+    process.env.NEXT_PUBLIC_SUPABASE_URL!,
+    process.env.NEXT_PUBLIC_SUPABASE_ANON_KEY!
+  )
+}

package/dist/templates/web/iot-dashboard/template/src/lib/supabase/server.ts

@@ -0,0 +1,27 @@
+import { createServerClient } from '@supabase/ssr'
+import { cookies } from 'next/headers'
+
+export async function createClient() {
+  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 {
+            // Server Component context
+          }
+        },
+      },
+    }
+  )
+}

package/dist/templates/web/iot-dashboard/template/src/lib/utils.ts

@@ -0,0 +1,25 @@
+import { clsx, type ClassValue } from 'clsx'
+import { twMerge } from 'tailwind-merge'
+
+export function cn(...inputs: ClassValue[]) {
+  return twMerge(clsx(inputs))
+}
+
+export function formatTimestamp(date: Date | string) {
+  return new Intl.DateTimeFormat('en-US', {
+    dateStyle: 'medium',
+    timeStyle: 'short',
+  }).format(new Date(date))
+}
+
+export function formatRelativeTime(date: Date | string) {
+  const now = new Date()
+  const then = new Date(date)
+  const diffMs = now.getTime() - then.getTime()
+  const diffMins = Math.floor(diffMs / 60000)
+
+  if (diffMins < 1) return 'Just now'
+  if (diffMins < 60) return `${diffMins} min ago`
+  if (diffMins < 1440) return `${Math.floor(diffMins / 60)} hours ago`
+  return `${Math.floor(diffMins / 1440)} days ago`
+}

package/dist/templates/web/iot-dashboard/template/tsconfig.json

@@ -0,0 +1,27 @@
+{
+  "compilerOptions": {
+    "target": "ES2022",
+    "lib": ["dom", "dom.iterable", "esnext"],
+    "allowJs": true,
+    "skipLibCheck": true,
+    "strict": true,
+    "noEmit": true,
+    "esModuleInterop": true,
+    "module": "esnext",
+    "moduleResolution": "bundler",
+    "resolveJsonModule": true,
+    "isolatedModules": true,
+    "jsx": "preserve",
+    "incremental": true,
+    "plugins": [
+      {
+        "name": "next"
+      }
+    ],
+    "paths": {
+      "@/*": ["./src/*"]
+    }
+  },
+  "include": ["next-env.d.ts", "**/*.ts", "**/*.tsx", ".next/types/**/*.ts"],
+  "exclude": ["node_modules"]
+}

package/dist/templates/web/marketplace/template/.env.example

@@ -0,0 +1,12 @@
+# Supabase Configuration
+NEXT_PUBLIC_SUPABASE_URL=your-supabase-url
+NEXT_PUBLIC_SUPABASE_ANON_KEY=your-supabase-anon-key
+SUPABASE_SERVICE_ROLE_KEY=your-service-role-key
+
+# Stripe Configuration
+NEXT_PUBLIC_STRIPE_PUBLISHABLE_KEY=pk_test_xxx
+STRIPE_SECRET_KEY=sk_test_xxx
+STRIPE_WEBHOOK_SECRET=whsec_xxx
+
+# Application
+NEXT_PUBLIC_APP_URL=http://localhost:3000