Merge pull request #68 from turkey-kim/feat/wiki

Feat/wiki: 문서 변경 알람 및 문서 업데이트 전 알람 기능 추가

package.json

@@ -20,6 +20,7 @@
     "react-scripts": "5.0.1",
     "rehype-raw": "^7.0.0",
     "remark-gfm": "^3.0.1",
+    "sweetalert": "^2.1.2",
     "typescript": "^4.9.5",
     "web-vitals": "^2.1.4"
   },

src/components/Wiki/Content.tsx

@@ -2,6 +2,7 @@ import React, {useEffect, useState} from "react";
 import "../../styles/wiki/wiki.css";
 import "../../styles/wiki/reactMarkdown.css";
 import {useParams} from "react-router-dom";
+import swal from "sweetalert";
 import Loading from "../Loading";
 import EditButton from "./EditButton";
 import TeamContent from "./TeamContent";
@@ -63,15 +64,29 @@ function Content() {
   }, [content]);
 
   const updateContent = () => {
-    const newContent = sessionStorage.getItem(title);
-
-    if (newContent) {
-      setContent(JSON.parse(newContent).content);
-      if (isEditorOpen) {
-        setText(content);
-        setIsEditorOpen(false);
+    swal({
+      title: "정말 문서를 업데이트 하시겠습니까?",
+      text: "기존에 편집중인 내용은 따로 복사 후 업데이트하는 것을 권장합니다.",
+      buttons: ["취소", true],
+      icon: "warning",
+      dangerMode: true,
+    }).then(willDelete => {
+      if (willDelete) {
+        swal("문서가 업데이트 되었습니다!", {
+          icon: "success",
+        });
+
+        const newContent = sessionStorage.getItem(title);
+
+        if (newContent) {
+          setContent(JSON.parse(newContent).content);
+          if (isEditorOpen) {
+            setText(content);
+            setIsEditorOpen(false);
+          }
+        }
       }
-    }
+    });
   };
 
   return (

src/components/Wiki/SaveContents.tsx

@@ -1,3 +1,4 @@
+import swal from "sweetalert";
 import {doc, onSnapshot} from "firebase/firestore";
 import {db} from "../../utils/firebaseConfig";
 
@@ -20,12 +21,10 @@ async function SaveContents(categories: string[]): Promise<any> {
         callSnapshot > categories.length &&
         sameLocation !== -1
       ) {
-        /* eslint-disable */
-        alert(
-          "⚠️ 문서가 업데이트되었습니다! \n\n 🙏🏻 refresh 버튼을 누른 후 계속 작업해주세요. 🙏🏻",
+        swal(
+          "문서가 업데이트되었습니다!",
+          "🙏🏻 refresh 버튼을 누른 후 계속 작업해주세요. 🙏🏻",
         );
-
-        /* eslint-enable */
       }
     });
   });