import articleListSeeds from './seeds/article-list';
import { createReducer, createAction, handle } from 'modules/utils/dux';
import { createSelector } from 'reselect';
// import { createSelector } from 'reselect';

// import { getArticleList } from '../ducks/';

/* REDUCER NAME */
export const NAME = 'articleList';

/* TYPES */
const LIKE = 'blog/article-list/LIKE';
const UNLIKE = 'blog/article-list/UNLIKE';
const SHARE = 'blog/article-list/SHARE';

/* REDUCERS */

const reducer = createReducer(
  handle(LIKE, (state, { slug }) => ({
    ...state,
    [slug]: {
      ...state[slug],
      details: {
        ...state[slug].details,
        isArticleLiked: true,
        likes: state[slug].details.likes + 1
      }
    }
  })),

  handle(UNLIKE, (state, { slug }) => ({
    ...state,
    [slug]: {
      ...state[slug],
      details: {
        ...state[slug].details,
        isArticleLiked: false,
        likes: state[slug].details.likes - 1
      }
    }
  })),

  handle(SHARE, (state, { slug, name }) => ({
    ...state,
    [slug]: {
      ...state[slug],
      details: {
        ...state[slug].details,
        shares: {
          ...state[slug].details.shares,
          [name]: {
            ...state[slug].details.shares[name],
            amount: state[slug].details.shares[name].amount + 1
          }
        }
      }
    }
  }))
);

export default reducer(articleListSeeds);

/* SELECTORS */

export const getRoot = state => state.blog.articleList;

export const getSlugFromRouteParams = (_, { match }) => {
  return match.params.slug;
};

export const getAll = getRoot;

export const getItemByRouteParams = createSelector(
  getAll,
  getSlugFromRouteParams,
  (all, slug) => all[slug]
);

const getSlug = (_, { slug }) => slug;

export const getItemBySlug = createSelector(
  getAll,
  getSlug,
  function _getItemBySlug(all, slug) {
    if (!all || !slug) {
      return null;
    }

    const article = all[slug];

    if (!article) {
      return null;
    }

    return article;
  }
);

export const getDetailsBySlug = createSelector(
  getItemBySlug,
  function _getDetailsBySlug(article) {
    if (!article || !article.details) {
      return null;
    }

    return article.details;
  }
);

export const getSharesBySlug = createSelector(
  getDetailsBySlug,
  function _getSharesBySlug(details) {
    return Object.values(details.shares);
  }
);

export const getExploreArticleList = createSelector(
  getDetailsBySlug,
  details => details.exploreArticleList
);

export const getItemAdBySlug = createSelector(
  getItemBySlug,
  function _getDetailsBySlug(article) {
    if (!article || !article.details) {
      return null;
    }

    return {
      title: article.title,
      slug: article.slug,
      cover: article.cover
    };
  }
);

/* ACTION_CREATORS */

export const actions = {
  like(slug) {
    return createAction(LIKE, { slug });
  },

  unlike(slug) {
    return createAction(UNLIKE, { slug });
  },

  share(slug, name) {
    return createAction(SHARE, { slug, name });
  }
};

/* HELPERS */