<%!-- Header --%>

{gettext("My Tickets")}

{gettext("Track your support requests")}

<.link navigate={PhoenixKit.Utils.Routes.path("/dashboard/tickets/new")} class="btn btn-primary" > <.icon name="hero-plus" class="h-5 w-5" /> {gettext("New Ticket")}
<%!-- Status Filter --%>
<%= if @status_filter do %> <% end %>
{ngettext("%{count} ticket", "%{count} tickets", @total_count, count: @total_count)}
<%!-- Tickets List --%>
<%= if @loading do %>
<% else %> <%= if Enum.empty?(@tickets) do %>
<.icon name="hero-ticket" class="h-16 w-16 mx-auto text-base-content/30 mb-4" />

{gettext("No tickets yet")}

<%= if @status_filter do %> {gettext("No tickets with this status. Try a different filter.")} <% else %> {gettext("Create your first ticket to get help from our support team.")} <% end %>

<.link navigate={PhoenixKit.Utils.Routes.path("/dashboard/tickets/new")} class="btn btn-primary" > <.icon name="hero-plus" class="h-5 w-5" /> {gettext("New Ticket")}
<% else %> <%= for ticket <- @tickets do %> <.link navigate={PhoenixKit.Utils.Routes.path("/dashboard/tickets/#{ticket.uuid}")} class="block bg-base-100 rounded-lg shadow hover:shadow-md transition p-4" >

{ticket.title}

{String.slice(ticket.description || "", 0, 150)}{if String.length( ticket.description || "" ) > 150, do: "..."}

<%= case ticket.status do %> <% "open" -> %> {gettext("Open")} <% "in_progress" -> %> {gettext("In Progress")} <% "resolved" -> %> {gettext("Resolved")} <% "closed" -> %> {gettext("Closed")} <% end %>
<.icon name="hero-calendar" class="w-4 h-4" /> {Calendar.strftime(ticket.inserted_at, "%b %d, %Y")} <.icon name="hero-chat-bubble-left" class="w-4 h-4" /> {ticket.comment_count || 0} {ngettext("comment", "comments", ticket.comment_count || 0)} <%= if ticket.assigned_to do %> <.icon name="hero-user" class="w-4 h-4" /> {gettext("Assigned")} <% end %>
<% end %> <%!-- Pagination --%> <%= if @total_pages > 1 do %>
{gettext("Page %{page} of %{total}", page: @page, total: @total_pages)}
<% end %> <% end %> <% end %>