NoteEditor: autofocus (#10)

src/skrift-electron/renderer/components/NoteEditor/AutoFocus.tsx

@@ -0,0 +1,17 @@
+import { useEditorEffect } from "@nytimes/react-prosemirror";
+import { TextSelection } from "prosemirror-state";
+import React from "react";
+
+export const AutoFocus: React.FC = () => {
+    useEditorEffect((view) => {
+        // Set initial selection to end of document, so the initial
+        // focus after render starts at the end of the note.
+        view.dispatch(
+            view.state.tr.setSelection(TextSelection.atEnd(view.state.doc))
+        );
+
+        view.dom.focus();
+    }, []);
+
+    return null;
+};

src/skrift-electron/renderer/components/NoteEditor/index.tsx

@@ -15,6 +15,7 @@ import { mouseEventToMode } from "../../mouseEventToMode";
 import { nodeViews } from "./nodeViews";
 import { noteLinkPlugin } from "./noteLinkPlugin";
 import { buildInputRules } from "./inputrules";
+import { AutoFocus } from "./AutoFocus";
 
 interface Props {
   note: NoteWithLinks;
@@ -126,6 +127,7 @@ export const NoteEditor: React.FC<Props> = ({
         handleDOMEvents={handleDOMEvents}
         nodeViews={_nodeViews}
       >
+        <AutoFocus />
         <div ref={setMount} />
       </ProseMirror>
     </div>