fix: add back replace meta schema plugin for monaco

src/App.tsx

@@ -20,6 +20,7 @@ import useUISchema from "./hooks/useUISchema";
 import useDefaultEditorValue from "./hooks/useDefaultEditorValue";
 import useSearchBar from "./hooks/useSearchBar";
 import useMonacoVimMode from "./hooks/useMonacoVimMode";
+import useMonacoReplaceMetaSchema from "./hooks/useMonacoReplaceMetaSchema";
 import useQueryParams from "./hooks/useQueryParams";
 
 const App: React.FC = () => {
@@ -88,9 +89,11 @@ const App: React.FC = () => {
     _.debounce(handleMonacoEditorOnChange, 500),
     [UISchema],
   );
+  const [metaSchema] = useMonacoReplaceMetaSchema(editor);
   const [model, setPosition] = useMonacoModel(
     parsedSchema ? JSON.stringify(parsedSchema, null, 2) : defaultValue,
     editor,
+    metaSchema,
   );
   const [vimMode] = useMonacoVimMode(editor);
 

src/hooks/useMonacoModel.tsx

@@ -1,15 +1,19 @@
 import { useState, useEffect } from "react";
 import * as monaco from "monaco-editor";
-import schema from "@open-rpc/meta-schema";
 
 const useMonacoModel = (
   defaultValue: string | undefined | null,
   editor: monaco.editor.IStandaloneCodeEditor,
+  schema: any,
 ) => {
   const [model, setModel] = useState();
   const [position, setPosition] = useState([4, 13, 4, 13]);
   useEffect(() => {
     if (editor) {
+      const existingModel = monaco.editor.getModels()[0];
+      if (existingModel) {
+        existingModel.dispose();
+      }
       const modelUri = monaco.Uri.parse(`inmemory:/${Math.random()}/model/userSpec.json`);
       const m = monaco.editor.createModel(defaultValue || "", "json", modelUri);
       monaco.languages.json.jsonDefaults.setDiagnosticsOptions({
@@ -38,7 +42,7 @@ const useMonacoModel = (
         model.dispose();
       }
     };
-  }, [editor]);
+  }, [editor, schema]);
   return [model, setPosition];
 };
 

src/hooks/useMonacoReplaceMetaSchema.tsx

@@ -0,0 +1,48 @@
+import React, { useState, useEffect } from "react";
+import * as monaco from "monaco-editor";
+const { initVimMode } = require("monaco-vim"); //tslint:disable-line
+import schema from "@open-rpc/meta-schema";
+
+// Vim Mode:
+// Press Chord Ctrl-K, Ctrl-V => the action will run if it is enabled
+const useMonacoReplaceMetaSchema = (editor: monaco.editor.IStandaloneCodeEditor) => {
+  const [metaSchema, setMetaSchema] = useState(schema);
+
+  useEffect(() => {
+    if (!editor) { return; }
+
+    // reset editor to empty schema
+
+    /* tslint:disable */
+    // replace schema:
+    // Press Chord Ctrl-K, Ctrl-R => the action will run if it is enabled
+
+    editor.addAction({
+      // An unique identifier of the contributed action.
+      id: "replace-meta-schema",
+
+      // A label of the action that will be presented to the user.
+      label: "Replace Meta Schema",
+
+      // An optional array of keybindings for the action.
+      keybindings: [
+        monaco.KeyMod.chord(monaco.KeyMod.CtrlCmd | monaco.KeyCode.KEY_K, monaco.KeyMod.CtrlCmd | monaco.KeyCode.KEY_R),
+      ],
+      contextMenuGroupId: "navigation",
+      contextMenuOrder: 1.5,
+      // Method that will be executed when the action is triggered.
+      // @param editor The editor instance is passed in as a convinience
+      run: (ed) => {
+        const result = window.prompt("Paste schema to replace current meta schema", "{}");
+        if (result) {
+          const metaSchema = JSON.parse(result);
+          setMetaSchema(metaSchema);
+        }
+      },
+    });
+  }, [editor]);
+
+  return [metaSchema];
+};
+
+export default useMonacoReplaceMetaSchema;