<?php
declare(strict_types=1);

/** @var string $clientId */
/** @var string $clientSecret */
/** @var string $oauthJson */
/** @var null|array $diag */
/** @var bool $isConnected */
/** @var bool $reconnectRequired */
/** @var null|string $tokenError */
/** @var list<array{site_url:string,site_type:string,permission_level:string,fetched_at:string,is_enabled:int,enabled_at:?string,last_sync_date:?string,last_sync_at:?string,last_sync_error:?string}> $properties */
/** @var string $syncMode */
/** @var string $syncRowLimit */
/** @var string $syncSleepMs */
/** @var string $breakdownsPolicy */
/** @var array $quickWinCfg */
/** @var null|string $lastSyncSummary */

$csrf = \SeoScope\Auth\AdminCsrf::token();
$formRedirect = (string) ($_SERVER['REQUEST_URI'] ?? '/settings?tab=google');
?>

<div class="section-title mb-2"><?= seoscope_h(__('settings.google.title')) ?></div>
<div class="section-subtitle mb-3"><?= seoscope_h(__('settings.google.subtitle')) ?></div>

<div class="text-muted small mb-3">
    <strong><?= seoscope_h(__('settings.google.step1_label')) ?></strong>
    <?= seoscope_h(__('settings.google.step1_text')) ?>
</div>

<div id="oauth-credentials"></div>
<form method="post" action="<?= seoscope_h(seoscope_url('/settings/google')) ?>" enctype="multipart/form-data">
    <input type="hidden" name="_csrf" value="<?= seoscope_h($csrf) ?>">
    <input type="hidden" name="redirect" value="<?= seoscope_h($formRedirect) ?>">

    <div class="row g-4">
        <div class="col-12 col-lg-6">
            <div class="dashboard-card section-card" style="background: rgba(255,255,255,0.70);">
                <div class="section-title mb-1"><?= seoscope_h(__('settings.google.json.title')) ?></div>
                <div class="section-subtitle mb-3"><?= seoscope_h(__('settings.google.json.subtitle')) ?></div>

                <div class="mb-3">
                    <label class="form-label"><?= seoscope_h(__('settings.google.json.upload')) ?></label>
                    <input class="form-control" type="file" name="oauth_json_file" accept=".json,application/json">
                </div>

                <div class="mb-0">
                    <label class="form-label"><?= seoscope_h(__('settings.google.json.paste')) ?></label>
                    <textarea class="form-control" name="oauth_json" rows="8" placeholder="{ ... }"><?= seoscope_h($oauthJson) ?></textarea>
                </div>
            </div>
        </div>

        <div class="col-12 col-lg-6">
            <div class="dashboard-card section-card" style="background: rgba(255,255,255,0.70);">
                <div class="section-title mb-1"><?= seoscope_h(__('settings.google.manual.title')) ?></div>
                <div class="section-subtitle mb-3"><?= seoscope_h(__('settings.google.manual.subtitle')) ?></div>

                <div class="mb-3">
                    <label class="form-label"><?= seoscope_h(__('settings.google.client_id')) ?></label>
                    <input class="form-control" name="client_id" value="<?= seoscope_h($clientId) ?>" placeholder="xxxx.apps.googleusercontent.com">
                </div>
                <div class="mb-0">
                    <label class="form-label"><?= seoscope_h(__('settings.google.client_secret')) ?></label>
                    <input class="form-control" type="password" name="client_secret" value="<?= seoscope_h($clientSecret) ?>" placeholder="••••••••••••••••" autocomplete="off">
                </div>
            </div>
        </div>
    </div>

    <div class="mt-4 d-flex gap-3 flex-wrap">
        <button type="submit" class="btn-login" style="max-width: 320px;"><?= seoscope_h(__('settings.google.save')) ?></button>
    </div>

    <p class="helper-text mt-4 mb-0">
        <?= seoscope_h(__('settings.google.note_plaintext')) ?>
    </p>
</form>

<div class="text-muted small mt-4 mb-3">
    <strong><?= seoscope_h(__('settings.google.step2_label')) ?></strong>
    <?= seoscope_h(__('settings.google.step2_text')) ?>
</div>

<div id="oauth-connect"></div>
<div class="dashboard-card section-card mb-4" style="background: rgba(255,255,255,0.70);">
    <div class="d-flex align-items-center justify-content-between flex-wrap gap-3">
        <div>
            <div class="section-title mb-1"><?= seoscope_h(__('settings.google.oauth.title')) ?></div>
            <div class="section-subtitle mb-0"><?= seoscope_h(__('settings.google.oauth.subtitle')) ?></div>
        </div>
        <div class="d-flex align-items-center gap-2 flex-wrap">
            <?php if (!empty($isConnected)): ?>
                <span class="badge <?= !empty($reconnectRequired) ? 'bg-warning text-dark' : 'bg-success' ?>">
                    <?= seoscope_h(!empty($reconnectRequired) ? __('settings.google.oauth.status_reconnect') : __('settings.google.oauth.status_connected')) ?>
                </span>
                <form method="post" action="<?= seoscope_h(seoscope_url('/settings/google/refresh')) ?>" class="m-0">
                    <input type="hidden" name="_csrf" value="<?= seoscope_h($csrf) ?>">
                    <input type="hidden" name="redirect" value="<?= seoscope_h($formRedirect) ?>">
                    <button type="submit" class="btn btn-upgrade"><?= seoscope_h(__('settings.google.oauth.refresh_now')) ?></button>
                </form>
                <form method="post" action="<?= seoscope_h(seoscope_url('/settings/google/disconnect')) ?>" class="m-0" onsubmit="return confirm('<?= seoscope_h(__('settings.google.oauth.disconnect_confirm')) ?>');">
                    <input type="hidden" name="_csrf" value="<?= seoscope_h($csrf) ?>">
                    <input type="hidden" name="redirect" value="<?= seoscope_h($formRedirect) ?>">
                    <button type="submit" class="btn btn-upgrade"><?= seoscope_h(__('settings.google.oauth.disconnect')) ?></button>
                </form>
                <?php if (!empty($reconnectRequired)): ?>
                    <form method="post" action="<?= seoscope_h(seoscope_url('/settings/google/connect')) ?>" class="m-0">
                        <input type="hidden" name="_csrf" value="<?= seoscope_h($csrf) ?>">
                        <input type="hidden" name="redirect" value="<?= seoscope_h($formRedirect) ?>">
                        <button type="submit" class="btn btn-upgrade"><?= seoscope_h(__('settings.google.oauth.reconnect')) ?></button>
                    </form>
                <?php endif; ?>
            <?php else: ?>
                <form method="post" action="<?= seoscope_h(seoscope_url('/settings/google/connect')) ?>" class="m-0">
                    <input type="hidden" name="_csrf" value="<?= seoscope_h($csrf) ?>">
                    <input type="hidden" name="redirect" value="<?= seoscope_h($formRedirect) ?>">
                    <button type="submit" class="btn btn-upgrade"><?= seoscope_h(__('settings.google.oauth.connect')) ?></button>
                </form>
            <?php endif; ?>
        </div>
    </div>
    <div class="helper-text mt-3 mb-0">
        <?= seoscope_h(__('settings.google.oauth.note')) ?>
    </div>
    <?php if (!empty($tokenError) && is_string($tokenError)): ?>
        <div class="text-muted small mt-2">
            <?= seoscope_h(__('settings.google.oauth.last_error')) ?>
            <?= seoscope_h($tokenError) ?>
        </div>
    <?php endif; ?>
</div>

<div class="dashboard-card section-card mb-4" style="background: rgba(255,255,255,0.70);">
    <div class="d-flex align-items-center justify-content-between flex-wrap gap-3">
        <div>
            <div class="section-title mb-1"><?= seoscope_h(__('settings.google.sync.title')) ?></div>
            <div class="section-subtitle mb-0"><?= seoscope_h(__('settings.google.sync.subtitle')) ?></div>
        </div>
    </div>

    <form method="post" action="<?= seoscope_h(seoscope_url('/settings/google/sync-config')) ?>" class="mt-3">
        <input type="hidden" name="_csrf" value="<?= seoscope_h($csrf) ?>">
        <input type="hidden" name="redirect" value="<?= seoscope_h($formRedirect) ?>">

        <div class="row g-3">
            <div class="col-12 col-lg-7">
                <label class="form-label"><?= seoscope_h(__('settings.google.sync.mode')) ?></label>
                <select class="form-select" name="sync_mode">
                    <option value="last_30_days" <?= ($syncMode ?? '') === 'last_30_days' ? 'selected' : '' ?>>
                        <?= seoscope_h(__('settings.google.sync.mode_last_30')) ?>
                    </option>
                    <option value="last_3_months" <?= ($syncMode ?? '') === 'last_3_months' ? 'selected' : '' ?>>
                        <?= seoscope_h(__('settings.google.sync.mode_last_3')) ?>
                    </option>
                    <option value="last_12_months" <?= ($syncMode ?? '') === 'last_12_months' ? 'selected' : '' ?>>
                        <?= seoscope_h(__('settings.google.sync.mode_last_12')) ?>
                    </option>
                    <option value="last_16_months" <?= ($syncMode ?? '') === 'last_16_months' ? 'selected' : '' ?>>
                        <?= seoscope_h(__('settings.google.sync.mode_last_16')) ?>
                    </option>
                </select>
            </div>
            <div class="col-12 col-lg-5">
                <label class="form-label"><?= seoscope_h(__('settings.google.sync.row_limit')) ?></label>
                <input class="form-control" type="number" name="sync_row_limit" min="1" max="25000" value="<?= seoscope_h((string) ($syncRowLimit ?? '25000')) ?>">
                <div class="text-muted small mt-2"><?= seoscope_h(__('settings.google.sync.row_limit_help')) ?></div>
            </div>
            <div class="col-12">
                <?php /* Device/Country toggle removed: property-level breakdowns are always collected for home widgets. */ ?>
            </div>
        </div>

        <div class="mt-3">
            <button type="submit" class="btn btn-upgrade"><?= seoscope_h(__('settings.google.sync.save')) ?></button>
        </div>
    </form>
</div>

<div class="accordion mb-4" id="ss-google-advanced">
    <div class="accordion-item">
        <h2 class="accordion-header" id="ss-ga-advanced-h">
            <button class="accordion-button collapsed" type="button" data-bs-toggle="collapse" data-bs-target="#ss-ga-advanced" aria-expanded="false" aria-controls="ss-ga-advanced">
                <?= seoscope_h(__('settings.google.advanced_title')) ?>
            </button>
        </h2>
        <div id="ss-ga-advanced" class="accordion-collapse collapse" aria-labelledby="ss-ga-advanced-h" data-bs-parent="#ss-google-advanced">
            <div class="accordion-body">
                <div class="dashboard-card section-card mb-4" style="background: rgba(255,255,255,0.70);">
                    <div class="d-flex align-items-center justify-content-between flex-wrap gap-3">
                        <div>
                            <div class="section-title mb-1"><?= seoscope_h(__('settings.google.sync.safety_title')) ?></div>
                            <div class="section-subtitle mb-0"><?= seoscope_h(__('settings.google.sync.safety_subtitle')) ?></div>
                        </div>
                    </div>
                    <form method="post" action="<?= seoscope_h(seoscope_url('/settings/google/sync-safety')) ?>" class="mt-3">
                        <input type="hidden" name="_csrf" value="<?= seoscope_h($csrf) ?>">
                        <input type="hidden" name="redirect" value="<?= seoscope_h($formRedirect) ?>">
                        <div class="row g-3">
                            <div class="col-12 col-lg-5">
                                <label class="form-label"><?= seoscope_h(__('settings.google.sync.sleep_ms')) ?></label>
                                <input class="form-control" type="number" name="sync_sleep_ms" min="0" max="2000" value="<?= seoscope_h((string) ($syncSleepMs ?? '100')) ?>">
                                <div class="text-muted small mt-2"><?= seoscope_h(__('settings.google.sync.sleep_ms_help')) ?></div>
                            </div>
                        </div>
                        <div class="mt-3">
                            <button type="submit" class="btn btn-upgrade"><?= seoscope_h(__('settings.google.sync.save')) ?></button>
                        </div>
                    </form>
                </div>

                <div class="dashboard-card section-card mb-4" style="background: rgba(255,255,255,0.70);">
                    <div class="d-flex align-items-center justify-content-between flex-wrap gap-3">
                        <div>
                            <div class="section-title mb-1"><?= seoscope_h(__('settings.google.sync.run_title')) ?></div>
                            <div class="section-subtitle mb-0"><?= seoscope_h(__('settings.google.sync.run_subtitle')) ?></div>
                        </div>
                        <form method="post" action="<?= seoscope_h(seoscope_url('/settings/google/sync/run')) ?>" class="m-0">
                            <input type="hidden" name="_csrf" value="<?= seoscope_h($csrf) ?>">
                            <input type="hidden" name="redirect" value="<?= seoscope_h($formRedirect) ?>">
                            <button type="submit" class="btn btn-upgrade" <?= empty($isConnected) ? 'disabled' : '' ?>>
                                <?= seoscope_h(__('settings.google.sync.run_now')) ?>
                            </button>
                        </form>
                    </div>
                    <?php if (!empty($lastSyncSummary) && is_string($lastSyncSummary)): ?>
                        <div class="text-muted small mt-3">
                            <?= seoscope_h(__('settings.google.sync.last_summary')) ?>
                            <code><?= seoscope_h($lastSyncSummary) ?></code>
                        </div>
                    <?php endif; ?>
                    <div class="text-muted small mt-2"><?= seoscope_h(__('settings.google.sync.run_note')) ?></div>
                </div>

                <div class="mt-3">
                    <a class="text-decoration-none" href="<?= seoscope_h(seoscope_url('/settings?' . http_build_query(['tab' => 'diagnostics']))) ?>">
                        <?= seoscope_h(__('settings.google.sync.logs_view_in_diagnostics')) ?>
                        <span class="text-muted" aria-hidden="true"> →</span>
                    </a>
                </div>
            </div>
        </div>
    </div>
</div>

