dawarich/app/views/trips/show.html.erb
Claude 9a060c14dd
UI: Move sharing controls to DaisyUI modal
- Add Share Trip button under trip dates
- Button displays 'Share Trip' or 'Manage Sharing' based on state
- Convert sharing partial to use DaisyUI 4 modal dialog
- Modal can be closed via X button, backdrop click, or ESC key
- All sharing functionality remains intact within modal
2025-11-07 12:30:22 +00:00

81 lines
3.2 KiB
Text

<% 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-2">
<%= human_date(@trip.started_at) %> - <%= human_date(@trip.ended_at) %>
</p>
<button onclick="sharing_modal_<%= @trip.id %>.showModal()" class="btn btn-sm btn-ghost gap-2 mb-4">
<svg xmlns="http://www.w3.org/2000/svg" class="h-4 w-4" fill="none" viewBox="0 0 24 24" stroke="currentColor">
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M8.684 13.342C8.886 12.938 9 12.482 9 12c0-.482-.114-.938-.316-1.342m0 2.684a3 3 0 110-2.684m0 2.684l6.632 3.316m-6.632-6l6.632-3.316m0 0a3 3 0 105.367-2.684 3 3 0 00-5.367 2.684zm0 9.316a3 3 0 105.368 2.684 3 3 0 00-5.368-2.684z" />
</svg>
<% if @trip.sharing_enabled? %>
<span>Manage Sharing</span>
<% else %>
<span>Share Trip</span>
<% end %>
</button>
<%= 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>
<!-- Sharing Modal -->
<%= render "trips/sharing", trip: @trip %>
</div>