drop settingsToggleShowDocs

We can change the event handler in App.tsx do we no longer need the
settingsToggleShowDocs action or related sagas.

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);
                     }
                 });
 

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()),
     ]);

src/settings/actions.ts

@@ -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',
-}));

src/settings/sagas.test.ts

@@ -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();
-    });
-});

src/settings/sagas.ts

@@ -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);
-}