import {
  mapGetters,
  mapState,
  mapMutations,
  GetterTree,
  MutationTree,
  Mapper,
  MutationMethod,
} from 'vuex';

interface State {
  needUpdateCard: boolean;
  leftDrawerOpen: boolean;
  selectedPath: string;
  selectedRoute: string;
}

const LOCAL_STORAGE_LEFT_DRAWER_OPEN_KEY = 'microws_left-drawer-open';
export const state: State = {
  needUpdateCard: false,
  leftDrawerOpen: (() =>
    localStorage.getItem(LOCAL_STORAGE_LEFT_DRAWER_OPEN_KEY) !== 'false')(),
  selectedPath: '',
  selectedRoute: '',
};

export const getters: GetterTree<State, State> = {
  leftDrawerOpen(state) {
    return state.leftDrawerOpen;
  },
  selectedPath(state) {
    return state.selectedPath;
  },
  selectedRoute(state) {
    return state.selectedRoute;
  },
};

export const mutations: MutationTree<State> = {
  leftDrawerToggle(state) {
    state.leftDrawerOpen = !state.leftDrawerOpen;
    localStorage.setItem(LOCAL_STORAGE_LEFT_DRAWER_OPEN_KEY, String(state.leftDrawerOpen));
  },
  setNeedUpdateCard(state, needUpdate) {
    state.needUpdateCard = needUpdate;
  },
  setSelectedPath(state, path) {
    state.selectedPath = path;
  },
  setSelectedRoute(state, routeName) {
    state.selectedRoute = routeName;
  },
};

export const actions = {};

export const microWsComputed = {
  ...mapState<Mapper<State>>('microws', {
    leftDrawerOpen: (state: State) => state.leftDrawerOpen,
    needUpdateCard: (state: State) => state.needUpdateCard,
  }),
  ...mapGetters('microws', ['leftDrawerOpen']),
};

export const microWsMethods: {
  setNeedUpdateCard: MutationMethod;
} = mapMutations('microws', ['setNeedUpdateCard']);
