From 92ff38db5913ef3c8d37da2554d3c0e77fe95590 Mon Sep 17 00:00:00 2001
From: Anton Khorev <tony29@yandex.ru>
Date: Wed, 28 May 2025 14:58:14 +0300
Subject: [PATCH] Add placeholders/titles to social link controls

---
 app/assets/javascripts/user.js        | 19 +++++++++++++++++++
 app/views/profiles/show.html.erb      |  2 +-
 config/locales/en.yml                 |  3 +++
 test/system/user_social_links_test.rb | 25 +++++++++++++++++++++++++
 4 files changed, 48 insertions(+), 1 deletion(-)
 create mode 100644 test/system/user_social_links_test.rb

diff --git a/app/assets/javascripts/user.js b/app/assets/javascripts/user.js
index 5d96ccf5f..c8e23a459 100644
--- a/app/assets/javascripts/user.js
+++ b/app/assets/javascripts/user.js
@@ -19,16 +19,35 @@ $(function () {
         .find("input").attr("name", `user[social_links_attributes][${newIndex}][url]`).trigger("focus")
         .end().find("button").on("click", function () {
           $(this).parent().remove();
+          renumberSocialLinks();
         });
+
+      renumberSocialLinks();
     });
 
     $(".social_link_destroy input[type='checkbox']").change(function () {
       $(this).parent().parent().addClass("d-none");
+      renumberSocialLinks();
     });
 
     $(".social_link_destroy input[type='checkbox']:checked").each(function () {
       $(this).parent().parent().addClass("d-none");
     });
+
+    renumberSocialLinks();
+  }
+
+  function renumberSocialLinks() {
+    $("#social_links .row:not(.d-none)").each(function (i) {
+      const inputLabel = OSM.i18n.t("javascripts.profile.social_link_n", { n: i + 1 });
+      const removeButtonLabel = OSM.i18n.t("javascripts.profile.remove_social_link_n", { n: i + 1 });
+
+      $(this).find("input[type='text']")
+        .attr("placeholder", inputLabel)
+        .attr("aria-label", inputLabel);
+      $(this).find("label, button")
+        .attr("title", removeButtonLabel);
+    });
   }
 
   if ($("#map").length) {
diff --git a/app/views/profiles/show.html.erb b/app/views/profiles/show.html.erb
index e3e093e86..bacced4df 100644
--- a/app/views/profiles/show.html.erb
+++ b/app/views/profiles/show.html.erb
@@ -25,7 +25,7 @@
       </template>
       <%= f.fields_for :social_links do |social_link_form| %>
         <div class="social-link-fields row mb-3">
-          <%= social_link_form.text_field :url, :hide_label => true, :wrapper_class => "col-sm-8" %>
+          <%= social_link_form.text_field :url, :skip_label => true, :wrapper_class => "col-sm-8" %>
           <%= social_link_form.check_box :_destroy, :wrapper_class => "d-none social_link_destroy" %>
           <%= social_link_form.label :_destroy, t(".social_links.remove"), :class => "btn btn-outline-primary col-sm-2 align-self-start" %>
         </div>
diff --git a/config/locales/en.yml b/config/locales/en.yml
index aa73fc0fc..5d5bbacc1 100644
--- a/config/locales/en.yml
+++ b/config/locales/en.yml
@@ -3343,6 +3343,9 @@ en:
       queryfeature_tooltip: Query features
       queryfeature_disabled_tooltip: Zoom in to query features
       embed_html_disabled: HTML embedding is not available for this map layer
+    profile:
+      social_link_n: "Social Profile Link %{n}"
+      remove_social_link_n: "Remove Social Profile Link %{n}"
     edit_help: Move the map and zoom in on a location you want to edit, then click here.
     directions:
       distance_in_units:
diff --git a/test/system/user_social_links_test.rb b/test/system/user_social_links_test.rb
new file mode 100644
index 000000000..3604a1985
--- /dev/null
+++ b/test/system/user_social_links_test.rb
@@ -0,0 +1,25 @@
+require "application_system_test_case"
+
+class UserSocialLinksTest < ApplicationSystemTestCase
+  def setup
+    stub_request(:get, /.*gravatar.com.*d=404/).to_return(:status => 404)
+
+    @user = create(:user)
+    sign_in_as(@user)
+    visit user_path(@user)
+  end
+
+  test "can add social links" do
+    within_content_body do
+      click_on "Edit Profile"
+
+      assert_no_field "Social Profile Link 1"
+
+      click_on "Add Social Link"
+      fill_in "Social Profile Link 1", :with => "https://example.com/user/fred"
+      click_on "Update Profile"
+
+      assert_link "example.com/user/fred"
+    end
+  end
+end
-- 
2.39.5