<% content_for :title, @user.username %>

<div class="mb-6 flex items-center justify-between">
  <div>
    <h1 class="text-3xl font-bold text-gray-900"><%= @user.username %></h1>
    <% if @user.admin? %>
      <span class="mt-2 inline-flex items-center px-3 py-1 rounded-full text-sm font-medium bg-red-100 text-red-800">
        管理者
      </span>
    <% end %>
  </div>
  <div class="flex space-x-3">
    <%= link_to "編集", edit_user_path(@user), class: "inline-flex items-center px-4 py-2 border border-gray-300 shadow-sm text-sm font-medium rounded-md text-gray-700 bg-white hover:bg-gray-50" %>
    <%= link_to "一覧に戻る", users_path, class: "inline-flex items-center px-4 py-2 border border-gray-300 shadow-sm text-sm font-medium rounded-md text-gray-700 bg-white hover:bg-gray-50" %>
  </div>
</div>

<div class="bg-white shadow overflow-hidden sm:rounded-lg">
  <div class="px-4 py-5 sm:px-6">
    <h3 class="text-lg leading-6 font-medium text-gray-900">
      ユーザー情報
    </h3>
  </div>
  <div class="border-t border-gray-200">
    <dl>
      <div class="bg-gray-50 px-4 py-5 sm:grid sm:grid-cols-3 sm:gap-4 sm:px-6">
        <dt class="text-sm font-medium text-gray-500">
          ユーザー名
        </dt>
        <dd class="mt-1 text-sm text-gray-900 sm:mt-0 sm:col-span-2">
          <%= @user.username %>
        </dd>
      </div>
      <div class="bg-white px-4 py-5 sm:grid sm:grid-cols-3 sm:gap-4 sm:px-6">
        <dt class="text-sm font-medium text-gray-500">
          メールアドレス
        </dt>
        <dd class="mt-1 text-sm text-gray-900 sm:mt-0 sm:col-span-2">
          <%= @user.email %>
        </dd>
      </div>
      <div class="bg-gray-50 px-4 py-5 sm:grid sm:grid-cols-3 sm:gap-4 sm:px-6">
        <dt class="text-sm font-medium text-gray-500">
          権限
        </dt>
        <dd class="mt-1 text-sm text-gray-900 sm:mt-0 sm:col-span-2">
          <%= @user.admin? ? "管理者" : "一般ユーザー" %>
        </dd>
      </div>
      <div class="bg-white px-4 py-5 sm:grid sm:grid-cols-3 sm:gap-4 sm:px-6">
        <dt class="text-sm font-medium text-gray-500">
          登録日
        </dt>
        <dd class="mt-1 text-sm text-gray-900 sm:mt-0 sm:col-span-2">
          <%= @user.created_at.strftime("%Y年%m月%d日 %H:%M") %>
        </dd>
      </div>
      <div class="bg-gray-50 px-4 py-5 sm:grid sm:grid-cols-3 sm:gap-4 sm:px-6">
        <dt class="text-sm font-medium text-gray-500">
          最終更新日
        </dt>
        <dd class="mt-1 text-sm text-gray-900 sm:mt-0 sm:col-span-2">
          <%= @user.updated_at.strftime("%Y年%m月%d日 %H:%M") %>
        </dd>
      </div>
    </dl>
  </div>
</div>

<% if @user != current_user %>
  <div class="mt-6 flex space-x-3">
    <%= button_to "#{@user.admin? ? '管理者権限を削除' : '管理者権限を付与'}", 
                  toggle_admin_user_path(@user), 
                  method: :patch,
                  class: "inline-flex items-center px-4 py-2 border border-transparent text-sm font-medium rounded-md text-white bg-yellow-600 hover:bg-yellow-700",
                  data: { confirm: "#{@user.admin? ? '管理者権限を削除' : '管理者権限を付与'}しますか?" } %>
    <%= button_to "ユーザーを削除", 
                  user_path(@user), 
                  method: :delete,
                  class: "inline-flex items-center px-4 py-2 border border-transparent text-sm font-medium rounded-md text-white bg-red-600 hover:bg-red-700",
                  data: { confirm: "#{@user.username}を削除しますか?" } %>
  </div>
<% end %>
