Gatsby hangs on "Building static HTML for pages" when using Recoil with Suspend

[Mrtenz]

Preliminary Checks

• This issue is not a duplicate. Before opening a new issue, please search existing issues: https://github.com/gatsbyjs/gatsby/issues
• This issue is not a question, feature request, RFC, or anything other than a bug report directly related to Gatsby. Please post those things in GitHub Discussions: https://github.com/gatsbyjs/gatsby/discussions

Description

When using an asynchronous selector with Recoil wrapped in a <Suspend>, which will cause the component to suspend until the value is available, Gatsby fails to build. There is no error, it just gets stuck on "Building static HTML for pages" indefinitely.

This does not happen during gatsby develop. The page loads as expected.

Reproduction Link

https://github.com/Mrtenz/gatsby-recoil-suspense

Steps to Reproduce

1. Cause a component to Suspend, e.g., using Recoil asynchronous selectors.
2. Run gatsby build.

Expected Result

The build completes.

Actual Result

The build gets stuck.

Environment

System:
    OS: macOS 13.5.2
    CPU: (12) arm64 Apple M2 Max
    Shell: 5.9 - /bin/zsh
  Binaries:
    Node: 18.16.0 - /private/var/folders/8w/2tkyvh9n30n0jqqzvxmkzhs80000gn/T/xfs-b6204c5e/node
    Yarn: 3.6.3 - /private/var/folders/8w/2tkyvh9n30n0jqqzvxmkzhs80000gn/T/xfs-b6204c5e/yarn
    npm: 9.5.1 - ~/.asdf/plugins/nodejs/shims/npm
  Browsers:
    Chrome: 117.0.5938.62
    Safari: 16.6
  npmPackages:
    gatsby: ^5.12.4 => 5.12.4

Config Flags

No response