From 1f73e7d039c94be5aaf71a225c4f7bdd9ac82668 Mon Sep 17 00:00:00 2001
From: Penar Musaraj <pmusaraj@gmail.com>
Date: Wed, 24 Apr 2024 16:07:12 -0400
Subject: [PATCH] FIX: Allow deleting avatars from the selectable avatars
 setting (#26720)

Fixes two issues:

- frontend was reloading the page when clicking-to-remove avatar
- backend wasn't allowing resetting the setting by deleting all avatars
---
 .../components/modal/uploaded-image-list.hbs    |  3 +++
 .../components/modal/uploaded-image-list.js     |  3 ++-
 app/assets/stylesheets/common/base/user.scss    | 17 +++++++++++++++--
 .../admin/site_settings_controller.rb           |  2 +-
 .../admin/site_settings_controller_spec.rb      |  7 +++++++
 5 files changed, 28 insertions(+), 4 deletions(-)

diff --git a/app/assets/javascripts/admin/addon/components/modal/uploaded-image-list.hbs b/app/assets/javascripts/admin/addon/components/modal/uploaded-image-list.hbs
index 26212ebbab377c..b802fca84c40e4 100644
--- a/app/assets/javascripts/admin/addon/components/modal/uploaded-image-list.hbs
+++ b/app/assets/javascripts/admin/addon/components/modal/uploaded-image-list.hbs
@@ -8,6 +8,9 @@
       {{#each this.images as |image|}}
         <a href class="selectable-avatar" {{on "click" (fn this.remove image)}}>
           {{bound-avatar-template image "huge"}}
+          <span class="selectable-avatar__remove">{{d-icon
+              "times-circle"
+            }}</span>
         </a>
       {{else}}
         <p>{{i18n "admin.site_settings.uploaded_image_list.empty"}}</p>
diff --git a/app/assets/javascripts/admin/addon/components/modal/uploaded-image-list.js b/app/assets/javascripts/admin/addon/components/modal/uploaded-image-list.js
index 9bdaf0640772bf..a872a4d3dfeaaf 100644
--- a/app/assets/javascripts/admin/addon/components/modal/uploaded-image-list.js
+++ b/app/assets/javascripts/admin/addon/components/modal/uploaded-image-list.js
@@ -9,7 +9,8 @@ export default class UploadedImageList extends Component {
     : [];
 
   @action
-  remove(url) {
+  remove(url, event) {
+    event.preventDefault();
     this.images.removeObject(url);
   }
 
diff --git a/app/assets/stylesheets/common/base/user.scss b/app/assets/stylesheets/common/base/user.scss
index 6189555c7305a2..5a089868027308 100644
--- a/app/assets/stylesheets/common/base/user.scss
+++ b/app/assets/stylesheets/common/base/user.scss
@@ -911,14 +911,27 @@
   .selectable-avatar {
     margin: 5px;
     display: inline-block;
+    position: relative;
     .avatar {
       cursor: pointer;
       width: 60px;
       height: 60px;
-      &:hover {
-        box-shadow: 0 0 10px var(--primary);
+    }
+    &:hover {
+      .selectable-avatar__remove {
+        visibility: visible;
       }
     }
+    &__remove {
+      visibility: hidden;
+      color: var(--primary-high);
+      position: absolute;
+      bottom: 0px;
+      width: 100%;
+      left: 0px;
+      text-align: center;
+      font-size: var(--font-up-2);
+    }
   }
 }
 
diff --git a/app/controllers/admin/site_settings_controller.rb b/app/controllers/admin/site_settings_controller.rb
index 5e0dd1914e675d..cb89bf844c45f9 100644
--- a/app/controllers/admin/site_settings_controller.rb
+++ b/app/controllers/admin/site_settings_controller.rb
@@ -45,7 +45,7 @@ def update
     when :file_size_restriction
       value = value.tr("^0-9", "").to_i
     when :uploaded_image_list
-      value = Upload.get_from_urls(value.split("|")).to_a
+      value = value.blank? ? "" : Upload.get_from_urls(value.split("|")).to_a
     end
 
     value = Upload.get_from_url(value) || "" if SiteSetting.type_supervisor.get_type(id) == :upload
diff --git a/spec/requests/admin/site_settings_controller_spec.rb b/spec/requests/admin/site_settings_controller_spec.rb
index 0d9fc41dc99862..178b87b08031e4 100644
--- a/spec/requests/admin/site_settings_controller_spec.rb
+++ b/spec/requests/admin/site_settings_controller_spec.rb
@@ -269,6 +269,13 @@ def expect_user_count(
         expect(SiteSetting.title).to eq("")
       end
 
+      it "allows value to be a blank string for selectable_avatars" do
+        SiteSetting.selectable_avatars = [Fabricate(:image_upload)]
+        put "/admin/site_settings/selectable_avatars.json", params: { selectable_avatars: "" }
+        expect(response.status).to eq(200)
+        expect(SiteSetting.selectable_avatars).to eq([])
+      end
+
       it "sanitizes integer values" do
         put "/admin/site_settings/suggested_topics.json", params: { suggested_topics: "1,000" }