Press n or j to go to the next uncovered block, b, p or k for the previous block.
| 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 | 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x 14x 14x 1x 1x 1x 6x 6x 1x 1x 1x 2x 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x | import { createSlice, PayloadAction } from "@reduxjs/toolkit";
import { Product } from "@/types/product";
import { RootState } from "../store";
/**
* Payload type for updating quick view.
* Allows any object with an id field - handles various product formats
* from different components and API responses.
*/
type QuickViewPayload = { id: number; [key: string]: unknown };
interface QuickViewState {
value: Product;
isOpen: boolean;
}
const initialState: QuickViewState = {
value: {
title: "",
reviews: 0,
price: 0,
discountedPrice: 0,
img: "",
id: 0,
images: [],
imgs: { thumbnails: [], previews: [] },
} as Product,
isOpen: false,
};
export const quickView = createSlice({
name: "quickView",
initialState,
reducers: {
updateQuickView: (state, action: PayloadAction<QuickViewPayload>) => {
state.value = action.payload as Product;
state.isOpen = true;
},
resetQuickView: (state) => {
state.value = initialState.value;
state.isOpen = false;
},
closeQuickView: (state) => {
state.isOpen = false;
},
},
});
// Selectors
export const selectQuickViewProduct = (state: RootState) =>
state.quickViewReducer.value;
export const selectQuickViewIsOpen = (state: RootState) =>
state.quickViewReducer.isOpen;
export const { updateQuickView, resetQuickView, closeQuickView } = quickView.actions;
export default quickView.reducer;
|