editor: move docs toggle from settings

This removes the docs toggle switch from the settings and adds a new
docs toggle button to the editor.

Fixes: https://github.com/pybricks/support/issues/778

src/editor/Editor.tsx

@@ -357,7 +357,8 @@ const Editor: React.VFC = () => {
     const dispatch = useDispatch();
 
     const [editor, setEditor] = useState<monaco.editor.IStandaloneCodeEditor>();
-    const { toggleIsSettingShowDocsEnabled } = useSettingIsShowDocsEnabled();
+    const { isSettingShowDocsEnabled, toggleIsSettingShowDocsEnabled } =
+        useSettingIsShowDocsEnabled();
     const { isDarkMode } = useTernaryDarkMode();
 
     const i18n = useI18n();
@@ -486,6 +487,18 @@ const Editor: React.VFC = () => {
                     <div className="pb-editor-monaco" ref={editorRef} />
                 </ContextMenu2>
             </ResizeSensor2>
+            <Button
+                className="pb-editor-doc-button"
+                minimal
+                large
+                icon="manual"
+                title={
+                    isSettingShowDocsEnabled
+                        ? i18n.translate('docs.hide')
+                        : i18n.translate('docs.show')
+                }
+                onClick={toggleIsSettingShowDocsEnabled}
+            />
         </div>
     );
 };

src/editor/editor.scss

@@ -93,4 +93,11 @@
             color: bp.$pt-dark-text-color-muted;
         }
     }
+
+    &-doc-button {
+        position: absolute;
+        bottom: bp.$pt-grid-size;
+        right: bp.$pt-grid-size;
+        z-index: bp.$pt-z-index-overlay;
+    }
 }

src/editor/translations/en.json

@@ -8,5 +8,9 @@
     "undo": "Undo",
     "redo": "Redo",
     "closeFile": { "tooltip": "Close {fileName}" },
-    "contextMenu": { "label": "Editor context menu" }
+    "contextMenu": { "label": "Editor context menu" },
+    "docs": {
+        "show": "Show documentation",
+        "hide": "Hide documentation"
+    }
 }