From 1316e751715863fd03214665231ad251a4f1a95d Mon Sep 17 00:00:00 2001
From: Ken Johnson <cktricky@gmail.com>
Date: Sun, 7 Dec 2025 21:24:55 +0000
Subject: [PATCH] Modernize admin user edit modal to Bootstrap 5
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

Update modal content to Bootstrap 5 styling and API:
- Replace Bootstrap 2 modal-header structure with Bootstrap 5
- Update close button from 'close' class to 'btn-close'
- Replace 'data-dismiss' with 'data-bs-dismiss'
- Modernize form classes: control-group → mb-3, span12 → form-control
- Update form labels to use 'form-label' class
- Add 'form-select' class to select dropdown
- Update JavaScript to use Bootstrap 5 Modal.getInstance() API
- Add preventDefault() to button click handlers

The modal now properly loads and displays in Bootstrap 5 with
modern form styling and correct modal dismissal behavior.

🤖 Generated with [Claude Code](https://claude.com/claude-code)

Co-Authored-By: Claude <noreply@anthropic.com>
---
 app/views/admin/get_user.html.erb | 92 +++++++++++++++----------------
 1 file changed, 45 insertions(+), 47 deletions(-)

diff --git a/app/views/admin/get_user.html.erb b/app/views/admin/get_user.html.erb
index 5ee2432..9fcfe17 100755
--- a/app/views/admin/get_user.html.erb
+++ b/app/views/admin/get_user.html.erb
@@ -1,54 +1,46 @@
 <!-- Begin Modal -->
     <div class="modal-header">
-      <button type="button" class="close" data-dismiss="modal" aria-label="dismiss">
-        ×
-      </button>
-      <h4 id="myModalLabel1">
+      <h5 class="modal-title" id="myModalLabel1">
         Account Settings
-      </h4>
+      </h5>
+      <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
     </div>
     <div class="modal-body">
-      <div class="row-fluid">
-        <div class="span8">
-        <%= form_for @user, :html => {:id => "account_edit"} do |f| %>
-        <div class="control-group">
-      <%= f.label :email, nil, {:class => "control-label"}%>
-      <%= f.text_field :email, {:class => "span12"}%>
-      </div>
-
-      <div class="control-group">
-      <%= f.label :first_name, nil, {:class => "control-label"}%>
-      <%= f.text_field :first_name, {:class => "span12"} %>
-      </div>
-
-      <div class="control-group">
-      <%= f.label :last_name, nil, {:class => "control-label"}%>
-      <%= f.text_field :last_name, {:class => "span12"} %>
-      </div>
-
-         <div class="control-group">
-      <%= f.label :password, nil, {:class => "control-label"}%>
-      <%= f.password_field :password, {:class => "span12", :placeholder => "Enter Password"}%>
-     </div>
-
-     <div class="control-group">
-      <%= f.label :password_confirmation, nil, {:class => "control-label"}%>
-      <%= f.password_field :password_confirmation, {:class => "span12", :placeholder => "Enter Password"} %>
-     </div>
-
-      <%= f.label :admin, nil, {:class => "control-label"}%>
-      <%= f.select(:admin, @admin_select) %>
+      <%= form_for @user, :html => {:id => "account_edit"} do |f| %>
+        <div class="mb-3">
+          <%= f.label :email, nil, {:class => "form-label"}%>
+          <%= f.text_field :email, {:class => "form-control"}%>
+        </div>
+
+        <div class="mb-3">
+          <%= f.label :first_name, nil, {:class => "form-label"}%>
+          <%= f.text_field :first_name, {:class => "form-control"} %>
+        </div>
+
+        <div class="mb-3">
+          <%= f.label :last_name, nil, {:class => "form-label"}%>
+          <%= f.text_field :last_name, {:class => "form-control"} %>
+        </div>
+
+        <div class="mb-3">
+          <%= f.label :password, nil, {:class => "form-label"}%>
+          <%= f.password_field :password, {:class => "form-control", :placeholder => "Enter Password"}%>
+        </div>
+
+        <div class="mb-3">
+          <%= f.label :password_confirmation, nil, {:class => "form-label"}%>
+          <%= f.password_field :password_confirmation, {:class => "form-control", :placeholder => "Enter Password"} %>
+        </div>
+
+        <div class="mb-3">
+          <%= f.label :admin, nil, {:class => "form-label"}%>
+          <%= f.select(:admin, @admin_select, {}, {:class => "form-select"}) %>
         </div>
-      </div>
-      <div class="row-fluid">
-      </div>
     </div>
     <div class="modal-footer">
-      <button class="btn" data-dismiss="modal" aria-hidden="true">
-        Close
-      </button>
-         <%= link_to "Delete", "#", {:id => "delete_button", :class => "btn btn-danger pull-left"} %>
-         <%= f.submit "Submit", {:id => 'submit_button', :class => "btn btn-primary pull-right"} %>
+         <%= link_to "Delete", "#", {:id => "delete_button", :class => "btn btn-danger"} %>
+         <button type="button" class="btn btn-secondary" data-bs-dismiss="modal">Close</button>
+         <%= f.submit "Submit", {:id => 'submit_button', :class => "btn btn-primary"} %>
     </div>
        <% end %>
 <!-- End Modal -->
@@ -57,9 +49,12 @@
 
 <script type="text/javascript">
 
-$('#submit_button').click(function() {
+$('#submit_button').click(function(e) {
+  e.preventDefault();
   var valuesToSubmit = $("#account_edit").serialize();
-  $("#editAcct").modal('hide');
+  var modalElement = document.getElementById('editAcct');
+  var modal = bootstrap.Modal.getInstance(modalElement);
+  modal.hide();
 
   $.ajax({
       url: "/admin/" +  <%= @user.id %> + "/update_user.json",
@@ -76,8 +71,11 @@ $('#submit_button').click(function() {
 
 });
 
-$('#delete_button').click(function() {
-  $("#editAcct").modal('hide');
+$('#delete_button').click(function(e) {
+  e.preventDefault();
+  var modalElement = document.getElementById('editAcct');
+  var modal = bootstrap.Modal.getInstance(modalElement);
+  modal.hide();
 
   $.ajax({
       url: "/admin/" +  <%= params[:admin_id] %> + "/delete_user.json",