{% extends "base.html" %}
{% block title %}{{ t('profile') }} | {{ app_name }}{% endblock %}
{% block content %}
    <section class="panel narrow-panel">
        <div class="panel-header">
            <h1>{{ t('profile') }}</h1>
            <p>{{ t('profile_subtitle') }}</p>
        </div>
        <form method="post" class="form-grid two-column">
            {{ form.hidden_tag() }}
            <label>{{ form.first_name.label }} {{ form.first_name(class="input") }}</label>
            <label>{{ form.last_name.label }} {{ form.last_name(class="input") }}</label>
            <label>{{ form.email.label }} {{ form.email(class="input") }}</label>
            <label>
                {{ form.phone.label }}
                {{ form.phone(class="input", placeholder="+9665XXXXXXXX") }}
                <small class="field-help">{{ ltext('Use the same mobile number that you will share with Telegram. / استخدم نفس رقم الموبايل الذي ستشاركه مع تيليجرام.') }}</small>
            </label>
            <label>{{ form.title.label }} {{ form.title(class="input") }}</label>
            <label>{{ form.timezone.label }} {{ form.timezone(class="input") }}</label>
            <label>{{ form.locale.label }} {{ form.locale(class="input") }}</label>
            <div class="form-actions">
                {{ form.submit(class="button") }}
                <a href="{{ url_for('auth.change_password') }}" class="button button-secondary">{{ t('change_password') }}</a>
            </div>
        </form>
    </section>

    <section class="panel narrow-panel">
        <div class="panel-header">
            <h2>{{ ltext('Telegram Notifications / إشعارات تيليجرام') }}</h2>
            <p>{{ ltext('Link your account once, then every ticket email alert will also be delivered in Telegram. / اربط حسابك مرة واحدة، وبعدها ستصلك إشعارات التذاكر التي تُرسل بالبريد أيضاً على تيليجرام.') }}</p>
        </div>

        {% if current_user.telegram_chat_id %}
            <div class="telegram-link-box is-linked">
                <strong>{{ ltext('Telegram is linked. / تيليجرام مربوط.') }}</strong>
                <span>{{ ltext('Current chat ID / معرّف المحادثة الحالي') }}: {{ current_user.telegram_chat_id }}</span>
            </div>
        {% elif active_telegram_link %}
            <div class="telegram-link-box is-pending">
                <strong>{{ ltext('Telegram link request is pending. / طلب ربط تيليجرام قيد الانتظار.') }}</strong>
                <span>{{ ltext('Open the bot, press Start, then share your mobile number from Telegram. / افتح البوت واضغط Start ثم شارك رقم الموبايل من داخل تيليجرام.') }}</span>
                <span>{{ ltext('Expires at / ينتهي في') }}: {{ active_telegram_link.expires_at.strftime('%Y-%m-%d %H:%M UTC') }}</span>
            </div>
        {% else %}
            <div class="telegram-link-box">
                <strong>{{ ltext('Telegram is not linked yet. / تيليجرام غير مربوط بعد.') }}</strong>
                <span>{{ ltext('The system will verify your mobile number before saving the Telegram chat. / سيتحقق النظام من رقم موبايلك قبل حفظ محادثة تيليجرام.') }}</span>
            </div>
        {% endif %}

        <div class="button-row">
            {% if telegram_enabled and current_user.phone %}
                {% if not current_user.telegram_chat_id %}
                    <form method="post" action="{{ url_for('users.connect_telegram') }}">
                        <input type="hidden" name="csrf_token" value="{{ csrf_token() }}">
                        <button type="submit" class="button">{{ ltext('Connect Telegram / ربط تيليجرام') }}</button>
                    </form>
                {% endif %}
                <form method="post" action="{{ url_for('users.refresh_telegram_link') }}">
                    <input type="hidden" name="csrf_token" value="{{ csrf_token() }}">
                    <button type="submit" class="button button-secondary">{{ ltext('Refresh Telegram Status / تحديث حالة تيليجرام') }}</button>
                </form>
                {% if current_user.telegram_chat_id %}
                    <form method="post" action="{{ url_for('users.disconnect_telegram') }}">
                        <input type="hidden" name="csrf_token" value="{{ csrf_token() }}">
                        <button type="submit" class="button button-secondary">{{ ltext('Disconnect Telegram / فصل تيليجرام') }}</button>
                    </form>
                {% endif %}
            {% endif %}
        </div>

        <div class="field-help">
            {% if not telegram_enabled %}
                {{ ltext('Telegram notifications are currently disabled by the administrator. / إشعارات تيليجرام معطلة حالياً من قبل الإدارة.') }}
            {% elif not current_user.phone %}
                {{ ltext('Save your mobile number first, then start the Telegram link process. / احفظ رقم الموبايل أولاً، ثم ابدأ ربط تيليجرام.') }}
            {% elif active_telegram_link and not current_user.telegram_chat_id %}
                {{ ltext('If you are testing locally without a public webhook, press Start in Telegram, share your number, then return to this page or press Refresh Telegram Status. / إذا كنت تختبر محلياً بدون webhook عام، اضغط Start في تيليجرام وشارك رقمك ثم ارجع إلى هذه الصفحة أو اضغط تحديث حالة تيليجرام.') }}
            {% elif telegram_bot_username %}
                {{ ltext('Bot username / اسم مستخدم البوت') }}: @{{ telegram_bot_username }}
            {% else %}
                {{ ltext('The bot username could not be loaded right now, but the link request can still be created if Telegram is configured correctly. / لم يتم تحميل اسم المستخدم الخاص بالبوت حالياً، لكن يمكن إنشاء طلب الربط إذا كانت إعدادات تيليجرام صحيحة.') }}
            {% endif %}
        </div>
    </section>

    <section class="panel narrow-panel">
        <div class="panel-header">
            <h2>{{ t('setup_mfa') }}</h2>
            <p>{{ t('mfa_enabled') if current_user.two_factor_enabled else t('mfa_disabled') }}</p>
        </div>
        <div class="button-row">
            {% if current_user.has_role('super-admin') %}
                {% if current_user.two_factor_enabled %}
                    <a href="{{ url_for('auth.disable_mfa') }}" class="button button-secondary">{{ t('disable_mfa') }}</a>
                {% else %}
                    <a href="{{ url_for('auth.setup_mfa') }}" class="button">{{ t('enable_mfa') }}</a>
                {% endif %}
            {% else %}
                <span class="muted-text">{{ ltext('MFA for users is controlled by the super admin. / تفعيل وإلغاء MFA للمستخدمين يتم من قبل السوبر أدمن.') }}</span>
            {% endif %}
        </div>
    </section>
{% endblock %}