<?php
if (!defined('VFM_APP')) {
    return;
}
?>
<div class="row mb-3">
    <div class="col-sm-12">
        <div class="card" id="view-oauth">
            <div class="card-header d-flex justify-content-center align-items-center">
                <h4 class="m-0"><i class="bi bi-shield-lock"></i> OAuth</h4>
                <button type="button" class="btn ms-auto" data-bs-toggle="collapse" data-bs-target="#card-oauth" aria-expanded="false">
                    <i class="bi bi-dash-lg"></i>
                </button>
            </div>
            <div class="collapse show" id="card-oauth">
                <div class="card-body">
                <?php if (version_compare(PHP_VERSION, '8.1.0', '<')) { ?>
                    <div class="alert alert-warning">
                        <i class="bi bi-exclamation-triangle"></i>
                        OAuth requires PHP 8.1 or higher.
                    </div>
                <?php } else { ?>
                    <p>Enter the Client ID and Secret. A provider is automatically enabled when its Client ID is set.</p>
                    <div class="row">
                        <div class="col-md-6 mb-3">
                            <div class="d-flex">
                                <h5 class="mb-3"><i class="bi bi-google"></i> Google</h5>
                                <a href="#" type="button" class="btn ms-auto" data-bs-toggle="collapse" data-bs-target="#oauth-google-help" aria-expanded="false"><i class="bi bi-question-circle-fill"></i></a>
                            </div>
                            <div class="form-group mb-3 small">
                                <div class="collapse" id="oauth-google-help">
                                    <p>Go to the <a target="_blank" href="https://console.cloud.google.com/apis/credentials"><u>Google Cloud Console</u></a> to create your credentials.</p>
                                    <ol class="m-0">
                                        <li>Click <strong>CREATE CREDENTIALS</strong> and select <strong>OAuth client ID</strong>.</li>
                                        <li>Set the Application type to <strong>Web application</strong>.</li>
                                        <li>Under <strong>Authorized redirect URIs</strong>, add this exact URL:<br><code><?php echo $setUp->getConfig("script_url", ""); ?>vfm-admin/assets/oauth/callback.php</code></li>
                                        <li>Copy the generated Client ID and Client Secret below.</li>
                                    </ol>
                                </div>
                            </div>
                            <div class="form-group mb-3">
                                <label class="form-label">Client ID</label>
                                <input class="form-control" type="text" name="oauth_google_client_id" value="<?php echo $setUp->getConfig("oauth_google_client_id", ""); ?>">
                            </div>
                            <div class="form-group mb-3">
                                <label class="form-label">Client Secret</label>
                                <input class="form-control" type="text" name="oauth_google_client_secret" value="" placeholder="<?php echo $admin->secretPlaceholder($setUp->getConfig("oauth_google_client_secret", "")); ?>" autocomplete="off">
                            </div>
                        </div>

                        <div class="col-md-6 mb-3">
                            <div class="d-flex">
                                <h5 class="mb-3"><i class="bi bi-github"></i> GitHub</h5>
                                <a href="#" type="button" class="btn ms-auto" data-bs-toggle="collapse" data-bs-target="#oauth-github-help" aria-expanded="false"><i class="bi bi-question-circle-fill"></i></a>
                            </div>
                            <div class="form-group mb-3 small">
                                <div class="collapse" id="oauth-github-help">
                                    <p>Go to your <a target="_blank" href="https://github.com/settings/developers"><u>GitHub Developer Settings</u></a> to create a new App.</p>
                                    <ol class="m-0">
                                        <li>Click <strong>New OAuth App</strong>.</li>
                                        <li>Fill in your application details.</li>
                                        <li>For the <strong>Authorization callback URL</strong>, use this exact URL:<br>
                                            <code><?php echo $setUp->getConfig("script_url", ""); ?>vfm-admin/assets/oauth/callback.php</code></li>
                                        <li>Click <strong>Register application</strong>, then copy the Client ID and generate a Client Secret.</li>
                                    </ol>
                                </div>
                            </div>

                            <div class="form-group mb-3">
                                <label class="form-label">Client ID</label>
                                <input class="form-control" type="text" name="oauth_github_client_id" value="<?php echo $setUp->getConfig("oauth_github_client_id", ""); ?>">
                            </div>
                            <div class="form-group mb-3">
                                <label class="form-label">Client Secret</label>
                                <input class="form-control" type="text" name="oauth_github_client_secret" value="" placeholder="<?php echo $admin->secretPlaceholder($setUp->getConfig("oauth_github_client_secret", "")); ?>" autocomplete="off">
                            </div>
                        </div>
                    </div>

                    <div class="row">
                        <div class="col-md-6 mb-3">
                            <div class="d-flex">
                                <h5 class="mb-3"><i class="bi bi-linkedin"></i> LinkedIn</h5>
                                <a href="#" type="button" class="btn ms-auto" data-bs-toggle="collapse" data-bs-target="#oauth-linkedin-help" aria-expanded="false"><i class="bi bi-question-circle-fill"></i></a>
                            </div>
                            <div class="form-group mb-3 small">
                                    <div class="collapse" id="oauth-linkedin-help">
                                    <p>Create a new App on the <a href="https://www.linkedin.com/developers/apps/new" target="_blank"><u>LinkedIn Developer Portal</u></a>, then follow these steps:</p>
                                    <ol class="m-0">
                                        <li>Go to the <strong>Products</strong> tab and add <strong>Sign In with LinkedIn using OpenID Connect</strong>.</li>
                                        <li>Go to the <strong>Auth</strong> tab to find your Client ID and Client Secret.</li>
                                        <li>On that same page, under "OAuth 2.0 settings", add your required callback URL:<br>
                                            <code><?php echo $setUp->getConfig("script_url", ""); ?>vfm-admin/assets/oauth/callback.php</code>
                                        </li>
                                        <li>Ensure the <code>openid</code>, <code>profile</code>, and <code>email</code> scopes are enabled.</li>
                                    </ol>
                                </div>
                            </div>
                            <div class="form-group mb-3">
                                <label class="form-label">Client ID</label>
                                <input class="form-control" type="text" name="oauth_linkedin_client_id" value="<?php echo $setUp->getConfig("oauth_linkedin_client_id", ""); ?>">
                            </div>
                            <div class="form-group mb-3">
                                <label class="form-label">Client Secret</label>
                                <input class="form-control" type="text" name="oauth_linkedin_client_secret" value="" placeholder="<?php echo $admin->secretPlaceholder($setUp->getConfig("oauth_linkedin_client_secret", "")); ?>" autocomplete="off">
                            </div>
                        </div>
                    </div>
                <?php } ?>
                </div>
            </div>
        </div>
    </div>
</div>
