const { createStore, applyMiddleware, combineReducers } = require('redux');
const thunk = require('redux-thunk').default;
const Axios = require("axios");

const ROOT = ""

// users edition of users
const usersReducer = (state = { list: []} , action) => {
  const { payload, type } = action

  switch(type) {
    case "USER_LIST_FETCHED":
      return { ...state, list: payload.resource ,  count: payload.meta.count }
      break;
    default:
      return state
  }
}


// controls the resource links to interactions of session
const sessionReducers = (state = { token: null, links: [], currentUser: null }, action) => {
  const { payload, type, origin } = action


  switch(type) {
    case "USER_LOGIN":
      return { ...state, token: payload.token, links: payload.links, origin }
    case "USER_CURRENT":
      return { ...state, links: payload.links, currentUser: payload.user, origin }
    case "USER_LIST_FETCHED":
      // return { ...state, links: [ ...state.links, payload.links ] }
      return { ...state, links: payload.links, origin: origin }

    case "USER_LOGIN_FAIL":
      return { ...state, error: payload, origin: origin }
    case "USER_LOGOUT":
      return {}
    default:
      return state
  }
}

const combined = combineReducers({
   users: usersReducer,
   session: sessionReducers,
  });

const store = createStore(combined, {}, applyMiddleware(thunk));

class ClientApi {

  constructor(dispatch) {
    this.token = null
    this.dispatch = dispatch
    this.resources = {
      "/users/current" : { method: "GET", success: "USER_CURRENT" },
      "/users/list" : { method: "GET", success: "USER_LIST_FETCHED" },
    }
  }

  consumeResource({ rel, href }, data) {
    const link = rel === "self" ? { method: "GET", href, success: "SELF" }  : this.resources[rel]

    return Axios({
      method: link.method ,
      url: href,
      headers: { Authorization: this.token },
      data
    }).then(res => {
      this.dispatch({ type: link.success, payload: res.data, origin: rel  })
    })
  }

  login({ email, password }) {

    Axios.post(`${ROOT}/api/admin/v1/login`, {
      email, password
    })
    .then(res => {
      this.token = res.data.token;
      return this.dispatch({ type: "USER_LOGIN", payload: res.data, origin: "login" })
    })
    .catch(err => (
      this.dispatch({ type: "USER_LOGIN_FAIL", payload: err })
   ))
  }
}


const clientApi = new ClientApi(store.dispatch)


store.subscribe(() => {

  const { session, profile, users }  = store.getState()
  console.log(session)
  const profileResource = session.links.find(link => link.rel === "/users/current")

  if(profileResource)
    clientApi.consumeResource(profileResource)

  const firstPage = session.links.find(link => link.rel === "/users/list")

  if(firstPage)
    clientApi.consumeResource(firstPage)

    debugger
  if(session.origin === "/users/list") {
    for(const user of users.list) {

      console.log(user.name)
      const getUserLink = user.links.find(l => l.rel === "self")
      // clientApi.consumeResource(getUserLink)
    }
  }
})

store.subscribe(() => {
  console.log("subscribe --------------------------------------------------")
})

clientApi.login({ email: "admin@hotmail.com" , password: "staging" })


// ClientApi.login({ email: "admin@hotmail.com" , password: "stging" })
// ClientApi.getUsers({ page: 1 , size: 20})