<?php

declare(strict_types=1);
// Variables: $baseUrl, $assetsUrl, $project, $user, $navItems, $tables, $pagesConfig, $currentTableName, $pageTitle
?>
<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0, viewport-fit=cover">
    <title><?= htmlspecialchars($project['name'] ?? 'Project') ?> - Pages</title>

    <?php include constant('BASE_PATH') . '/core/views/project-head.php'; ?>
    <link rel="stylesheet" href="<?= htmlspecialchars($assetsUrl) ?>/css/module-guide.css?v=<?= (int) @filemtime(constant('BASE_PATH') . '/public/assets/css/module-guide.css') ?>">

    <?= \PpPhp\Core\ModuleAssets::style('Pages', 'Views/styles.css') ?>
</head>

<body class="pages-module">
    <?php include __DIR__ . '/partials/shell.php'; ?>

    <div id="mainArea" class="main-area">
        <!-- Left panel: tables -->
        <div class="left-panel pages-table-panel">
            <div class="panel-header pages-panel-header">
                <div>
                    <span class="pages-panel-kicker">Data source</span>
                    <strong>Tables</strong>
                </div>
                <span class="pages-table-count" id="pagesTableCount"><?= count($tables) ?></span>
            </div>
            <div class="pages-table-search">
                <i class="bi bi-search" aria-hidden="true"></i>
                <input type="search" id="pagesTableSearch" placeholder="Find a table…" aria-label="Find a table">
                <button type="button" id="clearPagesTableSearch" aria-label="Clear table search" title="Clear the table search" hidden><i class="bi bi-x-lg"></i></button>
            </div>
            <ul class="table-list" id="pagesTableList">
                <?php foreach ($tables as $t): ?>
                    <li data-table="<?= htmlspecialchars($t['name']) ?>" tabindex="0" role="button" aria-label="Configure pages for <?= htmlspecialchars($t['name']) ?>">
                        <span class="pages-table-icon"><i class="bi bi-<?= $t['type'] === 'VIEW' ? 'eye' : 'table' ?>"></i></span>
                        <span class="pages-table-name"><?= htmlspecialchars($t['name']) ?></span>
                        <i class="bi bi-chevron-right pages-table-arrow" aria-hidden="true"></i>
                    </li>
                <?php endforeach; ?>
            </ul>
            <div class="pages-table-empty" id="pagesTableEmpty" hidden>
                <i class="bi bi-search"></i><span>No matching tables</span>
            </div>
        </div>

        <!-- Right workspace: page config -->
        <div class="right-workspace">
            <div class="toolbar" id="pagesToolbar">
                <button class="btn btn-sm btn-outline-secondary d-md-none me-1" id="btnTogglePageList" title="Show or hide the table list">
                    <i class="bi bi-list"></i> Tables
                </button>
                <span class="pages-toolbar-icon"><i class="bi bi-window-stack"></i></span>
                <span class="pages-toolbar-context">
                    <small>Page configuration</small>
                    <strong id="selectedTableLabel">Select a table</strong>
                </span>
                <button type="button" class="pp-guide-trigger ms-auto" data-bs-toggle="modal" data-bs-target="#pagesGuideModal" title="Open the complete Pages module guide" aria-label="Open the Pages module guide">
                    <i class="bi bi-question-circle"></i><span>Guide</span>
                </button>
                <span class="pages-toolbar-hint d-none d-sm-inline"><i class="bi bi-cloud-check"></i> Changes save automatically</span>
            </div>
            <div class="workspace-content" id="pagesWorkspace">
                <?php include __DIR__ . '/partials/page_config.php'; ?>
            </div>
            <?php include __DIR__ . '/partials/settings_modal.php'; ?>
            <?php include __DIR__ . '/partials/key_columns_modal.php'; ?>
            <?php include __DIR__ . '/partials/click_action_modal.php'; ?>
        </div>
    </div>
    <?php include __DIR__ . '/partials/guide.php'; ?>

    <?php include constant('BASE_PATH') . '/core/views/project-scripts.php'; ?>
    <script src="<?= htmlspecialchars($assetsUrl) ?>/js/module-guide.js"></script>

    <script>
        const projectSlug = <?= json_encode($project['slug'] ?? '') ?>;
        const baseUrl = <?= json_encode($baseUrl) ?>;
        const dbTables = <?= json_encode($tables) ?>;
        const pagesConfig = <?= json_encode($pagesConfig ?: new stdClass()) ?>;
        // Import/export formats come from the DataOps registry, so registering a
        // new format makes its checkbox appear here with no change to this view.
        const ppFormats = <?= json_encode([
            'exports' => \PpPhp\Core\DataOps\FormatRegistry::exportChoices(),
            'readers' => \PpPhp\Core\DataOps\FormatRegistry::readerChoices(),
        ]) ?>;
        let currentTableName = <?= json_encode($currentTableName) ?>;
    </script>


    <!-- Modular scripts (order matters) -->
    <?= \PpPhp\Core\ModuleAssets::script('Pages', 'Views/scripts/core.js') ?>
    <?= \PpPhp\Core\ModuleAssets::script('Pages', 'Views/scripts/modals.js') ?>
    <?= \PpPhp\Core\ModuleAssets::script('Pages', 'Views/scripts/ui.js') ?>
    <?= \PpPhp\Core\ModuleAssets::script('Pages', 'Views/scripts/save.js') ?>
    <?= \PpPhp\Core\ModuleAssets::script('Pages', 'Views/scripts/init.js') ?>

    
</body>

</html>
