Amélioration de la présentation des utilisateurs

app/controllers/accounts_controller.rb

@@ -48,10 +48,10 @@ class AccountsController < ApplicationController
   private
 
   def create_user_params
-    params.require(:user).permit(:email, :password, :password_confirmation)
+    params.require(:user).permit(:email, :password, :password_confirmation, :name)
   end
 
   def update_user_params
-    params.require(:user).permit(:current_password, :password, :password_confirmation, :unconfirmed_email)
+    params.require(:user).permit(:current_password, :password, :password_confirmation, :unconfirmed_email, :name)
   end
 end

app/views/accounts/edit.html.erb

@@ -8,18 +8,22 @@
     <%= form.label :unconfirmed_email, "New Email" %>
     <%= form.text_field :unconfirmed_email %>
   </div>
+  <div>
+    <%= form.label :name %>
+    <%= form.text_field :name, autocomplete: "name" %>
+  </div>
   <div>
     <%= form.label :password, "Password (leave blank if you don't want to change it)" %>
-    <%= form.password_field :password %>
+    <%= form.password_field :password, autocomplete: "new-password" %>
   </div>
   <div>
     <%= form.label :password_confirmation %>
-    <%= form.password_field :password_confirmation %>
+    <%= form.password_field :password_confirmation, autocomplete: "new-password" %>
   </div>
   <hr/>
   <div>
     <%= form.label :current_password, "Current password (we need your current password to confirm your changes)" %>
-    <%= form.password_field :current_password, required: true %>
+    <%= form.password_field :current_password, required: true, autocomplete: "current-password" %>
   </div>
   <%= form.submit "Update Account" %>
 <% end %>

app/views/accounts/new.html.erb

@@ -4,6 +4,10 @@
     <%= form.label :email %>
     <%= form.text_field :email, required: true, autofocus: true, autocomplete: "email" %>
   </div>
+  <div>
+    <%= form.label :name %>
+    <%= form.text_field :name, autocomplete: "name" %>
+  </div>
   <div>
     <%= form.label :password %>
     <%= form.password_field :password, required: true, autocomplete: "new-password" %>

app/views/users/index.html.erb

@@ -13,20 +13,14 @@
           <table class="min-w-full divide-y divide-gray-200">
             <thead class="bg-gray-50">
               <tr>
-                <th scope="col" class="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">
-                  Gravatar
-                </th>
-                <th scope="col" class="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">
-                  Email
-                </th>
                 <th scope="col" class="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">
                   Name
                 </th>
                 <th scope="col" class="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">
-                  Created at
+                  Created at<br />Updated at
                 </th>
                 <th scope="col" class="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">
-                  Updated at
+                  Status
                 </th>
                 <th scope="col" class="relative px-6 py-3">
                   <span class="sr-only">Edit</span>
@@ -37,19 +31,33 @@
               <% @users.each do |user| %>
                 <tr class="<%= cycle("bg-white", "bg-gray-50") %>">
                   <td class="px-6 py-4 whitespace-nowrap text-sm font-medium text-gray-900">
-                    <%= user_gravatar current_user, class: "h-10 w-10 rounded-full", size: 80 %>
+                    <div class="flex items-center">
-                  </td>
+                      <div class="flex-shrink-0 h-10 w-10">
-                  <td class="px-6 py-4 whitespace-nowrap text-sm font-medium text-gray-900">
+                        <%= user_gravatar current_user, class: "h-10 w-10 rounded-full", size: 80 %>
-                    <%= user.email %>
+                      </div>
-                  </td>
+                      <div class="ml-4">
-                  <td class="px-6 py-4 whitespace-nowrap text-sm font-medium text-gray-900">
+                        <div class="text-sm font-medium text-gray-900">
-                    <%= user.name %>
+                          <%= user.name.presence || "<i>Anonymous</i>".html_safe %>
+                        </div>
+                        <div class="text-sm text-gray-500">
+                          <%= user.email %>
+                        </div>
+                      </div>
+                    </div>
                   </td>
                   <td class="px-6 py-4 whitespace-nowrap text-sm text-gray-500">
-                    <%= user.created_at %>
+                    <%= user.created_at %><br /><%= user.updated_at %>
                   </td>
                   <td class="px-6 py-4 whitespace-nowrap text-sm text-gray-500">
-                    <%= user.updated_at %>
+                    <% if user.confirmed? %>
+                      <span class="px-2 inline-flex text-xs leading-5 font-semibold rounded-full bg-green-100 text-green-800">
+                        Confirmed
+                      </span>
+                    <% else %>
+                      <span class="px-2 inline-flex text-xs leading-5 font-semibold rounded-full bg-yellow-100 text-yellow-800">
+                        Unconfirmed
+                      </span>
+                    <% end %>
                   </td>
                   <td class="px-6 py-4 whitespace-nowrap text-right text-sm font-medium">
                     <%= link_to "Show", user, class: "text-indigo-600 hover:text-indigo-900" %>