Merge pull request #19 from potato-club/add/modal

[#16] Feat Modal
potato-club · Feb 20, 2023 · 6d78373 · 6d78373
2 parents fac5575 + f558e92
commit 6d78373
Show file tree

Hide file tree

Showing 2 changed files with 17 additions and 4 deletions.
diff --git a/src/components/modal/alert.tsx b/src/components/modal/alert.tsx
@@ -23,7 +23,9 @@ export const Alert = ({ content, isOpen, closeModal }: Props) => {
     >
       <Wrapper isOpen={isOpen} ref={modalRef}>
         <Content>{content}</Content>
-        <Button onClick={closeModal}>닫기</Button>
+        <Button type="button" onClick={closeModal}>
+          닫기
+        </Button>
       </Wrapper>
     </CSSTransition>
   );

diff --git a/src/components/modal/modal.tsx b/src/components/modal/modal.tsx
@@ -8,12 +8,19 @@ interface Props {
   isOpen: boolean;
   closeModal: () => void;
   event: () => void;
+  eventBtnType: "button" | "submit" | "reset";
 }
 interface StyleProps {
   isOpen: boolean;
 }
 
-export const Modal = ({ content, isOpen, closeModal, event }: Props) => {
+export const Modal = ({
+  content,
+  isOpen,
+  closeModal,
+  event,
+  eventBtnType,
+}: Props) => {
   const modalRef = useRef(null);
   return (
     <CSSTransition
@@ -26,8 +33,12 @@ export const Modal = ({ content, isOpen, closeModal, event }: Props) => {
         <Content>{content}</Content>
         <Buttons>
           <Division />
-          <Button onClick={event}>네</Button>
-          <Button onClick={closeModal}>아니요</Button>
+          <Button type={eventBtnType} onClick={event}>
+            네
+          </Button>
+          <Button type="button" onClick={closeModal}>
+            아니요
+          </Button>
         </Buttons>
       </Wrapper>
     </CSSTransition>