mirror of
https://github.com/Freika/dawarich.git
synced 2026-01-10 17:21:38 -05:00
148 lines
7 KiB
Text
148 lines
7 KiB
Text
|
<div class="container mx-auto px-4 py-8">
|
||
|
|
<div class="max-w-4xl mx-auto">
|
||
|
|
<!-- Family Header -->
|
||
|
|
<div class="bg-white shadow rounded-lg p-6 mb-6">
|
||
|
|
<div class="flex items-center justify-between">
|
||
|
|
<div>
|
||
|
|
<h1 class="text-2xl font-bold text-gray-900"><%= @family.name %></h1>
|
||
|
|
<p class="text-gray-600 mt-1">
|
||
|
|
<%= t('families.show.created_by', default: 'Created by') %>
|
||
|
|
<%= @family.creator.email %>
|
||
|
|
<%= t('families.show.on_date', default: 'on') %>
|
||
|
|
<%= @family.created_at.strftime('%B %d, %Y') %>
|
||
|
|
</p>
|
||
|
|
</div>
|
||
|
|
|
||
|
|
<div class="flex space-x-3">
|
||
|
|
<% if policy(@family).update? %>
|
||
|
|
<%= link_to edit_family_path(@family),
|
||
|
|
class: "bg-blue-600 hover:bg-blue-700 text-white px-4 py-2 rounded-md font-medium transition-colors duration-200" do %>
|
||
|
|
<%= t('families.show.edit', default: 'Edit Family') %>
|
||
|
|
<% end %>
|
||
|
|
<% end %>
|
||
|
|
|
||
|
|
<% if policy(@family).leave? %>
|
||
|
|
<%= link_to leave_family_path(@family),
|
||
|
|
method: :delete,
|
||
|
|
confirm: t('families.show.leave_confirm', default: 'Are you sure you want to leave this family?'),
|
||
|
|
class: "bg-red-600 hover:bg-red-700 text-white px-4 py-2 rounded-md font-medium transition-colors duration-200" do %>
|
||
|
|
<%= t('families.show.leave', default: 'Leave Family') %>
|
||
|
|
<% end %>
|
||
|
|
<% end %>
|
||
|
|
|
||
|
|
<% if policy(@family).destroy? %>
|
||
|
|
<%= link_to family_path(@family),
|
||
|
|
method: :delete,
|
||
|
|
confirm: t('families.show.delete_confirm', default: 'Are you sure you want to delete this family? This action cannot be undone.'),
|
||
|
|
class: "bg-red-600 hover:bg-red-700 text-white px-4 py-2 rounded-md font-medium transition-colors duration-200" do %>
|
||
|
|
<%= t('families.show.delete', default: 'Delete Family') %>
|
||
|
|
<% end %>
|
||
|
|
<% end %>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
|
||
|
|
<div class="grid grid-cols-1 lg:grid-cols-2 gap-6">
|
||
|
|
<!-- Family Members -->
|
||
|
|
<div class="bg-white shadow rounded-lg p-6">
|
||
|
|
<div class="flex items-center justify-between mb-4">
|
||
|
|
<h2 class="text-xl font-semibold text-gray-900">
|
||
|
|
<%= t('families.show.members_title', default: 'Family Members') %>
|
||
|
|
<span class="text-sm font-normal text-gray-500">(<%= @members.count %>)</span>
|
||
|
|
</h2>
|
||
|
|
<%= link_to family_members_path(@family),
|
||
|
|
class: "text-blue-600 hover:text-blue-800 text-sm font-medium" do %>
|
||
|
|
<%= t('families.show.manage_members', default: 'Manage') %>
|
||
|
|
<% end %>
|
||
|
|
</div>
|
||
|
|
|
||
|
|
<div class="space-y-3">
|
||
|
|
<% @members.each do |member| %>
|
||
|
|
<div class="flex items-center justify-between p-3 bg-gray-50 rounded-lg">
|
||
|
|
<div>
|
||
|
|
<div class="font-medium text-gray-900"><%= member.email %></div>
|
||
|
|
<div class="text-sm text-gray-500">
|
||
|
|
<%= member.family_membership.role.humanize %>
|
||
|
|
<% if member.family_membership.role == 'owner' %>
|
||
|
|
<span class="inline-flex items-center px-2 py-0.5 rounded text-xs font-medium bg-yellow-100 text-yellow-800 ml-2">
|
||
|
|
<%= t('families.show.owner_badge', default: 'Owner') %>
|
||
|
|
</span>
|
||
|
|
<% end %>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
<div class="text-sm text-gray-500">
|
||
|
|
<%= t('families.show.joined_on', default: 'Joined') %>
|
||
|
|
<%= member.family_membership.created_at.strftime('%b %d, %Y') %>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
<% end %>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
|
||
|
|
<!-- Pending Invitations -->
|
||
|
|
<div class="bg-white shadow rounded-lg p-6">
|
||
|
|
<div class="flex items-center justify-between mb-4">
|
||
|
|
<h2 class="text-xl font-semibold text-gray-900">
|
||
|
|
<%= t('families.show.invitations_title', default: 'Pending Invitations') %>
|
||
|
|
<span class="text-sm font-normal text-gray-500">(<%= @pending_invitations.count %>)</span>
|
||
|
|
</h2>
|
||
|
|
</div>
|
||
|
|
|
||
|
|
<% if @pending_invitations.any? %>
|
||
|
|
<div class="space-y-3 mb-4">
|
||
|
|
<% @pending_invitations.each do |invitation| %>
|
||
|
|
<div class="flex items-center justify-between p-3 bg-gray-50 rounded-lg">
|
||
|
|
<div>
|
||
|
|
<div class="font-medium text-gray-900"><%= invitation.email %></div>
|
||
|
|
<div class="text-sm text-gray-500">
|
||
|
|
<%= t('families.show.invited_on', default: 'Invited') %>
|
||
|
|
<%= invitation.created_at.strftime('%b %d, %Y') %>
|
||
|
|
</div>
|
||
|
|
<div class="text-xs text-gray-400">
|
||
|
|
<%= t('families.show.expires_on', default: 'Expires') %>
|
||
|
|
<%= invitation.expires_at.strftime('%b %d, %Y at %I:%M %p') %>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
<% if policy(@family).manage_invitations? %>
|
||
|
|
<%= link_to family_invitation_path(@family, invitation),
|
||
|
|
method: :delete,
|
||
|
|
confirm: t('families.show.cancel_invitation_confirm', default: 'Are you sure you want to cancel this invitation?'),
|
||
|
|
class: "text-red-600 hover:text-red-800 text-sm font-medium" do %>
|
||
|
|
<%= t('families.show.cancel', default: 'Cancel') %>
|
||
|
|
<% end %>
|
||
|
|
<% end %>
|
||
|
|
</div>
|
||
|
|
<% end %>
|
||
|
|
</div>
|
||
|
|
<% else %>
|
||
|
|
<p class="text-gray-500 text-center py-4">
|
||
|
|
<%= t('families.show.no_pending_invitations', default: 'No pending invitations') %>
|
||
|
|
</p>
|
||
|
|
<% end %>
|
||
|
|
|
||
|
|
<!-- Invite New Member -->
|
||
|
|
<% if policy(@family).invite? %>
|
||
|
|
<div class="border-t pt-4">
|
||
|
|
<h3 class="text-lg font-medium text-gray-900 mb-3">
|
||
|
|
<%= t('families.show.invite_member', default: 'Invite New Member') %>
|
||
|
|
</h3>
|
||
|
|
|
||
|
|
<%= form_with model: [@family, FamilyInvitation.new], url: family_invitations_path(@family), local: true, class: "space-y-3" do |form| %>
|
||
|
|
<div>
|
||
|
|
<%= form.label :email, t('families.show.email_label', default: 'Email Address'), class: "block text-sm font-medium text-gray-700 mb-1" %>
|
||
|
|
<%= form.email_field :email,
|
||
|
|
placeholder: t('families.show.email_placeholder', default: 'Enter email address'),
|
||
|
|
class: "w-full px-3 py-2 border border-gray-300 rounded-md shadow-sm focus:outline-none focus:ring-2 focus:ring-blue-500 focus:border-blue-500" %>
|
||
|
|
</div>
|
||
|
|
|
||
|
|
<div class="flex justify-end">
|
||
|
|
<%= form.submit t('families.show.send_invitation', default: 'Send Invitation'),
|
||
|
|
class: "bg-green-600 hover:bg-green-700 text-white px-4 py-2 rounded-md font-medium transition-colors duration-200" %>
|
||
|
|
</div>
|
||
|
|
<% end %>
|
||
|
|
</div>
|
||
|
|
<% end %>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</div>
|