diff --git a/package.json b/package.json index ffb5cc2..799db06 100644 --- a/package.json +++ b/package.json @@ -37,6 +37,7 @@ "dotenv": "^16.4.5", "firebase": "^11.3.1", "js-base64": "^3.7.7", + "js-cookie": "^3.0.5", "lodash": "^4.17.21", "lucide-react": "^0.475.0", "next": "^15.0.3", @@ -62,6 +63,7 @@ "@testing-library/dom": "^10.4.0", "@testing-library/jest-dom": "^6.6.3", "@types/jest": "^29.5.12", + "@types/js-cookie": "^3.0.6", "@types/node": "^20", "@types/react": "^18", "@types/react-dom": "^18", diff --git a/public/assets/icons/icon-fee-check.svg b/public/assets/icons/icon-fee-check.svg new file mode 100644 index 0000000..e1a68dc --- /dev/null +++ b/public/assets/icons/icon-fee-check.svg @@ -0,0 +1,3 @@ + + + diff --git a/public/assets/icons/side-menu/admin-homepage.svg b/public/assets/icons/side-menu/admin-homepage.svg new file mode 100644 index 0000000..beccd3c --- /dev/null +++ b/public/assets/icons/side-menu/admin-homepage.svg @@ -0,0 +1,120 @@ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + diff --git a/src/app/callback/page.tsx b/src/app/callback/page.tsx index 046effd..f816f0f 100644 --- a/src/app/callback/page.tsx +++ b/src/app/callback/page.tsx @@ -3,6 +3,7 @@ import { useEffect, Suspense } from 'react'; import { useSearchParams, useRouter } from 'next/navigation'; import { handleLoginSuccess } from '@/utils/loginHandler'; +import Cookies from 'js-cookie'; function CallbackContent() { const searchParams = useSearchParams(); @@ -13,7 +14,7 @@ function CallbackContent() { const email = searchParams.get('email'); const accessToken = searchParams.get('accessToken'); - localStorage.setItem('email', email || ''); + Cookies.set('email', email || ''); if (!status) return; diff --git a/src/app/mobile/admin/dashboard/page.tsx b/src/app/mobile/admin/dashboard/page.tsx index 8afcfe7..42b229d 100644 --- a/src/app/mobile/admin/dashboard/page.tsx +++ b/src/app/mobile/admin/dashboard/page.tsx @@ -1,7 +1,6 @@ 'use client'; import { useState, useEffect } from 'react'; -import MobileLayout from '@/components/mobile/layout'; import Header from '@/components/mobile/Header'; import Dropdown from '@/components/mobile/Dropdown'; import useDropdown from '@/hooks/useDropdown'; @@ -104,7 +103,7 @@ export default function Dashboard() { }; return ( - +
@@ -171,6 +170,6 @@ export default function Dashboard() { hideDropdown={hideDropdown} positionClasses="top-[80px] right-5" /> - +
); } diff --git a/src/app/mobile/admin/notification/page.tsx b/src/app/mobile/admin/notification/page.tsx index 61084ab..3c8f229 100644 --- a/src/app/mobile/admin/notification/page.tsx +++ b/src/app/mobile/admin/notification/page.tsx @@ -1,7 +1,6 @@ 'use client'; import { useEffect, useState } from 'react'; -import MobileLayout from '@/components/mobile/layout'; import NotificationItem from '@/components/mobile/NotificationItem'; import Header from '@/components/mobile/Header'; import { elapsedTime } from '@/utils/elapsedTime'; @@ -32,7 +31,7 @@ export default function Notification() { }; return ( - +
{notificationDetail?.length === 0 ? (
@@ -53,6 +52,6 @@ export default function Notification() { /> )) )} - +
); } diff --git a/src/app/mobile/history/page.tsx b/src/app/mobile/history/page.tsx index b884577..1d9ce7c 100644 --- a/src/app/mobile/history/page.tsx +++ b/src/app/mobile/history/page.tsx @@ -1,7 +1,6 @@ 'use client'; import { useEffect, useState, useMemo } from 'react'; -import MobileLayout from '@/components/mobile/layout'; import Header from '@/components/mobile/Header'; import ReturnItem from '@/app/mobile/history/_components/ReturnItem'; import RentalItem from '@/app/mobile/history/_components/RentalItem'; @@ -194,7 +193,7 @@ export default function UserRentalList() { ); return ( - +
{/* 반납이 필요한 물품 */} @@ -287,6 +286,6 @@ export default function UserRentalList() {
© wink
- + ); } diff --git a/src/app/mobile/layout.tsx b/src/app/mobile/layout.tsx new file mode 100644 index 0000000..98216de --- /dev/null +++ b/src/app/mobile/layout.tsx @@ -0,0 +1,44 @@ +'use client'; + +import useAuthRedirect from '@/hooks/useAuthRedirect'; +import React, { useEffect } from 'react'; +import { usePathname } from 'next/navigation'; + +export default function MobileLayout({ + children, +}: { + children: React.ReactNode; +}) { + const pathname = usePathname(); + + // 제외할 경로 목록 + const excludedRoutes = ['/mobile/sign-in', '/mobile/sign-up']; + + const isExcluded = excludedRoutes.includes(pathname); + + useAuthRedirect(); + + useEffect(() => { + if (!isExcluded) { + const originalBgColor = document.body.style.backgroundColor; + document.body.style.backgroundColor = '#F3F4F6'; + + return () => { + document.body.style.backgroundColor = originalBgColor; + }; + } + + return undefined; + }, [isExcluded]); + + if (isExcluded) { + // 레이아웃 없이 children만 렌더링 + return children; + } + + return ( +
+
{children}
+
+ ); +} diff --git a/src/app/mobile/main/_components/MainHeader/index.tsx b/src/app/mobile/main/_components/MainHeader/index.tsx index b46936b..9626b8c 100644 --- a/src/app/mobile/main/_components/MainHeader/index.tsx +++ b/src/app/mobile/main/_components/MainHeader/index.tsx @@ -5,7 +5,9 @@ import Sidebar from '@/components/mobile/SidebarMenu/index'; import { useEffect, useState } from 'react'; import IconAlarm from 'public/assets/icons/icon-alarm.svg'; import IconHamburger from 'public/assets/icons/icon-hamburger.svg'; +import IconFeeCheck from 'public/assets/icons/icon-fee-check.svg'; import { getNotificationCount } from '@/apis/notification'; +import Cookies from 'js-cookie'; export default function MainHeader() { const router = useRouter(); @@ -15,6 +17,7 @@ export default function MainHeader() { name: string; id: string; role: string; + isFeePaid: boolean; } | null>(null); useEffect(() => { @@ -31,7 +34,7 @@ export default function MainHeader() { }, []); useEffect(() => { - const storedUser = localStorage.getItem('user'); + const storedUser = Cookies.get('user'); if (storedUser) { setUser(JSON.parse(storedUser)); } @@ -40,8 +43,8 @@ export default function MainHeader() { return ( <>
-
- {user?.name}님 +
+ {user?.name}님{user?.isFeePaid ? : null}