Simplified redux-query reducer with error handling

Component.js

import { getQueryByUrl } from './reducers/queries'
import { getPageByPath } from './reducers/pages'

const Page = ({ loading = true, error, page }) => {
  if (loading) {
    return <Loader />
  }
    
  if (error) {
    return <Error error={error} />
  }

  if (!page) {
    return <NotFound />
  }

  return (
    <div>
      {page.title}
    </div>
  )
}

export default compose(
  connect(
    (state, { path }) => ({
      ...getQueryByUrl(state, getPageUrl({ path })),
      page: getPageByPath(state, path),
    }),
  )
)(Page)

queries.js

import { actionTypes, reconcileQueryKey } from 'redux-query'

export const getQueries = state => state.queries || {}
export const getQueryByKey = (state, queryKey) => {
  const queries = getQueries(state)

  return queries[queryKey]
}

export const getQueryByParams = (state, params) => (
  getQueryByKey(state, reconcileQueryKey(params))
)

export const getQueryByUrl = (state, url) => (
  getQueryByParams(state, { url })
)

const updateQuery = (state = {}, action) => {
  switch (action.type) {
    case actionTypes.MUTATE_START:
    case actionTypes.REQUEST_START:
      return {
        loading: true,
      }
    case actionTypes.MUTATE_SUCCESS:
    case actionTypes.REQUEST_SUCCESS:
      return {
        ...state,
        loading: false,
        completed: true,
      }
    case actionTypes.MUTATE_FAILURE:
    case actionTypes.REQUEST_FAILURE:
      return {
        ...state,
        loading: false,
        completed: true,
        error: action.responseBody,
      }
    case actionTypes.CANCEL_QUERY:
      if (state.isPending) {
        return {
          ...state,
          loading: false,
          completed: true,
        }
      }

      return state
    default:
      return state
  }
}

const queriesReducer = (state = {}, action) => {
  switch (action.type) {
    case actionTypes.MUTATE_START:
    case actionTypes.REQUEST_START:
    case actionTypes.REQUEST_SUCCESS:
    case actionTypes.MUTATE_FAILURE:
    case actionTypes.MUTATE_SUCCESS:
    case actionTypes.REQUEST_FAILURE:
      return {
        ...state,
        [action.queryKey]: updateQuery(state[action.queryKey], action),
      }

    case actionTypes.RESET:
      return {}

    default: {
      return state
    }
  }
}

export default queriesReducer