{% extends "base.html" %}
{% import "macros/admin_management_header.html" as mh %}

{% block extra_head %}
{% include "partials/workspace_ui_head.html" %}
{% endblock %}

{% block page_title %}Link Telegram{% endblock %}

{% block content %}
<main class="mx-auto max-w-3xl px-4 py-6 text-foreground sm:px-6">
    {{ mh::management_header_simple(
        title="Link Telegram",
        subtitle="Connect a Telegram chat to your Blocks account so bots can recognize you.",
        title_heading="h1",
        include_actions_column=false
    ) }}

    <section class="blocks-workspace-panel" aria-label="Telegram account linking">
        {% if status == "linked" %}
        <div class="mb-4 rounded-lg border border-success bg-success/10 p-4" role="status">
            <strong>Telegram linked.</strong> Chat <code>{{ chat_id }}</code> is connected
            {% if label %} ({{ label }}){% endif %}.
        </div>
        <p class="text-muted">You can message the bot again for product-specific commands (for example license keys if Zephyre Licenses is enabled).</p>

        {% elif status == "error" %}
        <div class="mb-4 rounded-lg border border-danger bg-danger/10 p-4" role="alert">{{ error }}</div>
        {% if login_redirect_url %}
        {# Break out of brochure SPA iframe so Google OAuth is not framed (403). #}
        <p class="mb-4"><a class="blocks-button blocks-button-primary" href="{{ login_redirect_url }}" target="_top" rel="noopener">Sign in to continue</a></p>
        {% endif %}
        <p class="mb-0 text-muted">Message the bot again to get a fresh enrollment link, then open it while signed in as this account.</p>

        {% else %}
        <h2 class="mb-3 text-lg font-semibold">How to link</h2>
        <ol class="list-inside list-decimal space-y-3">
            <li>Open the Telegram bot you want to use and send any message (e.g. <code>hi</code> or <code>/start</code>).</li>
            <li>Tap the enrollment link the bot replies with — you must be signed in here.</li>
            <li>After linking, that chat is associated with this Blocks account.</li>
        </ol>
        {% endif %}
    </section>
</main>
{% endblock %}