<% content_for :title, @trip.name %>

<%= turbo_stream_from "trip_#{@trip.id}" %>

<div class="container mx-auto px-4 my-5">
  <div class="bg-base-100 p-4">
    <div class="grid grid-cols-1 lg:grid-cols-2 gap-6">
      <div class="w-full block" id="trip_path">
        <%= render "trips/path", trip: @trip, current_user: current_user %>
      </div>
      <div class="w-full">
        <div class="text-center mb-8">
          <h1 class="text-4xl font-bold mb-2"><%= @trip.name %></h1>
          <p class="text-md text-base-content/60 mb-4">
            <%= human_date(@trip.started_at) %> - <%= human_date(@trip.ended_at) %>
          </p>

          <%= render "trips/countries", trip: @trip, current_user: current_user, distance_unit: current_user.safe_settings.distance_unit %>
        </div>

        <div>
          <%= @trip.notes.body %>
        </div>

        <!-- Photos Grid Section -->
        <% if @photo_previews.any? %>
          <% @photo_previews.each_slice(3) do |slice| %>
            <div class="h-48 flex gap-4 mt-4 justify-center">
              <% slice.each do |photo| %>
                <div class="flex-1 h-full overflow-hidden rounded-lg transition-transform duration-300 hover:scale-105 hover:shadow-lg">
                  <img
                    src="<%= photo[:url] %>"
                    loading='lazy'
                    class="h-full w-full object-cover"
                  >
                </div>
              <% end %>
            </div>
          <% end %>
        <% end %>

        <% if @photo_sources.any? %>
          <div class="text-center mt-6">
            <% @photo_sources.each do |source| %>
              <%= link_to "More photos on #{source}", photo_search_url(source, current_user.settings, @trip.started_at, @trip.ended_at), class: "btn btn-primary mt-2", target: '_blank' %>
            <% end %>
          </div>
        <% end %>
      </div>
    </div>
  </div>

  <!-- Action Buttons Section -->
  <div class="bg-base-100 items-center">
    <div class="flex flex-wrap gap-2 justify-center">
      <%= link_to "Edit this trip", edit_trip_path(@trip), class: "btn" %>
      <%= link_to "Destroy this trip",
          trip_path(@trip),
          data: {
            turbo_confirm: "Are you sure?",
            turbo_method: :delete
          },
          class: "btn" %>
      <%= link_to "Back to trips", trips_path, class: "btn" %>
    </div>
  </div>
</div>
