@digilogiclabs/create-saas-app 2.9.1 → 2.11.0

package/dist/templates/web/base/template/src/app/loading.tsx

@@ -1,52 +1,52 @@
-import { Card, SkeletonCard, SkeletonText } from '@digilogiclabs/saas-factory-ui'
-
-export default function Loading() {
-  return (
-    <div className="min-h-screen bg-gradient-to-br from-blue-50 to-indigo-100 dark:from-gray-900 dark:to-gray-800">
-      <div className="container mx-auto px-4 py-8">
-        {/* Header skeleton */}
-        <div className="mb-8">
-          <SkeletonText className="h-8 w-64 mb-4" />
-          <SkeletonText className="h-4 w-96" />
-        </div>
-
-        {/* Cards grid skeleton */}
-        <div className="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-6 mb-8">
-          {Array.from({ length: 6 }).map((_, i) => (
-            <SkeletonCard key={i} />
-          ))}
-        </div>
-
-        {/* Centered loading spinner */}
-        <div className="flex justify-center">
-          <Card className="p-8 max-w-sm w-full mx-4">
-            <div className="flex flex-col items-center space-y-4">
-              {/* Animated spinner */}
-              <div className="relative">
-                <div className="w-12 h-12 border-4 border-gray-200 dark:border-gray-700 rounded-full animate-spin"></div>
-                <div className="absolute top-0 left-0 w-12 h-12 border-4 border-blue-600 border-t-transparent rounded-full animate-spin"></div>
-              </div>
-              
-              {/* Loading text */}
-              <div className="text-center">
-                <h2 className="text-lg font-semibold text-gray-900 dark:text-white mb-2">
-                  Loading...
-                </h2>
-                <p className="text-sm text-gray-600 dark:text-gray-300">
-                  Please wait while we prepare your content
-                </p>
-              </div>
-              
-              {/* Pulsing dots */}
-              <div className="flex space-x-1">
-                <div className="w-2 h-2 bg-blue-600 rounded-full animate-pulse"></div>
-                <div className="w-2 h-2 bg-blue-600 rounded-full animate-pulse" style={{ animationDelay: '0.2s' }}></div>
-                <div className="w-2 h-2 bg-blue-600 rounded-full animate-pulse" style={{ animationDelay: '0.4s' }}></div>
-              </div>
-            </div>
-          </Card>
-        </div>
-      </div>
-    </div>
-  )
-}
+import { Card, SkeletonCard, SkeletonText } from '@digilogiclabs/saas-factory-ui'
+
+export default function Loading() {
+  return (
+    <div className="min-h-screen bg-background">
+      <div className="container mx-auto px-4 py-8">
+        {/* Header skeleton */}
+        <div className="mb-8">
+          <SkeletonText className="h-8 w-64 mb-4" />
+          <SkeletonText className="h-4 w-96" />
+        </div>
+
+        {/* Cards grid skeleton */}
+        <div className="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-6 mb-8">
+          {Array.from({ length: 6 }).map((_, i) => (
+            <SkeletonCard key={i} />
+          ))}
+        </div>
+
+        {/* Centered loading spinner */}
+        <div className="flex justify-center">
+          <Card className="p-8 max-w-sm w-full mx-4">
+            <div className="flex flex-col items-center space-y-4">
+              {/* Animated spinner */}
+              <div className="relative">
+                <div className="w-12 h-12 border-4 border-border rounded-full animate-spin"></div>
+                <div className="absolute top-0 left-0 w-12 h-12 border-4 border-primary border-t-transparent rounded-full animate-spin"></div>
+              </div>
+
+              {/* Loading text */}
+              <div className="text-center">
+                <h2 className="text-lg font-semibold text-foreground mb-2">
+                  Loading...
+                </h2>
+                <p className="text-sm text-muted-foreground">
+                  Please wait while we prepare your content
+                </p>
+              </div>
+
+              {/* Pulsing dots */}
+              <div className="flex space-x-1">
+                <div className="w-2 h-2 bg-primary rounded-full animate-pulse"></div>
+                <div className="w-2 h-2 bg-primary rounded-full animate-pulse" style={{ animationDelay: '0.2s' }}></div>
+                <div className="w-2 h-2 bg-primary rounded-full animate-pulse" style={{ animationDelay: '0.4s' }}></div>
+              </div>
+            </div>
+          </Card>
+        </div>
+      </div>
+    </div>
+  )
+}

package/dist/templates/web/base/template/tsconfig.json

@@ -1,33 +1,27 @@
-{
-  "compilerOptions": {
-    "target": "es5",
-    "lib": ["dom", "dom.iterable", "es6"],
-    "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"
-      }
-    ],
-    "baseUrl": ".",
-    "paths": {
-      "@/*": ["./src/*"],
-      "@/components/*": ["./src/components/*"],
-      "@/lib/*": ["./src/lib/*"],
-      "@/hooks/*": ["./src/hooks/*"],
-      "@/types/*": ["./src/types/*"]
-    }
-  },
-  "include": ["next-env.d.ts", "**/*.ts", "**/*.tsx", ".next/types/**/*.ts"],
-  "exclude": ["node_modules"]
-}
-
+{
+  "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/iot-dashboard/template/next.config.js

@@ -1,14 +1,14 @@
-/** @type {import('next').NextConfig} */
-const nextConfig = {
-  reactStrictMode: true,
-  images: {
-    remotePatterns: [
-      {
-        protocol: 'https',
-        hostname: '**.supabase.co',
-      },
-    ],
-  },
-}
-
-module.exports = nextConfig
+/** @type {import('next').NextConfig} */
+const nextConfig = {
+  reactStrictMode: true,
+  images: {
+    remotePatterns: [
+      {
+        protocol: 'https',
+        hostname: '**',
+      },
+    ],
+  },
+}
+
+module.exports = nextConfig

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

@@ -8,39 +8,35 @@
     "build": "next build",
     "start": "next start",
     "lint": "next lint",
-    "type-check": "tsc --noEmit",
-    "test": "vitest",
-    "test:run": "vitest run"
+    "type-check": "tsc --noEmit"
   },
   "dependencies": {
-    "next": "^15.0.0",
+    "next": "^15.5.0",
     "react": "^19.0.0",
     "react-dom": "^19.0.0",
-    "@digilogiclabs/platform-core": "^1.13.0",
-    "@digilogiclabs/app-sdk": "^1.0.0",
-    "@digilogiclabs/saas-factory-ui": "^1.4.0",
-    "tailwindcss": "^4.0.0",
-    "clsx": "^2.0.0",
+    "@digilogiclabs/platform-core": "^1.14.0",
+    "@digilogiclabs/app-sdk": "^1.1.0",
+    "@digilogiclabs/saas-factory-ui": "^1.8.1",
+    "tailwindcss": "^4.1.0",
+    "@tailwindcss/postcss": "^4.1.0",
+    "clsx": "^2.1.0",
     "class-variance-authority": "^0.7.0",
-    "tailwind-merge": "^2.0.0",
+    "tailwind-merge": "^2.6.0",
     "next-themes": "^0.4.0",
     "lucide-react": "^0.460.0",
     "zod": "^4.1.0",
     "zustand": "^4.5.0",
-    "recharts": "^2.13.0",
+    "recharts": "^2.14.0",
     "date-fns": "^4.1.0"
   },
   "devDependencies": {
-    "typescript": "^5.7.0",
+    "typescript": "^5.8.0",
     "@types/node": "^22.0.0",
     "@types/react": "^19.0.0",
     "@types/react-dom": "^19.0.0",
     "eslint": "^9.0.0",
     "eslint-config-next": "^15.0.0",
-    "prettier": "^3.4.0",
-    "vitest": "^2.1.0",
-    "@testing-library/react": "^16.0.0",
-    "@testing-library/jest-dom": "^6.6.0"
+    "prettier": "^3.4.0"
   },
   "engines": {
     "node": ">=20.0.0"

package/dist/templates/web/iot-dashboard/template/postcss.config.mjs

@@ -0,0 +1,8 @@
+/** @type {import('postcss-load-config').Config} */
+const config = {
+  plugins: {
+    '@tailwindcss/postcss': {},
+  },
+};
+
+export default config;

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

@@ -0,0 +1,157 @@
+'use client'
+
+import { useState } from 'react'
+import { Button, Card } from '@digilogiclabs/saas-factory-ui'
+import { Bell, CheckCircle } from 'lucide-react'
+
+type Severity = 'critical' | 'warning' | 'info'
+type AlertStatus = 'active' | 'acknowledged'
+
+interface Alert {
+  id: number
+  severity: Severity
+  message: string
+  device: string
+  timestamp: string
+  status: AlertStatus
+}
+
+const ALERTS: Alert[] = [
+  { id: 1, severity: 'critical', message: 'Temperature exceeded 45°C threshold', device: 'Temp Sensor T-001', timestamp: '2 min ago', status: 'active' },
+  { id: 2, severity: 'critical', message: 'Device unresponsive for 10+ minutes', device: 'Motion Detector M-001', timestamp: '15 min ago', status: 'active' },
+  { id: 3, severity: 'warning', message: 'Signal strength below -80 dBm', device: 'Gateway B2', timestamp: '28 min ago', status: 'active' },
+  { id: 4, severity: 'warning', message: 'Firmware update available (v2.5.0)', device: 'Sensor Hub A1', timestamp: '1 hour ago', status: 'active' },
+  { id: 5, severity: 'info', message: 'Scheduled maintenance window approaching', device: 'All Devices', timestamp: '2 hours ago', status: 'active' },
+  { id: 6, severity: 'warning', message: 'Battery level below 20%', device: 'Humidity Sensor H-001', timestamp: '3 hours ago', status: 'acknowledged' },
+  { id: 7, severity: 'critical', message: 'Pressure reading outside safe range', device: 'Pressure Gauge P-001', timestamp: '4 hours ago', status: 'acknowledged' },
+  { id: 8, severity: 'info', message: 'New device registered successfully', device: 'Temp Sensor T-002', timestamp: '5 hours ago', status: 'acknowledged' },
+  { id: 9, severity: 'warning', message: 'High packet loss detected on network', device: 'Gateway B2', timestamp: '6 hours ago', status: 'active' },
+  { id: 10, severity: 'info', message: 'Daily telemetry summary generated', device: 'System', timestamp: '8 hours ago', status: 'acknowledged' },
+]
+
+const SEVERITY_OPTIONS = ['All', 'Critical', 'Warning', 'Info']
+const STATUS_OPTIONS = ['All', 'Active', 'Acknowledged']
+
+function severityDotColor(severity: Severity): string {
+  switch (severity) {
+    case 'critical': return 'bg-red-500'
+    case 'warning': return 'bg-amber-500'
+    case 'info': return 'bg-blue-500'
+  }
+}
+
+function severityLabel(severity: Severity): string {
+  return severity.charAt(0).toUpperCase() + severity.slice(1)
+}
+
+export default function AlertsPage() {
+  const [severityFilter, setSeverityFilter] = useState('All')
+  const [statusFilter, setStatusFilter] = useState('All')
+  const [alerts, setAlerts] = useState(ALERTS)
+
+  const filtered = alerts.filter((a) => {
+    if (severityFilter !== 'All' && a.severity !== severityFilter.toLowerCase()) return false
+    if (statusFilter !== 'All' && a.status !== statusFilter.toLowerCase()) return false
+    return true
+  })
+
+  const activeCount = alerts.filter((a) => a.status === 'active').length
+
+  const handleAcknowledge = (id: number) => {
+    setAlerts((prev) =>
+      prev.map((a) => (a.id === id ? { ...a, status: 'acknowledged' as AlertStatus } : a))
+    )
+  }
+
+  return (
+    <div className="min-h-screen bg-background">
+      <div className="max-w-7xl mx-auto px-4 sm:px-6 py-8">
+        {/* Header */}
+        <div className="mb-8">
+          <h1 className="text-2xl font-bold text-foreground">Alerts</h1>
+          <p className="text-sm text-muted-foreground">{activeCount} active alert{activeCount !== 1 ? 's' : ''}</p>
+        </div>
+
+        {/* Filter Bar */}
+        <Card className="p-4 mb-6">
+          <div className="flex flex-col sm:flex-row gap-3">
+            <select
+              value={severityFilter}
+              onChange={(e) => setSeverityFilter(e.target.value)}
+              className="px-3 py-2 rounded-md border border-input bg-background text-foreground text-sm focus:outline-none focus:ring-2 focus:ring-ring"
+            >
+              {SEVERITY_OPTIONS.map((s) => (
+                <option key={s} value={s}>{s === 'All' ? 'All Severities' : s}</option>
+              ))}
+            </select>
+            <select
+              value={statusFilter}
+              onChange={(e) => setStatusFilter(e.target.value)}
+              className="px-3 py-2 rounded-md border border-input bg-background text-foreground text-sm focus:outline-none focus:ring-2 focus:ring-ring"
+            >
+              {STATUS_OPTIONS.map((s) => (
+                <option key={s} value={s}>{s === 'All' ? 'All Statuses' : s}</option>
+              ))}
+            </select>
+          </div>
+        </Card>
+
+        {/* Alert List */}
+        {filtered.length === 0 ? (
+          <Card className="p-0">
+            <div className="flex flex-col items-center justify-center py-16 px-4">
+              <div className="w-16 h-16 bg-muted rounded-full flex items-center justify-center mb-4">
+                <Bell className="w-8 h-8 text-muted-foreground" />
+              </div>
+              <p className="text-foreground font-medium mb-1">No alerts found</p>
+              <p className="text-sm text-muted-foreground">Try adjusting your filters.</p>
+            </div>
+          </Card>
+        ) : (
+          <div className="space-y-3">
+            {filtered.map((alert) => (
+              <Card key={alert.id} className="p-4">
+                <div className="flex items-start gap-3">
+                  <div className={`w-2.5 h-2.5 rounded-full mt-1.5 shrink-0 ${severityDotColor(alert.severity)}`} />
+                  <div className="flex-1 min-w-0">
+                    <div className="flex flex-col sm:flex-row sm:items-center sm:justify-between gap-2">
+                      <div>
+                        <p className="text-sm font-medium text-foreground">{alert.message}</p>
+                        <div className="flex items-center gap-3 mt-1">
+                          <span className="text-xs text-muted-foreground">{alert.device}</span>
+                          <span className="text-xs text-muted-foreground">{alert.timestamp}</span>
+                          <span className={`text-xs px-1.5 py-0.5 rounded ${
+                            alert.severity === 'critical'
+                              ? 'bg-red-500/10 text-red-600'
+                              : alert.severity === 'warning'
+                              ? 'bg-amber-500/10 text-amber-600'
+                              : 'bg-blue-500/10 text-blue-600'
+                          }`}>
+                            {severityLabel(alert.severity)}
+                          </span>
+                        </div>
+                      </div>
+                      {alert.status === 'active' ? (
+                        <Button
+                          variant="outline"
+                          size="sm"
+                          onClick={() => handleAcknowledge(alert.id)}
+                          className="shrink-0"
+                        >
+                          <CheckCircle className="w-4 h-4 mr-1" />
+                          Acknowledge
+                        </Button>
+                      ) : (
+                        <span className="text-xs text-muted-foreground italic shrink-0">Acknowledged</span>
+                      )}
+                    </div>
+                  </div>
+                </div>
+              </Card>
+            ))}
+          </div>
+        )}
+      </div>
+    </div>
+  )
+}

package/dist/templates/web/iot-dashboard/template/src/app/api/auth/route.ts

@@ -0,0 +1,57 @@
+/**
+ * Demo auth API routes.
+ *
+ * POST /api/auth — Login or Signup
+ * DELETE /api/auth — Logout
+ *
+ * Replace with your real auth provider (Auth.js, Supabase Auth, etc.)
+ * when configuring your app for production.
+ */
+import { NextRequest, NextResponse } from 'next/server'
+import { cookies } from 'next/headers'
+
+export async function POST(request: NextRequest) {
+  try {
+    const body = await request.json()
+    const { email, password, action } = body
+
+    if (!email || !password) {
+      return NextResponse.json(
+        { error: 'Email and password are required' },
+        { status: 400 }
+      )
+    }
+
+    // Demo: accept any email/password combination.
+    // Replace with real authentication (database lookup, bcrypt compare, etc.)
+    const user = {
+      id: crypto.randomUUID(),
+      email,
+      name: email.split('@')[0],
+    }
+
+    const session = JSON.stringify({ user })
+    const cookieStore = await cookies()
+
+    cookieStore.set('session', session, {
+      httpOnly: true,
+      secure: process.env.NODE_ENV === 'production',
+      sameSite: 'lax',
+      path: '/',
+      maxAge: 60 * 60 * 24 * 7, // 7 days
+    })
+
+    return NextResponse.json({ user })
+  } catch {
+    return NextResponse.json(
+      { error: 'Authentication failed' },
+      { status: 500 }
+    )
+  }
+}
+
+export async function DELETE() {
+  const cookieStore = await cookies()
+  cookieStore.delete('session')
+  return NextResponse.json({ success: true })
+}