From 19b0dbe59d7cc5479dbb108ccd61e847b93803f3 Mon Sep 17 00:00:00 2001
From: Andrei Prigorshnev <a.prigorshnev@gmail.com>
Date: Fri, 24 Mar 2023 20:46:10 +0400
Subject: [PATCH] UX: Show titles on site settings navigation menu items
 (#20794)

In some languages, labels on the site settings navigation menu
get truncated. This adds titles to menu items, so users can see
untruncated labels on hover.
---
 .../admin/addon/templates/site-settings.hbs        |  7 ++++---
 .../tests/acceptance/admin-site-settings-test.js   | 14 ++++++++++++++
 2 files changed, 18 insertions(+), 3 deletions(-)

diff --git a/app/assets/javascripts/admin/addon/templates/site-settings.hbs b/app/assets/javascripts/admin/addon/templates/site-settings.hbs
index a12f1f05339..67235d6b42f 100644
--- a/app/assets/javascripts/admin/addon/templates/site-settings.hbs
+++ b/app/assets/javascripts/admin/addon/templates/site-settings.hbs
@@ -37,11 +37,12 @@
           @route="adminSiteSettingsCategory"
           @model={{category.nameKey}}
           class={{category.nameKey}}
+          title={{category.name}}
         >
           {{category.name}}
-          {{#if category.count}}<span
-              class="count"
-            >({{category.count}})</span>{{/if}}
+          {{#if category.count}}
+            <span class="count">({{category.count}})</span>
+          {{/if}}
         </LinkTo>
       </li>
     {{/each}}
diff --git a/app/assets/javascripts/discourse/tests/acceptance/admin-site-settings-test.js b/app/assets/javascripts/discourse/tests/acceptance/admin-site-settings-test.js
index cda13cc16a0..f804236f371 100644
--- a/app/assets/javascripts/discourse/tests/acceptance/admin-site-settings-test.js
+++ b/app/assets/javascripts/discourse/tests/acceptance/admin-site-settings-test.js
@@ -3,6 +3,7 @@ import {
   count,
   exists,
   query,
+  queryAll,
 } from "discourse/tests/helpers/qunit-helpers";
 import {
   click,
@@ -190,4 +191,17 @@ acceptance("Admin - Site Settings", function (needs) {
       "blocked_onebox_domains=proper.com"
     );
   });
+
+  test("nav menu items have titles", async (assert) => {
+    await visit("/admin/site_settings");
+
+    const navItems = queryAll(".admin-nav .nav-stacked li a");
+    navItems.each((_, item) => {
+      assert.equal(
+        item.title,
+        item.innerText,
+        "menu item has title, and the title is equal to menu item's label"
+      );
+    });
+  });
 });