From e624cd0d476fbc76e50929cb36a9c0ef899a724b Mon Sep 17 00:00:00 2001 From: dbwhdtjr0457 Date: Wed, 29 Nov 2023 19:17:26 +0900 Subject: [PATCH] =?UTF-8?q?feat:=20=EC=9D=BC=EA=B8=B0=20=EC=88=98=EC=A0=95?= =?UTF-8?q?=20=EC=8B=9C=20=EB=AA=A8=EC=96=91=20=EC=B6=9C=EB=A0=A5=ED=95=98?= =?UTF-8?q?=EA=B3=A0,=20=EB=AA=A8=EC=96=91=20=EC=84=A0=ED=83=9D=20?= =?UTF-8?q?=ED=9B=84=20=EC=A0=80=EC=9E=A5=20=EC=8B=9C=20=EB=B0=98=EC=98=81?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- FE/.eslintrc.js | 1 + .../components/DiaryModal/DiaryCreateModal.js | 3 +- .../components/DiaryModal/DiaryListModal.js | 3 ++ .../components/DiaryModal/DiaryReadModal.js | 18 ++++--- .../components/DiaryModal/DiaryUpdateModal.js | 48 ++++++++----------- FE/src/components/LoginModal/LoginModal.js | 4 +- 6 files changed, 36 insertions(+), 41 deletions(-) diff --git a/FE/.eslintrc.js b/FE/.eslintrc.js index e753391..38162b2 100644 --- a/FE/.eslintrc.js +++ b/FE/.eslintrc.js @@ -27,5 +27,6 @@ module.exports = { "react/jsx-filename-extension": [1, { extensions: [".js", ".jsx"] }], "react/prop-types": "off", "import/no-extraneous-dependencies": ["off"], + "react/no-danger": "off", }, }; diff --git a/FE/src/components/DiaryModal/DiaryCreateModal.js b/FE/src/components/DiaryModal/DiaryCreateModal.js index e5116bc..49c9765 100644 --- a/FE/src/components/DiaryModal/DiaryCreateModal.js +++ b/FE/src/components/DiaryModal/DiaryCreateModal.js @@ -17,7 +17,7 @@ function DiaryCreateModal(props) { const setDiaryState = useSetRecoilState(diaryAtom); // TODO: 날짜 선택 기능 구현 - const [diaryData, setDiaryData] = React.useState({ + const [diaryData, setDiaryData] = useState({ title: "", content: "", date: "2023-11-19", @@ -176,7 +176,6 @@ function DiaryModalShapeSelectBox(props) { { - console.log(shape.uuid); setDiaryData((prev) => ({ ...prev, shapeUuid: shape.uuid })); }} > diff --git a/FE/src/components/DiaryModal/DiaryListModal.js b/FE/src/components/DiaryModal/DiaryListModal.js index 544e572..397d90e 100644 --- a/FE/src/components/DiaryModal/DiaryListModal.js +++ b/FE/src/components/DiaryModal/DiaryListModal.js @@ -1,3 +1,5 @@ +/* eslint-disable */ + import React, { useEffect, useLayoutEffect } from "react"; import styled from "styled-components"; import { useRecoilState } from "recoil"; @@ -19,6 +21,7 @@ function DiaryListModal() { setDiaryState((prev) => ({ ...prev, diaryUuid: selectedDiary?.uuid, + diaryPoint: `${selectedDiary?.coordinate.x},${selectedDiary?.coordinate.y},${selectedDiary?.coordinate.z}`, })); } }, [selectedDiary]); diff --git a/FE/src/components/DiaryModal/DiaryReadModal.js b/FE/src/components/DiaryModal/DiaryReadModal.js index da86dcf..494476c 100644 --- a/FE/src/components/DiaryModal/DiaryReadModal.js +++ b/FE/src/components/DiaryModal/DiaryReadModal.js @@ -1,6 +1,4 @@ -/*eslint-disable*/ - -import React, { useEffect } from "react"; +import React from "react"; import { useQuery } from "react-query"; import styled from "styled-components"; import { useRecoilState, useRecoilValue } from "recoil"; @@ -64,12 +62,12 @@ function DiaryReadModal(props) { "diary", () => getDiary(userState.accessToken, diaryState.diaryUuid), { - onSuccess: (data) => { - const shapeData = shapeState.find((item) => { - return item.uuid === data.shapeUuid; - }); - if (shapeData) { - setShapeData(shapeData.data); + onSuccess: (loadedData) => { + const foundShapeData = shapeState.find( + (item) => item.uuid === loadedData.shapeUuid, + ); + if (foundShapeData) { + setShapeData(foundShapeData.data); } }, }, @@ -162,7 +160,7 @@ function DiaryReadModal(props) {
+ /> {diaryState.isDelete ? : null} diff --git a/FE/src/components/DiaryModal/DiaryUpdateModal.js b/FE/src/components/DiaryModal/DiaryUpdateModal.js index 3c8fedd..85d34df 100644 --- a/FE/src/components/DiaryModal/DiaryUpdateModal.js +++ b/FE/src/components/DiaryModal/DiaryUpdateModal.js @@ -1,22 +1,14 @@ -import React, { useEffect, useRef } from "react"; +import React, { useState, useEffect, useRef } from "react"; import { useRecoilState, useRecoilValue } from "recoil"; import { useMutation, useQuery } from "react-query"; import styled from "styled-components"; import userAtom from "../../atoms/userAtom"; import diaryAtom from "../../atoms/diaryAtom"; +import shapeAtom from "../../atoms/shapeAtom"; import ModalWrapper from "../../styles/Modal/ModalWrapper"; import DiaryModalHeader from "../../styles/Modal/DiaryModalHeader"; import deleteIcon from "../../assets/deleteIcon.svg"; -async function getShapeFn() { - return fetch("http://223.130.129.145:3005/shapes/default", { - method: "GET", - headers: { - "Content-Type": "application/json", - }, - }).then((res) => res.json()); -} - async function getDiary(accessToken, diaryUuid) { return fetch(`http://223.130.129.145:3005/diaries/${diaryUuid}`, { method: "GET", @@ -32,17 +24,17 @@ function DiaryUpdateModal(props) { const { refetch } = props; const titleRef = useRef(null); const contentRef = useRef(null); - const [isInput, setIsInput] = React.useState(true); + const [isInput, setIsInput] = useState(true); const userState = useRecoilValue(userAtom); const [diaryState, setDiaryState] = useRecoilState(diaryAtom); - const [diaryData, setDiaryData] = React.useState({ - title: "test", - content: "test", - date: "2023-11-20", + const [diaryData, setDiaryData] = useState({ + uuid: diaryState.diaryUuid, + title: "", + content: "", + date: "2023-11-19", point: diaryState.diaryPoint, tags: [], - shapeUuid: "cf3a074a-0707-40c4-a598-c7c17a654476", - uuid: diaryState.diaryUuid, + shapeUuid: "", }); async function updateDiaryFn(data) { @@ -99,12 +91,6 @@ function DiaryUpdateModal(props) { setDiaryData({ ...diaryData, tags: diaryData.tags.slice(0, -1) }); }; - const { - data: shapeData, - // isLoading: shapeIsLoading, - // isError: shapeIsError, - } = useQuery("shape", getShapeFn); - const { mutate: updateDiary, // isLoading: diaryIsLoading, @@ -206,7 +192,7 @@ function DiaryUpdateModal(props) { }} /> - + delete @@ -228,7 +214,8 @@ function DiaryUpdateModal(props) { } function DiaryModalShapeSelectBox(props) { - const { shapeData } = props; + const { setDiaryData } = props; + const shapeState = useRecoilValue(shapeAtom); return ( @@ -237,9 +224,14 @@ function DiaryModalShapeSelectBox(props) { 직접 그리기 - {shapeData?.map((shape) => ( - - {shape.shapePath} + {shapeState?.map((shape) => ( + { + setDiaryData((prev) => ({ ...prev, shapeUuid: shape.uuid })); + }} + > +
))} diff --git a/FE/src/components/LoginModal/LoginModal.js b/FE/src/components/LoginModal/LoginModal.js index 261364c..b86036b 100644 --- a/FE/src/components/LoginModal/LoginModal.js +++ b/FE/src/components/LoginModal/LoginModal.js @@ -95,7 +95,9 @@ function LoginModal() { { + setKeepLogin((prev) => !prev); + }} />
로그인 유지