diff --git a/index.html b/index.html index ceebe3f..9d55c56 100644 --- a/index.html +++ b/index.html @@ -11,6 +11,34 @@ crossorigin href="https://cdn.jsdelivr.net/gh/orioncactus/pretendard@v1.3.9/dist/web/variable/pretendardvariable.min.css" /> + + + +
diff --git a/package.json b/package.json index b25cece..25f66ab 100644 --- a/package.json +++ b/package.json @@ -11,8 +11,6 @@ }, "dependencies": { "@egjs/react-infinitegrid": "^4.12.0", - "@emotion/react": "^11.14.0", - "@emotion/styled": "^11.14.0", "@mui/icons-material": "^6.4.4", "@mui/material": "^6.4.4", "@tailwindcss/vite": "^4.0.6", diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml index b22f4db..8689848 100644 --- a/pnpm-lock.yaml +++ b/pnpm-lock.yaml @@ -11,12 +11,6 @@ importers: '@egjs/react-infinitegrid': specifier: ^4.12.0 version: 4.12.0 - '@emotion/react': - specifier: ^11.14.0 - version: 11.14.0(@types/react@19.0.8)(react@18.3.1) - '@emotion/styled': - specifier: ^11.14.0 - version: 11.14.0(@emotion/react@11.14.0(@types/react@19.0.8)(react@18.3.1))(@types/react@19.0.8)(react@18.3.1) '@mui/icons-material': specifier: ^6.4.4 version: 6.4.4(@mui/material@6.4.4(@emotion/react@11.14.0(@types/react@19.0.8)(react@18.3.1))(@emotion/styled@11.14.0(@emotion/react@11.14.0(@types/react@19.0.8)(react@18.3.1))(@types/react@19.0.8)(react@18.3.1))(@types/react@19.0.8)(react-dom@18.3.1(react@18.3.1))(react@18.3.1))(@types/react@19.0.8)(react@18.3.1) @@ -2562,6 +2556,7 @@ snapshots: stylis: 4.2.0 transitivePeerDependencies: - supports-color + optional: true '@emotion/cache@11.14.0': dependencies: @@ -2576,6 +2571,7 @@ snapshots: '@emotion/is-prop-valid@1.3.1': dependencies: '@emotion/memoize': 0.9.0 + optional: true '@emotion/memoize@0.9.0': {} @@ -2594,6 +2590,7 @@ snapshots: '@types/react': 19.0.8 transitivePeerDependencies: - supports-color + optional: true '@emotion/serialize@1.3.3': dependencies: @@ -2619,12 +2616,14 @@ snapshots: '@types/react': 19.0.8 transitivePeerDependencies: - supports-color + optional: true '@emotion/unitless@0.10.0': {} '@emotion/use-insertion-effect-with-fallbacks@1.2.0(react@18.3.1)': dependencies: react: 18.3.1 + optional: true '@emotion/utils@1.4.2': {} @@ -3155,7 +3154,8 @@ snapshots: '@types/json5@0.0.29': {} - '@types/parse-json@4.0.2': {} + '@types/parse-json@4.0.2': + optional: true '@types/prop-types@15.7.14': {} @@ -3342,6 +3342,7 @@ snapshots: '@babel/runtime': 7.26.9 cosmiconfig: 7.1.0 resolve: 1.22.10 + optional: true balanced-match@1.0.2: {} @@ -3407,7 +3408,8 @@ snapshots: concat-map@0.0.1: {} - convert-source-map@1.9.0: {} + convert-source-map@1.9.0: + optional: true convert-source-map@2.0.0: {} @@ -3420,6 +3422,7 @@ snapshots: parse-json: 5.2.0 path-type: 4.0.0 yaml: 1.10.2 + optional: true cosmiconfig@8.3.6(typescript@5.7.3): dependencies: @@ -3783,7 +3786,8 @@ snapshots: dependencies: to-regex-range: 5.0.1 - find-root@1.1.0: {} + find-root@1.1.0: + optional: true find-up@5.0.0: dependencies: @@ -3906,6 +3910,7 @@ snapshots: hoist-non-react-statics@3.3.2: dependencies: react-is: 16.13.1 + optional: true ignore@5.3.2: {} @@ -4475,7 +4480,8 @@ snapshots: source-map-js@1.2.1: {} - source-map@0.5.7: {} + source-map@0.5.7: + optional: true string.prototype.trim@1.2.10: dependencies: @@ -4691,7 +4697,8 @@ snapshots: yallist@3.1.1: {} - yaml@1.10.2: {} + yaml@1.10.2: + optional: true yocto-queue@0.1.0: {} diff --git a/src/App.tsx b/src/App.tsx index cb7a312..306b1a0 100644 --- a/src/App.tsx +++ b/src/App.tsx @@ -1,3 +1,4 @@ +import { Suspense } from 'react'; import { Route, Routes } from 'react-router'; import useViewport from './hooks/useViewport'; @@ -29,6 +30,35 @@ import WritePage from './pages/Write'; import ShareApprovalPage from './pages/Share'; import useThemeStore from './stores/themeStore'; +// const Layout = lazy(() => import('./layouts/Layout')); +// const MobileLayout = lazy(() => import('./layouts/MobileLayout')); +// const PrivateRoute = lazy(() => import('./layouts/PrivateRoute')); +// const AuthCallbackPage = lazy(() => import('./pages/Auth')); + +// const AdminPage = lazy(() => import('./pages/Admin')); +// const FilteringManage = lazy(() => import('./pages/Admin/Filtering')); +// const ReportManage = lazy(() => import('./pages/Admin/Report')); +// const AdminRollingPaper = lazy(() => import('./pages/Admin/RollingPaper')); +// const AdminRoute = lazy(() => import('./layouts/AdminRoute')); +// const Home = lazy(() => import('./pages/Home')); +// const Landing = lazy(() => import('./pages/Landing')); +// const LetterBoardPage = lazy(() => import('./pages/LetterBoard')); +// const LetterBoardDetailPage = lazy(() => import('./pages/LetterBoardDetail')); +// const LetterBoxPage = lazy(() => import('./pages/LetterBox')); +// const LetterBoxDetailPage = lazy(() => import('./pages/LetterBoxDetail')); +// const LetterDetailPage = lazy(() => import('./pages/LetterDetail')); +// const LoginPage = lazy(() => import('./pages/Login')); +// const MyPage = lazy(() => import('./pages/MyPage')); +// const MyBoardPage = lazy(() => import('./pages/MyPage/components/MyBoardPage')); +// const NotFoundPage = lazy(() => import('./pages/NotFound')); +// const NotificationsPage = lazy(() => import('./pages/Notifications')); +// const OnboardingPage = lazy(() => import('./pages/Onboarding')); +// const RandomLettersPage = lazy(() => import('./pages/RandomLetters')); +// const RollingPaperPage = lazy(() => import('./pages/RollingPaper')); +// const WritePage = lazy(() => import('./pages/Write')); +// const ShareApprovalPage = lazy(() => import('./pages/Share')); +// const useThemeStore = lazy(() => import('./stores/themeStore')); + const App = () => { const theme = useThemeStore((state) => state.theme); useViewport(); @@ -44,49 +74,51 @@ const App = () => { initializeTheme(); return ( - - }> - } /> - } /> - } /> - } /> - } /> + 로딩중}> + + }> + } /> + } /> + } /> + } /> + } /> - }> - } /> - - }> - } /> - } /> - } /> + }> + } /> + + }> + } /> + } /> + } /> + + } /> + } /> - } /> - } /> - - - }> - } /> - } /> + + }> + } /> + } /> + + } /> + } /> + + }> + } /> + } /> + } /> - } /> - } /> - - }> - } /> - } /> - } /> - - }> - }> - } /> - } /> - } /> + }> + }> + } /> + } /> + } /> + - - + + ); }; diff --git a/src/assets/images/basic-theme.png b/src/assets/images/basic-theme.png deleted file mode 100644 index f99e6fe..0000000 Binary files a/src/assets/images/basic-theme.png and /dev/null differ diff --git a/src/assets/images/basic-theme.webp b/src/assets/images/basic-theme.webp new file mode 100644 index 0000000..8450192 Binary files /dev/null and b/src/assets/images/basic-theme.webp differ diff --git a/src/assets/images/celebration-stamp.png b/src/assets/images/celebration-stamp.png deleted file mode 100644 index f80d31d..0000000 Binary files a/src/assets/images/celebration-stamp.png and /dev/null differ diff --git a/src/assets/images/celebration-stamp.webp b/src/assets/images/celebration-stamp.webp new file mode 100644 index 0000000..eb217c5 Binary files /dev/null and b/src/assets/images/celebration-stamp.webp differ diff --git a/src/assets/images/celebration-theme-asset-bottom.png b/src/assets/images/celebration-theme-asset-bottom.png deleted file mode 100644 index 98a8fd2..0000000 Binary files a/src/assets/images/celebration-theme-asset-bottom.png and /dev/null differ diff --git a/src/assets/images/celebration-theme-asset-bottom.webp b/src/assets/images/celebration-theme-asset-bottom.webp new file mode 100644 index 0000000..e4f7edd Binary files /dev/null and b/src/assets/images/celebration-theme-asset-bottom.webp differ diff --git a/src/assets/images/celebration-theme-asset-side.png b/src/assets/images/celebration-theme-asset-side.png deleted file mode 100644 index 28c04ee..0000000 Binary files a/src/assets/images/celebration-theme-asset-side.png and /dev/null differ diff --git a/src/assets/images/celebration-theme-asset-side.webp b/src/assets/images/celebration-theme-asset-side.webp new file mode 100644 index 0000000..a7236d9 Binary files /dev/null and b/src/assets/images/celebration-theme-asset-side.webp differ diff --git a/src/assets/images/celebration.png b/src/assets/images/celebration.png deleted file mode 100644 index cfffc10..0000000 Binary files a/src/assets/images/celebration.png and /dev/null differ diff --git a/src/assets/images/celebration.webp b/src/assets/images/celebration.webp new file mode 100644 index 0000000..4b2ab42 Binary files /dev/null and b/src/assets/images/celebration.webp differ diff --git a/src/assets/images/closed-letter.png b/src/assets/images/closed-letter.png deleted file mode 100644 index d787dca..0000000 Binary files a/src/assets/images/closed-letter.png and /dev/null differ diff --git a/src/assets/images/closed-letter.webp b/src/assets/images/closed-letter.webp new file mode 100644 index 0000000..b909a76 Binary files /dev/null and b/src/assets/images/closed-letter.webp differ diff --git a/src/assets/images/congrat-theme.png b/src/assets/images/congrat-theme.png deleted file mode 100644 index 286d532..0000000 Binary files a/src/assets/images/congrat-theme.png and /dev/null differ diff --git a/src/assets/images/congrat-theme.webp b/src/assets/images/congrat-theme.webp new file mode 100644 index 0000000..66f1ee9 Binary files /dev/null and b/src/assets/images/congrat-theme.webp differ diff --git a/src/assets/images/consolation-stamp.png b/src/assets/images/consolation-stamp.png deleted file mode 100644 index a4c7090..0000000 Binary files a/src/assets/images/consolation-stamp.png and /dev/null differ diff --git a/src/assets/images/consolation-stamp.webp b/src/assets/images/consolation-stamp.webp new file mode 100644 index 0000000..cb183ee Binary files /dev/null and b/src/assets/images/consolation-stamp.webp differ diff --git a/src/assets/images/consolation.png b/src/assets/images/consolation.png deleted file mode 100644 index e44a027..0000000 Binary files a/src/assets/images/consolation.png and /dev/null differ diff --git a/src/assets/images/consolation.webp b/src/assets/images/consolation.webp new file mode 100644 index 0000000..f0686f2 Binary files /dev/null and b/src/assets/images/consolation.webp differ diff --git a/src/assets/images/consult-stamp.png b/src/assets/images/consult-stamp.png deleted file mode 100644 index 094d616..0000000 Binary files a/src/assets/images/consult-stamp.png and /dev/null differ diff --git a/src/assets/images/consult-stamp.webp b/src/assets/images/consult-stamp.webp new file mode 100644 index 0000000..e5fbe14 Binary files /dev/null and b/src/assets/images/consult-stamp.webp differ diff --git a/src/assets/images/consult.png b/src/assets/images/consult.png deleted file mode 100644 index e719e2b..0000000 Binary files a/src/assets/images/consult.png and /dev/null differ diff --git a/src/assets/images/consult.webp b/src/assets/images/consult.webp new file mode 100644 index 0000000..476ada8 Binary files /dev/null and b/src/assets/images/consult.webp differ diff --git a/src/assets/images/etc-stamp.png b/src/assets/images/etc-stamp.png deleted file mode 100644 index cc3f4dd..0000000 Binary files a/src/assets/images/etc-stamp.png and /dev/null differ diff --git a/src/assets/images/etc-stamp.webp b/src/assets/images/etc-stamp.webp new file mode 100644 index 0000000..5f4f1e4 Binary files /dev/null and b/src/assets/images/etc-stamp.webp differ diff --git a/src/assets/images/etc.png b/src/assets/images/etc.png deleted file mode 100644 index 76174c2..0000000 Binary files a/src/assets/images/etc.png and /dev/null differ diff --git a/src/assets/images/etc.webp b/src/assets/images/etc.webp new file mode 100644 index 0000000..18f88f0 Binary files /dev/null and b/src/assets/images/etc.webp differ diff --git a/src/assets/images/field-4-dark.png b/src/assets/images/field-4-dark.png deleted file mode 100644 index 0f6ab5b..0000000 Binary files a/src/assets/images/field-4-dark.png and /dev/null differ diff --git a/src/assets/images/field-theme-asset-bird-dark.png b/src/assets/images/field-theme-asset-bird-dark.png deleted file mode 100644 index ffaac1c..0000000 Binary files a/src/assets/images/field-theme-asset-bird-dark.png and /dev/null differ diff --git a/src/assets/images/field-theme-asset-bottom.png b/src/assets/images/field-theme-asset-bottom.png deleted file mode 100644 index 128e8c2..0000000 Binary files a/src/assets/images/field-theme-asset-bottom.png and /dev/null differ diff --git a/src/assets/images/field-theme-asset-bottom.webp b/src/assets/images/field-theme-asset-bottom.webp new file mode 100644 index 0000000..ea143ee Binary files /dev/null and b/src/assets/images/field-theme-asset-bottom.webp differ diff --git a/src/assets/images/field-theme.png b/src/assets/images/field-theme.png deleted file mode 100644 index 09978f8..0000000 Binary files a/src/assets/images/field-theme.png and /dev/null differ diff --git a/src/assets/images/field-theme.webp b/src/assets/images/field-theme.webp new file mode 100644 index 0000000..3776e9d Binary files /dev/null and b/src/assets/images/field-theme.webp differ diff --git a/src/assets/images/opened-letter-front.png b/src/assets/images/opened-letter-front.png deleted file mode 100644 index c326013..0000000 Binary files a/src/assets/images/opened-letter-front.png and /dev/null differ diff --git a/src/assets/images/opened-letter-front.webp b/src/assets/images/opened-letter-front.webp new file mode 100644 index 0000000..9f5bfa0 Binary files /dev/null and b/src/assets/images/opened-letter-front.webp differ diff --git a/src/assets/images/opened-letter.png b/src/assets/images/opened-letter.png deleted file mode 100644 index 5797b4a..0000000 Binary files a/src/assets/images/opened-letter.png and /dev/null differ diff --git a/src/assets/images/opened-letter.webp b/src/assets/images/opened-letter.webp new file mode 100644 index 0000000..c6fbfcc Binary files /dev/null and b/src/assets/images/opened-letter.webp differ diff --git a/src/assets/images/respondent-stamp.png b/src/assets/images/respondent-stamp.png deleted file mode 100644 index 2d58c20..0000000 Binary files a/src/assets/images/respondent-stamp.png and /dev/null differ diff --git a/src/assets/images/respondent-stamp.webp b/src/assets/images/respondent-stamp.webp new file mode 100644 index 0000000..59cc223 Binary files /dev/null and b/src/assets/images/respondent-stamp.webp differ diff --git a/src/assets/images/sky-theme-asset-clouds.png b/src/assets/images/sky-theme-asset-clouds.png deleted file mode 100644 index 98187b9..0000000 Binary files a/src/assets/images/sky-theme-asset-clouds.png and /dev/null differ diff --git a/src/assets/images/sky-theme-asset-clouds.webp b/src/assets/images/sky-theme-asset-clouds.webp new file mode 100644 index 0000000..445fbfd Binary files /dev/null and b/src/assets/images/sky-theme-asset-clouds.webp differ diff --git a/src/assets/images/sky-theme.png b/src/assets/images/sky-theme.png deleted file mode 100644 index 14ba42f..0000000 Binary files a/src/assets/images/sky-theme.png and /dev/null differ diff --git a/src/assets/images/sky-theme.webp b/src/assets/images/sky-theme.webp new file mode 100644 index 0000000..d5f0af9 Binary files /dev/null and b/src/assets/images/sky-theme.webp differ diff --git a/src/assets/images/vintage-theme-asset-bg.png b/src/assets/images/vintage-theme-asset-bg.png deleted file mode 100644 index b67338f..0000000 Binary files a/src/assets/images/vintage-theme-asset-bg.png and /dev/null differ diff --git a/src/assets/images/vintage-theme-asset-bg.webp b/src/assets/images/vintage-theme-asset-bg.webp new file mode 100644 index 0000000..be8d460 Binary files /dev/null and b/src/assets/images/vintage-theme-asset-bg.webp differ diff --git a/src/assets/images/vintage-theme.png b/src/assets/images/vintage-theme.png deleted file mode 100644 index c27e5c3..0000000 Binary files a/src/assets/images/vintage-theme.png and /dev/null differ diff --git a/src/assets/images/vintage-theme.webp b/src/assets/images/vintage-theme.webp new file mode 100644 index 0000000..eef75f8 Binary files /dev/null and b/src/assets/images/vintage-theme.webp differ diff --git a/src/components/BackgroundBottom.tsx b/src/components/BackgroundBottom.tsx index 30bced2..520f5e0 100644 --- a/src/components/BackgroundBottom.tsx +++ b/src/components/BackgroundBottom.tsx @@ -1,4 +1,4 @@ -import BgItem from '@/assets/images/field-4.png'; +import BgItem from '@/assets/images/field-theme-asset-bottom.webp'; import BgItemDark from '@/assets/images/field-4-dark.webp'; import BackgroundImageWrapper from './BackgroundImageWrapper'; diff --git a/src/components/ResultLetter.tsx b/src/components/ResultLetter.tsx index f062f0b..c150e45 100644 --- a/src/components/ResultLetter.tsx +++ b/src/components/ResultLetter.tsx @@ -6,12 +6,14 @@ export default function ResultLetter({ categoryName = 'CONSOLATION', title, zipCode = 'ERROR', + createdAt, }: { categoryName: Category; title: string; zipCode: string; + createdAt?: Date; }) { - const date = new Date(); + const date = createdAt ? new Date(createdAt) : new Date(); const today = `${date.getFullYear()}년 ${date.getMonth() + 1}월 ${date.getDate()}일`; return ( diff --git a/src/layouts/PrivateRoute.tsx b/src/layouts/PrivateRoute.tsx index 95fb2fd..a433bc4 100644 --- a/src/layouts/PrivateRoute.tsx +++ b/src/layouts/PrivateRoute.tsx @@ -6,7 +6,6 @@ import { useServerSentEvents } from '@/hooks/useServerSentEvents'; import Toast from '@/components/Toast'; export default function PrivateRoute() { - // useServerSentEvents(); const isLoggedIn = useAuthStore((state) => state.isLoggedIn); const navigate = useNavigate(); diff --git a/src/pages/Admin/Report.tsx b/src/pages/Admin/Report.tsx index 103b385..baba319 100644 --- a/src/pages/Admin/Report.tsx +++ b/src/pages/Admin/Report.tsx @@ -15,7 +15,7 @@ import WrapperTitle from './components/WrapperTitle'; export default function ReportManage() { const [detailModalOpen, setDetailModalOpen] = useState(false); const [handleModalOpen, setHandleModalOpen] = useState(false); - const [reports, setReports] = useState([]); + const [reports, setReports] = useState(null); const [reportPages, setReportPages] = useState({ currentPage: '1', totalPages: '0', @@ -71,31 +71,36 @@ export default function ReportManage() { + {reports ? ( +
+ + ID + 제보자 이메일 + 작성자 이메일 + 제보 일자 + 제보 사유 + + {reports.map((data, idx) => ( + + ))} -
- - ID - 제보자 이메일 - 작성자 이메일 - 제보 일자 - 제보 사유 - - {reports?.map((data, idx) => ( - - ))} - -
+
+ ) : ( +
Loading...
+ )} + {detailModalOpen && ( )} diff --git a/src/pages/Admin/components/ReportHandlingModal.tsx b/src/pages/Admin/components/ReportHandlingModal.tsx index b2c9f8b..4b8e3d6 100644 --- a/src/pages/Admin/components/ReportHandlingModal.tsx +++ b/src/pages/Admin/components/ReportHandlingModal.tsx @@ -8,13 +8,13 @@ export default function ReportHandlingModal({ setHandleModalOpen, selectedReportId, }: { - setReports: React.Dispatch>; + setReports: React.Dispatch>; setHandleModalOpen: React.Dispatch>; selectedReportId: number | null; }) { const handleDeleteList = (targetId: number) => { setReports((curReports) => - curReports.filter((report) => { + curReports!.filter((report) => { if (report.id === targetId) return false; return true; }), diff --git a/src/pages/Onboarding/UserInteraction.tsx b/src/pages/Onboarding/UserInteraction.tsx index 3e1a40b..5d06e99 100644 --- a/src/pages/Onboarding/UserInteraction.tsx +++ b/src/pages/Onboarding/UserInteraction.tsx @@ -1,8 +1,8 @@ import { useState, useRef, useEffect } from 'react'; import { twMerge } from 'tailwind-merge'; -import envelope from '@/assets/images/closed-letter.png'; -import envelopeFront from '@/assets/images/opened-letter-front.png'; +import envelope from '@/assets/images/closed-letter.webp'; +import envelopeFront from '@/assets/images/opened-letter-front.webp'; export default function UserInteraction({ setIsAnimationOver, diff --git a/src/pages/RandomLetters/components/MatchingSelect.tsx b/src/pages/RandomLetters/components/MatchingSelect.tsx index bc5658c..219273e 100644 --- a/src/pages/RandomLetters/components/MatchingSelect.tsx +++ b/src/pages/RandomLetters/components/MatchingSelect.tsx @@ -80,6 +80,7 @@ export default function MatchingSelect({ categoryName={list.category} title={list.title} zipCode={list.zipCode} + createdAt={list.createdAt} /> diff --git a/src/pages/RandomLetters/components/MatchingSelectModal.tsx b/src/pages/RandomLetters/components/MatchingSelectModal.tsx index c7d22c5..c934806 100644 --- a/src/pages/RandomLetters/components/MatchingSelectModal.tsx +++ b/src/pages/RandomLetters/components/MatchingSelectModal.tsx @@ -37,6 +37,7 @@ function MatchingSelectModal({ categoryName={selectedLetter.category} title={selectedLetter.title} zipCode={selectedLetter.zipCode} + createdAt={selectedLetter.createdAt} />
diff --git a/src/pages/RollingPaper/components/WriteCommentButton.tsx b/src/pages/RollingPaper/components/WriteCommentButton.tsx index e203c07..294c392 100644 --- a/src/pages/RollingPaper/components/WriteCommentButton.tsx +++ b/src/pages/RollingPaper/components/WriteCommentButton.tsx @@ -2,7 +2,7 @@ import { useMutation, useQueryClient } from '@tanstack/react-query'; import { useEffect, useState } from 'react'; import { postRollingPaperComment } from '@/apis/rolling'; -import EnvelopeImg from '@/assets/images/closed-letter.png'; +import EnvelopeImg from '@/assets/images/closed-letter.webp'; import MessageModal from '@/components/MessageModal'; import useAuthStore from '@/stores/authStore'; import { AxiosError } from 'axios'; diff --git a/src/pages/Write/OptionSlide.tsx b/src/pages/Write/OptionSlide.tsx index cc9a05b..887ef62 100644 --- a/src/pages/Write/OptionSlide.tsx +++ b/src/pages/Write/OptionSlide.tsx @@ -42,9 +42,9 @@ function OptionSlide({ prevLetter }: { prevLetter: PrevLetter[] }) { return (
-
+
void; }) { const buttonStyle = twMerge( - 'caption-sb text-gray-60 rounded-sm px-2 py-1', + 'caption-sb rounded-sm px-2 py-1', `bg-${bgColor} rounded-${rounded}`, - `${target === text && slideActive && 'bg-primary-1 text-white'}`, + `${target === text && slideActive && 'bg-primary-2 text-gray-70'}`, ); return (