import { Action, Reducer } from 'redux' import { AppThunkAction } from '../' import { GetShopItemRequestModel } from '../../models/requests' import { GetShopItemResponseModel } from '../../models/responses' import { Get } from '../../restClient' export interface ShopItemState extends GetShopItemResponseModel { isLoading: boolean } interface RequestAction extends GetShopItemRequestModel { type: 'REQUEST_SHOP_ITEM' } interface ReceiveAction extends GetShopItemResponseModel { type: 'RECEIVE_SHOP_ITEM' } type KnownAction = RequestAction | ReceiveAction export const actionCreators = { requestShopItem: (props: GetShopItemRequestModel): AppThunkAction => (dispatch, getState) => { Get>('https://localhost:7151/api/ShopItem', props) .then(response => response) .then(data => { if(data) dispatch({ type: 'RECEIVE_SHOP_ITEM', ...data }) }) dispatch({ type: 'REQUEST_SHOP_ITEM', slug: props.slug }) } } const unloadedState: ShopItemState = { id: "", slug: "demo-post", image: { src: "https://dummyimage.com/600x700/dee2e6/6c757d.jpg", alt: "..." }, sku: "BST-498", badges: [ "Sale" ], title: "Shop item template", brandName: "Brand & Name", text: `

Lorem ipsum dolor sit amet consectetur adipisicing elit. Praesentium at dolorem quidem modi. Nam sequi consequatur obcaecati excepturi alias magni, accusamus eius blanditiis delectus ipsam minima ea iste laborum vero?

`, author: { id: "", nickName: "Admin", image: { src: "https://dummyimage.com/40x40/ced4da/6c757d", alt: "..." } }, created: new Date().toString(), tags: [ "react", "redux", "webapi" ], price: 20, newPrice: 10, quantity: 10, comments: [ { author: { id: "", nickName: "Commenter Name 1", image: { src: "https://dummyimage.com/50x50/ced4da/6c757d.jpg", alt: "..." } }, comment: "If you're going to lead a space frontier, it has to be government; it'll never be private enterprise. Because the space frontier is dangerous, and it's expensive, and it has unquantified risks.", responses: [ { author: { id: "", nickName: "Commenter Name 4", image: { src: "https://dummyimage.com/50x50/ced4da/6c757d.jpg", alt: "..." } }, comment: "And under those conditions, you cannot establish a capital-market evaluation of that enterprise. You can't get investors." }, { author: { id: "", nickName: "Commenter Name 3", image: { src: "https://dummyimage.com/50x50/ced4da/6c757d.jpg", alt: "..." } }, comment: "When you put money directly to a problem, it makes a good headline." } ] }, { author: { id: "", nickName: "Commenter Name 2", image: { src: "https://dummyimage.com/50x50/ced4da/6c757d.jpg", alt: "..." } }, comment: "When I look at the universe and all the ways the universe wants to kill us, I find it hard to reconcile that with statements of beneficence." } ], isLoading: false } export const reducer: Reducer = (state: ShopItemState | undefined, incomingAction: Action): ShopItemState => { if (state === undefined) { return unloadedState } const action = incomingAction as KnownAction switch (action.type) { case 'REQUEST_SHOP_ITEM': return { ...state, isLoading: true } case 'RECEIVE_SHOP_ITEM': return { ...action, isLoading: false } } return state }