how to set up redux with NextJs and allow dispatching of actions

Im trying to set up redux for my NextJS React App and I'm having some complications when dispatching this action through the indicated link. An error of 'Network Error' is displayed on LIST_FAIL. Any well available resources or advice would be appreciated. Thanks.

import axios from 'axios';
import {
  //NOte that these are actions which will be dispatched or fired in the action y using dispatch()
  LIST_REQUEST,
  LIST_SUCCESS,
  LIST_FAIL,
} from '../constants/customerConstants';

export const listCusts = () => async (dispatch, getState) => {
  try {
    //our first request to the backend to get the token
    dispatch({
      type:LIST_REQUEST,
    });

    const { data } = await axios.get('https://byronochara.tech/gassystem/api/v1/customers');
    console.log(data);
    const result = data.results;
    // console.log('Results now an Array', result); //This is now an array to be looped in the list screen

    dispatch({
      type: LIST_SUCCESS,
      payload: result,
    });
  } catch (error) {
    dispatch({
      type: LIST_FAIL,
      payload:
        error.response && error.response.data.message
          ? error.response.data.message
          : error.message,
    });
  }
};