[Bug] `Layer` does not get it's source set when it's not a direct child of `Source`

Description

These two snippets should have the same behavior...

const App = () =>
  <Map {...}>
    <Source {...}>
      <Layer {...}/>
    </Source>
  </Map>

const App = () =>
  <Map {...}>
    <Source {...}>
      <MyLayer/>
    </Source>
  </Map>

const MyLayer = () =>
  <Layer {...}/>

But currently they do not have the same behavior as in the latter case the layer's source does not get set to the id of the parent source and hence the following error gets thrown...

Error: layers.my-layer: missing required property "source"
    at Object.as [as y] (maplibre-gl.js:42:143228)
    at xi (maplibre-gl.js:46:270533)
    at wi._validate (maplibre-gl.js:46:294579)
    at wi.addLayer (maplibre-gl.js:46:284511)
    at e.Map.addLayer (maplibre-gl.js:46:508918)
    at createLayer (layer.js:62:9)
    at Layer (layer.js:93:5)
    at renderWithHooks (react-dom.development.js:16305:18)
    at mountIndeterminateComponent (react-dom.development.js:20074:13)
    at beginWork (react-dom.development.js:21587:16)
    at beginWork$1 (react-dom.development.js:27426:14)
    at performUnitOfWork (react-dom.development.js:26557:12)
    at workLoopSync (react-dom.development.js:26466:5)
    at renderRootSync (react-dom.development.js:26434:7)
    at performConcurrentWorkOnRoot (react-dom.development.js:25738:74)
    at workLoop (scheduler.development.js:266:34)
    at flushWork (scheduler.development.js:239:14)
    at MessagePort.performWorkUntilDeadline (scheduler.development.js:533:21) Error Component Stack
    at Layer (layer.js:67:42)
    at MyLayer (<anonymous>)
    at Source (source.js:81:34)
    at div (<anonymous>)
    at div (<anonymous>)
    at _Map (map.js:24:49)
    at App (<anonymous>)

Expected Behavior

Both snippets should have the same behavior, i.e. they render without any errors

Steps to Reproduce

See this codesandbox: https://codesandbox.io/p/sandbox/4f6xyt

Environment

Framework version: @vis.gl/react-maplibre@8.0.4

Logs

See the log mentioned above

Start by reproducing the issue in the linked CodeSandbox, then inspect the Layer and Source component paths shown in the stack trace, especially layer.js and source.js. The work is done when a Layer rendered through MyLayer receives its parent Source id and both snippets render without the missing-source error.