diff --git a/emotiondiary/src/App.js b/emotiondiary/src/App.js
index 3ccef65f..d9e51892 100644
--- a/emotiondiary/src/App.js
+++ b/emotiondiary/src/App.js
@@ -99,7 +99,7 @@ function App() {
} />
} />
- } />
+ } />
} />
diff --git a/emotiondiary/src/components/DiaryEditor.js b/emotiondiary/src/components/DiaryEditor.js
index 273b653e..e24d21d5 100644
--- a/emotiondiary/src/components/DiaryEditor.js
+++ b/emotiondiary/src/components/DiaryEditor.js
@@ -1,5 +1,5 @@
import { useNavigate } from "react-router-dom";
-import { useContext, useRef, useState } from "react";
+import { useContext, useEffect, useRef, useState } from "react";
import MyHeader from "./MyHeader";
import MyButton from "./MyButton";
@@ -55,14 +55,14 @@ const getStringDate = (date) => {
return `${year}-${month}-${day}`;
};
-const DiaryEditor = () => {
+const DiaryEditor = ({ isEdit, originData }) => {
const [content, setContent] = useState("");
const [emotion, setEmotion] = useState(3);
const [date, setDate] = useState(getStringDate(new Date()));
const contentRef = useRef();
- const { onCreate } = useContext(DiaryDispatchContext);
+ const { onCreate, onEdit } = useContext(DiaryDispatchContext);
const navigate = useNavigate();
@@ -76,14 +76,32 @@ const DiaryEditor = () => {
return;
}
- onCreate(date, content, emotion);
+ if (
+ window.confirm(
+ isEdit ? "일기를 수정하시겠습니까?" : "새로운 일기를 작성하시겠습니까?"
+ )
+ ) {
+ if (!isEdit) {
+ onCreate(date, content, emotion);
+ } else {
+ onEdit(originData.id, date, content, emotion);
+ }
+ }
navigate("/", { replace: true });
};
+ useEffect(() => {
+ if (isEdit) {
+ setDate(getStringDate(new Date(parseInt(originData.date))));
+ setEmotion(originData.emotion);
+ setContent(originData.content);
+ }
+ }, [isEdit, originData]);
+
return (
navigate(-1)} />
}
diff --git a/emotiondiary/src/components/EmotionItem.js b/emotiondiary/src/components/EmotionItem.js
index 3060ff4a..4d688271 100644
--- a/emotiondiary/src/components/EmotionItem.js
+++ b/emotiondiary/src/components/EmotionItem.js
@@ -12,7 +12,7 @@ const EmotionItem = ({
}`}
onClick={() => onClick(emotion_id)}
>
-
+
{emotion_descript}
);
diff --git a/emotiondiary/src/pages/Edit.js b/emotiondiary/src/pages/Edit.js
index af0b5390..c5650e94 100644
--- a/emotiondiary/src/pages/Edit.js
+++ b/emotiondiary/src/pages/Edit.js
@@ -1,22 +1,34 @@
-import { useNavigate, useSearchParams } from "react-router-dom";
+import { useContext, useEffect, useState } from "react";
+import { useNavigate, useParams } from "react-router-dom";
+import { DiaryStateContext } from "../App";
+import DiaryEditor from "../components/DiaryEditor";
const Edit = () => {
+ const [originData, setOriginData] = useState();
+
const navigate = useNavigate();
- const [searchParams, setSearchParams] = useSearchParams();
+ const diaryList = useContext(DiaryStateContext);
- const id = searchParams.get("id");
- const mode = searchParams.get("mode");
- console.log(id);
- console.log(mode);
+ const { id } = useParams();
+ useEffect(() => {
+ if (diaryList.length >= 1) {
+ const targetDiary = diaryList.find(
+ (it) => parseInt(it.id) === parseInt(id)
+ );
+
+ if (targetDiary) {
+ setOriginData(targetDiary);
+ } else {
+ navigate("/", { replace: true });
+ }
+ }
+ }, [diaryList, id]);
return (
-
Edit
-
이곳은 일기 수정 페이지 입니다.
-
-
-
-
+
+ {originData && }
+
);
};