diff --git a/app/components/CodeEditor.tsx b/app/components/CodeEditor.tsx index c843bb15..b20ecb25 100644 --- a/app/components/CodeEditor.tsx +++ b/app/components/CodeEditor.tsx @@ -10,6 +10,7 @@ import { useJsonDoc } from "~/hooks/useJsonDoc"; import { getEditorSetup } from "~/utilities/codeMirrorSetup"; import { darkTheme, lightTheme } from "~/utilities/codeMirrorTheme"; import { useTheme } from "./ThemeProvider"; +import { useHotkeys } from "react-hotkeys-hook"; export type CodeEditorProps = { content: string; @@ -98,6 +99,16 @@ export function CodeEditor(opts: CodeEditorProps) { const { minimal } = useJsonDoc(); + useHotkeys( + "ctrl+a,meta+a,command+a", + (e) => { + e.preventDefault(); + view?.dispatch({ selection: { anchor: 0, head: state?.doc.length } }); + }, + [view, state] + ); + + return (
{ + e.preventDefault(); + view?.dispatch({ selection: { anchor: 0, head: state?.doc.length } }); + }, + [view, state] + ); + return (
diff --git a/app/components/JsonPreview.tsx b/app/components/JsonPreview.tsx index 855035ed..3ec1d459 100644 --- a/app/components/JsonPreview.tsx +++ b/app/components/JsonPreview.tsx @@ -15,7 +15,8 @@ import { getPreviewSetup } from "~/utilities/codeMirrorSetup"; import { lightTheme, darkTheme } from "~/utilities/codeMirrorTheme"; import { CopyTextButton } from "./CopyTextButton"; import { useTheme } from "./ThemeProvider"; -import {usePreferences} from '~/components/PreferencesProvider' +import {usePreferences} from '~/components/PreferencesProvider'; +import { useHotkeys } from "react-hotkeys-hook"; export type JsonPreviewProps = { json: unknown; @@ -56,7 +57,7 @@ export function JsonPreview({ json, highlightPath }: JsonPreviewProps) { const [theme] = useTheme(); - const { setContainer, view } = useCodeMirror({ + const { setContainer, view, state } = useCodeMirror({ container: editor.current, extensions, value: jsonMapped.json, @@ -92,6 +93,15 @@ export function JsonPreview({ json, highlightPath }: JsonPreviewProps) { view.dispatch(transactionSpec); }, [view, highlighting, jsonMapped, highlightPath]); + useHotkeys( + "ctrl+a,meta+a,command+a", + (e) => { + e.preventDefault(); + view?.dispatch({ selection: { anchor: 0, head: state?.doc.length } }); + }, + [view, state] + ); + const [hovering, setHovering] = useState(false); return (