From 5e3deba9fe22e3a5b9d1e8c2ff0379610533346c Mon Sep 17 00:00:00 2001
From: Alf Eaton <alf.eaton@overleaf.com>
Date: Tue, 23 Jan 2024 09:24:34 +0000
Subject: [PATCH] Dispatch 'UNSTABLE_editor:extensions' event on
 'editor:extension-loaded' (#16611)

GitOrigin-RevId: a1d93330a7633c6d5870e2c368ab45a4a586db35
---
 .../extensions/third-party-extensions.ts      | 41 +++++++++++++++----
 1 file changed, 34 insertions(+), 7 deletions(-)

diff --git a/services/web/frontend/js/features/source-editor/extensions/third-party-extensions.ts b/services/web/frontend/js/features/source-editor/extensions/third-party-extensions.ts
index 4944ea11e6..1b49edf8fd 100644
--- a/services/web/frontend/js/features/source-editor/extensions/third-party-extensions.ts
+++ b/services/web/frontend/js/features/source-editor/extensions/third-party-extensions.ts
@@ -1,5 +1,16 @@
-import type { Extension } from '@codemirror/state'
+import { Compartment, type Extension } from '@codemirror/state'
 import CodeMirror, { CodeMirrorVim } from './bundle'
+import { ViewPlugin } from '@codemirror/view'
+
+const thirdPartyExtensionsConf = new Compartment()
+
+const dispatchEvent = (extensions: Extension[]) => {
+  window.dispatchEvent(
+    new CustomEvent('UNSTABLE_editor:extensions', {
+      detail: { CodeMirror, CodeMirrorVim, extensions },
+    })
+  )
+}
 
 /**
  * A custom extension that allows additional CodeMirror extensions to be provided by external code,
@@ -8,11 +19,7 @@ import CodeMirror, { CodeMirrorVim } from './bundle'
 export const thirdPartyExtensions = (): Extension => {
   const extensions: Extension[] = []
 
-  window.dispatchEvent(
-    new CustomEvent('UNSTABLE_editor:extensions', {
-      detail: { CodeMirror, CodeMirrorVim, extensions },
-    })
-  )
+  dispatchEvent(extensions)
 
   Object.defineProperty(window, 'UNSTABLE_editorHelp', {
     writable: false,
@@ -42,5 +49,25 @@ window.addEventListener("UNSTABLE_editor:extensions", function(evt) {
 });`,
   })
 
-  return extensions
+  return [thirdPartyExtensionsConf.of(extensions), extensionLoaded]
 }
+
+const extensionLoaded = ViewPlugin.define(view => {
+  const listener = () => {
+    const extensions: Extension[] = []
+
+    dispatchEvent(extensions)
+
+    view.dispatch({
+      effects: thirdPartyExtensionsConf.reconfigure(extensions),
+    })
+  }
+
+  window.addEventListener('editor:extension-loaded', listener)
+
+  return {
+    destroy() {
+      window.removeEventListener('editor:extension-loaded', listener)
+    },
+  }
+})