# Multi Landing Pages System

## Overview

Sistem ini memungkinkan Anda untuk memiliki multiple landing pages dengan desain yang berbeda dan dapat mengaktifkan/menonaktifkan landing pages melalui panel admin tanpa menghapus landing page yang sudah ada.

## Features

### 🎨 Multiple Landing Page Types
- **Classic**: Desain tradisional dengan skema warna amber
- **Modern**: Desain modern dengan tema gelap dan gradien
- **Minimal**: Desain minimalis dengan fokus pada konten
- **Corporate**: Desain profesional untuk institusi pemerintah

### 🛠️ Management Features
- **CRUD Operations**: Create, Read, Update, Delete landing pages
- **Active/Inactive Toggle**: Aktifkan atau nonaktifkan landing pages
- **Default Selection**: Pilih landing page default yang akan ditampilkan
- **Settings & Metadata**: Konfigurasi khusus untuk setiap landing page
- **Admin Panel**: Interface yang user-friendly untuk mengelola landing pages

## API Endpoints

### Get All Landing Pages
```bash
GET /api/landing-pages
```

### Get Active Landing Page
```bash
GET /api/landing-pages/active
```

### Create Landing Page
```bash
POST /api/landing-pages
Content-Type: application/json

{
  "name": "New Landing Page",
  "slug": "new-page",
  "title": "Title",
  "description": "Description",
  "type": "CLASSIC",
  "path": "/landing-pages/new",
  "isActive": true,
  "isDefault": false
}
```

### Update Landing Page
```bash
PUT /api/landing-pages/[id]
```

### Delete Landing Page
```bash
DELETE /api/landing-pages/[id]
```

### Toggle Active Status
```bash
POST /api/landing-pages/[id]/toggle
Content-Type: application/json

{
  "isActive": true
}
```

### Set Default Landing Page
```bash
POST /api/landing-pages/[id]/set-default
```

## Admin Panel

Akses admin panel di: `/admin/landing-pages`

### Features:
- **List View**: Melihat semua landing pages dengan statusnya
- **Create**: Menambah landing page baru
- **Edit**: Mengedit landing page yang ada
- **Delete**: Menghapus landing page (tidak bisa menghapus default)
- **Toggle Active**: Mengaktifkan/menonaktifkan landing page
- **Set Default**: Menjadikan landing page sebagai default
- **Preview**: Membuka landing page di tab baru

## File Structure

```
src/app/
├── page.tsx                          # Main router (redirects to active landing page)
├── admin/
│   └── landing-pages/
│       └── page.tsx                  # Admin panel
├── landing-pages/
│   ├── classic/
│   │   └── page.tsx                  # Classic landing page
│   ├── modern/
│   │   └── page.tsx                  # Modern landing page
│   ├── minimal/
│   │   └── page.tsx                  # Minimal landing page (placeholder)
│   └── corporate/
│       └── page.tsx                  # Corporate landing page (placeholder)
└── api/
    └── landing-pages/
        ├── route.ts                  # GET all, POST create
        ├── [id]/
        │   └── route.ts              # GET by ID, PUT update, DELETE
        ├── [id]/
        │   └── toggle/
        │       └── route.ts          # POST toggle active
        ├── [id]/
        │   └── set-default/
        │       └── route.ts          # POST set default
        └── active/
            └── route.ts              # GET active landing page
```

## Database Schema

```sql
model LandingPage {
  id          String        @id @default(cuid())
  name        String        @unique
  slug        String        @unique
  title       String
  description String?
  type        LandingPageType @default(CLASSIC)
  path        String        @unique
  isActive    Boolean       @default(false)
  isDefault   Boolean       @default(false)
  settings    Json?         // Landing page specific settings
  metadata    Json?         // SEO metadata, custom configs
  createdAt   DateTime      @default(now())
  updatedAt   DateTime      @updatedAt
}

enum LandingPageType {
  CLASSIC     // Original landing page design
  MODERN      // Modern landing page design
  MINIMAL     // Minimal landing page design
  CORPORATE   // Corporate landing page design
}
```

## How It Works

1. **Main Page Router**: `src/app/page.tsx` akan mencari landing page yang aktif dan default, kemudian redirect ke path tersebut.

2. **Active Landing Page Logic**:
   - Pertama, cari landing page dengan `isDefault: true` dan `isActive: true`
   - Jika tidak ada, cari landing page pertama dengan `isActive: true`
   - Jika tidak ada sama sekali, tampilkan fallback page

3. **Admin Management**: Admin dapat mengelola landing pages melalui panel admin di `/admin/landing-pages`

4. **Dynamic Switching**: Landing page dapat diubah kapan saja tanpa perlu deployment ulang

## Usage Examples

### Switch to Modern Landing Page
```bash
# Get modern landing page ID
curl -s http://localhost:3000/api/landing-pages | jq '.data[] | select(.slug=="modern") | .id'

# Set as default
curl -X POST http://localhost:3000/api/landing-pages/[MODERN_ID]/set-default
```

### Create New Landing Page
```bash
curl -X POST http://localhost:3000/api/landing-pages \
  -H "Content-Type: application/json" \
  -d '{
    "name": "Custom Landing Page",
    "slug": "custom",
    "title": "Custom Title",
    "description": "Custom description",
    "type": "CLASSIC",
    "path": "/landing-pages/custom",
    "isActive": true,
    "isDefault": false
  }'
```

### Deactivate Landing Page
```bash
curl -X POST http://localhost:3000/api/landing-pages/[ID]/toggle \
  -H "Content-Type: application/json" \
  -d '{"isActive": false}'
```

## Seeding Data

Untuk membuat landing pages awal, jalankan:
```bash
npx tsx prisma/seed-landing-pages.ts
```

Ini akan membuat 4 landing pages:
- Classic (active & default)
- Modern (inactive)
- Minimal (inactive)
- Corporate (inactive)

## Security Notes

- Landing page default tidak dapat dihapus
- Hanya admin yang dapat mengakses panel admin
- Path validation untuk mencegah directory traversal
- Input validation untuk semua API endpoints

## Future Enhancements

- [ ] Template system untuk landing pages
- [ ] A/B testing functionality
- [ ] Analytics integration
- [ ] Custom CSS/JS injection per landing page
- [ ] Component-based landing page builder
- [ ] Preview mode for inactive pages