I am facing an issue when I import fetchEventSource package that is used for Server side events.
I tried integrating this package from npm and after the package is imported I started getting this generic React error and my page doesnt load. Below is the structure of the code.

 import React, { useCallback } from 'react';
 import { fetchEventSource } from '@microsoft/fetch-event-source';

 interface IContextValue {
  askQuestion: (question: string) => void;
 }

 const context = React.createContext<IContextValue>({} as IContextValue);

 export const chProvider: React.FC = ({ children }) => {
  const value: IChatRDContextValue = React.useMemo(() => {

  return {
  askQuestion : useCallback((request: string): void => {
        const args: InteractionRequestPayload = {
        };
        
        useEffect(() => {
          const APIUrl = getStreamingAPIUrl();
            const baseInit = {
        method: 'POST',
        headers: {
          'Content-Type': 'application/json',
        },
          body: JSON.stringify(args),
          openWhenHidden: true,
        };
        fetchEventSource(APIUrl, {
          ...baseInit,
          onmessage(ev:any) {
            
          },
          onerror(err:any) {
            throw err;
          },
          async onopen(response:any) {
            if (!response.ok) throw response;
          },
          onclose() {
          },
        }).catch(() => {
          
        });
        });

      }
    } catch (e) {
    }
  }, [])
};
}, []);

return <context.Provider value={value}>{children}</context.Provider>;
};

export const useRD = () => React.useContext(context);