Merge pull request #74 from rktdnjs/develop

[9주차] : 9주차 개발 코드 Merge

package.json

@@ -3,6 +3,7 @@
   "version": "0.1.0",
   "private": true,
   "dependencies": {
+    "@hookform/error-message": "^2.0.1",
     "@tanstack/react-query": "^4.35.3",
     "@tanstack/react-query-devtools": "^4.35.3",
     "@testing-library/jest-dom": "^5.17.0",

src/App.js

@@ -11,7 +11,7 @@ import MyPage from './pages/MyPage';
 import AdminPage from './pages/AdminPage';
 import AdminAuthPage from './pages/AdminAuthPage';
 import ErrorPage from './pages/ErrorPage';
-import ProtectedRoute from './components/templates/ProtectedRoute';
+import ProtectedRoute from './components/layout/ProtectedRoute';
 import UploadStudentCardPage from './pages/UploadStudentCardPage';
 import routes from './constant/routes';
 
@@ -27,6 +27,11 @@ function App() {
         <Route path={routes.login} element={<LoginPage />} />
         <Route path={routes.loginKakao} element={<KakaoOuathPage />} />
         <Route path={routes.registerBank} element={<RegisterBankPage />} />
+        <Route path={routes.post} element={<PostListPage />} />
+        <Route path={routes.detailPost} element={<PostDetailPage />} />
+        {/* 아래 각 페이지들에 대해 requiedAuth 추가 필요 */}
+        <Route path={routes.postWriteIntro} element={<PostWriteIntroPage />} />
+        <Route path={routes.postWrite} element={<PostWritePage />} />
         <Route
           path={routes.mypage}
           element={
@@ -36,13 +41,9 @@ function App() {
           }
         />
         <Route path={routes.uploadStudentCard} element={<UploadStudentCardPage />} />
-        <Route path={routes.post} element={<PostListPage />} />
-        <Route path={routes.detailPost} element={<PostDetailPage />} />
-        <Route path={routes.postWriteIntro} element={<PostWriteIntroPage />} />
-        <Route path={routes.postWrite} element={<PostWritePage />} />
-        <Route path={routes.error} element={<ErrorPage />} />
         <Route path={routes.admin} element={<AdminPage />} />
         <Route path={routes.adminAuth} element={<AdminAuthPage />} />
+        <Route path={routes.error} element={<ErrorPage />} />
       </Routes>
     </BrowserRouter>
   );

src/apis/admin.js

@@ -5,7 +5,7 @@ export const adminAuth = () => {
 };
 
 export const adminAuthDetail = (id = 1) => {
-  return instance.get(`/admin/list/${id}`);
+  return instance.get(`/admin/auth/list/${id}`);
 };
 
 export const adminAuthList = () => {

src/components/organisms/Info.jsx → src/components/atoms/Info.jsx

@@ -1,4 +1,4 @@
-import Time from '../atoms/Time';
+import time from '../../utils/time';
 
 /* eslint-disable */
 const Info = ({ response }) => {
@@ -36,7 +36,7 @@ const Info = ({ response }) => {
       {/* 마감기한 */}
       <div className="my-12">
         <div className="text-xl font-bold text-blue py-2">마감기한</div>
-        <div>{<Time date={finishTime} />}</div>
+        <div>{time(finishTime)}</div>
       </div>
     </div>
   );

src/components/atoms/RangeInput.jsx → src/components/atoms/input/RangeInput.jsx

@@ -1,4 +1,4 @@
-import '../../styles/thumb.css';
+import '../../../styles/thumb.css';
 
 const RangeInput = ({ name, register }) => {
   return (

src/components/atoms/SelectInput.jsx → src/components/atoms/input/SelectInput.jsx

@@ -1,4 +1,4 @@
-import cafe from '../../constant/cafe';
+import cafe from '../../../constant/cafe';
 
 const SelectInput = ({
   register,

src/components/atoms/LoginNav.jsx → src/components/atoms/nav/LoginNav.jsx

@@ -2,7 +2,7 @@ import React from 'react';
 import { BsArrowLeft } from 'react-icons/bs';
 import { MdHome } from 'react-icons/md';
 import { Link, useNavigate } from 'react-router-dom';
-import routes from '../../constant/routes';
+import routes from '../../../constant/routes';
 
 const LoginNav = () => {
   const navigate = useNavigate();

src/components/atoms/Nav.jsx → src/components/atoms/nav/Nav.jsx

@@ -2,8 +2,8 @@
 import React from 'react';
 import { Link } from 'react-router-dom';
 import { BiSolidUser } from 'react-icons/bi';
-import logo from '../../assets/images/logo.png';
-import routes from '../../constant/routes';
+import logo from '../../../assets/images/logo.png';
+import routes from '../../../constant/routes';
 
 const Nav = () => {
   return (

src/components/atoms/OtherNav.jsx → src/components/atoms/nav/OtherNav.jsx

@@ -3,7 +3,7 @@ import { BsArrowLeft } from 'react-icons/bs';
 import { BiSolidUser } from 'react-icons/bi';
 import { MdHome } from 'react-icons/md';
 import { Link, useNavigate } from 'react-router-dom';
-import routes from '../../constant/routes';
+import routes from '../../../constant/routes';
 
 const OtherNav = ({ iconColor = '#000', bgColor = 'bg-[#FFF]' }) => {
   const navigate = useNavigate();

src/components/molecules/BankForm.jsx

@@ -2,7 +2,7 @@ import React, { useState, useEffect } from 'react';
 import { Link, useNavigate } from 'react-router-dom';
 import Swal from 'sweetalert2';
 import { useMutation } from '@tanstack/react-query';
-import Button from '../atoms/Button';
+import Button from '../atoms/button/Button';
 import banks from '../../constant/bank';
 import routes from '../../constant/routes';
 import registerBank from '../../apis/register';

src/components/molecules/BtnNavigate.jsx

@@ -1,5 +1,5 @@
 import { IoIosArrowBack, IoIosArrowForward } from 'react-icons/io';
-import Button from '../atoms/Button';
+import Button from '../atoms/button/Button';
 
 const BtnNavigate = ({ handlePrev, handleNext }) => {
   const btnWidth = 'w-[8rem]';

src/components/molecules/CircleBtn.jsx

@@ -1,4 +1,4 @@
-import Button from '../atoms/Button';
+import Button from '../atoms/button/Button';
 
 const CircleBtn = ({ num, children, active }) => {
   const bgColor = active ? 'bg-blue' : 'bg-gray-400';

src/components/molecules/FilterForm.jsx

@@ -1,5 +1,5 @@
 import React, { useState } from 'react';
-import FilterBtn from '../atoms/FilterBtn';
+import FilterBtn from '../atoms/button/FilterBtn';
 
 const FilterForm = ({ getFilter }) => {
   const [filter, setFilter] = useState('All');

src/components/molecules/Labels.jsx

@@ -1,5 +1,5 @@
-import Label from '../atoms/Label';
-import SubLabel from '../atoms/SubLabel';
+import Label from '../atoms/label/Label';
+import SubLabel from '../atoms/label/SubLabel';
 
 const Labels = ({ htmlFor, label, subLabel }) => {
   return (

src/components/organisms/AuthRequest.jsx

@@ -4,7 +4,7 @@ import { PiCaretRightLight } from 'react-icons/pi';
 const AuthRequest = ({ user }) => {
   return (
     <div className="h-10 rounded-lg border-gray-300 border-2 my-5">
-      <Link to={`/admin/auth/${user.userId}`}>
+      <Link to={`/mypage/admin/auth/${user.userId}`}>
         <div className="p-[0.4rem] pl-4 flex items-center justify-between">
           {user.nickname}
           <PiCaretRightLight size={20} />

src/components/organisms/PickerTime.jsx

@@ -3,7 +3,7 @@ import { useState } from 'react';
 import { useMutation } from '@tanstack/react-query';
 import { useParams } from 'react-router-dom';
 import { postDetailPicker } from '../../apis/postDetail';
-import Button from '../atoms/Button';
+import Button from '../atoms/button/Button';
 
 const PickerTime = ({ setPage, setIsMatch }) => {
   const { id } = useParams();

src/components/templates/MyPageTemplate.jsx

@@ -1,9 +1,9 @@
 import React from 'react';
 // import { useQuery } from '@tanstack/react-query';
-import OtherNav from '../atoms/OtherNav';
-import AdminMyPage from './AdminMyPage';
-import GuestMyPage from './GuestMyPage';
-import StudentMyPage from './StudentMyPage';
+import OtherNav from '../atoms/nav/OtherNav';
+import AdminMyPage from './mypage/AdminMyPageTemplate';
+import GuestMyPage from './mypage/GuestMyPageTemplate';
+import StudentMyPage from './mypage/StudentMyPageTemplate';
 import Footer from '../atoms/Footer';
 // import { getMyPage } from '../../apis/myPage';
 

src/components/templates/AdminMyPage.jsx → src/components/templates/mypage/AdminMyPageTemplate.jsx

@@ -2,9 +2,9 @@ import { CiEdit } from 'react-icons/ci';
 import { PiCaretRightLight, PiReadCvLogoThin, PiCheckSquareLight } from 'react-icons/pi';
 import { RiAdminLine } from 'react-icons/ri';
 import { useNavigate } from 'react-router-dom';
-import routes from '../../constant/routes';
+import routes from '../../../constant/routes';
 
-const AdminMyPage = () => {
+const AdminMyPageTemplate = () => {
   const navigate = useNavigate();
   const navigateAdmin = () => {
     return navigate(routes.admin);
@@ -42,4 +42,4 @@ const AdminMyPage = () => {
   );
 };
 
-export default AdminMyPage;
+export default AdminMyPageTemplate;

src/components/templates/GuestMyPage.jsx → src/components/templates/mypage/GuestMyPageTemplate.jsx

@@ -1,9 +1,9 @@
 import { CiEdit } from 'react-icons/ci';
 import { PiGraduationCapLight, PiCaretRightLight } from 'react-icons/pi';
 import { useNavigate } from 'react-router-dom';
-import routes from '../../constant/routes';
+import routes from '../../../constant/routes';
 
-const GuestMyPage = () => {
+const GuestMyPageTemplate = () => {
   const navigate = useNavigate();
   const uploadStudentIdCard = () => {
     return navigate(routes.uploadStudentCard);
@@ -31,4 +31,4 @@ const GuestMyPage = () => {
   );
 };
 
-export default GuestMyPage;
+export default GuestMyPageTemplate;

src/components/templates/StudentMyPage.jsx → src/components/templates/mypage/StudentMyPageTemplate.jsx

@@ -1,7 +1,7 @@
 import { CiEdit } from 'react-icons/ci';
 import { PiCaretRightLight, PiReadCvLogoThin, PiCheckSquareLight } from 'react-icons/pi';
 
-const StudentMyPage = () => {
+const StudentMyPageTemplate = () => {
   return (
     <div>
       <div className="w-full h-1 bg-zinc-200" />
@@ -26,4 +26,4 @@ const StudentMyPage = () => {
   );
 };
 
-export default StudentMyPage;
+export default StudentMyPageTemplate;

src/components/templates/PickerMatch.jsx → src/components/templates/postDetail/PickerMatchTemplate.jsx

@@ -1,9 +1,9 @@
-import Button from '../atoms/Button';
-import OtherNav from '../atoms/OtherNav';
-import Info from '../organisms/Info';
-import Location from '../organisms/Location';
+import Button from '../../atoms/button/Button';
+import OtherNav from '../../atoms/nav/OtherNav';
+import Info from '../../atoms/Info';
+import Location from '../../organisms/Location';
 
-const PickerMatch = ({ response }) => {
+const PickerMatchTemplate = ({ response }) => {
   return (
     <>
       {/* 파란색 부분 */}
@@ -25,4 +25,4 @@ const PickerMatch = ({ response }) => {
   );
 };
 
-export default PickerMatch;
+export default PickerMatchTemplate;

src/components/templates/PickerNoMatch.jsx → src/components/templates/postDetail/PickerNoMatchTemplate.jsx

@@ -1,13 +1,13 @@
 import { useEffect, useState } from 'react';
 import Swal from 'sweetalert2';
-import Button from '../atoms/Button';
-import OtherNav from '../atoms/OtherNav';
-import Info from '../organisms/Info';
-import Location from '../organisms/Location';
-import '../../styles/DeleteSpin.css';
-import PickerTime from '../organisms/PickerTime';
+import Button from '../../atoms/button/Button';
+import OtherNav from '../../atoms/nav/OtherNav';
+import Info from '../../atoms/Info';
+import Location from '../../organisms/Location';
+import '../../../styles/DeleteSpin.css';
+import PickerTime from '../../organisms/PickerTime';
 
-const PickerNoMatch = ({ response }) => {
+const PickerNoMatchTemplate = ({ response }) => {
   const [page, setPage] = useState(0);
   const [isMatch, setIsMatch] = useState(false);
 
@@ -66,4 +66,4 @@ const PickerNoMatch = ({ response }) => {
   );
 };
 
-export default PickerNoMatch;
+export default PickerNoMatchTemplate;

src/components/templates/WriterMatch.jsx → src/components/templates/postDetail/WriterMatchTemplate.jsx

@@ -1,8 +1,8 @@
-import OtherNav from '../atoms/OtherNav';
-import Info from '../organisms/Info';
-import Location from '../organisms/Location';
+import OtherNav from '../../atoms/nav/OtherNav';
+import Info from '../../atoms/Info';
+import Location from '../../organisms/Location';
 
-const WriterMatch = ({ response }) => {
+const WriterMatchTemplate = ({ response }) => {
   return (
     <>
       {/* 파란색 부분 */}
@@ -36,4 +36,4 @@ const WriterMatch = ({ response }) => {
   );
 };
 
-export default WriterMatch;
+export default WriterMatchTemplate;

src/components/templates/WriterNoMatch.jsx → src/components/templates/postDetail/WriterNoMatchTemplate.jsx

@@ -1,11 +1,11 @@
 import { BsThreeDotsVertical } from 'react-icons/bs';
 import Swal from 'sweetalert2';
 import { useNavigate } from 'react-router-dom';
-import OtherNav from '../atoms/OtherNav';
-import Info from '../organisms/Info';
-import Location from '../organisms/Location';
+import OtherNav from '../../atoms/nav/OtherNav';
+import Info from '../../atoms/Info';
+import Location from '../../organisms/Location';
 
-const WriterNoMatch = ({ response }) => {
+const WriterNoMatchTemplate = ({ response }) => {
   const navigate = useNavigate();
 
   // 삭제 버튼 눌렀을 때
@@ -64,4 +64,4 @@ const WriterNoMatch = ({ response }) => {
   );
 };
 
-export default WriterNoMatch;
+export default WriterNoMatchTemplate;

src/components/templates/OrderDeadLine.jsx → src/components/templates/postWrite/OrderDeadLineTemplate.jsx

@@ -1,12 +1,12 @@
 /* eslint-disable */
-import Labels from '../molecules/Labels';
-import Input from '../atoms/Input';
-import ErrorMsg from '../atoms/ErrorMsg';
-import { ORDER_DEADLINE, HOUR, MINUTE } from '../../constant/postWrite/orderDeadLine';
-import validateInputMsg from '../../constant/validateInputMsg';
+import Labels from '../../molecules/Labels';
+import Input from '../../atoms/input/Input';
+import ErrorMsg from '../../atoms/ErrorMsg';
+import { ORDER_DEADLINE, HOUR, MINUTE } from '../../../constant/postWrite/orderDeadLine';
+import validateInputMsg from '../../../constant/validateInputMsg';
 import { useFormContext } from 'react-hook-form';
 
-const OrderDeadLine = () => {
+const OrderDeadLineTemplate = () => {
   const {
     register,
     handleSubmit,
@@ -45,4 +45,4 @@ const OrderDeadLine = () => {
   );
 };
 
-export default OrderDeadLine;
+export default OrderDeadLineTemplate;

src/components/templates/OrderInfo.jsx → src/components/templates/postWrite/OrderInfoTemplate.jsx

@@ -1,15 +1,15 @@
 /*eslint-disable*/
 import { useFieldArray, useFormContext } from 'react-hook-form';
-import Labels from '../molecules/Labels';
-import SelectInput from '../atoms/SelectInput';
-import Input from '../atoms/Input';
-import ErrorMsg from '../atoms/ErrorMsg';
-import PlusBtn from '../atoms/PlusBtn';
-import MinusBtn from '../atoms/MinusBtn';
-import { ORDER_INFO_STORE, ORDER_INFO_BEVERAGE, STORE, BEVERAGE } from '../../constant/postWrite/orderInfo';
-import validateInputMsg from '../../constant/validateInputMsg';
+import Labels from '../../molecules/Labels';
+import SelectInput from '../../atoms/input/SelectInput';
+import Input from '../../atoms/input/Input';
+import ErrorMsg from '../../atoms/ErrorMsg';
+import PlusBtn from '../../atoms/button/PlusBtn';
+import MinusBtn from '../../atoms/button/MinusBtn';
+import { ORDER_INFO_STORE, ORDER_INFO_BEVERAGE, STORE, BEVERAGE } from '../../../constant/postWrite/orderInfo';
+import validateInputMsg from '../../../constant/validateInputMsg';
 
-const OrderInfo = () => {
+const OrderInfoTemplate = () => {
   const {
     register,
     formState: { errors },
@@ -69,4 +69,4 @@ const OrderInfo = () => {
   );
 };
 
-export default OrderInfo;
+export default OrderInfoTemplate;