<?php
/**
 * Activation form view template
 *
 * @package FinalPOS
 */

if ( ! defined( 'ABSPATH' ) ) {
	die( 'Direct access is not allowed.' );
}

// Check site status for warnings.
$site_status = FinalPOS_Common::get_site_status_warnings();
$can_proceed = $site_status['can_proceed'];
$warnings    = $site_status['warnings'];
?>
<div class="finalpos-activation-form">
	<?php if ( ! empty( $warnings ) ) : ?>
		<?php foreach ( $warnings as $warning ) : ?>
			<div class="notice notice-<?php echo 'error' === $warning['type'] ? 'error' : 'warning'; ?>">
				<p><?php echo wp_kses_post( $warning['message'] ); ?></p>
			</div>
		<?php endforeach; ?>
	<?php endif; ?>

	<h2 class="finalpos-title-large"><?php esc_html_e( 'Welcome to Final POS! Let\'s connect your WooCommerce store:', 'finalpos' ); ?></h2>

	<div class="finalpos-steps">
		<div class="finalpos-three-steps">
			<div class="finalpos-step">
				<div class="finalpos-step-number">1</div>
				<div class="finalpos-step-content">
					<h3><?php esc_html_e( 'Enter your authentication key below and click Connect', 'finalpos' ); ?></h3>
					<p><?php esc_html_e( 'You can find this in Hub under Settings -> WooCommerce, after installing the WooCommerce extension in your Hub account.', 'finalpos' ); ?></p>
				</div>
			</div>
			<div class="finalpos-step">
				<div class="finalpos-step-number">2</div>
				<div class="finalpos-step-content">
					<h3><?php esc_html_e( 'Approve connection to your WooCommerce store', 'finalpos' ); ?></h3>
					<p><?php esc_html_e( 'Final POS requires "Read/Write" access to work properly.', 'finalpos' ); ?></p>
				</div>
			</div>
			<div class="finalpos-step">
				<div class="finalpos-step-number">3</div>
				<div class="finalpos-step-content">
					<h3><?php esc_html_e( 'Configure your sync preferences to finish setup', 'finalpos' ); ?></h3>
					<p><?php esc_html_e( 'Select the product categories you need, and how far back to sync historical orders from WooCommerce.', 'finalpos' ); ?></p>
					<div class="finalpos-sync-options">
						<div class="finalpos-sync-option">
							<span class="finalpos-checkmark">
								<img src="<?php echo esc_url( FINALPOS_PLUGIN_URL . 'assets/img/checkmark.svg' ); ?>" alt="Checkmark">
							</span>
							<span><?php esc_html_e( 'Products', 'finalpos' ); ?></span>
						</div>
						<div class="finalpos-sync-option">
							<span class="finalpos-checkmark">
								<img src="<?php echo esc_url( FINALPOS_PLUGIN_URL . 'assets/img/checkmark.svg' ); ?>" alt="Checkmark">
							</span>
							<span><?php esc_html_e( 'Registered Customers', 'finalpos' ); ?></span>
						</div>
						<div class="finalpos-sync-option">
							<span class="finalpos-checkmark">
								<img src="<?php echo esc_url( FINALPOS_PLUGIN_URL . 'assets/img/checkmark.svg' ); ?>" alt="Checkmark">
							</span>
							<span><?php esc_html_e( 'Orders', 'finalpos' ); ?></span>
						</div>
					</div>
				</div>
			</div>
		</div>
		<div class="finalpos-steps-image">
			<img src="<?php echo esc_url( FINALPOS_PLUGIN_URL . 'assets/img/woocommerce-sync.svg' ); ?>" alt="WooCommerce Sync Screenshot">
		</div>
	</div>

	<div class="finalpos-auth-box">
		<div class="finalpos-auth-instructions">
			<p><?php esc_html_e( 'Enter activation key', 'finalpos' ); ?></p>

			<form method="post" action="<?php echo esc_url( admin_url( 'admin-post.php' ) ); ?>">
				<?php wp_nonce_field( 'final_activation_action', 'final_activation_nonce' ); ?>
				<input type="hidden" name="action" value="final_verify_activation_key">

				<div class="finalpos-auth-input-group">
					<input type="text" id="activation_key" name="activation_key" value=""
						placeholder="<?php esc_attr_e( 'XXXXX-XXX-XXXXXXX', 'finalpos' ); ?>"
						<?php echo $can_proceed ? '' : 'readonly'; ?>>
					<button type="submit" class="finalpos-button" <?php echo $can_proceed ? '' : 'disabled'; ?>><?php esc_html_e( 'Connect', 'finalpos' ); ?></button>
				</div>

				<?php
				$error_message = get_transient( 'finalpos_setup_error' );
				// phpcs:ignore WordPress.Security.NonceVerification.Recommended -- Display-only page showing redirect messages.
				if ( isset( $_GET['error'] ) ) :
					?>
					<p class="finalpos-error-message"><?php echo esc_html( sanitize_text_field( wp_unslash( $_GET['error'] ) ) ); ?></p>
				<?php // phpcs:ignore WordPress.Security.NonceVerification.Recommended -- Display-only page showing redirect messages. ?>
				<?php elseif ( isset( $_GET['message'] ) ) : ?>
					<p class="finalpos-success-message"><?php echo esc_html( sanitize_text_field( wp_unslash( $_GET['message'] ) ) ); ?></p>
				<?php elseif ( $error_message ) : ?>
					<p class="finalpos-error-message"><?php echo esc_html( $error_message ); ?></p>
					<?php delete_transient( 'finalpos_setup_error' ); ?>
				<?php endif; ?>
			</form>
		</div>
		<div class="finalpos-auth-image">
			<img src="<?php echo esc_url( FINALPOS_PLUGIN_URL . 'assets/img/auth-icon.svg' ); ?>" alt="Auth Icon">
		</div>
	</div>

	<div class="finalpos-no-account">
		<?php esc_html_e( 'Don\'t have an account yet?', 'finalpos' ); ?>
		<a href="https://finalpos.com/sign-up" target="_blank" class="finalpos-link-to-hub"><?php esc_html_e( 'Sign up', 'finalpos' ); ?></a>
	</div>
</div>
