[NEXTJS 13.5] app dir

hello, how can i handle nextjs errors correctly? Because for now when for example API throws 502 (is denied at this moment) my entire vercel app is returning error as you can see on screen. For now i just have rejceting promise in error case. Should i have another "catcher" on that which will do something with this error?

const proccessFetch = async (
  input: URL | RequestInfo,
  init?: Omit<RequestInit, 'body'> & { body?: Record<string, any> | null },
) => {
  try {
    const response = await fetch(
      input,
      init && {
        ...init,
        headers: {
          // 'Content-Type': 'application/json',
          ...init.headers,
        },
        body: init.body ? JSON.stringify(init.body) : null,
      },
    )

    if (!response.ok) return Promise.reject(new Error('Response is not ok').message)

    return response.status === 200 && response.headers.get('Content-Length') !== '0'
      ? await response.json()
      : null
  } catch (err) {
    return Promise.reject(new Error(`${JSON.stringify(err)}`).message)
  }
}