43 lines
1.2 KiB
TypeScript
43 lines
1.2 KiB
TypeScript
'use client';
|
|
|
|
import Shop from '@/components/shop/Shop';
|
|
import { useCallback, useState } from 'react';
|
|
import { useModalStore } from '@/store/modal.state';
|
|
|
|
export interface IHandleOpen {
|
|
image?: string;
|
|
isDecimal?: boolean;
|
|
priceItem?: number;
|
|
shopItem?: number;
|
|
}
|
|
|
|
const ShopContainer = () => {
|
|
const [isOpen, setIsOpen] = useState<boolean>(false);
|
|
|
|
const { setShopItemId, setPriceItem, setImage, setIsDecimal } = useModalStore();
|
|
|
|
const handleClose = useCallback(() => {
|
|
setIsOpen(false);
|
|
}, []);
|
|
|
|
const handleOpen = useCallback((data: IHandleOpen) => {
|
|
if (data.image && data.priceItem && data.shopItem && data.isDecimal !== undefined) {
|
|
setIsDecimal(data.isDecimal);
|
|
setImage(data.image);
|
|
setPriceItem(data.priceItem);
|
|
setShopItemId(data.shopItem);
|
|
setIsOpen(true);
|
|
} else {
|
|
setIsOpen(true);
|
|
setIsDecimal(true);
|
|
setImage('/icons/small-coin-icon.svg');
|
|
setPriceItem(0);
|
|
setShopItemId(null);
|
|
}
|
|
}, []);
|
|
|
|
return <Shop isOpen={isOpen} handleClose={handleClose} handleOpen={handleOpen} />;
|
|
};
|
|
|
|
export default ShopContainer;
|