<?= $this->extend('layouts/mobile') ?>

<?= $this->section('header') ?>
<?= view('layouts/_inner_header', ['title' => $title ?? 'Contact Support']) ?>
<?= $this->endSection() ?>

<?= $this->section('content') ?>
<?php
$state  = $state ?? [
    'name_locked'          => false,
    'phone_locked'         => false,
    'email'                => '',
    'profile_name'         => '',
    'phone'                => '',
    'support_category_id'  => '',
    'message'              => '',
    'categories'           => [],
    'categories_available' => true,
];
$errors = $errors ?? [];
$invalid = static function (string $key) use ($errors): string {
    return isset($errors[$key]) ? ' is-invalid' : '';
};
?>
<p class="page-lead">Contact us if you face any issues with the application or have any questions/suggestions for us and our team will be happy to help you!</p>

<?php if (isset($errors['form']) && ($errors['form'] === \App\Services\SupportService::MSG_NO_CATEGORIES || $errors['form'] === \App\Services\SupportService::MSG_FAIL)): ?>
    <div class="flash flash-error" role="alert"><?= esc($errors['form']) ?></div>
<?php endif; ?>

<form class="auth-form support-form" method="post" action="<?= site_url('support') ?>">
    <?= csrf_field() ?>

    <label class="field-label" for="support_profile_name">Profile Name <span class="req">*</span></label>
    <input
        class="field-input<?= $invalid('profile_name') ?>"
        type="text"
        id="support_profile_name"
        maxlength="100"
        autocomplete="name"
        value="<?= esc($state['profile_name'] ?? '') ?>"
        <?php if (! empty($state['name_locked'])): ?>
            readonly tabindex="-1"
        <?php else: ?>
            name="profile_name" required
        <?php endif; ?>
    >
    <?php if (isset($errors['profile_name'])): ?>
        <p class="field-error" role="alert"><?= esc($errors['profile_name']) ?></p>
    <?php endif; ?>

    <label class="field-label" for="support_email">Email <span class="req">*</span></label>
    <input class="field-input" type="email" id="support_email" value="<?= esc($state['email'] ?? '') ?>" readonly tabindex="-1" autocomplete="off">

    <label class="field-label" for="support_phone">Phone Number</label>
    <input
        class="field-input<?= $invalid('phone') ?>"
        type="tel"
        id="support_phone"
        maxlength="20"
        autocomplete="tel"
        placeholder="+91 (555) 555 - 5555"
        value="<?= esc($state['phone'] ?? '') ?>"
        <?php if (! empty($state['phone_locked'])): ?>
            readonly tabindex="-1"
        <?php else: ?>
            name="phone"
        <?php endif; ?>
    >
    <?php if (isset($errors['phone'])): ?>
        <p class="field-error" role="alert"><?= esc($errors['phone']) ?></p>
    <?php endif; ?>

    <label class="field-label" for="support_category_id">How can we help? <span class="req">*</span></label>
    <select class="field-input<?= $invalid('support_category_id') ?>" id="support_category_id" name="support_category_id" <?= empty($state['categories_available']) ? 'disabled' : 'required' ?>>
        <option value="">- Select -</option>
        <?php foreach (($state['categories'] ?? []) as $category): ?>
            <option value="<?= (int) $category['id'] ?>" <?= (string) ($state['support_category_id'] ?? '') === (string) $category['id'] ? 'selected' : '' ?>><?= esc($category['title']) ?></option>
        <?php endforeach; ?>
    </select>
    <?php if (isset($errors['support_category_id'])): ?>
        <p class="field-error" role="alert"><?= esc($errors['support_category_id']) ?></p>
    <?php endif; ?>

    <label class="field-label" for="support_message">Message <span class="req">*</span></label>
    <textarea class="field-input support-message<?= $invalid('message') ?>" id="support_message" name="message" rows="5" maxlength="4000" required><?= esc($state['message'] ?? '') ?></textarea>
    <?php if (isset($errors['message'])): ?>
        <p class="field-error" role="alert"><?= esc($errors['message']) ?></p>
    <?php endif; ?>

    <button class="btn-primary" type="submit" <?= empty($state['categories_available']) ? 'disabled' : '' ?>>Submit Support Request</button>
</form>
<?= $this->endSection() ?>
