change vim save

packages/editor/src/components/CodeMirrorEditor/CodeMirrorEditor.tsx

@@ -9,7 +9,7 @@ import type { ReactCodeMirrorProps } from '@uiw/react-codemirror';
 
 import { GlobalCodeMirrorEditorKey, AcceptedUploadFileType } from '../../consts';
 import {
-  useFileDropzone, FileDropzoneOverlay, AllEditorTheme, AllKeymap,
+  useFileDropzone, FileDropzoneOverlay, AllEditorTheme,
 } from '../../services';
 import {
   getStrFromBol, adjustPasteData,
@@ -35,7 +35,6 @@ type Props = {
   onScroll?: () => void,
   indentSize?: number,
   editorTheme?: string,
-  editorKeymap?: string,
 }
 
 export const CodeMirrorEditor = (props: Props): JSX.Element => {
@@ -47,7 +46,6 @@ export const CodeMirrorEditor = (props: Props): JSX.Element => {
     onScroll,
     indentSize,
     editorTheme,
-    editorKeymap,
   } = props;
 
   const containerRef = useRef(null);
@@ -161,16 +159,6 @@ export const CodeMirrorEditor = (props: Props): JSX.Element => {
   }, [codeMirrorEditor, editorTheme]);
 
 
-  useEffect(() => {
-
-    const keymap = editorKeymap ?? 'default';
-    const extension = AllKeymap[keymap] ?? AllKeymap.default;
-
-    const cleanupFunction = codeMirrorEditor?.appendExtensions(Prec.low(extension));
-    return cleanupFunction;
-
-  }, [codeMirrorEditor, editorKeymap]);
-
   const {
     getRootProps,
     isDragActive,

packages/editor/src/components/CodeMirrorEditorMain.tsx

@@ -1,9 +1,10 @@
 import { useEffect } from 'react';
 
-import { type Extension } from '@codemirror/state';
+import { type Extension, Prec } from '@codemirror/state';
 import { keymap, scrollPastEnd } from '@codemirror/view';
 
 import { GlobalCodeMirrorEditorKey, AcceptedUploadFileType } from '../consts';
+import { getKeymap } from '../services';
 import { setDataLine } from '../services/extensions/setDataLine';
 import { useCodeMirrorEditorIsolated } from '../stores';
 
@@ -66,6 +67,16 @@ export const CodeMirrorEditorMain = (props: Props): JSX.Element => {
     return cleanupFunction;
   }, [codeMirrorEditor, onSave]);
 
+  useEffect(() => {
+
+    const keymap = editorKeymap ?? 'default';
+    const extension = getKeymap(keymap, onSave);
+
+    const cleanupFunction = codeMirrorEditor?.appendExtensions(Prec.low(extension));
+    return cleanupFunction;
+
+  }, [codeMirrorEditor, editorKeymap, onSave]);
+
 
   return (
     <CodeMirrorEditor
@@ -76,7 +87,6 @@ export const CodeMirrorEditorMain = (props: Props): JSX.Element => {
       acceptedFileType={acceptedFileTypeNoOpt}
       indentSize={indentSize}
       editorTheme={editorTheme}
-      editorKeymap={editorKeymap}
     />
   );
 };

packages/editor/src/services/keymaps/index.ts

@@ -9,9 +9,17 @@ import { vscodeKeymap } from '@replit/codemirror-vscode-keymap';
 Vim.map('jj', '<Esc>', 'insert');
 Vim.map('jk', '<Esc>', 'insert');
 
-export const AllKeymap: Record<string, Extension> = {
-  default: keymap.of(defaultKeymap),
-  vim: vim(),
-  emacs: emacs(),
-  vscode: keymap.of(vscodeKeymap),
+export const getKeymap = (keymapName: string, onSave?: () => void): Extension => {
+  switch (keymapName) {
+    case 'vim':
+      if (onSave != null) {
+        Vim.defineEx('write', 'w', onSave);
+      }
+      return vim();
+    case 'emacs':
+      return emacs();
+    case 'vscode':
+      return keymap.of(vscodeKeymap);
+  }
+  return keymap.of(defaultKeymap);
 };