<%= render HeaderComponent.new(title: "Contributions") %>

<%= render MainWithTabnavComponent.new(tabnav_partial: "shared/tabnav_contributions") do %>
  <section>
    <p class="mb-12">
      Your financial contributions to the development and upkeep of Kosmos
      software and services.
    </p>
  </section>

  <section class="donation-methods">
    <div class="grid grid-cols-1 sm:grid-cols-2 gap-4 sm:gap-6">
      <% if @donation_methods.include?(:btcpay) ||
            @donation_methods.include?(:lndhub) %>
        <%= render partial: "contributions/donations/bitcoin", locals: {
          donation_methods: @donation_methods, lndhub_balance: @balance
        } %>
      <% end %>
      <% if @donation_methods.include?(:opencollective) %>
        <%= render partial: "contributions/donations/opencollective" %>
      <% end %>
    </div>
  </section>

  <% if @donations_pending.any? %>
  <section class="donation-list">
    <h2>Pending</h2>
    <%= render partial: "contributions/donations/list",
               locals: { donations: @donations_pending } %>
  </section>
  <% end %>

  <% if @donations_completed.any? %>
  <section class="donation-list">
    <h2>Past contributions</h2>
    <%= render partial: "contributions/donations/list",
               locals: { donations: @donations_completed } %>
  </section>
  <% end %>
<% end %>
