diff --git a/src/_app/modules/wrapper/Wrapper.tsx b/src/_app/modules/wrapper/Wrapper.tsx index 5069ba407d8d420bf5e51450e5446f3b7d464e82..6f29d55036394226b11af935850e267b67e9a6c4 100644 --- a/src/_app/modules/wrapper/Wrapper.tsx +++ b/src/_app/modules/wrapper/Wrapper.tsx @@ -1,19 +1,25 @@ import { useContext, useEffect, useRef } from "react"; +import { STATUS } from "../../../common/constants"; import Socket from "../../../common/instances/Socket"; import { BSContext } from "../../../contexts/bottom-sheet"; import { ToastContext } from "../../../contexts/toast"; + import S from './Wrapper.module.css'; import type { GFCWithProp } from "../../../common/types/fc"; +import type { OrderedItemModel } from "../../../pages/admin-page/config/type"; import type { CartItemPostModel } from "../../../pages/cart-page/config/type"; +import type { MenuPageModel } from "../../../pages/menu-page/config/type"; import type { ReactNode , MutableRefObject } from "react"; -interface Props { children: ReactNode; } +type ShopInfo = MenuPageModel['shop']; +interface Props { children: ReactNode; } + // NEEDED TO USE CONTEXTS const Wrapper: GFCWithProp<Props> = ({ connector, children }) => { const { bSElement } = useContext(BSContext); @@ -25,9 +31,16 @@ const Wrapper: GFCWithProp<Props> = ({ connector, children }) => { if (!socket.current) socket.current = new Socket(); - socket.current!.onOrder((d: CartItemPostModel) => { + socket.current!.onOrder(async (d: OrderedItemModel) => { + if (d.status !== STATUS.COMPLETED) return; + + const shopInfo = await connector.current!.get<ShopInfo>(`/shop/${d.shopId}`); + setToastItem({ - id: '', title: d.shopId, description: d.waitingCount.toString(), goto: '' + id: '', + title: `${shopInfo.name} 주문이 준비되었습니다`, + description: `대기번호: ${d.waitingCount}번`, + goto: '' }); }); diff --git a/src/pages/main-page/modules/shop-box/ShopBox.tsx b/src/pages/main-page/modules/shop-box/ShopBox.tsx index e0ec9930c42725912b1378031b9c484f6488ae8a..69eb1c5c8f3d9ea633f66bc3c8d5e0fef09f23cb 100644 --- a/src/pages/main-page/modules/shop-box/ShopBox.tsx +++ b/src/pages/main-page/modules/shop-box/ShopBox.tsx @@ -26,9 +26,8 @@ const ShopBox: FC<Props> = ({ icon, name, location, openStatus }) => { navigator(APP_ROUTE.MAIN); }, []); - // TODO:: openStatus UI return ( - <div className={[S['container'], openStatus ? S['not-open'] : ''].join(' ')}> + <div className={[S['container'], openStatus ? '' : S['not-open']].join(' ')}> <img className={S['icon']} src={icon} alt={`${icon}icon`} /> <div className={S['text-box']}> <span className={S['title']}>{name}</span>