SONAR-9780 Add keyboard shortcuts help on the Rules page

4 files changed, 19 insertions, 15 deletions

diff --git a/server/sonar-web/src/main/js/apps/coding-rules/templates/coding-rules-workspace-header.hbs b/server/sonar-web/src/main/js/apps/coding-rules/templates/coding-rules-workspace-header.hbs
index 97623f1e77a..900951bc70d 100644
--- a/server/sonar-web/src/main/js/apps/coding-rules/templates/coding-rules-workspace-header.hbs
+++ b/server/sonar-web/src/main/js/apps/coding-rules/templates/coding-rules-workspace-header.hbs
@@ -2,14 +2,28 @@
   {{#if state.rule}}
     <a class="js-back">{{t 'coding_rules.return_to_list'}}</a>
   {{else}}
-    &nbsp;
+    {{#if canBulkChange}}
+      <button class="js-bulk-change">{{t 'bulk_change'}}</button>
+    {{/if}}
+    <button class="js-new-search" id="coding-rules-new-search">{{t 'clear_all_filters'}}</button>
   {{/if}}
 </div>
 
 
 <div class="pull-right">
+  <span class="note big-spacer-right">
+    <span class="shortcut-button little-spacer-right">↑</span><span class="shortcut-button little-spacer-right">↓</span>{{t 'coding_rules.to_select_rules'}}
+    <span class="shortcut-button little-spacer-right big-spacer-left">←</span><span class="shortcut-button little-spacer-right">→</span>{{t 'issues.to_navigate'}}
+  </span>
+
   {{#notNull state.total}}
-    <div class="search-navigator-header-pagination flash flash-heavy">
+    <a class="js-reload link-no-underline" href="#">
+      <svg width="18" height="24" viewBox="0 0 18 24">
+        <path fill="#777" d="M16.6454 8.1084c-.3-.5-.9-.7-1.4-.4-.5.3-.7.9-.4 1.4.9 1.6 1.1 3.4.6 5.1-.5 1.7-1.7 3.2-3.2 4-3.3 1.8-7.4.6-9.1-2.7-1.8-3.1-.8-6.9 2.1-8.8v3.3h2v-7h-7v2h3.9c-3.7 2.5-5 7.5-2.8 11.4 1.6 3 4.6 4.6 7.7 4.6 1.4 0 2.8-.3 4.2-1.1 2-1.1 3.5-3 4.2-5.2.6-2.2.3-4.6-.8-6.6z" />
+      </svg>
+    </a>
+
+    <div class="search-navigator-header-pagination spacer-left flash flash-heavy">
       <strong>
         {{#gt state.total 0}}
           <span class="current">
@@ -24,13 +38,4 @@
       {{t 'coding_rules._rules'}}
     </div>
   {{/notNull}}
-
-
-  <div class="search-navigator-header-buttons button-group">
-    <button class="js-reload">{{t 'reload'}}</button>
-    <button class="js-new-search" id="coding-rules-new-search">{{t 'coding_rules.new_search'}}</button>
-    {{#if canBulkChange}}
-      <button class="js-bulk-change">{{t 'bulk_change'}}</button>
-    {{/if}}
-  </div>
 </div>
diff --git a/server/sonar-web/src/main/js/apps/coding-rules/workspace-header-view.js b/server/sonar-web/src/main/js/apps/coding-rules/workspace-header-view.js
index 708164d62ae..cbf44b2aa3d 100644
--- a/server/sonar-web/src/main/js/apps/coding-rules/workspace-header-view.js
+++ b/server/sonar-web/src/main/js/apps/coding-rules/workspace-header-view.js
@@ -49,7 +49,8 @@ export default WorkspaceHeaderView.extend({
     }).render();
   },
 
-  reload() {
+  reload(event) {
+    event.preventDefault();
     this.options.app.controller.fetchList(true);
   },
 
diff --git a/server/sonar-web/src/main/less/components/search-navigator.less b/server/sonar-web/src/main/less/components/search-navigator.less
index dcd88bc69d7..c3ca54bce78 100644
--- a/server/sonar-web/src/main/less/components/search-navigator.less
+++ b/server/sonar-web/src/main/less/components/search-navigator.less
@@ -689,8 +689,6 @@
 .search-navigator-header-pagination {
   display: inline-block;
   vertical-align: top;
-  margin-right: 20px;
-  font-size: @smallFontSize;
 }
 
 .search-navigator-header-buttons {
diff --git a/sonar-core/src/main/resources/org/sonar/l10n/core.properties b/sonar-core/src/main/resources/org/sonar/l10n/core.properties
index b71154a1f9a..43cf2a8e953 100644
--- a/sonar-core/src/main/resources/org/sonar/l10n/core.properties
+++ b/sonar-core/src/main/resources/org/sonar/l10n/core.properties
@@ -1184,7 +1184,6 @@ coding_rules.deactivate_in_all_quality_profiles=Deactivate In All {0} Profiles
 coding_rules.inherits="{0}" inherits from "{1}"
 coding_rules.issues=Issues
 coding_rules.most_violating_projects=Most Violating Projects
-coding_rules.new_search=New Search
 coding_rules.no_results=No Coding Rules
 coding_rules.no_tags=No tags
 coding_rules.original=Original:
@@ -1205,6 +1204,7 @@ coding_rules.rule_template=Rule Template
 coding_rules.rule_template.title=This rule can be used as a template to create custom rules,\nit cannot be activated on a profile
 coding_rules._rules=rules
 coding_rules.show_template=Show Template
+coding_rules.to_select_rules=to select rules
 coding_rules.type.tooltip.CODE_SMELL=Code Smell Detection Rule
 coding_rules.type.tooltip.BUG=Bug Detection Rule
 coding_rules.type.tooltip.VULNERABILITY=Vulnerability Detection Rule