-2

apps/web/src/components/Common/Layout.tsx

··· 8 8 import FullPageLoader from "@/components/Shared/FullPageLoader"; 9 9 import GlobalAlerts from "@/components/Shared/GlobalAlerts"; 10 10 import GlobalModals from "@/components/Shared/GlobalModals"; 11 11 - import GlobalShortcuts from "@/components/Shared/GlobalShortcuts"; 12 11 import Navbar from "@/components/Shared/Navbar"; 13 12 import BottomNavigation from "@/components/Shared/Navbar/BottomNavigation"; 14 13 import { Spinner } from "@/components/Shared/UI"; ··· 74 73 style: { boxShadow: "none", fontSize: "16px" } 75 74 }} 76 75 /> 77 77 - <GlobalShortcuts /> 78 76 <GlobalModals /> 79 77 <GlobalAlerts /> 80 78 <ReloadTabsWatcher />

+1 -5

apps/web/src/components/Composer/NewPublication.tsx

··· 4 4 import type { IGif } from "@hey/types/giphy"; 5 5 import type { NewAttachment } from "@hey/types/misc"; 6 6 import { useCallback, useEffect, useState } from "react"; 7 7 - import { useHotkeys } from "react-hotkeys-hook"; 8 7 import { toast } from "sonner"; 9 8 import Attachment from "@/components/Composer/Actions/Attachment"; 10 9 import CollectSettings from "@/components/Composer/Actions/CollectSettings"; ··· 19 18 import collectActionParams from "@/helpers/collectActionParams"; 20 19 import errorToast from "@/helpers/errorToast"; 21 20 import getMentions from "@/helpers/getMentions"; 22 22 - import KeyboardShortcuts from "@/helpers/shortcuts"; 23 21 import uploadMetadata from "@/helpers/uploadMetadata"; 24 22 import useCreatePost from "@/hooks/useCreatePost"; 25 23 import useEditPost from "@/hooks/useEditPost"; ··· 240 238 addAttachments([attachment]); 241 239 }; 242 240 243 243 - useHotkeys(KeyboardShortcuts.CreatePost.key, () => handleCreatePost(), { 244 244 - enableOnContentEditable: true 245 245 - }); 241 241 + // Removed keyboard shortcut for create post 246 242 247 243 return ( 248 244 <Card className={className} onClick={() => setShowEmojiPicker(false)}>

-12

apps/web/src/components/Shared/GlobalModals.tsx

··· 7 7 import ReportAccount from "@/components/Shared/Modal/ReportAccount"; 8 8 import ReportPost from "@/components/Shared/Modal/ReportPost"; 9 9 import Subscribe from "@/components/Shared/Modal/Subscribe"; 10 10 - import ShortcutsModal from "@/components/Shared/ShortcutsModal"; 11 10 import { Modal } from "@/components/Shared/UI"; 12 11 import { useAuthModalStore } from "@/store/non-persisted/modal/useAuthModalStore"; 13 12 import { useFundModalStore } from "@/store/non-persisted/modal/useFundModalStore"; ··· 15 14 import { useProModalStore } from "@/store/non-persisted/modal/useProModalStore"; 16 15 import { useReportAccountModalStore } from "@/store/non-persisted/modal/useReportAccountModalStore"; 17 16 import { useReportPostModalStore } from "@/store/non-persisted/modal/useReportPostModalStore"; 18 18 - import { useShortcutsModalStore } from "@/store/non-persisted/modal/useShortcutsModalStore"; 19 17 import { useSuperFollowModalStore } from "@/store/non-persisted/modal/useSuperFollowModalStore"; 20 18 import { useSuperJoinModalStore } from "@/store/non-persisted/modal/useSuperJoinModalStore"; 21 19 import { useSwitchAccountModalStore } from "@/store/non-persisted/modal/useSwitchAccountModalStore"; ··· 49 47 superFollowingAccount 50 48 } = useSuperFollowModalStore(); 51 49 const { show: showProModal, setShow: setShowProModal } = useProModalStore(); 52 52 - const { show: showShortcutsModal, setShow: setShowShortcutsModal } = 53 53 - useShortcutsModalStore(); 54 54 - 55 50 const { screen: signupScreen } = useSignupStore(); 56 51 57 52 const authModalTitle = ··· 133 128 size="md" 134 129 > 135 130 <Subscribe /> 136 136 - </Modal> 137 137 - <Modal 138 138 - onClose={() => setShowShortcutsModal(false)} 139 139 - show={showShortcutsModal} 140 140 - title="Keyboard Shortcuts" 141 141 - > 142 142 - <ShortcutsModal /> 143 131 </Modal> 144 132 </> 145 133 );

-56

apps/web/src/components/Shared/GlobalShortcuts.tsx

··· 1 1 - import getAccount from "@hey/helpers/getAccount"; 2 2 - import { useHotkeys } from "react-hotkeys-hook"; 3 3 - import { useNavigate } from "react-router"; 4 4 - import KeyboardShortcuts from "@/helpers/shortcuts"; 5 5 - import { useShortcutsModalStore } from "@/store/non-persisted/modal/useShortcutsModalStore"; 6 6 - import { useAccountStore } from "@/store/persisted/useAccountStore"; 7 7 - 8 8 - const GlobalShortcuts = () => { 9 9 - const navigate = useNavigate(); 10 10 - const { currentAccount } = useAccountStore(); 11 11 - const { setShow: setShowShortcutsModal } = useShortcutsModalStore(); 12 12 - 13 13 - // Go to account 14 14 - useHotkeys(KeyboardShortcuts.GoToAccount.key, () => { 15 15 - navigate(getAccount(currentAccount).link); 16 16 - }); 17 17 - 18 18 - // Go to home 19 19 - useHotkeys(KeyboardShortcuts.GoToHome.key, () => { 20 20 - navigate("/"); 21 21 - }); 22 22 - 23 23 - // Go to explore 24 24 - useHotkeys(KeyboardShortcuts.GoToExplore.key, () => { 25 25 - navigate("/explore"); 26 26 - }); 27 27 - 28 28 - // Go to notifications 29 29 - useHotkeys(KeyboardShortcuts.GoToNotifications.key, () => { 30 30 - navigate("/notifications"); 31 31 - }); 32 32 - 33 33 - // Go to search 34 34 - useHotkeys(KeyboardShortcuts.GoToSearch.key, () => { 35 35 - navigate("/search"); 36 36 - }); 37 37 - 38 38 - // Go to bookmarks 39 39 - useHotkeys(KeyboardShortcuts.GoToBookmarks.key, () => { 40 40 - navigate("/bookmarks"); 41 41 - }); 42 42 - 43 43 - // Go to settings 44 44 - useHotkeys(KeyboardShortcuts.GoToSettings.key, () => { 45 45 - navigate("/settings"); 46 46 - }); 47 47 - 48 48 - // Show shortcuts modal 49 49 - useHotkeys(KeyboardShortcuts.ThisModal.key, () => { 50 50 - setShowShortcutsModal(true); 51 51 - }); 52 52 - 53 53 - return null; 54 54 - }; 55 55 - 56 56 - export default GlobalShortcuts;

-21

apps/web/src/components/Shared/ShortcutsModal.tsx

··· 1 1 - import KeyboardShortcuts from "@/helpers/shortcuts"; 2 2 - 3 3 - const ShortcutsModal = () => { 4 4 - return ( 5 5 - <div className="max-h-[60vh] overflow-y-auto p-5"> 6 6 - <ul className="space-y-2"> 7 7 - {Object.entries(KeyboardShortcuts).map(([id, shortcut]) => ( 8 8 - <li 9 9 - className="flex items-center justify-between rounded-md bg-gray-100 p-2 dark:bg-gray-700" 10 10 - key={id} 11 11 - > 12 12 - <span className="font-mono text-sm">{shortcut.key}</span> 13 13 - <span className="text-sm">{shortcut.name}</span> 14 14 - </li> 15 15 - ))} 16 16 - </ul> 17 17 - </div> 18 18 - ); 19 19 - }; 20 20 - 21 21 - export default ShortcutsModal;

-16

apps/web/src/helpers/shortcuts.ts

··· 1 1 - const KeyboardShortcuts = { 2 2 - CreatePost: { 3 3 - key: "mod+enter", 4 4 - name: "Create Post/Comment" 5 5 - }, 6 6 - GoToAccount: { key: "g+p", name: "Go to Account" }, 7 7 - GoToBookmarks: { key: "g+b", name: "Go to Bookmarks" }, 8 8 - GoToExplore: { key: "g+e", name: "Go to Explore" }, 9 9 - GoToHome: { key: "g+h", name: "Go to Home" }, 10 10 - GoToNotifications: { key: "g+n", name: "Go to Notifications" }, 11 11 - GoToSearch: { key: "g+s", name: "Go to Search" }, 12 12 - GoToSettings: { key: "g+t", name: "Go to Settings" }, 13 13 - ThisModal: { key: "?", name: "Shortcut help" } 14 14 - }; 15 15 - 16 16 - export default KeyboardShortcuts;

-5

apps/web/src/store/non-persisted/modal/useShortcutsModalStore.ts

··· 1 1 - import { createToggleStore } from "@/store/createToggleStore"; 2 2 - 3 3 - const { useStore: useShortcutsModalStore } = createToggleStore(); 4 4 - 5 5 - export { useShortcutsModalStore };