OpenKetchupSource · jungsunbeen · May 30, 2025 · May 30, 2025 · May 30, 2025 · May 30, 2025
diff --git a/index.html b/index.html
@@ -4,6 +4,12 @@
     <meta charset="UTF-8" />
     <link rel="icon" type="image/svg+xml" href="/images/icon.png" />
     <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+    <meta property="og:image" content="/images/meta.png" />
+    <meta property="og:title" content="SoulMate" />
+    <meta
+      property="og:description"
+      content="매일 마음을 기록하는 나만의 AI 친구, Soulmate"
+    />
     <link rel="preconnect" href="https://fonts.googleapis.com" />
     <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
     <link

diff --git a/public/images/meta.png b/public/images/meta.png
diff --git a/src/App.tsx b/src/App.tsx
@@ -11,6 +11,7 @@ import ChatPage from "./pages/chatting/ChatPage";
 import styled from "styled-components";
 import WritingPage from "./pages/writing/WritingPage";
 import Testpage from "./pages/Testpage";
+import EditPage from "./pages/writing/EditPage";
 
 function App() {
   return (
@@ -24,6 +25,7 @@ function App() {
           <Route path="/setChatting" element={<SettingPage />} />
           <Route path="/chat/:chatId/:character" element={<ChatPage />} />
           <Route path="/writing" element={<WritingPage />} />
+          <Route path="/edit/:chatId" element={<EditPage />} />
 
           <Route path="/comments" element={<Comments />} />
           <Route path="/hashtags" element={<Hashtags />} />

diff --git a/src/pages/DiaryDetail.tsx b/src/pages/DiaryDetail.tsx
@@ -1,5 +1,5 @@
 import styled from "styled-components";
-import { IoHomeOutline } from "react-icons/io5";
+import { IoHomeOutline, IoTrashBinOutline } from "react-icons/io5";
 import { BsPencil } from "react-icons/bs";
 import { useNavigate, useParams } from "react-router-dom";
 import { useEffect, useState } from "react";
@@ -62,7 +62,9 @@ const DiaryDetail = () => {
       <Header>
         <HomeIcon onClick={() => navigate("/")} />
         <DateText>{formatDate(diary.date)}</DateText>
-        <EditIcon onClick={() => navigate(`/edit/${diary.id}`)} />
+        <TrashIcon onClick={() => alert("삭제 기능은 준비 중입니다.")} />
+        <EditIcon onClick={() => alert("수정 기능은 준비 중입니다.")} />
+        {/* <EditIcon onClick={() => navigate(`/edit/${diary.id}`)} /> */}
       </Header>
 
       <Body>
@@ -127,6 +129,16 @@ const HomeIcon = styled(IoHomeOutline)`
   color: #1e2a52;
 `;
 
+const TrashIcon = styled(IoTrashBinOutline)`
+  position: absolute;
+  top: 50%;
+  right: 56px;
+  transform: translateY(-50%);
+  font-size: 20px;
+  color: #1e2a52;
+  size: 40px;
+`;
+
 const EditIcon = styled(BsPencil)`
   position: absolute;
   top: 50%;

diff --git a/src/pages/writing/EditPage.tsx b/src/pages/writing/EditPage.tsx
@@ -0,0 +1,5 @@
+const EditPage = () => {
+  return <div>일기 수정 기능은 준비 중입니다.</div>;
+};
+
+export default EditPage;
diff --git a/src/pages/writing/WritingPage.tsx b/src/pages/writing/WritingPage.tsx
@@ -3,19 +3,40 @@ import styled from "styled-components";
 import { BsArrowRight } from "react-icons/bs";
 import { IoHomeOutline } from "react-icons/io5";
 import { useNavigate } from "react-router-dom";
+import { postWritingDiary } from "../../services/apis/diary/writing";
 
 const WritingPage = () => {
   const [title, setTitle] = useState("");
   const [tags, setTags] = useState("");
   const [content, setContent] = useState("");
   const navigate = useNavigate();
 
+  const handleSubmit = async () => {
+    const confirmed = window.confirm("작성을 종료하시겠습니까?");
+    if (!confirmed) return;
+    try {
+      const response = await postWritingDiary({
+        date: "2025-05-30",
+        title,
+        content,
+        hashtag: tags,
+        character: "앙글이",
+      });
+
+      // 예: 생성된 일기의 ID가 response.data.id에 있다고 가정
+      navigate(`/diary/${response.data.id}`);
+    } catch (error) {
+      console.error("일기 저장 실패:", error);
+      alert("일기 저장 중 오류가 발생했습니다.");
+    }
+  };
+
   return (
     <Container>
       <Header>
         <HomeIcon onClick={() => navigate("/")} />
         <DateText>2025.05.01.</DateText>
-        <ArrowIcon onClick={() => navigate("/diary/1")} />
+        <ArrowIcon onClick={handleSubmit} />
       </Header>
       <Body>
         <TextInput

diff --git a/src/services/apis/diary/writing.ts b/src/services/apis/diary/writing.ts
@@ -0,0 +1,21 @@
+import { CreateAxiosInstanceWithToken } from "../axiosInstanceWithToken";
+
+const axiosInstanceWithToken = CreateAxiosInstanceWithToken();
+
+export async function postWritingDiary(diaryData: {
+  date: string;
+  title: string;
+  content: string;
+  hashtag: string;
+  character: string;
+}) {
+  try {
+    const response = await axiosInstanceWithToken.post(
+      `/api/diary/create`,
+      diaryData,
+    );
+    return response;
+  } catch (error) {
+    throw error;
+  }
+}