Try to switch away from polyfill

Signed-off-by: Alex Eftimie <alex.eftimie@getyourguide.com>

plugins/techdocs/src/alpha.tsx

@@ -29,7 +29,6 @@ import {
   createApiFactory,
   discoveryApiRef,
   fetchApiRef,
-  identityApiRef,
 } from '@backstage/core-plugin-api';
 import {
   compatWrapper,
@@ -55,14 +54,12 @@ const techDocsStorageApi = createApiExtension({
     deps: {
       configApi: configApiRef,
       discoveryApi: discoveryApiRef,
-      identityApi: identityApiRef,
       fetchApi: fetchApiRef,
     },
-    factory: ({ configApi, discoveryApi, identityApi, fetchApi }) =>
+    factory: ({ configApi, discoveryApi, fetchApi }) =>
       new TechDocsStorageClient({
         configApi,
         discoveryApi,
-        identityApi,
         fetchApi,
       }),
   }),

plugins/techdocs/src/client.ts

@@ -16,11 +16,7 @@
 
 import { CompoundEntityRef } from '@backstage/catalog-model';
 import { Config } from '@backstage/config';
-import {
-  DiscoveryApi,
-  FetchApi,
-  IdentityApi,
-} from '@backstage/core-plugin-api';
+import { DiscoveryApi, FetchApi } from '@backstage/core-plugin-api';
 import { NotFoundError, ResponseError } from '@backstage/errors';
 import {
   SyncResult,
@@ -29,7 +25,7 @@ import {
   TechDocsMetadata,
   TechDocsStorageApi,
 } from '@backstage/plugin-techdocs-react';
-import { EventSourcePolyfill } from 'event-source-polyfill';
+import { fetchEventSource } from '@microsoft/fetch-event-source';
 
 /**
  * API to talk to `techdocs-backend`.
@@ -124,18 +120,15 @@ export class TechDocsClient implements TechDocsApi {
 export class TechDocsStorageClient implements TechDocsStorageApi {
   public configApi: Config;
   public discoveryApi: DiscoveryApi;
-  public identityApi: IdentityApi;
   private fetchApi: FetchApi;
 
   constructor(options: {
     configApi: Config;
     discoveryApi: DiscoveryApi;
-    identityApi: IdentityApi;
     fetchApi: FetchApi;
   }) {
     this.configApi = options.configApi;
     this.discoveryApi = options.discoveryApi;
-    this.identityApi = options.identityApi;
     this.fetchApi = options.fetchApi;
   }
 
@@ -213,47 +206,29 @@ export class TechDocsStorageClient implements TechDocsStorageApi {
 
     const apiOrigin = await this.getApiOrigin();
     const url = `${apiOrigin}/sync/${namespace}/${kind}/${name}`;
-    const { token } = await this.identityApi.getCredentials();
 
     return new Promise((resolve, reject) => {
-      // Polyfill is used to add support for custom headers and auth
-      const source = new EventSourcePolyfill(url, {
+      fetchEventSource(url, {
         withCredentials: true,
-        headers: token ? { Authorization: `Bearer ${token}` } : {},
+        fetch: this.fetchApi.fetch,
+        onmessage(e: any) {
+          if (e.data) {
+            logHandler(JSON.parse(e.data));
+          }
+        },
+        onclose(e: any) {
+          let updated: boolean = false;
+
+          if (e.data) {
+            ({ updated } = JSON.parse(e.data));
+          }
+
+          resolve(updated ? 'updated' : 'cached');
+        },
+        onerror(e: any) {
+          reject(e);
+        },
       });
-
-      source.addEventListener('log', (e: any) => {
-        if (e.data) {
-          logHandler(JSON.parse(e.data));
-        }
-      });
-
-      source.addEventListener('finish', (e: any) => {
-        let updated: boolean = false;
-
-        if (e.data) {
-          ({ updated } = JSON.parse(e.data));
-        }
-
-        resolve(updated ? 'updated' : 'cached');
-      });
-
-      source.onerror = (e: any) => {
-        source.close();
-
-        switch (e.status) {
-          // the endpoint returned a 404 status
-          case 404:
-            reject(new NotFoundError(e.message));
-            return;
-
-          // also handles the event-stream close. the reject is ignored if the Promise was already
-          // resolved by a finish event.
-          default:
-            reject(new Error(e.data));
-            return;
-        }
-      };
     });
   }