<?php
/**
 * Activity Log Admin Dashboard Template
 * Modern design matching Switchboard design system
 *
 * @package Switchboard
 * @since 1.0.0
 */

if (!defined('ABSPATH')) {
    exit;
}

// Get all unique users with activity logs
global $wpdb;
$table_name = $wpdb->prefix . 'switchboard_activity_log';
$users_with_logs = $wpdb->get_results("SELECT DISTINCT user_id, user_name FROM {$table_name} WHERE user_id > 0 ORDER BY user_name ASC");

// Get all WordPress roles
$wp_roles = wp_roles();
$all_roles = $wp_roles->get_names();

// Define action types
$action_types = [
    'user_login' => __('Login', 'wpswitchboard'),
    'user_logout' => __('Logout', 'wpswitchboard'),
    'login_failed' => __('Failed Login', 'wpswitchboard'),
    'post_created' => __('Post Created', 'wpswitchboard'),
    'post_published' => __('Post Published', 'wpswitchboard'),
    'post_draft' => __('Post Draft', 'wpswitchboard'),
    'post_pending' => __('Post Pending', 'wpswitchboard'),
    'post_trash' => __('Post Trashed', 'wpswitchboard'),
    'post_deleted' => __('Post Deleted', 'wpswitchboard'),
    'plugin_activated' => __('Plugin Activated', 'wpswitchboard'),
    'plugin_deactivated' => __('Plugin Deactivated', 'wpswitchboard'),
    'theme_switched' => __('Theme Switched', 'wpswitchboard'),
    'user_registered' => __('User Registered', 'wpswitchboard'),
    'user_deleted' => __('User Deleted', 'wpswitchboard'),
    'profile_updated' => __('Profile Updated', 'wpswitchboard'),
    'option_updated' => __('Option Updated', 'wpswitchboard'),
];

// Get severity levels
$severity_levels = SwitchboardActivityLog::get_severity_levels();
?>

<div class="wrap sb-module-wrap">
    <!-- Header -->
    <div class="sb-module-header">
        <div class="sb-module-header-left">
            <svg class="sb-module-title-icon" fill="none" stroke="currentColor" viewBox="0 0 24 24">
                <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M9 5H7a2 2 0 00-2 2v12a2 2 0 002 2h10a2 2 0 002-2V7a2 2 0 00-2-2h-2M9 5a2 2 0 002 2h2a2 2 0 002-2M9 5a2 2 0 012-2h2a2 2 0 012 2m-3 7h3m-3 4h3m-6-4h.01M9 16h.01"></path>
            </svg>
            <div>
                <h1 class="sb-module-title">
                    <?php esc_html_e('Activity Log', 'wpswitchboard'); ?>
                    <span class="switchboard-badge">SWITCHBOARD</span>
                </h1>
                <p class="sb-module-subtitle"><?php esc_html_e('Monitor all user activity on your site', 'wpswitchboard'); ?></p>
            </div>
        </div>
        <div class="sb-module-header-right">
            <a href="https://docs.wpswitchboard.com/modules/security/activity-log" target="_blank" class="sb-module-help-link">
                <span class="sb-module-help-link-icon dashicons dashicons-editor-help"></span>
                <?php esc_html_e('Help', 'wpswitchboard'); ?>
            </a>
        </div>
    </div>

    <!-- Stats Cards -->
    <div class="sb-module-stats">
        <div class="sb-module-stat-card">
            <div class="sb-module-stat-label"><?php esc_html_e('Total Events', 'wpswitchboard'); ?></div>
            <div class="sb-module-stat-content">
                <div class="sb-module-stat-value" id="stat-total-events">-</div>
            </div>
        </div>

        <div class="sb-module-stat-card">
            <div class="sb-module-stat-label"><?php esc_html_e('Today', 'wpswitchboard'); ?></div>
            <div class="sb-module-stat-content">
                <div class="sb-module-stat-value" id="stat-today">-</div>
            </div>
        </div>

        <div class="sb-module-stat-card">
            <div class="sb-module-stat-label"><?php esc_html_e('Failed Logins (30d)', 'wpswitchboard'); ?></div>
            <div class="sb-module-stat-content">
                <div class="sb-module-stat-value" id="stat-failed-logins">-</div>
            </div>
        </div>

        <div class="sb-module-stat-card">
            <div class="sb-module-stat-label"><?php esc_html_e('Unique Users', 'wpswitchboard'); ?></div>
            <div class="sb-module-stat-content">
                <div class="sb-module-stat-value" id="stat-unique-users">-</div>
            </div>
        </div>
    </div>

    <!-- Main Layout: Sidebar + Content -->
    <div class="sb-module-layout">
        <!-- Sidebar: Filters -->
        <div class="sb-module-sidebar">
            <div class="sb-module-card">
                <div class="sb-module-card-header">
                    <div class="sb-module-card-header-left">
                        <h2 class="sb-module-card-title"><?php esc_html_e('Filters', 'wpswitchboard'); ?></h2>
                        <span id="active-filters-count" class="activity-log-filter-badge" style="display: none;">0</span>
                    </div>
                </div>
                <div class="sb-module-card-body">
                    <form id="activity-log-filters" class="activity-log-filters-form">
                        <!-- Search -->
                        <div class="sb-module-field">
                            <label><?php esc_html_e('Search', 'wpswitchboard'); ?></label>
                            <input type="text" id="filter-search" name="search" class="sb-module-search-input" placeholder="<?php esc_attr_e('Users, objects, IPs...', 'wpswitchboard'); ?>">
                        </div>

                        <!-- Date Range -->
                        <div class="sb-module-field">
                            <label><?php esc_html_e('Date Range', 'wpswitchboard'); ?></label>
                            <select id="filter-date-preset" class="activity-log-select">
                                <option value="today"><?php esc_html_e('Today', 'wpswitchboard'); ?></option>
                                <option value="yesterday"><?php esc_html_e('Yesterday', 'wpswitchboard'); ?></option>
                                <option value="7days" selected><?php esc_html_e('Last 7 Days', 'wpswitchboard'); ?></option>
                                <option value="30days"><?php esc_html_e('Last 30 Days', 'wpswitchboard'); ?></option>
                                <option value="all"><?php esc_html_e('All Time', 'wpswitchboard'); ?></option>
                                <option value="custom"><?php esc_html_e('Custom Range', 'wpswitchboard'); ?></option>
                            </select>
                        </div>

                        <!-- Custom Date Range (hidden by default) -->
                        <div id="custom-date-range" class="activity-log-custom-dates" style="display: none;">
                            <div class="sb-module-field">
                                <label><?php esc_html_e('From', 'wpswitchboard'); ?></label>
                                <input type="date" id="filter-date-from" name="date_from" class="activity-log-input">
                            </div>
                            <div class="sb-module-field">
                                <label><?php esc_html_e('To', 'wpswitchboard'); ?></label>
                                <input type="date" id="filter-date-to" name="date_to" class="activity-log-input">
                            </div>
                        </div>

                        <!-- User Filter -->
                        <div class="sb-module-field">
                            <label><?php esc_html_e('User', 'wpswitchboard'); ?></label>
                            <select id="filter-user" name="user_id" class="activity-log-select">
                                <option value=""><?php esc_html_e('All Users', 'wpswitchboard'); ?></option>
                                <option value="0"><?php esc_html_e('Guests', 'wpswitchboard'); ?></option>
                                <?php foreach ($users_with_logs as $user): ?>
                                    <option value="<?php echo esc_attr($user->user_id); ?>">
                                        <?php echo esc_html($user->user_name); ?>
                                    </option>
                                <?php endforeach; ?>
                            </select>
                        </div>

                        <!-- Severity Filter -->
                        <div class="sb-module-field">
                            <label><?php esc_html_e('Severity', 'wpswitchboard'); ?></label>
                            <select id="filter-severity" name="severity" class="activity-log-select">
                                <option value=""><?php esc_html_e('All Severities', 'wpswitchboard'); ?></option>
                                <?php foreach ($severity_levels as $severity_key => $severity_label): ?>
                                    <option value="<?php echo esc_attr($severity_key); ?>">
                                        <?php echo esc_html($severity_label); ?>
                                    </option>
                                <?php endforeach; ?>
                            </select>
                        </div>

                        <!-- Action Type Filter -->
                        <div class="sb-module-field">
                            <label><?php esc_html_e('Action Type', 'wpswitchboard'); ?></label>
                            <select id="filter-action" name="action_type" class="activity-log-select">
                                <option value=""><?php esc_html_e('All Actions', 'wpswitchboard'); ?></option>
                                <?php foreach ($action_types as $action_key => $action_label): ?>
                                    <option value="<?php echo esc_attr($action_key); ?>">
                                        <?php echo esc_html($action_label); ?>
                                    </option>
                                <?php endforeach; ?>
                            </select>
                        </div>

                        <!-- Role Filter -->
                        <div class="sb-module-field">
                            <label><?php esc_html_e('Role', 'wpswitchboard'); ?></label>
                            <select id="filter-role" name="role" class="activity-log-select">
                                <option value=""><?php esc_html_e('All Roles', 'wpswitchboard'); ?></option>
                                <?php foreach ($all_roles as $role_key => $role_name): ?>
                                    <option value="<?php echo esc_attr($role_key); ?>">
                                        <?php echo esc_html($role_name); ?>
                                    </option>
                                <?php endforeach; ?>
                            </select>
                        </div>

                        <!-- IP Address Filter -->
                        <div class="sb-module-field">
                            <label><?php esc_html_e('IP Address', 'wpswitchboard'); ?></label>
                            <input type="text" id="filter-ip" name="ip_address" class="activity-log-input" placeholder="<?php esc_attr_e('e.g. 192.168.1.1', 'wpswitchboard'); ?>">
                        </div>

                        <!-- Filter Actions -->
                        <div class="sb-module-field" style="margin-top: 20px; padding-top: 16px; border-top: 1px solid var(--gray-200);">
                            <div class="sb-module-button-group" style="display: grid; grid-template-columns: 1fr 1fr; gap: 10px;">
                                <button type="button" id="apply-filters" class="sb-module-button sb-module-button-primary">
                                    <?php esc_html_e('Apply', 'wpswitchboard'); ?>
                                </button>
                                <button type="button" id="clear-filters" class="sb-module-button">
                                    <?php esc_html_e('Clear', 'wpswitchboard'); ?>
                                </button>
                            </div>
                        </div>
                    </form>
                </div>
            </div>

            <!-- Actions Card -->
            <div class="sb-module-card" style="margin-top: 20px;">
                <div class="sb-module-card-header">
                    <div class="sb-module-card-header-left">
                        <h2 class="sb-module-card-title"><?php esc_html_e('Actions', 'wpswitchboard'); ?></h2>
                    </div>
                </div>
                <div class="sb-module-card-body">
                    <div style="display: flex; flex-direction: column; gap: 10px;">
                        <button type="button" id="export-csv" class="activity-log-action-btn activity-log-action-btn-primary">
                            <svg width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M21 15v4a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2v-4"></path><polyline points="7 10 12 15 17 10"></polyline><line x1="12" y1="15" x2="12" y2="3"></line></svg>
                            <span><?php esc_html_e('Export to CSV', 'wpswitchboard'); ?></span>
                        </button>
                        <button type="button" id="refresh-logs" class="activity-log-action-btn">
                            <svg width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><polyline points="23 4 23 10 17 10"></polyline><polyline points="1 20 1 14 7 14"></polyline><path d="M3.51 9a9 9 0 0 1 14.85-3.36L23 10M1 14l4.64 4.36A9 9 0 0 0 20.49 15"></path></svg>
                            <span><?php esc_html_e('Refresh Data', 'wpswitchboard'); ?></span>
                        </button>
                    </div>

                    <!-- Auto-refresh toggle -->
                    <div class="activity-log-auto-refresh" style="margin-top: 16px; padding-top: 16px; border-top: 1px solid var(--gray-200);">
                        <label class="activity-log-toggle-wrapper">
                            <input type="checkbox" id="auto-refresh-toggle" class="activity-log-toggle-input">
                            <span class="activity-log-toggle-slider"></span>
                            <span class="activity-log-toggle-label"><?php esc_html_e('Auto-refresh', 'wpswitchboard'); ?></span>
                        </label>
                        <select id="auto-refresh-interval" class="activity-log-select activity-log-select-sm" style="margin-top: 8px; display: none;">
                            <option value="10">Every 10 seconds</option>
                            <option value="30" selected>Every 30 seconds</option>
                            <option value="60">Every minute</option>
                        </select>
                    </div>
                </div>
            </div>

            <!-- Danger Zone Card -->
            <div class="sb-module-card activity-log-danger-card" style="margin-top: 20px;">
                <div class="sb-module-card-header" style="background: #fef2f2; border-bottom-color: #fecaca;">
                    <div class="sb-module-card-header-left">
                        <h2 class="sb-module-card-title" style="color: #dc2626;"><?php esc_html_e('Danger Zone', 'wpswitchboard'); ?></h2>
                    </div>
                </div>
                <div class="sb-module-card-body">
                    <p style="font-size: 13px; color: var(--gray-500); margin: 0 0 12px 0;">
                        <?php esc_html_e('Permanently delete all activity logs. This cannot be undone.', 'wpswitchboard'); ?>
                    </p>
                    <button type="button" id="delete-all-logs" class="activity-log-action-btn activity-log-action-btn-danger">
                        <svg width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><polyline points="3 6 5 6 21 6"></polyline><path d="M19 6v14a2 2 0 0 1-2 2H7a2 2 0 0 1-2-2V6m3 0V4a2 2 0 0 1 2-2h4a2 2 0 0 1 2 2v2"></path><line x1="10" y1="11" x2="10" y2="17"></line><line x1="14" y1="11" x2="14" y2="17"></line></svg>
                        <span><?php esc_html_e('Delete All Logs', 'wpswitchboard'); ?></span>
                    </button>
                </div>
            </div>
        </div>

        <!-- Main Content: Results Table -->
        <div class="sb-module-main">
            <div class="sb-module-card">
                <div class="sb-module-card-header">
                    <div class="sb-module-card-header-left">
                        <h2 class="sb-module-card-title"><?php esc_html_e('Activity Log', 'wpswitchboard'); ?></h2>
                        <p class="sb-module-card-desc" id="results-summary"><?php esc_html_e('Loading...', 'wpswitchboard'); ?></p>
                    </div>
                    <div class="sb-module-card-header-right">
                        <div class="activity-log-bulk-actions" id="bulk-actions" style="display: none;">
                            <span class="activity-log-selected-count">
                                <span id="selected-count">0</span> <?php esc_html_e('selected', 'wpswitchboard'); ?>
                            </span>
                            <button type="button" id="delete-selected" class="sb-module-button sb-module-button-danger sb-module-button-sm">
                                <span class="dashicons dashicons-trash"></span>
                                <?php esc_html_e('Delete', 'wpswitchboard'); ?>
                            </button>
                        </div>
                        <div class="activity-log-per-page">
                            <label for="per-page"><?php esc_html_e('Show:', 'wpswitchboard'); ?></label>
                            <select id="per-page" class="activity-log-select activity-log-select-sm">
                                <option value="25">25</option>
                                <option value="50" selected>50</option>
                                <option value="100">100</option>
                            </select>
                        </div>
                    </div>
                </div>
                <div class="sb-module-card-body" style="padding: 0;">
                    <div class="sb-module-table-wrapper">
                        <table class="sb-module-table activity-log-table" id="activity-log-table">
                            <thead>
                                <tr>
                                    <th style="width: 40px;">
                                        <input type="checkbox" id="select-all" class="activity-log-checkbox">
                                    </th>
                                    <th class="sortable" data-column="created_at" style="width: 150px;">
                                        <?php esc_html_e('Date & Time', 'wpswitchboard'); ?> <span class="sort-indicator"></span>
                                    </th>
                                    <th class="sortable" data-column="user_name" style="width: 140px;">
                                        <?php esc_html_e('User', 'wpswitchboard'); ?> <span class="sort-indicator"></span>
                                    </th>
                                    <th style="width: 100px;"><?php esc_html_e('Role', 'wpswitchboard'); ?></th>
                                    <th class="sortable" data-column="action" style="width: 130px;">
                                        <?php esc_html_e('Action', 'wpswitchboard'); ?> <span class="sort-indicator"></span>
                                    </th>
                                    <th><?php esc_html_e('Details', 'wpswitchboard'); ?></th>
                                    <th style="width: 120px;"><?php esc_html_e('IP Address', 'wpswitchboard'); ?></th>
                                    <th style="width: 60px;"></th>
                                </tr>
                            </thead>
                            <tbody id="activity-log-tbody">
                                <tr>
                                    <td colspan="8" class="sb-module-empty" style="padding: 60px 20px;">
                                        <div class="sb-module-empty-icon dashicons dashicons-update" style="font-size: 48px; width: 48px; height: 48px; animation: spin 1s linear infinite;"></div>
                                        <p class="sb-module-empty-desc"><?php esc_html_e('Loading activity logs...', 'wpswitchboard'); ?></p>
                                    </td>
                                </tr>
                            </tbody>
                        </table>
                    </div>
                </div>
                <div class="sb-module-card-footer">
                    <span id="page-info" style="color: var(--gray-500); font-size: 14px; font-weight: 500;">-</span>
                    <div style="display: flex; gap: 8px; align-items: center;">
                        <button type="button" id="page-first" class="sb-module-button sb-module-button-secondary sb-module-button-sm" disabled title="<?php esc_attr_e('First Page', 'wpswitchboard'); ?>">
                            <svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><polyline points="11 17 6 12 11 7"></polyline><polyline points="18 17 13 12 18 7"></polyline></svg>
                        </button>
                        <button type="button" id="page-prev" class="sb-module-button sb-module-button-secondary sb-module-button-sm" disabled>
                            <svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><polyline points="15 18 9 12 15 6"></polyline></svg>
                            <?php esc_html_e('Previous', 'wpswitchboard'); ?>
                        </button>
                        <button type="button" id="page-next" class="sb-module-button sb-module-button-secondary sb-module-button-sm">
                            <?php esc_html_e('Next', 'wpswitchboard'); ?>
                            <svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><polyline points="9 18 15 12 9 6"></polyline></svg>
                        </button>
                        <button type="button" id="page-last" class="sb-module-button sb-module-button-secondary sb-module-button-sm" title="<?php esc_attr_e('Last Page', 'wpswitchboard'); ?>">
                            <svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><polyline points="13 17 18 12 13 7"></polyline><polyline points="6 17 11 12 6 7"></polyline></svg>
                        </button>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>

<!-- User Agent Modal -->
<div id="user-agent-modal" class="activity-log-modal" style="display: none;">
    <div class="activity-log-modal-overlay"></div>
    <div class="activity-log-modal-content">
        <div class="activity-log-modal-header">
            <h3><?php esc_html_e('User Agent Details', 'wpswitchboard'); ?></h3>
            <button type="button" class="activity-log-modal-close">&times;</button>
        </div>
        <div class="activity-log-modal-body">
            <pre id="user-agent-content" class="activity-log-user-agent-text"></pre>
        </div>
    </div>
</div>

<!-- Delete Confirmation Modal -->
<div id="delete-modal" class="activity-log-modal" style="display: none;">
    <div class="activity-log-modal-overlay"></div>
    <div class="activity-log-modal-content">
        <div class="activity-log-modal-header">
            <h3><?php esc_html_e('Confirm Delete', 'wpswitchboard'); ?></h3>
            <button type="button" class="activity-log-modal-close">&times;</button>
        </div>
        <div class="activity-log-modal-body">
            <p id="delete-message"><?php esc_html_e('Are you sure you want to delete the selected entries? This action cannot be undone.', 'wpswitchboard'); ?></p>
        </div>
        <div class="activity-log-modal-footer">
            <button type="button" class="sb-module-button activity-log-modal-cancel"><?php esc_html_e('Cancel', 'wpswitchboard'); ?></button>
            <button type="button" id="confirm-delete" class="sb-module-button sb-module-button-danger"><?php esc_html_e('Delete', 'wpswitchboard'); ?></button>
        </div>
    </div>
</div>

<style>
@keyframes spin {
    from { transform: rotate(0deg); }
    to { transform: rotate(360deg); }
}
</style>
