feat(workspace): add app-drawer icon to Quick Access tab title and enlarge SVG

Add the app-drawer grid icon to the Quick Access panel tab title for
visual consistency with the toolbar button. Enlarge the SVG grid
squares for better visibility at small sizes. Rename panel title
from "Quick Access" to "Tools".

Author: abose

src/nls/root/strings.js

@@ -1255,7 +1255,7 @@ define({
     "BOTTOM_PANEL_MINIMIZE": "Minimize Panel",
     "BOTTOM_PANEL_SHOW": "Show Bottom Panel",
     "BOTTOM_PANEL_HIDE_TOGGLE": "Hide Bottom Panel",
-    "BOTTOM_PANEL_DEFAULT_TITLE": "Quick Access",
+    "BOTTOM_PANEL_DEFAULT_TITLE": "Tools",
     "BOTTOM_PANEL_DEFAULT_HEADING": "Open a Panel",
     "BOTTOM_PANEL_OPEN_PANEL": "Open a Panel",
     "BOTTOM_PANEL_MAXIMIZE": "Maximize Panel",

src/styles/images/app-drawer.svg

@@ -178,8 +178,26 @@ define(function (require, exports, module) {
             }
         });
 
-        // Create the app-drawer toolbar icon above the profile button
         const iconURL = ExtensionUtils.getModulePath(module, "../styles/images/app-drawer.svg");
+
+        /**
+         * Inject the app-drawer icon into the Quick Access tab title.
+         * Called each time the panel is shown because the tab DOM is rebuilt.
+         */
+        function _addTabIcon() {
+            const $tabTitle = $('#bottom-panel-tab-bar .bottom-panel-tab[data-panel-id="'
+                + WorkspaceManager.DEFAULT_PANEL_ID + '"] .bottom-panel-tab-title');
+            if ($tabTitle.length && !$tabTitle.find(".app-drawer-tab-icon").length) {
+                $tabTitle.prepend($('<img class="app-drawer-tab-icon">').attr("src", iconURL).css({
+                    "width": "12px",
+                    "height": "12px",
+                    "vertical-align": "middle",
+                    "margin-right": "4px"
+                }));
+            }
+        }
+
+        // Create the app-drawer toolbar icon above the profile button
         const $drawerBtn = $("<a>")
             .attr({
                 id: "app-drawer-button",
@@ -207,6 +225,7 @@ define(function (require, exports, module) {
                 _panel.hide();
             } else {
                 _updateButtonVisibility();
+                _addTabIcon();
             }
             $drawerBtn.toggleClass("selected-button", panelID === WorkspaceManager.DEFAULT_PANEL_ID);
         });