import {message} from 'antd'
import axios, {AxiosRequestConfig, AxiosResponse} from 'axios'

// axios client

const _backend = localStorage.getItem('apiDomain');
const baseUrl: string = _backend || process.env.REACT_APP_SERVICE_URL;

const client = axios.create({
  timeout: 30 * 1000,
  paramsSerializer: (params) => {
    if (typeof params === 'object') {
      const qs: string[] = []
      Object.keys(params).forEach((k, idx) => {
        if (params[k] === undefined || params[k] === null) {
          return
        }
        if (Array.isArray(params[k])) {
          params[k].forEach((val: any) => {
            qs.push(`${k}=${val}`)
          })
          return
        }
        qs.push(`${k}=${encodeURIComponent(params[k])}`)
      })
      return qs.join('&')
    }
    return params
  }
})

client.interceptors.request.use((request) => {
  if (request.baseURL === undefined) {
    request.baseURL = baseUrl;
  }
  return request
})

client.interceptors.response.use(
  (response) => {
    // const data = response.data
    // reject no data error case
    return response || Promise.reject(response)
  },
  (error) => {
    console.log(`error, ${error}`)

    const status = error.response?.status
    // 401 not authenticated, got to login
    if (status === 401 || status === 302) {
      console.log(`302 or 401, ${error.response}`)
      message.error(`error with http code: ${status}`)
    } else if (error.config?.isShowMessage) {
      message.error(error.response?.data?.message)
    }

    return Promise.reject(error)
  }
)

export default client
