feat: Add shortcut for dark mode (#3543)

* Create and move toggle into an action

* Add shortcut on help dialog

src/components/BackgroundPickerAndDarkModeToggle.tsx

@@ -1,7 +1,6 @@
 import React from "react";
 import { ActionManager } from "../actions/manager";
 import { AppState } from "../types";
-import { DarkModeToggle } from "./DarkModeToggle";
 
 export const BackgroundPickerAndDarkModeToggle = ({
   appState,
@@ -16,15 +15,6 @@ export const BackgroundPickerAndDarkModeToggle = ({
 }) => (
   <div style={{ display: "flex" }}>
     {actionManager.renderAction("changeViewBackgroundColor")}
-    {showThemeBtn && (
-      <div style={{ marginInlineStart: "0.25rem" }}>
-        <DarkModeToggle
-          value={appState.theme}
-          onChange={(theme) => {
-            setAppState({ theme });
-          }}
-        />
-      </div>
-    )}
+    {showThemeBtn && <>{actionManager.renderAction("toggleTheme")}</>}
   </div>
 );

src/components/HelpDialog.tsx

@@ -231,6 +231,10 @@ export const HelpDialog = ({ onClose }: { onClose?: () => void }) => {
                   label={t("labels.viewMode")}
                   shortcuts={[getShortcutKey("Alt+R")]}
                 />
+                <Shortcut
+                  label={t("labels.toggleTheme")}
+                  shortcuts={[getShortcutKey("Alt+Shift+D")]}
+                />
               </ShortcutIsland>
             </Column>
             <Column>