#162 fixed (#164)

Co-authored-by: = <rahulkumar@metafic.co>
triggerdotdev · Jul 14, 2023 · 5b27ba9 · 5b27ba9
1 parent 5d310de
commit 5b27ba9
Show file tree

Hide file tree

Showing 3 changed files with 34 additions and 3 deletions.
diff --git 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 (
  <div>
  <div

diff --git a/app/components/CodeViewer.tsx b/app/components/CodeViewer.tsx
@@ -4,6 +4,7 @@ import { useRef, useEffect } from "react";
 import { getViewerSetup } from "~/utilities/codeMirrorSetup";
 import { darkTheme, lightTheme } from "~/utilities/codeMirrorTheme";
 import { useTheme } from "./ThemeProvider";
+import { useHotkeys } from "react-hotkeys-hook";
 
 export function CodeViewer({ code, lang }: { code: string; lang?: "json" }) {
  const editor = useRef(null);
@@ -16,7 +17,7 @@ export function CodeViewer({ code, lang }: { code: string; lang?: "json" }) {
 
  const [theme] = useTheme();
 
- const { setContainer } = useCodeMirror({
+ const { setContainer, view, state } = useCodeMirror({
  container: editor.current,
  extensions,
  value: code,
@@ -33,6 +34,15 @@ export function CodeViewer({ code, lang }: { code: string; lang?: "json" }) {
  }
  }, [editor.current]);
 
+ useHotkeys(
+ "ctrl+a,meta+a,command+a",
+ (e) => {
+ e.preventDefault();
+ view?.dispatch({ selection: { anchor: 0, head: state?.doc.length } });
+ },
+ [view, state]
+ );
+
  return (
  <div>
  <div ref={editor} />

diff --git 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 (