From 2341700eb729d83bc4cf558020dde2e18ece3dc8 Mon Sep 17 00:00:00 2001 From: "wl990@naver.com" Date: Thu, 20 Feb 2025 17:12:55 +0900 Subject: [PATCH 01/13] =?UTF-8?q?design=20:=20=EC=B9=B4=ED=85=8C=EA=B3=A0?= =?UTF-8?q?=EB=A6=AC=20=EB=B2=84=ED=8A=BC=20=EC=82=AC=EC=9D=B4=EC=A6=88=20?= =?UTF-8?q?full=EB=A1=9C=20=EB=B3=80=EA=B2=BD?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/pages/Write/CategorySelect.tsx | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/src/pages/Write/CategorySelect.tsx b/src/pages/Write/CategorySelect.tsx index 9e80bd2..23bdcfa 100644 --- a/src/pages/Write/CategorySelect.tsx +++ b/src/pages/Write/CategorySelect.tsx @@ -66,13 +66,13 @@ export default function CategorySelect({ {send || prevLetter ? ( 홈으로 돌아가기 ) : ( + + ))} + + + ); +} diff --git a/src/pages/Admin/components/WrapperBox.tsx b/src/pages/Admin/components/WrapperBox.tsx new file mode 100644 index 0000000..d47cf98 --- /dev/null +++ b/src/pages/Admin/components/WrapperBox.tsx @@ -0,0 +1,9 @@ +import { ReactNode } from 'react'; + +export default function WrapperBox({ children }: { children: ReactNode }) { + return ( +
+ {children} +
+ ); +} diff --git a/src/pages/Admin/index.tsx b/src/pages/Admin/index.tsx new file mode 100644 index 0000000..d619662 --- /dev/null +++ b/src/pages/Admin/index.tsx @@ -0,0 +1,82 @@ +import { AlarmIcon, ArrowDownIcon } from '@/assets/icons'; +import { Outlet } from 'react-router'; + +const AdminPage = () => { + return ( +
+
+
+ 로고 +
+
+ 로그인된 계정 + {'admin123@test.com'} +
+
+
+ 사이트 관리 + +
+ +
+ +
+ +
+ +
+ +
+ + +
+
+ +
+ +
+ + + +
+
+
+ +
+
+
+
+ 사용자 목록 +
+
+ +
+
+
+ ); +}; +export default AdminPage; diff --git a/src/styles/components.css b/src/styles/components.css index bd4041c..0b0d980 100644 --- a/src/styles/components.css +++ b/src/styles/components.css @@ -29,4 +29,8 @@ linear-gradient(180deg, #ffedae 0%, #eec297 100%); background-blend-mode: overlay, normal; } + + .wrapper-box-shadow { + box-shadow: 0px 0px 10px 0px rgba(0, 0, 0, 0.25); + } } diff --git a/src/styles/typography.css b/src/styles/typography.css index 045f203..d09a879 100644 --- a/src/styles/typography.css +++ b/src/styles/typography.css @@ -11,12 +11,36 @@ line-height: 36px; } + .h2-r { + font-size: 24px; + font-weight: 400; + line-height: 36px; + } + + .h2-l { + font-size: 24px; + font-weight: 300; + line-height: 36px; + } + .h3-b { font-size: 20px; font-weight: 700; line-height: 30px; } + .h3-sb { + font-size: 20px; + font-weight: 600; + line-height: 30px; + } + + .h3-r { + font-size: 20px; + font-weight: 400; + line-height: 30px; + } + .body-l-b { font-size: 16px; font-weight: 700; From 38757ae725fe8944ee0558d1d72f39ccaef9e0ae Mon Sep 17 00:00:00 2001 From: "wl990@naver.com" Date: Fri, 21 Feb 2025 22:00:33 +0900 Subject: [PATCH 05/13] =?UTF-8?q?design:=EA=B4=80=EB=A6=AC=EC=9E=90=20?= =?UTF-8?q?=ED=8E=98=EC=9D=B4=EC=A7=80=20=ED=8D=BC=EB=B8=94=EB=A6=AC?= =?UTF-8?q?=EC=8B=B1?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/App.tsx | 8 +- src/pages/Admin/Report.tsx | 139 ++++++++++++++++++ src/pages/Admin/admin.d.ts | 31 ++++ src/pages/Admin/components/DetailFrame.tsx | 27 ++++ src/pages/Admin/components/ListItem.tsx | 43 ++++++ src/pages/Admin/components/MenuModal.tsx | 27 ++++ src/pages/Admin/components/Report.tsx | 79 ---------- .../{WrapperBox.tsx => WrapperFrame.tsx} | 2 +- src/pages/Admin/index.tsx | 11 +- 9 files changed, 278 insertions(+), 89 deletions(-) create mode 100644 src/pages/Admin/Report.tsx create mode 100644 src/pages/Admin/admin.d.ts create mode 100644 src/pages/Admin/components/DetailFrame.tsx create mode 100644 src/pages/Admin/components/ListItem.tsx create mode 100644 src/pages/Admin/components/MenuModal.tsx delete mode 100644 src/pages/Admin/components/Report.tsx rename src/pages/Admin/components/{WrapperBox.tsx => WrapperFrame.tsx} (69%) diff --git a/src/App.tsx b/src/App.tsx index a808367..b039ae8 100644 --- a/src/App.tsx +++ b/src/App.tsx @@ -2,6 +2,9 @@ import { Route, Routes } from 'react-router'; import useViewport from './hooks/useViewport'; import Layout from './layouts/Layout'; +import MobileLayout from './layouts/MobileLayout'; +import AdminPage from './pages/Admin'; +import ReportManage from './pages/Admin/Report'; import Home from './pages/Home'; import Landing from './pages/Landing'; import LetterBoardPage from './pages/LetterBoard'; @@ -16,16 +19,13 @@ import OnboardingPage from './pages/Onboarding'; import RandomLettersPage from './pages/RandomLetters'; import RollingPaperPage from './pages/RollingPaper'; import WritePage from './pages/Write'; -import AdminPage from './pages/Admin'; -import MobileLayout from './layouts/MobileLayout'; -import ReportManage from './pages/Admin/components/Report'; const App = () => { useViewport(); return ( - }> + }> } /> } /> } /> diff --git a/src/pages/Admin/Report.tsx b/src/pages/Admin/Report.tsx new file mode 100644 index 0000000..918e96c --- /dev/null +++ b/src/pages/Admin/Report.tsx @@ -0,0 +1,139 @@ +import { useEffect, useState } from 'react'; + +import { client } from '@/apis/client'; +import { AlarmIcon } from '@/assets/icons'; + +import DetailFrame from './components/DetailFrame'; +import ListItem from './components/ListItem'; +import WrapperFrame from './components/WrapperFrame'; + +export default function ReportManage() { + const [detailModalOpen, setDetailModalOpen] = useState(false); + // { + // id: '001', + // reporterEmail: 'user1@gmail.com', + // targetEmail: 'user22@gmail.com', + // reportedAt: new Date(2025, 1, 20), + // letterId:2001, + // sharePostId:null, + // eventId:null, + // reportType:'LETTER', + // reason:"ABUSE", + // reasonDetail:null, + // status: 'PENDING', + // }, + const DUMMY = [ + { + id: '001', + reporterEmail: 'user1fawfaws@gmail.com', + targetEmail: 'faw5f1a5w6@gmail.com', + reportedAt: new Date(2020, 12, 4), + reason: '욕설', + }, + { + id: '002', + reporterEmail: 'user1fawfaws@gmail.com', + targetEmail: 'faw5f1a5w6@gmail.com', + reportedAt: new Date(2020, 12, 4), + reason: '욕설', + }, + { + id: '003', + reporterEmail: 'fa5w6f1a5f1w6@gmail.com', + targetEmail: 'afwf@gmail.com', + reportedAt: new Date(2000, 6, 23), + reason: '욕설', + }, + { + id: '004', + reporterEmail: 'a@gmail.com', + targetEmail: 'a1f515wa6@gmail.com', + reportedAt: new Date(1080, 11, 5), + reason: '욕설', + }, + { + id: '005', + reporterEmail: 'aa@gmail.com', + targetEmail: 'w@gmail.com', + reportedAt: new Date(2040, 1, 2), + reason: '욕설', + }, + { + id: '006', + reporterEmail: 'a5w1f65a@gmail.com', + targetEmail: 'aw1f56a1f5aw16@gmail.com', + reportedAt: new Date(2025, 1, 23), + reason: '욕설', + }, + ]; + const modalContents = [ + { + title: '신고 목록 삭제', + onClick: () => { + console.log('삭제'); + }, + }, + { + title: '작성자 활동 정지', + onClick: () => { + console.log('정지'); + }, + }, + ]; + const [allReports, setAllReports] = useState(); + useEffect(() => { + const getAllReports = async () => { + const res = await client.get('/api/reports'); + console.log(res); + }; + getAllReports(); + const getReportDetail = async () => { + const res = await client.get('/api/reports/2'); + console.log(res); + }; + getReportDetail(); + const postReport = async () => { + const res = await client.post('/api/reports', { + letterId: 2010, + reportType: 'POST', + reason: 'HARASSMENT', + reasonDetail: '테스트용', + }); + console.log(res); + }; + postReport(); + }, []); + return ( + + + 신고 편지 목록 + +
+
+
+ ID + 제보자 이메일 + 작성자 이메일 + 제보 일자 + 제보 사유 +
+
+ {DUMMY.map((data, idx) => ( + + ))} +
+ {detailModalOpen && ( + + <> + 제보 편지 상세 조회 + + + )} + + ); +} diff --git a/src/pages/Admin/admin.d.ts b/src/pages/Admin/admin.d.ts new file mode 100644 index 0000000..e50f82d --- /dev/null +++ b/src/pages/Admin/admin.d.ts @@ -0,0 +1,31 @@ +interface Report { + id: number; + reporterEmail: string; + targetEmail: string; + reportedAt: Date; + letterId: number | null; + comment: string | null; + sharePostId: number | null; + reportType: 'LETTER' | 'POST' | 'COMMENT'; + reason: 'ABUSE' | 'DEFAMATION' | 'HARASSMENT' | 'THREATS' | 'ETC'; + reasonDetail: string | null; + status: 'PENDING' | 'RESOLVED' | 'REJECTED'; +} + +interface ReportDetail { + id: number; + memberId: number | null; + letterId: number | null; + sharePostId: number | null; + eventId: number | null; + reportType: 'LETTER' | 'POST' | 'COMMENT' | 'EVENT'; + reason: 'ABUSE' | 'DEFAMATION' | 'HARASSMENT' | 'THREATS' | 'ETC'; + reasonDetail: string | null; + status: 'PENDING' | 'RESOLVED' | 'REJECTED'; + reportedAt: Date; + createdAt: Date; + letterDetail: { + title: string; + content: string; + }; +} diff --git a/src/pages/Admin/components/DetailFrame.tsx b/src/pages/Admin/components/DetailFrame.tsx new file mode 100644 index 0000000..505d494 --- /dev/null +++ b/src/pages/Admin/components/DetailFrame.tsx @@ -0,0 +1,27 @@ +import { ReactNode, useRef } from 'react'; + +export default function DetailFrame({ + children, + closeEvent, +}: { + children: ReactNode; + closeEvent: React.Dispatch>; +}) { + const contentRef = useRef(null); + const handleOutsideClick = (e: React.MouseEvent) => { + if (e.target !== contentRef.current) closeEvent(false); + }; + return ( +
handleOutsideClick(e)} + > +
+ {children} +
+
+ ); +} diff --git a/src/pages/Admin/components/ListItem.tsx b/src/pages/Admin/components/ListItem.tsx new file mode 100644 index 0000000..a9eca5b --- /dev/null +++ b/src/pages/Admin/components/ListItem.tsx @@ -0,0 +1,43 @@ +import { useState } from 'react'; + +import { KebobMenuIcon } from '@/assets/icons'; + +import MenuModal from './MenuModal'; + +interface DataProps { + id: string; + reporterEmail: string; + targetEmail: string; + reportedAt: Date; + reason: string; +} +interface ModalContents { + title: string; + onClick: () => void; +} +export default function ListItem({ + data, + modalContents, + setDetailModalOpen, +}: { + data: DataProps; + modalContents: ModalContents[]; + setDetailModalOpen: React.Dispatch>; +}) { + const [modalOpen, setModalOpen] = useState(false); + return ( +
+
setDetailModalOpen(true)}> + {data.id} + {data.reporterEmail} + {data.targetEmail} + {`${data.reportedAt.getFullYear()}.${data.reportedAt.getMonth()}.${data.reportedAt.getDay()}`} + {data.reason} +
+ + {modalOpen && } +
+ ); +} diff --git a/src/pages/Admin/components/MenuModal.tsx b/src/pages/Admin/components/MenuModal.tsx new file mode 100644 index 0000000..ea900eb --- /dev/null +++ b/src/pages/Admin/components/MenuModal.tsx @@ -0,0 +1,27 @@ +interface ModalContents { + title: string; + onClick: () => void; +} +export default function MenuModal({ + modalContents, + setModalOpen, +}: { + modalContents: ModalContents[]; + setModalOpen: React.Dispatch>; +}) { + return ( +
+ {modalContents.map((content, idx) => ( + + ))} +
+ ); +} diff --git a/src/pages/Admin/components/Report.tsx b/src/pages/Admin/components/Report.tsx deleted file mode 100644 index 9d3f484..0000000 --- a/src/pages/Admin/components/Report.tsx +++ /dev/null @@ -1,79 +0,0 @@ -import { AlarmIcon } from '@/assets/icons'; -import WrapperBox from './WrapperBox'; - -export default function ReportManage() { - const DUMMY = [ - { - id: '001', - reporterEmail: 'user1@gmail.com', - editorEmail: 'user22@gmail.com', - reportedAt: new Date(2025, 1, 20), - reason: '욕설', - }, - { - id: '002', - reporterEmail: 'user1fawfaws@gmail.com', - editorEmail: 'faw5f1a5w6@gmail.com', - reportedAt: new Date(2020, 12, 4), - reason: '욕설', - }, - { - id: '003', - reporterEmail: 'fa5w6f1a5f1w6@gmail.com', - editorEmail: 'afwf@gmail.com', - reportedAt: new Date(2000, 6, 23), - reason: '욕설', - }, - { - id: '004', - reporterEmail: 'a@gmail.com', - editorEmail: 'a1f515wa6@gmail.com', - reportedAt: new Date(1080, 11, 5), - reason: '욕설', - }, - { - id: '005', - reporterEmail: 'aa@gmail.com', - editorEmail: 'w@gmail.com', - reportedAt: new Date(2040, 1, 2), - reason: '욕설', - }, - { - id: '006', - reporterEmail: 'a5w1f65a@gmail.com', - editorEmail: 'aw1f56a1f5aw16@gmail.com', - reportedAt: new Date(2025, 1, 23), - reason: '욕설', - }, - ]; - return ( - - - 신고 편지 목록 - -
-
-
- ID - 제보자 이메일 - 작성자 이메일 - 제보 일자 - 제보 사유 -
-
- {DUMMY.map((data) => ( -
-
- {data.id} - {data.reporterEmail} - {data.editorEmail} - {`${data.reportedAt.getFullYear()}.${data.reportedAt.getMonth()}.${data.reportedAt.getDay()}`} - {data.reason} -
- -
- ))} -
- - ); -} diff --git a/src/pages/Admin/components/WrapperBox.tsx b/src/pages/Admin/components/WrapperFrame.tsx similarity index 69% rename from src/pages/Admin/components/WrapperBox.tsx rename to src/pages/Admin/components/WrapperFrame.tsx index d47cf98..4c87de5 100644 --- a/src/pages/Admin/components/WrapperBox.tsx +++ b/src/pages/Admin/components/WrapperFrame.tsx @@ -1,6 +1,6 @@ import { ReactNode } from 'react'; -export default function WrapperBox({ children }: { children: ReactNode }) { +export default function WrapperFrame({ children }: { children: ReactNode }) { return (
{children} diff --git a/src/pages/Admin/index.tsx b/src/pages/Admin/index.tsx index d619662..681164f 100644 --- a/src/pages/Admin/index.tsx +++ b/src/pages/Admin/index.tsx @@ -1,11 +1,12 @@ -import { AlarmIcon, ArrowDownIcon } from '@/assets/icons'; import { Outlet } from 'react-router'; +import { AlarmIcon, ArrowDownIcon } from '@/assets/icons'; + const AdminPage = () => { return ( -
-
-
+
+
+
로고
@@ -68,7 +69,7 @@ const AdminPage = () => {
-
+
사용자 목록
From a181914206574721d518c49b6c050f4751611e54 Mon Sep 17 00:00:00 2001 From: "wl990@naver.com" Date: Fri, 21 Feb 2025 22:09:01 +0900 Subject: [PATCH 06/13] =?UTF-8?q?refactor=20:=20=ED=8F=B0=ED=8A=B8=20?= =?UTF-8?q?=EC=84=A0=ED=83=9D=20=EB=AA=A8=EB=8B=AC=20=EC=95=84=EC=9D=B4?= =?UTF-8?q?=EC=BD=98=20svgr=20=EB=B3=80=EA=B2=BD=20+=20=EB=AA=A9API=20?= =?UTF-8?q?=ED=98=95=EC=8B=9D=EC=97=90=20=EB=A7=9E=EC=B6=B0=20=ED=83=80?= =?UTF-8?q?=EC=9E=85=20=EC=88=98=EC=A0=95=20+=20API=20=EC=97=B0=EA=B2=B0?= =?UTF-8?q?=20=EC=9E=91=EC=97=85=2090%=20=EC=99=84=EB=A3=8C?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/apis/write.ts | 29 +++++++ src/assets/icons/check.svg | 17 +++++ src/assets/icons/index.ts | 4 + src/assets/icons/kebob-menu.svg | 3 + src/components/ResultLetter.tsx | 8 +- src/pages/Write/CategorySelect.tsx | 40 +++++++--- src/pages/Write/LetterEditor.tsx | 9 ++- src/pages/Write/OptionSlide.tsx | 25 +++--- src/pages/Write/components/CategoryList.tsx | 2 +- src/pages/Write/components/CategoryStamp.tsx | 10 +-- src/pages/Write/components/CheckIcon.tsx | 23 ------ src/pages/Write/components/FontOption.tsx | 39 +++------- .../Write/components/PreviousLetterOption.tsx | 6 +- .../components/ResultLetterAnimation.tsx | 4 +- src/pages/Write/components/ThemeOption.tsx | 12 +-- src/pages/Write/constants/index.ts | 76 +++++++++++++------ src/pages/Write/index.tsx | 52 ++++++++----- src/stores/writeStore.ts | 42 ++++++---- src/types/write.d.ts | 70 ++++++++++++----- 19 files changed, 295 insertions(+), 176 deletions(-) create mode 100644 src/apis/write.ts create mode 100644 src/assets/icons/check.svg create mode 100644 src/assets/icons/kebob-menu.svg delete mode 100644 src/pages/Write/components/CheckIcon.tsx diff --git a/src/apis/write.ts b/src/apis/write.ts new file mode 100644 index 0000000..4b16d42 --- /dev/null +++ b/src/apis/write.ts @@ -0,0 +1,29 @@ +import { client } from './client'; + +const postLetterApi = async ( + data: LetterRequest, + setState: React.Dispatch>, +) => { + try { + const res = await client.post('/api/letters', data); + setState(true); + console.log(res); + } catch (error) { + console.error(error); + } +}; + +const getPrevLetter = async ( + setPrevLetterState: React.Dispatch>, + searchParams: URLSearchParams, +) => { + try { + const res = await client.get(`/api/letters/${searchParams.get('letterId')}/previous`); + setPrevLetterState(res.data.data); + console.log(res); + } catch (error) { + console.error(error); + } +}; + +export { postLetterApi, getPrevLetter }; diff --git a/src/assets/icons/check.svg b/src/assets/icons/check.svg new file mode 100644 index 0000000..d7b785a --- /dev/null +++ b/src/assets/icons/check.svg @@ -0,0 +1,17 @@ + + + + + + + + \ No newline at end of file diff --git a/src/assets/icons/index.ts b/src/assets/icons/index.ts index 664fb6b..d0f09f4 100644 --- a/src/assets/icons/index.ts +++ b/src/assets/icons/index.ts @@ -2,12 +2,14 @@ import AlarmIcon from './alarm.svg?react'; import ArrowDownIcon from './arrow-down.svg?react'; import ArrowLeftIcon from './arrow-left.svg?react'; import BoardIcon from './board.svg?react'; +import CheckIcon from './check.svg?react'; import CloudIcon from './cloud.svg?react'; import DeleteIcon from './delete.svg?react'; import EnvelopeIcon from './envelope.svg?react'; import GoogleIcon from './google.svg?react'; import InformationIcon from './information.svg?react'; import KakaoIcon from './kakao.svg?react'; +import KebobMenuIcon from './kebob-menu.svg?react'; import LikeFilledIcon from './like-filled.svg?react'; import LikeOutlinedIcon from './like-outlined.svg?react'; import NaverIcon from './naver.svg?react'; @@ -27,10 +29,12 @@ export { GoogleIcon, StampIcon, AlarmIcon, + CheckIcon, ArrowDownIcon, PersonIcon, ArrowLeftIcon, InformationIcon, + KebobMenuIcon, EnvelopeIcon, BoardIcon, RestartIcon, diff --git a/src/assets/icons/kebob-menu.svg b/src/assets/icons/kebob-menu.svg new file mode 100644 index 0000000..32857ac --- /dev/null +++ b/src/assets/icons/kebob-menu.svg @@ -0,0 +1,3 @@ + + + \ No newline at end of file diff --git a/src/components/ResultLetter.tsx b/src/components/ResultLetter.tsx index 4fa14ed..87c2dc2 100644 --- a/src/components/ResultLetter.tsx +++ b/src/components/ResultLetter.tsx @@ -1,12 +1,12 @@ import letterPink from '@/assets/images/letter-pink.png'; -import { STAMPS } from '../pages/Write/constants'; +import { CATEGORYS } from '../pages/Write/constants'; export default function ResultLetter({ - stampName = '위로와 공감', + categoryName = 'CONSOLATION', title, }: { - stampName: Stamp; + categoryName: Category; title: string; }) { const address = '1A3E2'; @@ -23,7 +23,7 @@ export default function ResultLetter({ 따숨이님께 {title}
- 우표 + 우표
{today} diff --git a/src/pages/Write/CategorySelect.tsx b/src/pages/Write/CategorySelect.tsx index 23bdcfa..2f8e81c 100644 --- a/src/pages/Write/CategorySelect.tsx +++ b/src/pages/Write/CategorySelect.tsx @@ -1,6 +1,7 @@ import { useState } from 'react'; import { Link } from 'react-router'; +import { postLetterApi } from '@/apis/write'; import PageTitle from '@/components/PageTitle'; import useWrite from '@/stores/writeStore'; @@ -13,16 +14,31 @@ export default function CategorySelect({ prevLetter, }: { setStep: React.Dispatch>; - prevLetter: PrevLetter; + prevLetter: PrevLetter[]; }) { + const letterTitle = useWrite((state) => state.letterTitle); + const letterText = useWrite((state) => state.letterText); + const category = useWrite((state) => state.category); + const paperType = useWrite((state) => state.paperType); + const fontType = useWrite((state) => state.fontType); + const [send, setSend] = useState(false); - const stamp = useWrite((state) => state.stamp); + const LETTER_REQUEST: LetterRequest = { + receiver: null, + parentLetterId: null, + title: letterTitle, + content: letterText, + category: category, + paperType: paperType, + fontType: fontType, + }; + return ( <>
- {!send && !prevLetter && ( + {!send && prevLetter.length <= 0 && ( { @@ -34,15 +50,17 @@ export default function CategorySelect({
- {send || prevLetter ? '편지 작성이 완료 되었어요!' : '어떤 답장을 받고 싶나요?'} + {send || prevLetter.length > 0 + ? '편지 작성이 완료 되었어요!' + : '어떤 답장을 받고 싶나요?'} {/* 카테고리 선택 컴포넌트 */} - {!send && !prevLetter && } + {!send && prevLetter.length <= 0 && } - {prevLetter && ( + {prevLetter.length > 0 && (
- +
작성하신 편지는 @@ -56,14 +74,14 @@ export default function CategorySelect({ {send && (
- + 두근두근! 답장이 언제 올까요?
)} - {send || prevLetter ? ( + {send || prevLetter.length > 0 ? ( { - if (stamp) { - setSend(true); + if (category) { + postLetterApi(LETTER_REQUEST, setSend); } else { alert('우표 선택을 해주세요'); } diff --git a/src/pages/Write/LetterEditor.tsx b/src/pages/Write/LetterEditor.tsx index 690d0f5..5d6b93b 100644 --- a/src/pages/Write/LetterEditor.tsx +++ b/src/pages/Write/LetterEditor.tsx @@ -4,6 +4,7 @@ import { twMerge } from 'tailwind-merge'; import useWrite from '@/stores/writeStore'; import WritePageButton from './components/WritePageButton'; +import { FONTS } from './constants'; import OptionSlide from './OptionSlide'; export default function LetterEditor({ @@ -11,11 +12,11 @@ export default function LetterEditor({ prevLetter, }: { setStep: React.Dispatch>; - prevLetter: PrevLetter; + prevLetter: PrevLetter[]; }) { const textareaRef = useRef(null); - const font = useWrite((state) => state.font); + const fontType = useWrite((state) => state.fontType); const letterTitle = useWrite((state) => state.letterTitle); const setLetterTitle = useWrite((state) => state.setLetterTitle); @@ -34,7 +35,7 @@ export default function LetterEditor({
- {prevLetter ? ( + {prevLetter.length > 0 ? ( { @@ -72,7 +73,7 @@ export default function LetterEditor({
FROM. {'12E12'} - +
); diff --git a/src/pages/Write/CategorySelect.tsx b/src/pages/Write/CategorySelect.tsx index 4c0dca6..fd339a1 100644 --- a/src/pages/Write/CategorySelect.tsx +++ b/src/pages/Write/CategorySelect.tsx @@ -94,6 +94,7 @@ export default function CategorySelect({ onClick={() => { if (category) { postLetter(LETTER_REQUEST, setSend); + // setSend(true); } else { alert('우표 선택을 해주세요'); } diff --git a/src/pages/Write/LetterEditor.tsx b/src/pages/Write/LetterEditor.tsx index 5d6b93b..9921f69 100644 --- a/src/pages/Write/LetterEditor.tsx +++ b/src/pages/Write/LetterEditor.tsx @@ -4,7 +4,7 @@ import { twMerge } from 'tailwind-merge'; import useWrite from '@/stores/writeStore'; import WritePageButton from './components/WritePageButton'; -import { FONTS } from './constants'; +import { FONT_TYPE_OBJ } from './constants'; import OptionSlide from './OptionSlide'; export default function LetterEditor({ @@ -73,7 +73,10 @@ export default function LetterEditor({