js editor + fix js runner

src/pages/rules/EditRuleBook.vue

@@ -1,7 +1,7 @@
 <script setup lang="ts">
 import {useRoute, useRouter} from "vue-router";
 import {ref, watch} from "vue";
-import {useDebounceFn} from "@vueuse/core";
+import {useDebounceFn, useEventListener} from "@vueuse/core";
 import log from "loglevel";
 import {ScriptEditor, useRuleBooksStore} from "@/rules";
 import {PlusIcon, TrashIcon} from "@heroicons/vue/24/outline";
@@ -37,6 +37,13 @@ const save = async () => {
   }
 }
 
+useEventListener(window, 'keydown', (event: KeyboardEvent) => {
+  if ((event.metaKey || event.ctrlKey) && event.key.toLowerCase() === 's') {
+    event.preventDefault();
+    save();
+  }
+}, {capture: true});
+
 const addLedgerRef = () => {
   ledgerRefs.value = [...ledgerRefs.value, '']
 }
@@ -100,7 +107,7 @@ watch(useRoute(), async route => {
       </div>
       <div class="flex flex-col grow border-b-1">
         Script:
-        <ScriptEditor class="mt-2 mb-2" v-model="script" />
+        <ScriptEditor class="mt-2 mb-2" v-model="script" :ledgerRefs="ledgerRefs" />
       </div>
     </div>
     <div class="mt-2 justify-end flex">

src/rules/ScriptEditor.vue

@@ -29,12 +29,29 @@ const loadScriptDefinitions = async () => {
   }
 };
 
+const props = defineProps<{ ledgerRefs?: string[] }>();
+
+let ledgersLib: monaco.IDisposable | undefined;
+
+const updateLedgerRefs = (refs: readonly string[]) => {
+  ledgersLib?.dispose();
+  const members = refs
+      .filter(ref => ref && ref !== 'system')
+      .map(ref => `    readonly ${JSON.stringify(ref)}: Ledger;`)
+      .join('\n');
+  ledgersLib = monaco.typescript.javascriptDefaults.addExtraLib(
+      `declare interface Ledgers {\n${members}\n}\n`,
+      'ts:rule-runner.ledgers.d.ts'
+  );
+};
+
 const model = defineModel<string>({default: ''});
 const container = ref<HTMLElement>();
 let editor: monaco.editor.IStandaloneCodeEditor | undefined;
 
 onMounted(async () => {
   await loadScriptDefinitions();
+  updateLedgerRefs(props.ledgerRefs ?? []);
 
   if (!container.value) {
     return;
@@ -66,7 +83,12 @@ watch(model, value => {
   }
 });
 
-onBeforeUnmount(() => editor?.dispose());
+watch(() => props.ledgerRefs, refs => updateLedgerRefs(refs ?? []), {deep: true});
+
+onBeforeUnmount(() => {
+  editor?.dispose();
+  ledgersLib?.dispose();
+});
 </script>
 
 <template>