<?php if ( ! defined( 'ABSPATH' ) ) exit; ?>
<?php if ( !isset($_GET['user_nonce']) || !wp_verify_nonce(sanitize_text_field(wp_unslash($_GET['user_nonce'])), 'Copuloo') ) {} ?>
<div class="copuloo-admin-wrap">
<?php if (isset($_GET['error1'])) { echo wp_kses_post('<div class="copuloo-notice copuloo-notice-error"><p><strong>Error Adding Phone Number!</strong> Either the phone number or username that was entered was invalid.</p><button class="copuloo-notice-dismiss">Dismiss</button></div>'); }  ?>
<?php if (isset($_GET['success'])) { echo wp_kses_post('<div class="copuloo-notice copuloo-notice-success"><p><strong>Phone Number Successfully Added!</strong> You have successfully added the phone number.</p><button class="copuloo-notice-dismiss">Dismiss</button></div>'); }  ?>
 
    <div class="copuloo-card">
        <h2 class="copuloo-title">Add A Managed Number From Twilio</h2>
        <p class="copuloo-description">Phone numbers can be quickly and easily obtained through the Copuloo dashboard on the Find a Number page. However if you already have a Twilio number or prefer to purchase one directly from Twilio, WordPress administrators can use this page to manually import and manage those numbers.</p>
    </div>

    <div class="copuloo-card">
        <h2 class="copuloo-title">Manually Adding Phone Numbers</h2>
        <p class="copuloo-description">Follow these steps to manually add a phone number to a WordPress user's account:</p>
        <ol class="copuloo-list">
            <li>Go to your Twilio account.</li>
            <li>Purchase the requested phone number.</li>
            <li>Under Voice Configuration, set the Configure with field to your TwiML app created during setup.</li>
            <li>Under Messaging Configuration, set the Configure with field to your TwiML app created during setup.</li>
            <li>Ensure the webhooks are set to HTTP-POST request.</li>
            <li>Enter the full phone number in the form below to complete the setup.</li>
        </ol>
    </div>

    <div class="copuloo-card">
        <h2 class="copuloo-title">Manually Add A Managed Number</h2>
        <p class="copuloo-description">When added, this phone number will become the user's active phone number and replace any existing one.</p>
        <form action="<?php echo esc_url(admin_url('admin-post.php')); ?>" method="post">
            <?php wp_nonce_field('Copuloo', 'user_nonce'); ?>
            <input type="hidden" name="action" value="copuloo_add_managed_number">
            <div class="copuloo-form-group">
                <label for="countrycode" class="copuloo-label">Country Code</label>
                <div class="copuloo-input-group">
                    <?php
                    // Escaped inside the copuloo_country_code() function
                    echo copuloo_country_code('none', 'countrycode'); // phpcs:ignore WordPress.Security.EscapeOutput
                    ?>
                </div>
            </div>
            <div class="copuloo-form-group">
                <label for="phone" class="copuloo-label">Phone Number</label>
                <input required type="tel" name="phone" id="phone" inputmode="numeric" pattern="[0-9]+" placeholder="Enter phone number" class="copuloo-input">
            </div>
            <div class="copuloo-form-group">
                <label for="phone" class="copuloo-label">Phone Number SID Key</label>
                <input required type="text" name="phonenumbersid" id="phonenumbersid" placeholder="Enter the Twilio phone number SID key" class="copuloo-input">
            </div>
            <div class="copuloo-form-group">
                <label for="user" class="copuloo-label">WordPress User ID or Username</label>
                <input required type="text" name="user" id="user" placeholder="Enter user ID or username" class="copuloo-input">
            </div>
            <div class="copuloo-form-group">
                <button type="submit" class="copuloo-button copuloo-button-primary">Add Number</button>
                <p class="copuloo-help-text">Refer to the "Information" tab to understand the process for assigning a managed phone number to a user.</p>
            </div>
        </form>
    </div>
</div>
