From 1e64dd4ae5d82f650ae515183454b6d2bdd2a8ba Mon Sep 17 00:00:00 2001
From: Sung Ho Park <qkrtjdgh97@gmail.com>
Date: Sat, 8 Oct 2022 17:07:58 +0900
Subject: [PATCH] feat: PresentationVideoDeleteModal

- #48
---
 .../PresentationVideoDeleteModal/index.tsx    | 49 +++++++++++++++++++
 .../PresentationVideoDeleteModal/style.ts     | 29 +++++++++++
 2 files changed, 78 insertions(+)
 create mode 100644 components/Modal/PresentationVideoDeleteModal/index.tsx
 create mode 100644 components/Modal/PresentationVideoDeleteModal/style.ts

diff --git a/components/Modal/PresentationVideoDeleteModal/index.tsx b/components/Modal/PresentationVideoDeleteModal/index.tsx
new file mode 100644
index 0000000..b09be0c
--- /dev/null
+++ b/components/Modal/PresentationVideoDeleteModal/index.tsx
@@ -0,0 +1,49 @@
+import React from 'react';
+import { useRouter } from 'next/router';
+import { AxiosError } from 'axios';
+
+import { TaskState } from '@/lib/api/types';
+import { deleteProjectsKanbanTask } from '@/lib/api/projects';
+
+import Button from '@/components/atoms/Button';
+import Text from '@/components/atoms/Text';
+
+import Modal from '@/components/Modal';
+
+import Theme from '@/styles/Theme';
+
+import * as Styled from './style';
+
+export interface PresentationVideoDeleteModalProps {
+  closeModal: () => void;
+  handleVideoDeleteButton: () => void;
+}
+
+const PresentationVideoDeleteModal = ({ closeModal, handleVideoDeleteButton }: PresentationVideoDeleteModalProps) => {
+  return (
+    <Modal closeModal={closeModal}>
+      <Styled.ContentContainer>
+        <Styled.TextContainer>
+          <Text>삭제하면 복구할 수 없습니다.</Text>
+          <Text>정말 삭제하시겠습니까?</Text>
+        </Styled.TextContainer>
+        <Styled.ButtonContainer>
+          <Button
+            width={200}
+            height={52}
+            backgroundColor={Theme.S_0}
+            fontColor={Theme.M_1}
+            onClick={handleVideoDeleteButton}
+          >
+            삭제
+          </Button>
+          <Button width={200} height={52} onClick={closeModal}>
+            취소
+          </Button>
+        </Styled.ButtonContainer>
+      </Styled.ContentContainer>
+    </Modal>
+  );
+};
+
+export default PresentationVideoDeleteModal;
diff --git a/components/Modal/PresentationVideoDeleteModal/style.ts b/components/Modal/PresentationVideoDeleteModal/style.ts
new file mode 100644
index 0000000..cc21582
--- /dev/null
+++ b/components/Modal/PresentationVideoDeleteModal/style.ts
@@ -0,0 +1,29 @@
+import styled from 'styled-components';
+
+export const ContentContainer = styled.div`
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+
+  line-height: 20px;
+`;
+
+export const TextContainer = styled.div`
+  position: absolute;
+  top: 60px;
+
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+
+  gap: 8px;
+`;
+
+export const ButtonContainer = styled.div`
+  position: absolute;
+  bottom: 26px;
+
+  display: flex;
+
+  gap: 35px;
+`;