Updating users views

app/assets/javascripts/application/users.coffee

+$(document).on "click", ".show_password_fields", (e) ->
+  e.preventDefault()
+  $(this).addClass("d-none")
+  $(".password_fields").removeClass("d-none").find("input").attr("disabled", null)
\ No newline at end of file

app/helpers/application_helper.rb

@@ -15,4 +15,8 @@ module ApplicationHelper
     end
   end
 
+  def captures
+    @captures ||= {}
+  end
+
 end

app/views/users/_form.html.haml

-= form_for @user do |f|
-  - if @user.errors.any?
-    #error_explanation
-      %h2= "#{pluralize(@user.errors.count, "error")} prohibited this user from being saved:"
-      %ul
-        - @user.errors.full_messages.each do |message|
-          %li= message
+:ruby
+  show_password_fields = @user.new_record? ||
+                         @user.errors.details.has_key?(:password) ||
+                         @user.errors.details.has_key?(:password_confirmation)
+.row
+  .col-12.col-lg-6
+    .card.shadow.mb-4
+      .card-header.py-3
+        %h2.d-inline.m-0.font-weight-bold.text-primary= captures[:heading]
+        .float-right= captures[:links]
+      .card-body
+        = simple_form_for @user do |f|
+          = f.input :name
+          = f.input :email
+
+          %button.show_password_fields.btn.btn-primary{class: ('d-none' if show_password_fields)} Change password
+
+          .password_fields{class: ('d-none' unless show_password_fields)}
+            = f.input :password, as: :password, input_html: {disabled: !show_password_fields}
+            = f.input :password_confirmation, as: :password, input_html: {disabled: !show_password_fields}
+
+          = f.submit "Save", class: "btn btn-success"
 
-  .field
-    = f.label :name
-    = f.text_field :name
-  .field
-    = f.label :email
-    = f.text_field :email
-  .field
-    = f.label :password
-    = f.text_field :password
-  .actions
-    = f.submit 'Save'

app/views/users/edit.html.haml

-%h1 Editing user
+- captures[:heading] = capture do
+  Editing user
+- captures[:links] = capture do
+  = link_to icon('fas', 'eye', class: 'fa-2x ml-2', title: 'Show'), @user
+  = link_to icon('fas', 'reply', class: 'fa-2x ml-2', title: 'Back'), users_path
 
 = render 'form'
 
-= link_to 'Show', @user
-\|
-= link_to 'Back', users_path
+

app/views/users/index.html.haml

@@ -2,7 +2,8 @@
 
 .card.shadow.mb-4
   .card-header.py-3
-    %h2.m-0.font-weight-bold.text-primary= model.model_name.human(count: 2)
+    %h2.d-inline.m-0.font-weight-bold.text-primary= model.model_name.human(count: 2)
+    .float-right= link_to icon('fas', 'plus-square', class: "fa-2x", title: "New #{model.model_name.human}"), new_user_path
   .card-body
     .table-responsive
       %table.table.table-bordered.admin-table
@@ -17,9 +18,7 @@
               %td= link_to user.name, user
               %td= user.email
               %td
-                = link_to icon('fas', 'eye'), user_path(user)
-                = link_to icon('fas', 'edit'), edit_user_path(user)
-                = link_to icon('fas', 'trash-alt'), user_path(user), method: :delete, data: {confirm: "Are you sure?"}
-
-      = link_to "New #{model.model_name.human}", new_user_path
+                = link_to icon('fas', 'eye', title: "Show"), user_path(user)
+                = link_to icon('fas', 'edit', title: "Edit"), edit_user_path(user)
+                = link_to icon('fas', 'trash-alt', title: "Delete"), user_path(user), method: :delete, data: {confirm: "Are you sure?"}
 

app/views/users/new.html.haml

-%h1 New user
+- captures[:heading] = capture do
+  New user
+- captures[:links] = capture do
+  = link_to icon('fas', 'reply', class: 'fa-2x ml-2', title: 'Back'), users_path
 
-= render 'form'
+= render 'form', heading: "New user"
 
 = link_to 'Back', users_path

app/views/users/show.html.haml

-%p#notice= notice
-
-%p
-  %b Name:
-  = @user.name
-%p
-  %b Email:
-  = @user.email
-%p
-  %b Password:
-  = @user.password
-
-= link_to 'Edit', edit_user_path(@user)
-\|
-= link_to 'Back', users_path
+.row
+  .col-12.col-lg-6
+    .card.shadow.mb-4
+      .card-header.py-3
+        %h2.d-inline.m-0.font-weight-bold.text-primary= User
+        .float-right
+          = link_to icon('fas', 'edit', class: 'fa-2x ml-2', title: 'Edit'), @user
+          = link_to icon('fas', 'trash-alt', class: 'fa-2x ml-2', title: 'Delete'), @user, method: :delete, data: {confirm: "Are you sure?"}
+          = link_to icon('fas', 'reply', class: 'fa-2x ml-2', title: 'Back'), users_path
+      .card-body
+        %p
+          %b Name:
+          = @user.name
+        %p
+          %b Email:
+          = @user.email