Next Build times out when using Recoil-Relay Selector.

I am using recoil-relay to fetch queries directly for selectors. Currently, I am using graphQLSelector, but having problems when trying to use npm run build for generating a optimized production build. The project works as intended when using npm run dev.

I believe the error is related to recoil-relay, because before adding it the project build successfully.

Sample Code:

// package.json
{
  ...
  "scripts": {
    "dev": "npm run relay && next dev",
    "build": "npm run relay && NODE_OPTIONS='--trace-warnings' next build",
    "start": "npm run relay && next start",
    "lint": "next lint",
    "relay": "relay-compiler"
  },
  "relay": {
    "src": "./src/",
    "schema": "./schema.graphql",
    "artifactDirectory": "./src/__generated__",
    "language": "typescript",
    "eagerEsModules": true
  },
  "dependencies": {
    "@types/react-relay": "^14.1.2",
    "@types/relay-runtime": "^14.1.3",
    "next": "12.2.5",
    "react": "18.2.0",
    "react-relay": "^14.1.0",
    "recoil": "^0.7.5",
    "recoil-relay": "^0.1.0",
    "relay-runtime": "^14.1.0",
   ...
  },
  "devDependencies": {
    ...
    "babel-plugin-relay": "^14.1.0",
    "relay-compiler": "^14.1.0",
  }
}

Output from running npm run build:

> npm run relay && NODE_OPTIONS='--trace-warnings' next build


> crm@0.1.0 relay
> relay-compiler

[INFO] [default] compiling...
[INFO] [default] compiled documents: 3 reader, 3 normalization, 3 operation text
[INFO] Done.
info  - SWC minify release candidate enabled. https://nextjs.link/swcmin
...
info  - Linting and checking validity of types  
info  - Disabled SWC as replacement for Babel because of custom Babel configuration ".babelrc" https://nextjs.org/docs/messages/swc-disabled
info  - Using external babel configuration from .../.babelrc
info  - Creating an optimized production build  
info  - Compiled successfully
info  - Collecting page data  
[    ] info  - Generating static pages (0/6)(node:435911) ExperimentalWarning: The Fetch API is an experimental feature. This feature could change at any time
    at emitExperimentalWarning (node:internal/util:224:11)
    at fetch (node:internal/bootstrap/pre_execution:198:5)
    at fetchQuery (.../.next/server/pages/_app.js:418:10)
    at fetch (.../node_modules/relay-runtime/lib/network/ConvertToExecuteFunction.js:20:18)
    at Object.execute (.../node_modules/relay-runtime/lib/network/RelayNetwork.js:46:12)
    at Object.execute (.../node_modules/relay-runtime/lib/network/wrapNetworkWithLogObserver.js:73:22)
    at createSource (.../node_modules/relay-runtime/lib/store/RelayModernEnvironment.js:293:36)
    at .../node_modules/relay-runtime/lib/store/RelayModernEnvironment.js:431:17
    at _subscribe (.../node_modules/relay-runtime/lib/network/RelayObservable.js:579:15)
    at RelayObservable.subscribe (.../node_modules/relay-runtime/lib/network/RelayObservable.js:278:12)
warn  - Restarted static page generation for /CRM/Analysis because it took more than 60 seconds
warn  - See more info here https://nextjs.org/docs/messages/static-page-generation-timeout
[ ===] info  - Generating static pages (5/6)(node:436079) ExperimentalWarning: The Fetch API is an experimental feature. This feature could change at any time
    at emitExperimentalWarning (node:internal/util:224:11)
    at fetch (node:internal/bootstrap/pre_execution:198:5)
    at fetchQuery (.../.next/server/pages/_app.js:418:10)
    at fetch (.../node_modules/relay-runtime/lib/network/ConvertToExecuteFunction.js:20:18)
    at Object.execute (.../node_modules/relay-runtime/lib/network/RelayNetwork.js:46:12)
    at Object.execute (.../node_modules/relay-runtime/lib/network/wrapNetworkWithLogObserver.js:73:22)
    at createSource (.../node_modules/relay-runtime/lib/store/RelayModernEnvironment.js:293:36)
    at .../node_modules/relay-runtime/lib/store/RelayModernEnvironment.js:431:17
    at _subscribe (.../node_modules/relay-runtime/lib/network/RelayObservable.js:579:15)
    at RelayObservable.subscribe (.../node_modules/relay-runtime/lib/network/RelayObservable.js:278:12)
warn  - Restarted static page generation for /CRM/Analysis because it took more than 60 seconds
[ ===] info  - Generating static pages (5/6)(node:436152) ExperimentalWarning: The Fetch API is an experimental feature. This feature could change at any time
    at emitExperimentalWarning (node:internal/util:224:11)
    at fetch (node:internal/bootstrap/pre_execution:198:5)
    at fetchQuery (.../.next/server/pages/_app.js:418:10)
    at fetch (.../node_modules/relay-runtime/lib/network/ConvertToExecuteFunction.js:20:18)
    at Object.execute (.../node_modules/relay-runtime/lib/network/RelayNetwork.js:46:12)
    at Object.execute (.../node_modules/relay-runtime/lib/network/wrapNetworkWithLogObserver.js:73:22)
    at createSource (.../node_modules/relay-runtime/lib/store/RelayModernEnvironment.js:293:36)
    at .../node_modules/relay-runtime/lib/store/RelayModernEnvironment.js:431:17
    at _subscribe (.../node_modules/relay-runtime/lib/network/RelayObservable.js:579:15)
    at RelayObservable.subscribe (.../node_modules/relay-runtime/lib/network/RelayObservable.js:278:12)

> Build error occurred
Error: Static page generation for /CRM/Analysis is still timing out after 3 attempts. See more info here https://nextjs.org/docs/messages/static-page-generation-timeout
    at onRestart (.../node_modules/next/dist/build/index.js:562:35)
    at Worker.exportPage (.../node_modules/next/dist/lib/worker.js:48:40)
    at process.processTicksAndRejections (node:internal/process/task_queues:95:5)
    at async .../node_modules/next/dist/export/index.js:308:32
    at async Span.traceAsyncFn (.../node_modules/next/dist/trace/trace.js:79:20)
    at async Promise.all (index 3)
    at async .../node_modules/next/dist/export/index.js:303:9
    at async Span.traceAsyncFn (.../node_modules/next/dist/trace/trace.js:79:20)
    at async .../node_modules/next/dist/build/index.js:1118:21
    at async Span.traceAsyncFn (.../node_modules/next/dist/trace/trace.js:79:20)

The project is working as expected in dev, and it's using Suspense for handling fallbacks from the queries(As recommended in the documentation of recoil).

I tried increasing the staticPageGenerationTimeout, but even with 10 minutes, it stills fails.

There is a problem with next build and using recoil-relay?

For adding more context, that's how I am using the graphQLSelector:

// _app.tsx
import React from "react";
import type { AppProps } from "next/app";
import { RecoilRoot } from "recoil";
import { RecoilRelayEnvironmentProvider } from "recoil-relay";
import { RelayEnvironment, RelayEnvironmentKey } from "../relay_env";


function MyApp({ Component, pageProps }: AppProps) {
  return (
    <>
      <RecoilRoot>
        <RecoilRelayEnvironmentProvider
          environment={RelayEnvironment}
          environmentKey={RelayEnvironmentKey}
        >
          <React.Suspense fallback="Loading">
            <Component {...pageProps} />
          </React.Suspense>
        </RecoilRelayEnvironmentProvider>
      </RecoilRoot>
    </>
  );
}

export default MyApp;

// Analysis/index.tsx
import type { NextPage } from "next";
import { useRecoilState, useRecoilValue } from "recoil";
import {
  clientsSizeSelector,
} from "../../../atoms/ClientsAtoms";

const Analysis: NextPage = () => {
const clientsSize = useRecoilValue(clientsSizeSelector);
...
  return (
    <>
      ....
    </>
  );
};

export default Analysis;

// Atoms/ClientsAtoms.ts

import { graphql } from "react-relay";
import { graphQLSelector } from "recoil-relay";
import { RelayEnvironment } from "../relay_env";

const clientsSizeSelector = graphQLSelector({
  key: "clientsSize",
  environment: RelayEnvironment,
  query: graphql`
  query ClientsSizeQuery {
    clientsSize
  }
`;
  variables: {},
  mapResponse: (data) => data.clientsSize as number,
});

export { clientsSizeSelector };