Add hidden option to toolbox (#1220)

* Add hidden option to toolbox * Use false in order to hide toolbox * Add comment what false means * Add issue #1221 to changelog Co-authored-by: t.hata <[email protected]>
codex-team · Aug 27, 2020 · cdb48c4 · cdb48c4
1 parent 57397de
commit cdb48c4
Show file tree

Hide file tree

Showing 6 changed files with 21 additions and 7 deletions.
diff --git a/dist/editor.js b/dist/editor.js
diff --git a/docs/CHANGELOG.md b/docs/CHANGELOG.md
@@ -12,6 +12,7 @@
 - `New` - Tool's `reset` static method added to the API to clean up any data added by Tool on initialization
 - `Improvements` - Unuseful log about missed i18n section has been removed  [#1269](https://github.com/codex-team/editor.js/issues/1269)
 - `Fix` - Fixed issue with enter key in inputs and textareas [#920](https://github.com/codex-team/editor.js/issues/920)
+- `Improvements` - Allowed to set `false` as `toolbox` config in order to hide Toolbox button [#1221](https://github.com/codex-team/editor.js/issues/1221)
 
 ### 2.18
 

diff --git a/src/components/modules/renderer.ts b/src/components/modules/renderer.ts
@@ -91,7 +91,7 @@ export default class Renderer extends Module {
         const toolToolboxSettings = (Tools.unavailable[tool] as BlockToolConstructable).toolbox;
         const userToolboxSettings = Tools.getToolSettings(tool).toolbox;
 
-        stubData.title = toolToolboxSettings.title || userToolboxSettings.title || stubData.title;
+        stubData.title = toolToolboxSettings.title || (userToolboxSettings && userToolboxSettings.title) || stubData.title;
       }
 
       const stub = BlockManager.insert({

diff --git a/src/components/modules/toolbar/conversion.ts b/src/components/modules/toolbar/conversion.ts
@@ -264,10 +264,15 @@ export default class ConversionToolbar extends Module {
       const toolToolboxSettings = toolClass[internalSettings.TOOLBOX];
       const conversionConfig = toolClass[internalSettings.CONVERSION_CONFIG];
 
+      const userSettings = this.Editor.Tools.USER_SETTINGS;
+      const userToolboxSettings = this.Editor.Tools.getToolSettings(toolName)[userSettings.TOOLBOX];
+
+      const toolboxSettings = userToolboxSettings ?? toolToolboxSettings;
+
       /**
        * Skip tools that don't pass 'toolbox' property
        */
-      if (_.isEmpty(toolToolboxSettings) || !toolToolboxSettings.icon) {
+      if (_.isEmpty(toolboxSettings) || !toolboxSettings.icon) {
         continue;
       }
 
@@ -278,7 +283,7 @@ export default class ConversionToolbar extends Module {
         continue;
       }
 
-      this.addTool(toolName, toolToolboxSettings.icon, toolToolboxSettings.title);
+      this.addTool(toolName, toolboxSettings.icon, toolboxSettings.title);
     }
   }
 

diff --git a/src/components/modules/toolbar/toolbox.ts b/src/components/modules/toolbar/toolbox.ts
@@ -183,12 +183,19 @@ export default class Toolbox extends Module {
     //   return;
     // }
 
-    const userToolboxSettings = this.Editor.Tools.getToolSettings(toolName)[userSettings.TOOLBOX] || {};
+    const userToolboxSettings = this.Editor.Tools.getToolSettings(toolName)[userSettings.TOOLBOX];
+
+    /**
+     * Hide Toolbox button if Toolbox settings is false
+     */
+    if ((userToolboxSettings ?? toolToolboxSettings) === false) {
+      return;
+    }
 
     const button = $.make('li', [ this.CSS.toolboxButton ]);
 
     button.dataset.tool = toolName;
-    button.innerHTML = userToolboxSettings.icon || toolToolboxSettings.icon;
+    button.innerHTML = (userToolboxSettings && userToolboxSettings.icon) || toolToolboxSettings.icon;
 
     $.append(this.nodes.toolbox, button);
 

diff --git a/types/tools/tool-settings.d.ts b/types/tools/tool-settings.d.ts
@@ -44,6 +44,7 @@ export interface ToolSettings {
 
   /**
    * Tool's Toolbox settings
+   * It will be hidden from Toolbox when false is specified.
    */
-  toolbox?: ToolboxConfig;
+  toolbox?: ToolboxConfig | false;
 }