diff --git a/src/App.web.tsx b/src/App.web.tsx
index bef32082..6efe7cc0 100644
--- a/src/App.web.tsx
+++ b/src/App.web.tsx
@@ -35,6 +35,7 @@ import {
} from '#/state/session'
import {readLastActiveAccount} from '#/state/session/util'
import {Provider as ShellStateProvider} from '#/state/shell'
+import {useComposerKeyboardShortcut} from '#/state/shell/composer/useComposerKeyboardShortcut'
import {Provider as LoggedOutViewProvider} from '#/state/shell/logged-out'
import {Provider as ProgressGuideProvider} from '#/state/shell/progress-guide'
import {Provider as SelectedFeedProvider} from '#/state/shell/selected-feed'
@@ -62,6 +63,8 @@ function InnerApp() {
useIntentHandler()
const hasCheckedReferrer = useStarterPackEntry()
+ useComposerKeyboardShortcut()
+
// init
useEffect(() => {
async function onLaunch(account?: SessionAccount) {
diff --git a/src/state/shell/composer.tsx b/src/state/shell/composer/index.tsx
similarity index 100%
rename from src/state/shell/composer.tsx
rename to src/state/shell/composer/index.tsx
diff --git a/src/state/shell/composer/useComposerKeyboardShortcut.tsx b/src/state/shell/composer/useComposerKeyboardShortcut.tsx
new file mode 100644
index 00000000..f4606218
--- /dev/null
+++ b/src/state/shell/composer/useComposerKeyboardShortcut.tsx
@@ -0,0 +1,49 @@
+import React from 'react'
+
+import {useComposerControls} from './'
+
+/**
+ * Based on {@link https://github.com/jaywcjlove/hotkeys-js/blob/b0038773f3b902574f22af747f3bb003a850f1da/src/index.js#L51C1-L64C2}
+ */
+function shouldIgnore(event: KeyboardEvent) {
+ const target: any = event.target || event.srcElement
+ if (!target) return false
+ const {tagName} = target
+ if (!tagName) return false
+ const isInput =
+ tagName === 'INPUT' &&
+ ![
+ 'checkbox',
+ 'radio',
+ 'range',
+ 'button',
+ 'file',
+ 'reset',
+ 'submit',
+ 'color',
+ ].includes(target.type)
+ // ignore: isContentEditable === 'true', and