1. 카테고리 클릭 시 화면 상태 변경
- 카테고리 탭과 메뉴 리스트를 갖고 있는 상위 컴포넌트에서 ‘현재 카테고리’ 를 상태로 관리함.
- 카테고리 아이디로 갖고 있는 것이 바람직 할듯?
- 카테고리 탭은 현재 카테고리와 카테고리 변경 함수 를 받는다.
- 현재 카테고리에 해당하는 탭을 하이라이트하고
- 카테고리 클릭 시 상태를 변경한다.
- 메뉴 리스트는 현재 카테고리를 ****받는다.
- 현재 카테고리가 바뀌면 (즉, 메뉴 리스트가 렌더되면 애니메이션이 있어야함)
- 그래서 메뉴 리스트는 항상 현재 카테고리를 useEffect로 받아서 애니메이션 효과를 줘야함.
2. 메뉴 클릭 시 해당 메뉴에 맞는 모달을 띄움.
- 옵션 데이터도 이미 스토어에 저장이 되어있음.
- 모달에는 클릭 된 메뉴 아이디만 넘겨주면 됨
- 아니면 데이터를 찾아서 모달에 넘겨주고 모달은 순수하게 만드는 것도 좋겠다.
- 늘 드는 고민이지만, 누가 순수하지 못한 역할을 맡아야할까
3. 장바구니 기능
- 장바구니에 담긴 메뉴의 수량을 변경할 수 있음
- 1 아래로는 내려갈 수 없음. 9이상을 띄우면 카운터에 문의하라고 메시지를 띄우고 막음
- 더이상 바꿀 수 없을 때 버튼을 비활성화 함.
- 장바구니에 담은 메뉴를 삭제할 수 있음.
- 전체 삭제의 경우 확인 모달 띄움
- context에서 useReducer로 관리하면 될 듯
- 장바구니의 메뉴를 누르면 다시 해당 메뉴의 모달을 띄워줌.
- 아이템 리스트에서 클릭했을 때와 장바구니에서 눌렀을 때의 로직을 둘다 고려해야해
- 그러면 데이터를 아예 찾아서 넘겨주는 방식이 나을지도.
- 처음으로 버튼을 누르면 아예 사용자 앱 시작 화면으로 이동
4.