diff --git a/src/app/App.tsx b/src/app/App.tsx
index 904cda47..6a3b9fb5 100644
--- a/src/app/App.tsx
+++ b/src/app/App.tsx
@@ -8,7 +8,6 @@ import SplitterLayout from 'react-splitter-layout';
 import { useLocalStorage, useTernaryDarkMode } from 'usehooks-ts';
 import Editor, { EditorType } from '../editor/Editor';
 import Explorer from '../explorer/Explorer';
-import { settingsToggleShowDocs } from '../settings/actions';
 import { useSettingIsShowDocsEnabled } from '../settings/hooks';
 import StatusBar from '../status-bar/StatusBar';
 import Terminal from '../terminal/Terminal';
@@ -19,7 +18,7 @@ import 'react-splitter-layout/lib/index.css';
 import './app.scss';
 
 const Docs: React.VFC = () => {
-    const dispatch = useDispatch();
+    const { setIsSettingShowDocsEnabled } = useSettingIsShowDocsEnabled();
 
     return (
         <iframe
@@ -104,10 +103,9 @@ const Docs: React.VFC = () => {
                         e.key == 'd'
                     ) {
                         e.preventDefault();
-                        // we have to use dispatch here instead of
-                        // toggleIsSettingShowDocsEnabled since this
-                        // isn't updated on state changes
-                        dispatch(settingsToggleShowDocs());
+                        // since the iframe is only visible when docs are shown
+                        // the only action is to hide the docs
+                        setIsSettingShowDocsEnabled(false);
                     }
                 });
 
diff --git a/src/sagas.ts b/src/sagas.ts
index 79cf0cfe..7d9aef2c 100644
--- a/src/sagas.ts
+++ b/src/sagas.ts
@@ -16,7 +16,6 @@ import lwp3BootloaderProtocol from './lwp3-bootloader/sagas';
 import lwp3BootloaderBle from './lwp3-bootloader/sagas-ble';
 import mpy from './mpy/sagas';
 import notifications, { NotificationSagaContext } from './notifications/sagas';
-import settings from './settings/sagas';
 import terminal, { TerminalSagaContext } from './terminal/sagas';
 
 /* istanbul ignore next */
@@ -34,7 +33,6 @@ export default function* (): Generator {
         hub(),
         mpy(),
         notifications(),
-        settings(),
         terminal(),
         put(didStart()),
     ]);
diff --git a/src/settings/actions.ts b/src/settings/actions.ts
deleted file mode 100644
index b35fdd35..00000000
--- a/src/settings/actions.ts
+++ /dev/null
@@ -1,9 +0,0 @@
-// SPDX-License-Identifier: MIT
-// Copyright (c) 2022 The Pybricks Authors
-
-import { createAction } from '../actions';
-
-/** Requests to toggle the showDocs setting. */
-export const settingsToggleShowDocs = createAction(() => ({
-    type: 'editor.action.toggleShowDocs',
-}));
diff --git a/src/settings/sagas.test.ts b/src/settings/sagas.test.ts
deleted file mode 100644
index 91e49324..00000000
--- a/src/settings/sagas.test.ts
+++ /dev/null
@@ -1,23 +0,0 @@
-// SPDX-License-Identifier: MIT
-// Copyright (c) 2022 The Pybricks Authors
-//
-// Tests for settings sagas.
-
-import { AsyncSaga } from '../../test';
-import { settingsToggleShowDocs } from './actions';
-import settings from './sagas';
-
-describe('handleToggleShowDocs', () => {
-    it('should toggle the showDocs setting', async () => {
-        const key = 'setting.showDocs';
-        const saga = new AsyncSaga(settings);
-
-        saga.put(settingsToggleShowDocs());
-        expect(localStorage.getItem(key)).toBe('true');
-
-        saga.put(settingsToggleShowDocs());
-        expect(localStorage.getItem(key)).toBe('false');
-
-        await saga.end();
-    });
-});
diff --git a/src/settings/sagas.ts b/src/settings/sagas.ts
deleted file mode 100644
index a9e8b4b6..00000000
--- a/src/settings/sagas.ts
+++ /dev/null
@@ -1,32 +0,0 @@
-// SPDX-License-Identifier: MIT
-// Copyright (c) 2022 The Pybricks Authors
-
-// This manages settings by storing them in local storage whenever the app
-// request to set a setting. When local storage changes, it triggers a did
-// change action that can be used by reducers to compute the new state.
-
-import { call, takeEvery } from 'typed-redux-saga/macro';
-import { settingsToggleShowDocs } from './actions';
-
-/**
- * Hack to wire editor action to settings hook.
- *
- * There are a few places where using toggleIsSettingShowDocsEnabled() doesn't
- * work because it needs to be called from outside of a React component that
- * doesn't get updated when state changes.
- */
-function* handleToggleShowDocs(): Generator {
-    // HACK: This depends on the implementation detail that
-    // useSettingIsShowDocsEnabled() uses useLocalStorage() internally.
-    yield* call(() => {
-        const key = 'setting.showDocs';
-        const oldValue = localStorage.getItem(key);
-        const newValue = JSON.stringify(!(oldValue && JSON.parse(oldValue)));
-        localStorage.setItem(key, newValue);
-        window.dispatchEvent(new Event('local-storage'));
-    });
-}
-
-export default function* (): Generator {
-    yield* takeEvery(settingsToggleShowDocs, handleToggleShowDocs);
-}