Pass token authorization for SSE using MS implementation (#44)

package.json

@@ -1,6 +1,6 @@
 {
     "name": "jupyterlab-gallery",
-    "version": "0.6.2",
+    "version": "0.6.3",
     "description": "A JupyterLab gallery extension for presenting and downloading examples from remote repositories",
     "keywords": [
         "jupyter",
@@ -61,7 +61,8 @@
         "@jupyterlab/application": "^4.0.0",
         "@jupyterlab/coreutils": "^6.0.0",
         "@jupyterlab/services": "^7.0.0",
-        "@jupyterlab/settingregistry": "^4.0.0"
+        "@jupyterlab/settingregistry": "^4.0.0",
+        "@microsoft/fetch-event-source": "^2.0.1"
     },
     "devDependencies": {
         "@jupyterlab/builder": "^4.0.0",

src/gallery.tsx

@@ -12,7 +12,13 @@ import { IStream, Stream, Signal } from '@lumino/signaling';
 import { TranslationBundle } from '@jupyterlab/translation';
 import { IExhibit } from './types';
 import { IExhibitReply } from './types';
-import { requestAPI, eventStream, IStreamMessage, IProgress } from './handler';
+import {
+  requestAPI,
+  eventStream,
+  IStreamMessage,
+  IProgress,
+  IEventStream
+} from './handler';
 import { repositoryIcon } from './icons';
 
 interface IActions {
@@ -103,7 +109,7 @@ export class GalleryWidget extends ReactWidget {
     }
   };
 
-  private _eventSource: EventSource;
+  private _eventSource: IEventStream;
 
   private async _load() {
     try {

src/handler.ts

@@ -1,4 +1,5 @@
 import { URLExt } from '@jupyterlab/coreutils';
+import { fetchEventSource } from '@microsoft/fetch-event-source';
 
 import { ServerConnection } from '@jupyterlab/services';
 
@@ -61,12 +62,17 @@ export interface ITextStreamMessage {
 
 export type IStreamMessage = IProgressStreamMessage | ITextStreamMessage;
 
+export interface IEventStream {
+  close: () => void;
+  promise: Promise<void>;
+}
+
 export function eventStream(
   endPoint = '',
   onStream: (message: IStreamMessage) => void,
   onError: (error: Event) => void,
   namespace: string
-): EventSource {
+): IEventStream {
   const settings = ServerConnection.makeSettings();
   let requestUrl = URLExt.join(settings.baseUrl, namespace, endPoint);
   const xsrfTokenMatch = document.cookie.match('\\b_xsrf=([^;]*)\\b');
@@ -75,17 +81,29 @@ export function eventStream(
     fullUrl.searchParams.append('_xsrf', xsrfTokenMatch[1]);
     requestUrl = fullUrl.toString();
   }
-  const eventSource = new EventSource(requestUrl);
-  eventSource.addEventListener('message', event => {
-    const data = JSON.parse(event.data);
-    onStream(data);
-  });
-  eventSource.addEventListener('error', error => {
-    onError(error);
+  const controller = new AbortController();
+  const promise = fetchEventSource(requestUrl, {
+    onmessage: event => {
+      const data = JSON.parse(event.data);
+      onStream(data);
+    },
+    onerror: error => {
+      onError(error);
+    },
+    headers: {
+      Authorization: `token ${settings.token}`
+    },
+    signal: controller.signal
   });
+  const close = () => {
+    controller.abort();
+  };
   // https://bugzilla.mozilla.org/show_bug.cgi?id=833462
   window.addEventListener('beforeunload', () => {
-    eventSource.close();
+    close();
   });
-  return eventSource;
+  return {
+    close,
+    promise
+  };
 }

yarn.lock

@@ -3285,6 +3285,13 @@ __metadata:
   languageName: node
   linkType: hard
 
+"@microsoft/fetch-event-source@npm:^2.0.1":
+  version: 2.0.1
+  resolution: "@microsoft/fetch-event-source@npm:2.0.1"
+  checksum: a50e1c0f33220206967266d0a4bbba0703e2793b079d9f6e6bfd48f71b2115964a803e14cf6e902c6fab321edc084f26022334f5eaacc2cec87f174715d41852
+  languageName: node
+  linkType: hard
+
 "@nodelib/fs.scandir@npm:2.1.5":
   version: 2.1.5
   resolution: "@nodelib/fs.scandir@npm:2.1.5"
@@ -7454,6 +7461,7 @@ __metadata:
     "@jupyterlab/services": ^7.0.0
     "@jupyterlab/settingregistry": ^4.0.0
     "@jupyterlab/testutils": ^4.0.0
+    "@microsoft/fetch-event-source": ^2.0.1
     "@types/jest": ^29.2.0
     "@types/json-schema": ^7.0.11
     "@types/react": ^18.0.26