<?xml version="1.0" encoding="utf-8"?>
<odoo>

    <template id="rating_form" name="Helpdesk Rating Form">
        <t t-call="website.layout">
            <div class="container mt-5 mb-5 text-center">
                <h1>Rate Your Support Experience</h1>
                <p class="lead">
                    Ticket <strong><t t-esc="ticket.ticket_ref"/></strong> —
                    <t t-esc="ticket.name"/>
                </p>
                <form t-attf-action="/helpdesk/rate/{{ ticket.id }}/{{ token }}?db={{ request.db }}" method="POST">
                    <input type="hidden" name="csrf_token" t-att-value="request.csrf_token()"/>
                    <div class="mb-4">
                        <label class="form-label d-block">Your rating</label>
                        <div class="btn-group" role="group">
                            <input type="radio" class="btn-check" name="rating" id="rate1" value="1" required="required"/>
                            <label class="btn btn-outline-warning" for="rate1">★ 1</label>
                            <input type="radio" class="btn-check" name="rating" id="rate2" value="2"/>
                            <label class="btn btn-outline-warning" for="rate2">★★ 2</label>
                            <input type="radio" class="btn-check" name="rating" id="rate3" value="3"/>
                            <label class="btn btn-outline-warning" for="rate3">★★★ 3</label>
                        </div>
                    </div>
                    <div class="mb-3">
                        <label class="form-label" for="feedback">Optional feedback</label>
                        <textarea class="form-control" name="feedback" rows="4" placeholder="Tell us more..."/>
                    </div>
                    <button type="submit" class="btn btn-primary">Submit Rating</button>
                </form>
            </div>
        </t>
    </template>

    <template id="rating_thanks" name="Helpdesk Rating Thanks">
        <t t-call="website.layout">
            <div class="container mt-5 text-center">
                <h1>Thank You!</h1>
                <p class="lead">We appreciate your feedback on ticket <strong><t t-esc="ticket.ticket_ref"/></strong>.</p>
            </div>
        </t>
    </template>

    <template id="rating_invalid" name="Helpdesk Rating Invalid">
        <t t-call="website.layout">
            <div class="container mt-5 text-center">
                <h1>Invalid or Expired Link</h1>
                <p class="lead">This rating link is no longer valid.</p>
            </div>
        </t>
    </template>

</odoo>
