<?php
/**
 * Contact Us Floating Widget View
 *
 * Renders a circular floating Contact Us button at bottom-right of plugin admin pages
 * and the modal/panel markup used by the front-end script for direct submission.
 *
 * @package    MOMCS_Sync
 * @subpackage MOMCS_Sync\views\src\common\components
 * @author     miniOrange
 */

declare(strict_types=1);

namespace MOMCS_Sync\Views\Src\Common\Components;

use MOMCS_Sync\Includes\Common\Constants\Plugin_Constants;

if ( ! defined( 'ABSPATH' ) ) {
	exit;
}

/**
 * Class Contact_Us_View
 */
class Contact_Us_View {
	/**
	 * Render the floating widget markup.
	 *
	 * @return void
	 */
	public function render(): void {
		$current_user   = wp_get_current_user();
		$first_name     = $current_user && isset( $current_user->user_firstname ) ? $current_user->user_firstname : '';
		$last_name      = $current_user && isset( $current_user->user_lastname ) ? $current_user->user_lastname : '';
		$plugin_name    = 'Multi-channel for WooCommerce';
		$plugin_version = defined( 'MOMCS_VERSION' ) ? MOMCS_VERSION : '';
		$site_url       = site_url();

		// Localize data for JS in a scoped inline script to avoid duplicates.
		$vars = array(
			'contact_us_url' => apply_filters( 'momcs_contact_us_remote_url', Plugin_Constants::CONTACT_US_REMOTE_URL ),
			'support_email'  => Plugin_Constants::SUPPORT_EMAIL,
			'first_name'     => $first_name,
			'last_name'      => $last_name,
			'plugin_name'    => $plugin_name,
			'version'        => $plugin_version,
			'site_url'       => $site_url,
		);

		?>
		<div id="momcs-contact-us-button" class="momcs-contact-us-button" title="<?php echo esc_attr__( 'Contact Us', 'multi-channel-for-woocommerce' ); ?>">
			<span class="dashicons dashicons-email"></span>
		</div>

		<div id="momcs-contact-us-modal" class="momcs-contact-us-modal" aria-hidden="true">
			<div class="momcs-contact-us-modal__content" role="dialog" aria-modal="true" aria-labelledby="momcs-contact-us-title">
				<button type="button" class="momcs-contact-us-close" id="momcs-contact-us-close" aria-label="<?php echo esc_attr__( 'Close', 'multi-channel-for-woocommerce' ); ?>">&times;</button>
				<h2 id="momcs-contact-us-title"><?php echo esc_html__( 'Contact Us', 'multi-channel-for-woocommerce' ); ?></h2>
				<div class="momcs-contact-us-form">
					<label for="momcs_contact_email"><?php echo esc_html__( 'Your Email', 'multi-channel-for-woocommerce' ); ?></label>
					<input type="email" id="momcs_contact_email" placeholder="<?php echo esc_attr__( 'name@example.com', 'multi-channel-for-woocommerce' ); ?>" />

					<label for="momcs_contact_query" class="momcs-contact-us-label-margin"><?php echo esc_html__( 'Your Message', 'multi-channel-for-woocommerce' ); ?></label>
					<textarea id="momcs_contact_query" rows="5" placeholder="<?php echo esc_attr__( 'How can we help?', 'multi-channel-for-woocommerce' ); ?>"></textarea>

					<div id="momcs-contact-us-error" class="momcs-contact-us-alert momcs-contact-us-alert--error" style="display:none;"></div>
					<div id="momcs-contact-us-success" class="momcs-contact-us-alert momcs-contact-us-alert--success" style="display:none;"></div>

					<div class="momcs-contact-us-actions">
						<button id="momcs-contact-us-submit" class="button button-primary"><?php echo esc_html__( 'Submit', 'multi-channel-for-woocommerce' ); ?></button>
						<div id="momcs-contact-us-loading" class="momcs-contact-us-loading" style="display:none;"></div>
					</div>
				</div>
			</div>
		</div>

		<?php
	}
}


