ЯсноПонятно24

с учетом предыдущего типы не совпадают, что export type TIngredient = { _id: string; name: string; type: string; proteins: number; fat: number; carbohydrates: number; calories: number; price: number; image: string; image_large: string; image_mobile: string; }; export type TConstructorIngredient = TIngredient & { id: string; }; что делать в слайсе тогда, как поправить: import { createSlice, createAsyncThunk, PayloadAction, nanoid } from '@reduxjs/toolkit'; import { TConstructorIngredient, TIngredient } from '@utils-types'; import { getIngredientsApi } from '../../utils/burger-api'; type TBurgerState = { ingredients: TConstructorIngredient[]; bun: TConstructorIngredient | null; loading: boolean; error?: string | null; } type TIngredientState = { ingredients: TIngredient[]; } const initialState: TBurgerState = { ingredients: [], bun: null, loading: false, error: '' } export const fetchIngredients = createAsyncThunk<TIngredient[]>( 'ingredients/fetchIngredients', async () => { const response = await getIngredientsApi(); return response; } ) const burgerSlice = createSlice({ name: 'burgers', initialState, reducers: { addBurgerIngredient: (state, action: PayloadAction<TConstructorIngredient>) => { if (state.bun === null) { state.bun = action.payload; } else { state.ingredients.push(action.payload); } prepare: (ingredient: TIngredient) => { const key = nanoid(); return { payload: {...ingredient, key } }; } }, removeBurgerIngredient: (state, action: PayloadAction<string>) => { state.ingredients = state.ingredients.filter((ingredient) => ingredient.id !== action.payload); }, moveBurgerIngredient: (state, action: PayloadAction<{ currentIndex: number, targetIndex: number }>) => { const { currentIndex, targetIndex } = action.payload; const ingredientToMove = state.ingredients[currentIndex]; state.ingredients.splice(currentIndex, 1); state.ingredients.splice(targetIndex, 0, ingredientToMove); }, clearBurgerIngredients: (state) => { state.ingredients = []; state.bun = null; } }, selectors: { burgersData: (state:TIngredientState) => state.ingredients, isLoading: (state:TBurgerState) => state.loading }, extraReducers: (builder) => { builder .addCase(fetchIngredients.pending, (state) => { // Добавляем лоадер перед отправкой запроса на сервер state.loading = true; }) .addCase(fetchIngredients.fulfilled, (state, action: PayloadAction<TIngredient[]>) => { // Успешный ответ от сервера state.ingredients = action.payload; state.loading = false; }) .addCase(fetchIngredients.rejected, (state) => { // Ошибка при получении данных state.error = 'Ошибка при получении данных'; state.loading = false; }); } }); export const burgerSliceReducer = burgerSlice.reducer; export const { addBurgerIngredient, removeBurgerIngredient, moveBurgerIngredient, clearBurgerIngredients } = burgerSlice.actions;