Merge pull request #233 from Meetfolio-Project-CodeZ-Team/develop

merge to main

src/app/(route)/board/update/employment/page.tsx

@@ -26,12 +26,6 @@ export default function PatchEmploymentPage() {
     const fetchData = async () => {
       const response = await fetch(
         `${process.env.NEXT_PUBLIC_NEXT_SERVER}/api/board/detail?id=${id}`,
-        {
-          method: 'POST',
-          headers: {
-            'Content-Type': 'application/json',
-          },
-        },
       )
       const resData = await response.json()
       setData(resData.result.boardInfo)

src/app/(route)/board/update/group/page.tsx

@@ -26,12 +26,6 @@ export default function PatchGroupPage() {
     const fetchData = async () => {
       const response = await fetch(
         `${process.env.NEXT_PUBLIC_NEXT_SERVER}/api/board/detail?id=${id}`,
-        {
-          method: 'POST',
-          headers: {
-            'Content-Type': 'application/json',
-          },
-        },
       )
       const resData = await response.json()
       setData(resData.result.boardInfo)

src/app/(route)/mypage/myCovletDetail/[id]/page.tsx

@@ -10,7 +10,7 @@ import {
   feedbackData,
   tidState,
 } from '@/app/recoil/coverletter'
-import { useRouter, useSearchParams } from 'next/navigation'
+import { useSearchParams } from 'next/navigation'
 import { useEffect, useState } from 'react'
 import { useRecoilState } from 'recoil'
 
@@ -25,7 +25,6 @@ const MyCovletDetailPage = ({ params }: { params: { id: string } }) => {
   const profile = paramsData.get('profile')
 
   const [tid, setTid] = useRecoilState(tidState)
-  const router = useRouter()
   const paramsInfo = useSearchParams()
   const pg_token = paramsInfo.get('pg_token')
 

src/app/(route)/mypage/page.tsx

@@ -41,5 +41,3 @@ export default function UserMyPage() {
     </section>
   )
 }
-
-//폴더명 테스트

src/app/(route)/userpage/[id]/page.tsx

@@ -7,11 +7,7 @@ import { useEffect, useState } from 'react'
 
 export default function UserPage({ params }: { params: { id: string } }) {
   const [userInfo, setUser] = useState<memberInfo | null>(null)
-  const [otherUserInfo, setOtherUser] = useState<{ profile: string } | null>(
-    null,
-  )
-  const [covletCards, setCovletCards] = useState<CovletCard[]>([])
-  const [expCards, setExpCards] = useState<ExpCard[]>([])
+  const [otherUserInfo, setOtherUser] = useState('')
   const [isExp, setIsExp] = useState(false)
   const path = isExp ? 'expcard' : 'coverletter'
 
@@ -28,38 +24,18 @@ export default function UserPage({ params }: { params: { id: string } }) {
 
   useEffect(() => {
     const getData = async () => {
-      try {
-        const response = await fetch(`/api/userpage/${path}?id=${params.id}`, {
-          method: 'POST',
-          headers: {
-            'Content-Type': 'application/json',
-          },
-        })
-        const data = await response.json()
-
-        if (data.isSuccess && data.result?.profile) {
-          setOtherUser({
-            profile: data.result.profile,
-          })
-
-          isExp
-            ? setExpCards(data.result.experienceCardInfo.experienceCardItems)
-            : setCovletCards(data.result.coverLetterInfo.coverLetterInfo)
-        } else {
-          console.error('Failed to fetch other user data:', data.message)
-        }
-      } catch (error) {
-        console.error('Error fetching other user data:', error)
-      }
+      const response = await fetch(`/api/userpage/${path}?id=${params.id}`, {})
+      const data = await response.json()
+      setOtherUser(data.result.profile)
     }
     getData()
-  }, [isExp, path, params.id])
+  }, [isExp, params.id])
 
   return (
     <section className="flex flex-col min-h-screen relative">
       <Header nickname={userInfo?.memberName} profile={userInfo?.profile} />
       <div className="flex w-[full] h-[980px] mb-[200px]">
-        <OtherUserNav nickname={params.id} profile={otherUserInfo?.profile} />
+        <OtherUserNav nickname={params.id} profile={otherUserInfo} />
         <div className="flex-grow">
           <OtherUserPortfolio username={params.id} />
         </div>

src/app/api/userpage/coverletter/route.ts

@@ -1,12 +1,12 @@
-import { postUserCovelet } from '@/app/service/postRequests'
+import { getUserCovelet } from '@/app/service/getRequests'
 import { getCookie } from '@/app/utils/cookies'
 import { NextResponse } from 'next/server'
 
-export async function POST(request: Request) {
+export async function GET(request: Request) {
   let accessToken = getCookie(request, 'accessToken')
   const { searchParams } = new URL(request.url)
   const id = searchParams.get('id') || ''
-  const data = await postUserCovelet(accessToken, id)
+  const data = await getUserCovelet(accessToken, id)
 
   return NextResponse.json(data)
 }

src/app/api/userpage/expcard/route.ts

@@ -1,12 +1,12 @@
-import { postUserExpCard } from '@/app/service/postRequests'
+import { getUserExpCard } from '@/app/service/getRequests'
 import { getCookie } from '@/app/utils/cookies'
 import { NextResponse } from 'next/server'
 
-export async function POST(request: Request) {
+export async function GET(request: Request) {
   let accessToken = getCookie(request, 'accessToken')
   const { searchParams } = new URL(request.url)
   const id = searchParams.get('id') || ''
-  const data = await postUserExpCard(accessToken, id)
+  const data = await getUserExpCard(accessToken, id)
 
   return NextResponse.json(data)
 }

src/app/components/admin/board/SearchInput.tsx

@@ -1,38 +1,39 @@
 'use client'
-import { userState } from '@/app/recoil/admin'
+import { boardState, userState } from '@/app/recoil/admin'
 import { search } from '@/app/ui/IconsPath'
 import { useState } from 'react'
-import { SetterOrUpdater, useRecoilState } from 'recoil'
+import { useRecoilState } from 'recoil'
 import Icons from '../../common/Icons'
 import Input from '../../common/Input'
 
 interface SearchInputProps {
-  searchBoard?: SetterOrUpdater<ResponseBoardData>
   searchUser?: boolean
+  guideText?: string
 }
 
-const SearchInput = ({ searchBoard, searchUser }: SearchInputProps) => {
+const SearchInput = ({ searchUser, guideText }: SearchInputProps) => {
   const [title, setTitle] = useState('')
   const [userData, setUserData] = useRecoilState(userState)
+  const [boardData, setBoardData] = useRecoilState(boardState)
 
   const getKeywordBoard = async (title: string) => {
     const response = await fetch(
-      searchBoard
-        ? `${process.env.NEXT_PUBLIC_NEXT_SERVER}/api/admin/board?keyword=${title}&page=${0}`
-        : `${process.env.NEXT_PUBLIC_NEXT_SERVER}/api/admin/user/search?keyword=${title}`,
+      searchUser
+        ? `${process.env.NEXT_PUBLIC_NEXT_SERVER}/api/admin/user/search?keyword=${title}`
+        : `${process.env.NEXT_PUBLIC_NEXT_SERVER}/api/admin/board?keyword=${title}&page=${0}`,
     )
     const resData = await response.json()
-    searchBoard && searchBoard(resData.result)
-    searchUser && setUserData(resData.result)
+    searchUser ? setUserData(resData.result) : setBoardData(resData.result)
   }
 
   return (
-    <div className="flex w-[300px] px-4 gap-x-3 rounded-[18px] border-[1px] border-solid border-black items-center">
+    <div className="flex w-[300px] px-4 gap-x-3 rounded-[18px] border-[1.5px] border-black items-center">
       <Input
         className="w-[200px]"
         type={'search'}
         onChange={(e) => setTitle(e.target.value)}
         onEnterPress={() => getKeywordBoard(title)}
+        placeholder={guideText}
       />
       <div className="cursor-pointer">
         <Icons name={search} onClick={() => getKeywordBoard(title)} />

src/app/components/admin/containers/AdminNavContainer.tsx

@@ -7,12 +7,12 @@ interface AdminNavContainerProps {
 
 const AdminNavContainer = ({ selected }: AdminNavContainerProps) => {
   return (
-    <div className="flex flex-col w-[320px] pl-[53px] pt-[84px] shadow-lg bg-[#DEE5ED]">
+    <div className="flex flex-col w-[320px] pl-[53px] min-w-56 pt-[84px] shadow-lg bg-[#DEE5ED] min-h-[759px]">
       <div className="flex items-center mb-[48px] gap-x-2">
         <div className="w-12 h-12 rounded-[100px] text-4xl">👨‍💻</div>
         <div className="text-[25px] font-semibold">관리자</div>
       </div>
-      <div className="flex flex-col gap-y-8 text-[22px] font-normal">
+      <div className="flex flex-col gap-y-8 text-[22px] font-normal min-h-[509px]">
         <Link
           className={`${selected === 'dashboard' && 'font-bold'}`}
           href="/admin"

src/app/components/admin/containers/BoardContainer.tsx

@@ -25,7 +25,7 @@ const BoardContainer = () => {
         커뮤니티 관리
       </div>
       <div className="flex items-center w-[1013px] justify-between">
-        <SearhBoard searchBoard={setBoardData} />
+        <SearhBoard searchUser={false} guideText="제목으로 게시물을 검색" />
         <DropDownB options={Board} title={'전체'} setBoardType={setBoardType} />
       </div>
       {boardData && <ComunityBoard boardType={boardType} />}

src/app/components/admin/containers/ModelContainer.tsx

@@ -1,10 +1,9 @@
 'use client'
 import { MODEL_NAV } from '@/app/constants/admin'
 import { modelNum } from '@/app/recoil/admin'
+import dynamic from 'next/dynamic'
 import { useEffect, useState } from 'react'
 import { useRecoilState } from 'recoil'
-import ModelManage from '../model/ModelManage'
-import ModelTrain from '../model/ModelTrain'
 import ModelUsage from '../model/ModelUsage'
 
 const ModelContainer = () => {
@@ -13,6 +12,9 @@ const ModelContainer = () => {
   const marginBorder =
     titleNum === 1 ? 'ml-[154px]' : titleNum === 2 ? 'ml-[290px]' : ''
 
+  const ModelTrain = dynamic(() => import('../model/ModelTrain'))
+  const ModelManage = dynamic(() => import('../model/ModelManage'))
+
   useEffect(() => {
     const fetchData = async () => {
       const response = await fetch(

src/app/components/admin/containers/PointsContainer.tsx

@@ -1,8 +1,8 @@
 'use client'
 import { MONTH, POINT_ANAL, YEAR } from '@/app/constants/admin'
+import dynamic from 'next/dynamic'
 import { useEffect, useState } from 'react'
 import CalendarDropDown from '../point/CalendarDropDown'
-import PaymentAnal from '../point/PaymentAnal'
 import PointAnalDetail from '../point/PointAnalDetail'
 
 const PointsContainer = () => {
@@ -12,6 +12,8 @@ const PointsContainer = () => {
   const [pointData, setPointData] = useState<ResponsePoint | null>(null)
   const [paymentData, setPaymentData] = useState<ResponsePayment | null>(null)
 
+  const PaymentAnal = dynamic(() => import('../point/PaymentAnal'))
+
   useEffect(() => {
     const fetchData = async () => {
       const response = await fetch(

src/app/components/admin/containers/UserContainer.tsx

@@ -9,6 +9,7 @@ import UserBoard from '../user/UserBoard'
 
 const UserContainer = () => {
   const [userData, setUserData] = useRecoilState(userState)
+
   useEffect(() => {
     const fetchData = async () => {
       const response = await fetch(
@@ -19,6 +20,7 @@ const UserContainer = () => {
     }
     fetchData()
   }, [])
+
   const getKeywordUser = async (selectedJob: string) => {
     try {
       const response = await fetch(
@@ -31,11 +33,15 @@ const UserContainer = () => {
       setUserData(userData.result)
     } catch (error) {}
   }
+
   return (
     <div className="flex flex-col gap-y-6 bg-white w-[full] pl-[54px] pt-[27px] pb-[44px]">
       <div className="text-[28px] font-bold">회원 관리</div>
       <div className="flex items-center w-[1013px] justify-between">
-        <SearchInput searchUser={true} />
+        <SearchInput
+          searchUser={true}
+          guideText="검색하려는 회원의 이메일을 입력"
+        />
         <DropDownU
           options={JOBKEYWORD_USER}
           title={'전체'}

src/app/components/admin/user/UserInfo.tsx

@@ -47,10 +47,10 @@ const UserInfo = (userInfo: UserInfoProps) => {
   return (
     <div className="flex flex-col w-[1034px] h-[50px]">
       <div className="flex w-[1034px] h-[50px] border-b border-[#BDBDBD] items-center text-black text-lg">
-        <div className="w-[136px] text-center">{registrationDate}</div>
-        <div className="w-[231px] text-center">{email}</div>
+        <div className="w-[128px] text-center">{registrationDate}</div>
+        <div className="w-[228px] text-center text-[16px]">{email}</div>
         <div className="w-[94px] text-center">{grade}</div>
-        <div className="w-[176px] text-center">{major}</div>
+        <div className="w-[188px] text-center">{major}</div>
         <div className="w-[107px] text-center">{jobKeyword}</div>
         <div className="w-[152px] text-center">{point}</div>
         <div

src/app/components/board/containers/BoardContainer.tsx

@@ -2,13 +2,13 @@
 import { boardDataState, boardTypeState } from '@/app/recoil/board'
 import { leftAngle, rightAngle } from '@/app/ui/IconsPath'
 import Pencil from '@/app/ui/svg/common/Pencil'
+import dynamic from 'next/dynamic'
 import { useRouter } from 'next/navigation'
 import { useEffect, useState } from 'react'
 import ReactPaginate from 'react-paginate'
 import { useRecoilState } from 'recoil'
 import Icons from '../../common/Icons'
 import BoardHeader from '../BoardHeader'
-import GroupBoardContainer from './GroupBoardContainer'
 import JobBoardContainer from './JobBoardContainer'
 
 interface BoardContainerProps {
@@ -22,6 +22,7 @@ const BoardContainer = ({ nickname, profile }: BoardContainerProps) => {
   const path = isJob ? 'employment' : 'group'
   const router = useRouter()
   const [boardData, setBoardData] = useRecoilState(boardDataState)
+  const GroupBoardContainer = dynamic(() => import('./GroupBoardContainer'))
 
   const handlePageChange = ({ selected }: { selected: number }) => {
     setPage(() => selected + 1)

src/app/components/board/containers/BoardDetailContainer.tsx

@@ -59,7 +59,6 @@ const BoardDetailContainer = ({ nickname }: BoardDetailContainerProps) => {
   return (
     <div className="w-full h-full relative border-white border-b-2">
       <ToastContainer />
-
       {isSelected ? (
         <div className="w-full h-full relative ">
           <div>
@@ -126,7 +125,7 @@ const BoardDetailContainer = ({ nickname }: BoardDetailContainerProps) => {
               </div>
             )}
             <div
-              className={`flex absolute pr-8 left-7 ${data?.peopleNumber ? 'top-[260px] ' : 'top-[230px]'} break-all h-[70%] overflow-y-auto`}
+              className={`flex absolute pr-8 left-7 ${data?.peopleNumber ? 'top-[260px] ' : 'top-[230px]'} break-all h-[70%] overflow-y-auto whitespace-pre-wrap`}
             >
               {data?.content}
             </div>

src/app/components/board/containers/OtherUserNav.tsx

@@ -1,5 +1,5 @@
-import Image from 'next/image'
 import { PROFILE_EMOJI } from '@/app/constants/signup'
+import Image from 'next/image'
 
 interface OtherUserNavProps {
   nickname: string
@@ -10,14 +10,17 @@ const OtherUserNav = ({ nickname, profile }: OtherUserNavProps) => {
   return (
     <div className="flex flex-col w-[320px] pl-[53px] pt-[84px] shadow-lg">
       <div className="flex items-center mb-[60px] gap-x-4">
-        <div className="w-6 h-6">
-          <Image
-            width={24}
-            height={24}
-            src={`/Images/Emoji/${PROFILE_EMOJI[PROFILE_EMOJI.indexOf(profile || '')]}.png`}
-            alt="logoIcon"
-          />
-        </div>
+        {profile && (
+          <div className="w-6 h-6">
+            <Image
+              width={24}
+              height={24}
+              src={`/Images/Emoji/${PROFILE_EMOJI[PROFILE_EMOJI.indexOf(profile || '')]}.png`}
+              alt="logoIcon"
+            />
+          </div>
+        )}
+
         <div className="text-[25px] font-semibold">{nickname}</div>
       </div>
       <div className="flex flex-col gap-y-8 text-[22px] font-semibold leading-[33px]">

src/app/components/board/containers/OtherUserPortfolio.tsx

@@ -17,22 +17,16 @@ const OtherUserPortfolio = ({ username }: OtherUserPortfolioProps) => {
 
   useEffect(() => {
     const getData = async () => {
-      const response = await fetch(`/api/userpage/${path}?id=${username}`, {
-        method: 'POST',
-        headers: {
-          'Content-Type': 'application/json',
-        },
-      })
+      const response = await fetch(`/api/userpage/${path}?id=${username}`, {})
       const data = await response.json()
 
       setProfile(data.result.profile)
-
       isExp
         ? setExpCards(data.result.experienceCardInfo.experienceCardItems)
         : setCovletCards(data.result.coverLetterInfo.coverLetterInfo)
     }
     getData()
-  }, [isExp])
+  }, [isExp, username])
   return (
     <div className="w-full h-[1090px] relative">
       <div className="w-full h-[979px] left-0 top-0 absolute bg-gray-50 " />