+
+ {/* {유저 정보 들어오면 이미지 src 추가할 예정} */}
+
+
+ {activeNickname && (
+
+ {`@${activeNickname}님에게 남긴 답글`}
+
+
+ )}
+
+
+
+
{`${COMMENTS.totalCount}개의 댓글`}
+ {COMMENTS.comments.map((item) => {
+ return (
+
+
+
+ );
+ })}
+
+ );
+}
+
+export default Comments;
diff --git a/src/app/[userNickname]/[listId]/_components/ListDetailOuter/DeleteModalButton.tsx b/src/app/[userNickname]/[listId]/_components/ListDetailOuter/DeleteModalButton.tsx
new file mode 100644
index 00000000..009d0038
--- /dev/null
+++ b/src/app/[userNickname]/[listId]/_components/ListDetailOuter/DeleteModalButton.tsx
@@ -0,0 +1,37 @@
+import { ReactNode } from 'react';
+import Modal from '@/components/Modal/Modal';
+import useBooleanOutput from '@/hooks/useBooleanOutput';
+import * as styles from './ModalButtonStyle.css';
+import DeleteButton from '/public/icons/trash_can.svg';
+
+interface DeleteModalProps {
+ children?: ReactNode;
+}
+
+export default function DeleteModal({ children }: DeleteModalProps) {
+ const { isOn, handleSetOff, handleSetOn } = useBooleanOutput(); //모달 열림,닫힘 상태 관리
+ const handleConfirmButtonClick = () => {
+ //확인버튼 클릭시 실행될 로직()
+ handleSetOff(); //닫기
+ };
+
+ return (
+ <>
+ {/*👆 누르면 모달이 열리는 트리거 버튼*/}
+