FEATURE: Keyboard shortcut for opening the topic admin menu (#8568)

* Keyboard shortcut for opening the topic admin menu

* Review changes

* Attrubute and target class renaming

app/assets/javascripts/discourse/components/topic-timeline.js.es6

@@ -102,5 +102,6 @@ export default MountWidget.extend(Docking, {
     }
 
     this.dispatch("topic:current-post-scrolled", "timeline-scrollarea");
+    this.dispatch("topic:toggle-actions", "topic-admin-menu-button");
   }
 });

app/assets/javascripts/discourse/controllers/keyboard-shortcuts-help.js.es6

@@ -167,6 +167,10 @@ export default Controller.extend(ModalFunctionality, {
       defer: buildShortcut("actions.defer", {
         keys1: [SHIFT, "u"],
         keysDelimiter: PLUS
+      }),
+      topic_admin_actions: buildShortcut("actions.topic_admin_actions", {
+        keys1: [SHIFT, "a"],
+        keysDelimiter: PLUS
       })
     }
   }

app/assets/javascripts/discourse/lib/keyboard-shortcuts.js.es6

@@ -71,6 +71,7 @@ const bindings = {
   "shift+z shift+z": { handler: "logout" },
   "shift+f11": { handler: "fullscreenComposer", global: true },
   "shift+u": { handler: "deferTopic" },
+  "shift+a": { handler: "toggleAdminActions" },
   t: { postAction: "replyAsNewTopic" },
   u: { handler: "goBack", anonymous: true },
   "x r": {
@@ -638,5 +639,9 @@ export default {
 
   deferTopic() {
     this.container.lookup("controller:topic").send("deferTopic");
+  },
+
+  toggleAdminActions() {
+    this.appEvents.trigger("topic:toggle-actions");
   }
 };

app/assets/javascripts/discourse/templates/modal/keyboard-shortcuts-help.hbs

@@ -67,6 +67,7 @@
         <li>{{{shortcuts.actions.mark_watching}}}</li>
         <li>{{{shortcuts.actions.defer}}}</li>
         <li>{{{shortcuts.actions.print}}}</li>
+        <li>{{{shortcuts.actions.topic_admin_actions}}}</li>
       </ul>
     </div>
   </div>

app/assets/javascripts/discourse/widgets/topic-admin-menu.js.es6

@@ -52,7 +52,8 @@ createWidget("topic-admin-menu-button", {
         this.attach("button", {
           className:
             "btn-default toggle-admin-menu" +
-            (attrs.fixed ? " show-topic-admin" : ""),
+            (attrs.fixed ? " show-topic-admin" : "") +
+            (attrs.addKeyboardTargetClass ? " keyboard-target-admin-menu" : ""),
           title: "topic_admin_menu",
           icon: "wrench",
           action: "showAdminMenu",
@@ -75,9 +76,16 @@ createWidget("topic-admin-menu-button", {
 
   showAdminMenu(e) {
     this.state.expanded = true;
+    let $button;
+
+    if (e === undefined) {
+      $button = $(".keyboard-target-admin-menu");
+    } else {
+      $button = $(e.target).closest("button");
+    }
 
-    const $button = $(e.target).closest("button");
     const position = $button.position();
+
     const rtl = $("html").hasClass("rtl");
     position.left = position.left;
     position.outerHeight = $button.outerHeight();
@@ -90,6 +98,10 @@ createWidget("topic-admin-menu-button", {
       position.left += $button.width() - 203;
     }
     this.state.position = position;
+  },
+
+  topicToggleActions() {
+    this.state.expanded ? this.hideAdminMenu() : this.showAdminMenu();
   }
 });
 

app/assets/javascripts/discourse/widgets/topic-timeline.js.es6

@@ -322,7 +322,12 @@ createWidget("timeline-controls", {
     const { fullScreen, currentUser, topic } = attrs;
 
     if (!fullScreen && currentUser) {
-      controls.push(this.attach("topic-admin-menu-button", { topic }));
+      controls.push(
+        this.attach("topic-admin-menu-button", {
+          topic,
+          addKeyboardTargetClass: true
+        })
+      );
     }
 
     return controls;

config/locales/client.en.yml

@@ -3042,6 +3042,7 @@ en:
         mark_watching: "%{shortcut} Watch topic"
         print: "%{shortcut} Print topic"
         defer: "%{shortcut} Defer topic"
+        topic_admin_actions: "%{shortcut} Open topic admin actions"
 
     badges:
       earned_n_times:

config/locales/client.es.yml

@@ -2785,6 +2785,7 @@ es:
         mark_watching: "%{shortcut} Vigilar Tema"
         print: "%{shortcut} Imprimir tema"
         defer: "%{shortcut} Aplazar el tema"
+        topic_admin_actions: "%{shortcut} Abrir acciones de administrador para el tema"
     badges:
       earned_n_times:
         one: "Ganó esta medalla %{count} vez"