burger-online

1
import {PayloadAction, createSlice} from '@reduxjs/toolkit'
2
import {TIngredient, TOrderNumber} from '../../types'
3
import {RootState} from '../store'
4
import {fetchByClickingOnTheCardOrder, fetchOrder} from './actions'
5
import {IConstructorState, TDragAndDropIndex} from './types'
6

7
const initialState: IConstructorState = {
8
  bun: {
9
    calories: 0,
10
    carbohydrates: 0,
11
    fat: 0,
12
    image: '',
13
    image_large: '',
14
    image_mobile: '',
15
    name: '',
16
    price: 0,
17
    proteins: 0,
18
    type: '',
19
    __v: 0,
20
    _id: '',
21
    count: 0,
22
  },
23
  addedIngredients: [],
24
  countIngredient: 0,
25
  totalPrice: 0,
26

27
  createdOrder: {number: 0},
28
  statusCreatedOrder: '',
29

30
  order: {
31
    createdAt: '',
32
    ingredients: [],
33
    name: '',
34
    number: 0,
35
    status: '',
36
    updatedAt: '',
37
    _id: '',
38
  },
39
  statusOrder: '',
40
}
41

42
const constructorSlice = createSlice({
43
  name: 'constructor',
44
  initialState,
45
  reducers: {
46
    addBun: (state, action: PayloadAction<TIngredient>) => {
47
      state.bun = {
48
        ...action.payload,
49
        isLocked: true,
50
      }
51
      state.totalPrice = action.payload.price * 2
52
    },
53
    addIngredient: (state, {payload}: PayloadAction<TIngredient>) => {
54
      state.addedIngredients.push(payload)
55
    },
56
    removeIngredient: (state, {payload}: PayloadAction<TIngredient>) => {
57
      state.addedIngredients = state.addedIngredients.filter(item => item.uuid !== payload.uuid)
58
    },
59
    setOrder: (state, action: PayloadAction<TOrderNumber>) => {
60
      state.createdOrder = action.payload
61
    },
62
    sortedIngredients: (state, {payload}: PayloadAction<TDragAndDropIndex>) => {
63
      let newItems = [...state.addedIngredients]
64
      const removedDragItem = newItems.splice(payload.dragIndex, 1)
65
      newItems.splice(payload.hoverIndex, 0, ...removedDragItem)
66
      state.addedIngredients = newItems
67
    },
68
    setTotalPrice: (state, action: PayloadAction<number>) => {
69
      state.totalPrice = action.payload
70
    },
71
  },
72
  extraReducers: builder => {
73
    builder
74
      .addCase(fetchOrder.pending, state => {
75
        state.statusCreatedOrder = 'LOADING'
76
      })
77
      .addCase(fetchOrder.fulfilled, (state, {payload}) => {
78
        state.createdOrder = payload.order
79
        state.statusCreatedOrder = 'SUCCESS'
80
        state.addedIngredients = []
81
      })
82
      .addCase(fetchOrder.rejected, state => {
83
        state.statusOrder = 'ERROR'
84
        state.createdOrder = {number: 0}
85
      })
86
      .addCase(fetchByClickingOnTheCardOrder.pending, state => {
87
        state.statusOrder = 'LOADING'
88
      })
89
      .addCase(fetchByClickingOnTheCardOrder.fulfilled, (state, {payload}) => {
90
        state.statusOrder = 'SUCCESS'
91
        state.order = payload.orders[0]
92
      })
93
      .addCase(fetchByClickingOnTheCardOrder.rejected, state => {
94
        state.statusOrder = 'ERROR'
95
      })
96
  },
97
})
98

99
export const constructorStore = (store: RootState) => store.burger
100
export const {addBun, addIngredient, setTotalPrice, setOrder, removeIngredient, sortedIngredients} =
101
  constructorSlice.actions
102
export default constructorSlice.reducer
103