<?php include APP_PATH . '/views/layouts/header.php'; ?>

<div class="container-fluid">
    <!-- Page Header -->
    <div class="page-header">
        <h1>Add New Template</h1>
        <nav aria-label="breadcrumb">
            <ol class="breadcrumb">
                <li class="breadcrumb-item"><a href="<?php echo URL_PATH; ?>/admin/dashboard">Dashboard</a></li>
                <li class="breadcrumb-item"><a href="<?php echo URL_PATH; ?>/admin/templates">Templates</a></li>
                <li class="breadcrumb-item active">Add New</li>
            </ol>
        </nav>
    </div>
    
    <div class="row">
        <div class="col-lg-8">
            <div class="card">
                <div class="card-header">
                    <i class="bi bi-file-plus"></i> Template Information
                </div>
                <div class="card-body">
                    <?php if (isset($errorMessage)): ?>
                        <div class="alert alert-danger alert-dismissible fade show" role="alert">
                            <i class="bi bi-exclamation-triangle"></i>
                            <?php echo $errorMessage; ?>
                            <button type="button" class="btn-close" data-bs-dismiss="alert"></button>
                        </div>
                    <?php endif; ?>
                    
                    <form method="POST" action="<?php echo URL_PATH; ?>/admin/templates/create" class="needs-validation" novalidate>
                        <div class="mb-3">
                            <label for="name" class="form-label">Template Name *</label>
                            <input type="text" class="form-control" id="name" name="name" 
                                   value="<?php echo htmlspecialchars($_POST['name'] ?? ''); ?>" 
                                   placeholder="e.g., Birthday Wish 1" required>
                            <div class="invalid-feedback">Please enter a template name</div>
                        </div>
                        
                        <div class="mb-3">
                            <label for="description" class="form-label">Description</label>
                            <input type="text" class="form-control" id="description" name="description" 
                                   value="<?php echo htmlspecialchars($_POST['description'] ?? ''); ?>" 
                                   placeholder="Brief description of this template">
                            <small class="text-muted">Optional - helps identify the template</small>
                        </div>
                        
                        <div class="mb-3">
                            <label for="content" class="form-label">Template Content *</label>
                            <textarea class="form-control" id="content" name="content" rows="6" 
                                      placeholder="Happy Birthday! 🎉 Wishing you a wonderful day..." required><?php echo htmlspecialchars($_POST['content'] ?? ''); ?></textarea>
                            <small class="text-muted">This message will be used for WhatsApp and SMS</small>
                            <div class="invalid-feedback">Please enter template content</div>
                        </div>
                        
                        <div class="mb-3">
                            <label for="status" class="form-label">Status *</label>
                            <select class="form-select" id="status" name="status" required>
                                <option value="active" <?php echo (isset($_POST['status']) && $_POST['status'] === 'active') || !isset($_POST['status']) ? 'selected' : ''; ?>>Active</option>
                                <option value="inactive" <?php echo (isset($_POST['status']) && $_POST['status'] === 'inactive') ? 'selected' : ''; ?>>Inactive</option>
                            </select>
                            <small class="text-muted">Only active templates are visible to users</small>
                        </div>
                        
                        <hr>
                        
                        <div class="d-flex justify-content-between">
                            <a href="<?php echo URL_PATH; ?>/admin/templates" class="btn btn-secondary">
                                <i class="bi bi-arrow-left"></i> Cancel
                            </a>
                            <button type="submit" class="btn btn-primary">
                                <i class="bi bi-save"></i> Create Template
                            </button>
                        </div>
                    </form>
                </div>
            </div>
        </div>
        
        <div class="col-lg-4">
            <div class="card">
                <div class="card-header">
                    <i class="bi bi-info-circle"></i> Template Guidelines
                </div>
                <div class="card-body">
                    <h6>Tips for creating templates:</h6>
                    <ul class="small">
                        <li>Keep messages short and sweet</li>
                        <li>Use emojis to make it more personal 🎂🎉</li>
                        <li>Templates can be used for WhatsApp and SMS</li>
                        <li>Active templates appear in the PWA app</li>
                        <li>You can create multiple templates for variety</li>
                    </ul>
                    
                    <h6 class="mt-3">Example Templates:</h6>
                    <div class="alert alert-light small">
                        "Happy Birthday! 🎉 Wishing you a wonderful day filled with joy and happiness!"
                    </div>
                    <div class="alert alert-light small">
                        "Many happy returns of the day! 🎂 May all your dreams come true!"
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>

<?php include APP_PATH . '/views/layouts/footer.php'; ?>
