import { createSlice, createAsyncThunk } from '@reduxjs/toolkit'
import ProductService from '../../services/ProductService';

const initialState = {
    product:{
      data: {},
      status: 'idle',
      error: null,
    },
    products:{
      data: [],
      status: 'idle',
      error: null,
    },
    productsHistory:{
      data: [],
      status: 'idle',
      error: null,
    },
    productsSelected:[],
    ProductsSuggestion:[]
};

export const fetchProduct = createAsyncThunk(
  'product/fetchProduct',
  async (pid) => {
    
    const response = await ProductService.getProduct(pid)
    return response

  }
)

export const fetchProducts = createAsyncThunk(
  'product/fetchProducts',
  async ({maxResults, sortBy, customQuery}) => {

    const response = await ProductService.getProducts(maxResults, sortBy, customQuery)
    return response

  }
)

export const fetchProductsByCollection = createAsyncThunk(
  'product/fetchProductsByCollection',
  async ({collectionId}) => {
    
    const response = await ProductService.getProductsByCollection(collectionId)
    return response

  }
)

export const fetchProductsHistory = createAsyncThunk(
  'product/fetchProductsHistory',
  async (productIDList) => {

    const idsQuery = productIDList.map(id => `id:${id}`).join(" OR ");
    const response = await ProductService.getProducts(6, "TITLE", idsQuery)
    return response

  }
)

export const productSlice = createSlice({
  name: 'product',
  initialState,
  extraReducers: (builder) => {
    builder
      .addCase(fetchProducts.pending, (state) => {
        state.products.status = 'loading';
        state.products.error = null;
      })
      .addCase(fetchProducts.fulfilled, (state, action) => {
        state.products.status = 'succeeded';
        state.products.data = action.payload
      })
      .addCase(fetchProducts.rejected, (state, action) => {
        state.products.status = 'failed';
        state.products.data = [];
        state.products.error = action.error.message;
      })
      .addCase(fetchProduct.pending, (state) => {
        state.product.status = 'loading';
        state.product.error = null;
      })
      .addCase(fetchProduct.fulfilled, (state, action) => {
        state.product.status = 'succeeded';
        state.product.data = action.payload
      })
      .addCase(fetchProduct.rejected, (state, action) => {
        state.product.status = 'failed';
        state.product.data = {};
        state.product.error = action.error.message;
      })
      .addCase(fetchProductsByCollection.pending, (state) => {
        state.products.status = 'loading';
        state.products.error = null;
      })
      .addCase(fetchProductsByCollection.fulfilled, (state, action) => {
        state.products.status = 'succeeded';
        state.products.data = action.payload
      })
      .addCase(fetchProductsByCollection.rejected, (state, action) => {
        state.products.status = 'failed';
        state.products.data = [];
        state.products.error = action.error.message;
      })
      .addCase(fetchProductsHistory.pending, (state) => {
        state.productsHistory.status = 'loading';
        state.productsHistory.error = null;
      })
      .addCase(fetchProductsHistory.fulfilled, (state, action) => {
        state.productsHistory.status = 'succeeded';
        state.productsHistory.data = action.payload
      })
      .addCase(fetchProductsHistory.rejected, (state, action) => {
        state.productsHistory.status = 'failed';
        state.productsHistory.data = [];
        state.productsHistory.error = action.error.message;
      })
  }
});


export default productSlice.reducer;