<%= render DialogComponent.new do |dialog| %>
  <% dialog.with_header(title: t(".title"), subtitle: t(".description")) %>

  <% dialog.with_body do %>
    <div class="rounded-xl bg-container-inset p-1">
      <h3 class="uppercase text-secondary text-xs font-medium px-3 py-1.5"><%= t(".sources") %></h3>
      <ul class="bg-container shadow-border-xs rounded-lg">
        <li>
          <% if @pending_import.present? && (params[:type].nil? || params[:type] == @pending_import.type) %>
            <%= link_to import_path(@pending_import), class: "flex items-center justify-between p-4 group cursor-pointer", data: { turbo: false } do %>
              <div class="flex items-center gap-2">
                <div class="bg-orange-500/5 rounded-md w-8 h-8 flex items-center justify-center">
                  <span class="text-orange-500">
                    <%= icon("loader", color: "current") %>
                  </span>
                </div>
                <span class="text-sm text-primary group-hover:text-secondary">
                  <%= t(".resume", type: @pending_import.type.titleize) %>
                </span>
              </div>
              <%= icon("chevron-right") %>
            <% end %>

            <%= render "shared/ruler" %>
          </li>
        <% end %>

        <% if Current.family.accounts.any? && (params[:type].nil? || params[:type] == "TransactionImport") %>
          <li>
            <%= button_to imports_path(import: { type: "TransactionImport" }), class: "flex items-center justify-between p-4 group cursor-pointer w-full", data: { turbo: false } do %>
              <div class="flex items-center gap-2">
                <div class="bg-indigo-500/5 rounded-md w-8 h-8 flex items-center justify-center">
                  <span class="text-indigo-500">
                    <%= icon("file-spreadsheet", color: "current") %>
                  </span>
                </div>
                <span class="text-sm text-primary group-hover:text-secondary">
                  <%= t(".import_transactions") %>
                </span>
              </div>
              <%= icon("chevron-right") %>
            <% end %>

            <%= render "shared/ruler" %>
          </li>
        <% end %>

        <% if Current.family.accounts.any? && (params[:type].nil? || params[:type] == "TradeImport") %>
          <li>
            <%= button_to imports_path(import: { type: "TradeImport" }), class: "flex items-center justify-between p-4 group cursor-pointer w-full", data: { turbo: false } do %>
              <div class="flex items-center gap-2">
                <div class="bg-yellow-500/5 rounded-md w-8 h-8 flex items-center justify-center">
                  <span class="text-yellow-500">
                    <%= icon("square-percent", color: "current") %>
                  </span>
                </div>
                <span class="text-sm text-primary group-hover:text-secondary">
                  <%= t(".import_portfolio") %>
                </span>
              </div>
              <%= icon("chevron-right") %>
            <% end %>

            <%= render "shared/ruler" %>
          </li>
        <% end %>

        <% if params[:type].nil? || params[:type] == "AccountImport" %>
          <li>
            <%= button_to imports_path(import: { type: "AccountImport" }), class: "flex items-center justify-between p-4 group cursor-pointer w-full", data: { turbo: false } do %>
              <div class="flex items-center gap-2">
                <div class="bg-violet-500/5 rounded-md w-8 h-8 flex items-center justify-center">
                  <span class="text-violet-500">
                    <%= icon("building", color: "current") %>
                  </span>
                </div>
                <span class="text-sm text-primary group-hover:text-secondary">
                  <%= t(".import_accounts") %>
                </span>
              </div>
              <%= icon("chevron-right") %>
            <% end %>

            <%= render "shared/ruler" %>
          </li>
        <% end %>

        <% if Current.family.accounts.any? && (params[:type].nil? || params[:type] == "MintImport" || params[:type] == "TransactionImport") %>
          <li>
            <%= button_to imports_path(import: { type: "MintImport" }), class: "flex items-center justify-between p-4 group w-full", data: { turbo: false } do %>
              <div class="flex items-center gap-2">
                <%= image_tag("mint-logo.jpeg", alt: "Mint logo", class: "w-8 h-8 rounded-md") %>
                <span class="text-sm text-primary">
                  <%= t(".import_mint") %>
                </span>
              </div>
              <%= icon("chevron-right") %>
            <% end %>

            <%= render "shared/ruler" %>
          </li>
        <% end %>
      </ul>
    </div>
  <% end %>
<% end %>
