From b323cd4e4ca2690a364a8bb1ee354d7d7aef6253 Mon Sep 17 00:00:00 2001
From: Jason Zimdars <jz@37signals.com>
Date: Wed, 18 Dec 2024 14:28:06 -0600
Subject: [PATCH] Edit user profile

---
 app/controllers/users_controller.rb | 10 ++++++-
 app/views/users/edit.html.erb       | 46 +++++++++++++++++++++++++++++
 app/views/users/show.html.erb       |  7 +++++
 3 files changed, 62 insertions(+), 1 deletion(-)
 create mode 100644 app/views/users/edit.html.erb

diff --git a/app/controllers/users_controller.rb b/app/controllers/users_controller.rb
index 47e240865..a70195c9e 100644
--- a/app/controllers/users_controller.rb
+++ b/app/controllers/users_controller.rb
@@ -1,7 +1,7 @@
 class UsersController < ApplicationController
   require_unauthenticated_access only: %i[ new create ]
 
-  before_action :set_user, only: :show
+  before_action :set_user, only: %i[ show edit update ]
   before_action :set_account_from_join_code, only: %i[ new create ]
 
   def new
@@ -17,6 +17,14 @@ class UsersController < ApplicationController
   def show
   end
 
+  def edit
+  end
+
+  def update
+    @user.update user_params
+    redirect_to user_path(@user)
+  end
+
   private
     def set_account_from_join_code
       @account = Account.find_by_join_code!(params[:join_code])
diff --git a/app/views/users/edit.html.erb b/app/views/users/edit.html.erb
new file mode 100644
index 000000000..bffe4052e
--- /dev/null
+++ b/app/views/users/edit.html.erb
@@ -0,0 +1,46 @@
+<% @page_title = "Edit your profile" %>
+
+<% content_for :header do %>
+  <nav>
+    <%= link_to user_path(@user), class: "btn flex-item-justify-start" do %>
+      <%= image_tag "arrow-left.svg", aria: { hidden: true }, size: 24 %>
+      <span class="for-screen-reader">Back</span>
+    <% end %>
+  </nav>
+<% end %>
+
+<div class="panel shadow center">
+  <div class="flex flex-column gap txt-medium">
+    <div class="avatar txt-xx-large center fill-white">
+      <%= image_tag user_avatar_path(@user), alt: "Profile avatar for #{@user.name}", class: "avatar", size: 128 %>
+    </div>
+
+    <%= form_with model: @user, method: :patch, class: "flex flex-column gap", data: { controller: "form" } do |form| %>
+      <div class="flex align-center gap">
+        <%= translation_button :user_name %>
+        <label class="flex align-center gap input input--actor">
+          <%= form.text_field :name, class: "input full-width", autocomplete: "name", placeholder: "Name", autofocus: true, required: true, data: { "1p-ignore": true } %>
+          <%= image_tag "person.svg", aria: { hidden: "true" }, size: 30, class: "colorize--black" %>
+        </label>
+      </div>
+      <div class="flex align-center gap">
+        <%= translation_button :email_address %>
+        <label class="flex align-center gap input input--actor">
+          <%= form.email_field :email_address, class: "input full-width", autocomplete: "username", placeholder: "Email address", required: true %>
+          <%= image_tag "email.svg", aria: { hidden: "true" }, size: 30, class: "colorize--black" %>
+        </label>
+      </div>
+      <div class="flex align-center gap">
+        <%= translation_button :password %>
+        <label class="flex align-center gap input input--actor">
+          <%= form.password_field :password, class: "input full-width", autocomplete: "new-password", placeholder: "Password", required: false, maxlength: 72 %>
+          <%= image_tag "password.svg", aria: { hidden: "true" }, size: 30, class: "colorize--black" %>
+        </label>
+      </div>
+      <button type="submit" id="log_in" class="btn btn--reversed center">
+        <%= image_tag "check.svg", aria: { hidden: true }, size: 24 %>
+          <span class="for-screen-reader">Sign in</span>
+      </button>
+    <% end %>
+  </div>
+</div>
diff --git a/app/views/users/show.html.erb b/app/views/users/show.html.erb
index 9fe91b249..f126ae6b0 100644
--- a/app/views/users/show.html.erb
+++ b/app/views/users/show.html.erb
@@ -6,6 +6,13 @@
       <%= image_tag "arrow-left.svg", aria: { hidden: true }, size: 24 %>
       <span class="for-screen-reader">Back</span>
     <% end %>
+
+    <% if Current.user == @user %>
+      <%= link_to edit_user_path(@user), class: "btn flex-item-justify-end" do %>
+        <%= image_tag "pencil.svg", aria: { hidden: true }, size: 24 %>
+        <span class="for-screen-reader">Edit</span>
+      <% end %>
+    <% end %>
   </nav>
 <% end %>