Every new user encounter a crash and show 500 Internal server error, but refresh can recover normal.

[Water-bamboo]

crash stack 1:

Unhandled Rejection: TypeError: fetch failed
    at async i (.next/server/chunks/2535.js:11271:33701)
    at async Proxy.get (.next/server/chunks/2535.js:11271:33960)
    at async Object.getSupportedNetworks (.next/server/chunks/2535.js:11273:12008)
    at async x.initializeBlockchainApiController (.next/server/chunks/2535.js:11272:59318) {
  [cause]: [Error: Client network socket disconnected before secure TLS connection was established] {
    code: 'ECONNRESET',
    path: undefined,
    host: 'rpc.walletconnect.org',
    port: 443,
    localAddress: null
  }
}

Node.js process exited with exit status: 128. The logs above can help with debugging the issue.

crash stack 2:

Unhandled Rejection: TypeError: fetch failed
    at async i (.next/server/chunks/2535.js:11271:33701)
    at async Proxy.get (.next/server/chunks/2535.js:11271:33960)
    at async Object.getSupportedNetworks (.next/server/chunks/2535.js:11273:12008)
    at async x.initializeBlockchainApiController (.next/server/chunks/2535.js:11272:59318) {
  [cause]: [Error: write ETIMEDOUT] {
    errno: -110,
    code: 'ETIMEDOUT',
    syscall: 'write'
  }
}

Node.js process exited with exit status: 128. The logs above can help with debugging the issue.

code for create appkit

//Set up the Wagmi Adapter (Config)
export const wagmiAdapter = new WagmiAdapter({
  storage: createStorage({
    storage: cookieStorage,
  }),
  ssr: true, // disable for enabling coinbase wallet
  projectId,
  networks,
})

'use client'
import { networks, projectId, wagmiAdapter } from '@/config'
import { siweConfig } from '@/config/siweConfig'
import { ChainId } from '@/constants/chains'
import { base } from '@reown/appkit/networks'
import { createAppKit } from '@reown/appkit/react'
import { QueryClient, QueryClientProvider } from '@tanstack/react-query'
import React, { useCallback, type ReactNode } from 'react'
import { type Config, WagmiProvider, cookieToInitialState } from 'wagmi'
// import { RETRY_FLAG_KEY } from '@/app/global-error'

// Set up queryClient
const queryClient = new QueryClient()

if (!projectId) {
  throw new Error('Project ID is not defined')
}

function WalletProvider({ children, cookies }: { children: ReactNode; cookies: string | null }) {
  const initialState = cookieToInitialState(wagmiAdapter.wagmiConfig as Config, cookies)

// Set up metadata
  const metadata = {
    name: 'uniswap.org,
    description: 'uniswap.org,
    url: 'https://uniswap.org', // origin must match your domain & subdomain
    icons: ['/logo.png'],
  }

createAppKit({
      adapters: [wagmiAdapter],
      projectId,
      networks: networks,
      defaultNetwork: base,
      metadata: metadata,
      features: {
        analytics: false,
        socials: false,
        onramp: true,
        swaps: false,
        email: false,
      },
      chainImages: {
        [ChainId.UNICHAIN]: '/assets/img/chainLogo/unichain.png',
      },
      siweConfig,
      featuredWalletIds: [
        'c57ca95b47569778a828d19178114f4db188b89b763c899ba0be274e97267d96',
        'fd20dc426fb37566d803205b19bbc1d4096b248ac04548e3cfb6b3a38bd033aa',
        '8a0ee50d1f22f6651afcae7eb4253e52a3310b90af5daef78a8c4929a9bb99d4',
        '38f5d18bd8522c244bdd70cb4a68e0e718865155811c043f052fb9f1c51de662',
        '20459438007b75f4f4acb98bf29aa3b800550309646d375da5fd4aac6c2a2c66',
      ],
      enableEIP6963: true,
    })

return (
    <WagmiProvider config={wagmiAdapter.wagmiConfig as Config} initialState={initialState}>
      <QueryClientProvider client={queryClient}>{children}</QueryClientProvider>
    </WagmiProvider>
  )


export default WalletProvider

import { ReduxProvider } from '@/providers/ReduxProvider'
import { headers } from 'next/headers'
import type { PropsWithChildren } from 'react'
import { EthPriceProvider } from './EthPriceProvider'
import { TokenPollingProvider } from './TokenPollingProvider'
import { TokenProvider } from './TokenProvider'
import WalletProvider from './WalletProvider'
import { ApolloWrapper } from './apollo-wrapper'

export const Providers = async ({ children }: PropsWithChildren) => {
  const cookies = (await headers()).get('cookie')

  return (
    <ReduxProvider>
      <ApolloWrapper>
        <WalletProvider cookies={cookies}>
          <TokenProvider>
            <TokenPollingProvider>
              <EthPriceProvider>{children}</EthPriceProvider>
            </TokenPollingProvider>
          </TokenProvider>
        </WalletProvider>
      </ApolloWrapper>
    </ReduxProvider>
  )
}

export default function RootLayout({
  children,
}: Readonly<{
  children: React.ReactNode
}>) {
  return (
    <html lang="en" data-theme={'dark'} className={`${GeistSans.variable} antialiased ${tilt.className}`}>
      <body>
        <Providers>
          <div className="flex flex-col min-h-screen">
            <Header />
            <main className="flex-grow w-full">{children}</main>
            <Toaster closeButton />
            <Footer />
          </div>
        </Providers>
      </body>
    </html>
  )
}