React leaflet draw causes no context provider error

Question

I'm running into some major compatibility issues it seems. I am getting this error when I am directed to a page with a map that is meant for the user to draw a radius using react-leaflet-draw. Here is the error:

Here is the code that is the source of the problem:

<Map 
            className="map-container" 
            center={CENTER}
            zoom={DEFAULT_ZOOM} 
            maxZoom={MAX_ZOOM}
            ref={mapContainer}
          >
            <div className="vignette"></div>

            <Marker position={CENTER} />

            <FeatureGroup>
              <EditControl 
                onCreated={_onCreated}
                onDeleted={_onDeleted}
                draw={{
                  polyline: false,
                  polygon: false,
                  rectangle: false,
                  marker: false,
                  circlemarker: false
                }}
                edit={{
                  edit: false
                }}
              />

              {
                sessionStorage.getItem("coverageCoordinates") && 
                <Circle 
                center={JSON.parse(sessionStorage.getItem("coverageCoordinates"))}
                color="#00FFFF"
                opacity="0.4"
                radius={radius * MILES_TO_METERS}
                />
              }
            </FeatureGroup>

The reason I know the issue lies there is because when I comment out the EditControl component, the error disappears. I have also tried using different versions of each package to test if the issue was compatibility but the versions that I tried didn't work. Here is a small part of my package.json to show which versions.

"leaflet": "^1.3.0",
"react": "^17.0.0",
"react-dom": "^17.0.0",
"react-leaflet": "^2.0.0",
"react-leaflet-draw": "^0.19.7",
"react-leaflet-geosearch": "^0.3.0",
"react-router-dom": "^5.2.0",
"react-scripts": "^4.0.1",
"leaflet-draw": "^1.0.3",
"leaflet-geosearch": "^3.2.1",

I have tried using leaflet v4 paired with react v18, leaflet v2 with react v18, leaflet v2 with react v17, and leaflet v4 with react v17. The only way for the error message to go away is if I remove the EditControl component but it's needed for this web app. Any insight would be much appreciated.