feat: update shortcuts modal icon (#5920)

Author: Sekhmet

assets/images/Svg.js

@@ -25,6 +25,7 @@ const svg = {
   file: require("./file.svg"),
   folder: require("./folder.svg"),
   globe: require("./globe.svg"),
+  help: require("./help.svg"),
   home: require("./home.svg"),
   javascript: require("./javascript.svg"),
   jquery: require("./jquery.svg"),

assets/images/help.svg

@@ -30,7 +30,8 @@ img.reverseStepIn,
 img.reverseStepOut,
 img.replay-previous,
 img.replay-next,
-img.resume {
+img.resume,
+img.shortcuts {
   background-color: var(--theme-body-color);
 }
 
@@ -107,6 +108,10 @@ img.resume {
   margin-top: 5px;
 }
 
+.command-bar img.shortcuts {
+  mask: url(/images/help.svg) no-repeat;
+}
+
 .command-bar .replay-inactive {
   opacity: 0.5;
 }

src/components/SecondaryPanes/CommandBar.css

@@ -81,13 +81,13 @@ function formatKey(action) {
   return formatKeyShortcut(key);
 }
 
-function debugBtn(
-  onClick,
-  type,
-  className,
-  tooltip,
-  disabled = false,
-  ariaPressed = false
+export function debugBtn(
+  onClick: ?Function,
+  type: string,
+  className: string,
+  tooltip: string,
+  disabled: boolean = false,
+  ariaPressed: boolean = false
 ) {
   return (
     <CommandBarButton

src/components/SecondaryPanes/CommandBar.js

@@ -5,24 +5,9 @@
 // @flow
 import React, { Component } from "react";
 import classnames from "classnames";
+import { debugBtn } from "./CommandBar";
 import "./CommandBar.css";
 
-function debugBtn(onClick, type, className, tooltip, disabled = false) {
-  const props = {
-    onClick,
-    key: type,
-    "aria-label": tooltip,
-    title: tooltip,
-    disabled
-  };
-
-  return (
-    <button className={classnames(type, className)} {...props}>
-      ?
-    </button>
-  );
-}
-
 type Props = {
   horizontal: boolean,
   toggleShortcutsModal: () => void
@@ -33,7 +18,7 @@ class UtilsBar extends Component<Props> {
     return [
       debugBtn(
         this.props.toggleShortcutsModal,
-        "shortcut",
+        "shortcuts",
         "active",
         L10N.getStr("shortcuts.buttonName"),
         false