add sparkjs, threepipe, react-three-map, wawa-vfx, r3f-globe, Three-VFX to community components grid

[jo-chemla]

Following recent creation of r3f frameworks, renderers, or utils, this PR adds some missing community components to the doc, especially valuable @sparkjsdev 3dgs gaussian splat rendering, @repalash threepipe, mapping utils from @RodrigoHamuy, and vfx from @wass08 and @mustache-dev

Follow-up of #3378

Draft PR, current preview here

[codesandbox-ci]

This pull request is automatically built and testable in CodeSandbox.

To see build info of the built libraries, click here or the icon next to each commit SHA.

Latest deployment of this branch, based on commit bd75db9:

Sandbox	Source
example	Configuration

[jo-chemla]

Just made the final touch-ups, the PR is ready to review from my point-of-view. I moved some projects to a dedicated Stale section, not sure this is the right move.

Here is the published version of the community-r3f-components page

[krispya]

Thanks for doing this. I just removed the stale entries. I think what is left before merging is actually downloading the images, resizing them and hosting them out of our docs instead of relying on a bunch of external domains.

[jo-chemla]

Thanks for removing stale. Regarding the images, where do you want to host them if outside the repo?

[krispya]

I mean, we should download and resize the images then host them locally from the repo.

[jo-chemla]

Understood thanks, did not think you'd want to store images in repo. I just batch cropped them to 16x9 ratio at 320x180p, exported as jpg, this totals 250kB.

Just added the images in a subfolder, they are part of the build, but they did not get referenced via the same url pattern than those already present in docs like banner-journey.jpg:

• the images present in docs (standard html <img ...> or mdx ![]()) are linked by ../banner-journey.jpg, which result in an image url in the docs of https://github.com/jo-chemla/react-three-fiber/raw/master/docs/banner-r3f.jpg which works - the MDX_BASEURL is correctly prefixed
• while mine are docs <Img ...>, with filepaths ./community-r3f-components-images/r3f-scroll-rig.jpg which result in https://jo-chemla.github.io/react-three-fiber/getting-started/community-r3f-components-images/three-geospatial-manhattan.jpg which does not resolve. The MDX_BASEURL is not correctly prefixed for these.

After careful inspection, it looks like the <Img ...> does not correctly get passed the MDX_BASEURL, but standard <img ...> do work. Thankfully I had already cropped to the right aspect ratio, otherwise, the className="aspect-[16/9] would not be valid. To me looks like a pmndrs/docs bug if anyone want to have a look @abernier & co.

Populated by the github action here as

https://github.com/${{ github.repository }}/raw/${{ github.head_ref || github.ref_name }}/${{ inputs.mdx }}

xnconvert flow to crop + fill 16x9 ratio

[jo-chemla]

Ready to review from my point-of-view!

Here is the preview