<div class="page-header">
  <h1><%= admin? ? t(".title_admin") : t(".title") %></h1>
  <i>How?..Just <%= link_to "Watch The Free Video", doc_path("tldr"), target: "_blank" %> > </i>
  <div class="header-actions">
    <%= link_to t(".create_new"), new_developer_app_path, role: "button" %>
  </div>
</div>

<% if @pending_invitations.any? %>
  <% @pending_invitations.each do |invitation| %>
    <%= render Components::Banner.new(kind: :info) do %>
      <span><%= t(".invitation_banner", app_name: invitation.program.name) %></span>
      <div class="banner-actions">
        <%= button_to t(".accept_invitation"),
            accept_developer_app_collaborator_invite_path(invitation.program, invitation),
            method: :post, class: "small-btn approve" %>
        <%= button_to t(".decline_invitation"),
            decline_developer_app_collaborator_invite_path(invitation.program, invitation),
            method: :post, class: "small-btn secondary" %>
      </div>
    <% end %>
  <% end %>
<% end %>

<div class="page-sections">
  <% if admin? %>
    <div class="search-bar">
      <%= form_with url: developer_apps_path, method: :get, local: true do %>
        <%= text_field_tag :search, params[:search], placeholder: t(".search_placeholder"), type: "search" %>
        <button type="submit"><%= t(".search_button") %></button>
        <% if params[:search].present? %>
          <%= link_to "✕ #{t('.clear_filters')}", developer_apps_path, class: "button-secondary small-btn" %>
        <% end %>
      <% end %>
      <span class="search-results-count"><%= t(".results_count", count: @apps.total_count) %></span>
    </div>
  <% end %>

  <% if @apps.any? %>
    <div class="app-list">
      <% @apps.each do |app| %>
        <section class="card app-list-item">
          <div class="app-list-item-identity">
            <div>
              <h3><%= link_to app.name, developer_app_path(app) %></h3>
              <small><%= app.scopes_array.join(", ").presence || t(".no_scopes") %></small>
            </div>
          </div>
          <div class="app-list-item-meta">
            <% if admin? && app.owner_identity %>
              <small class="usn"><%= app.owner_identity.full_name %></small>
            <% end %>
            <code class="client-id"><%= app.uid %></code>
          </div>
        </section>
      <% end %>
    </div>
    <%= paginate @apps %>
  <% else %>
    <div class="empty-state">
      <div class="empty-icon"><%= inline_icon("code", size: 48) %></div>
      <h3><%= t ".blank_slate.title" %></h3>
      <p><%= t ".blank_slate.cta" %></p>
      <%= link_to t(".blank_slate.create"), new_developer_app_path, role: "button" %>
    </div>
  <% end %>
</div>
