diff --git a/src/apis/recruitments/index.ts b/src/apis/recruitments/index.ts index 32fd095..33805c8 100644 --- a/src/apis/recruitments/index.ts +++ b/src/apis/recruitments/index.ts @@ -13,10 +13,12 @@ export const GetRecruitmentsList = (queryString: string) => { const { append } = useToastStore(); return useQuery( ["getRecruitmentsList", queryString], - async () => - await instance.get( + async () => { + const { data } = await instance.get( `${router}/student?${queryString}` - ), + ); + return data; + }, { onError: () => { append({ diff --git a/src/components/common/Header.tsx b/src/components/common/Header.tsx index 0968003..a1b9523 100644 --- a/src/components/common/Header.tsx +++ b/src/components/common/Header.tsx @@ -28,7 +28,7 @@ function Header() { className={`text-[#333333] text-b2 ${ pathname.indexOf("/companies") !== -1 && "font-b" }`} - href={"/companies?page=1&name="} + href={"/companies?page=1"} prefetch > 기업체 @@ -37,7 +37,7 @@ function Header() { className={`text-[#333333] text-b2 ${ pathname.indexOf("/recruitments") !== -1 && "font-b" }`} - href={"/recruitments?page=1&job_code=&tech_code=&name="} + href={"/recruitments?page=1"} > 모집의뢰서 diff --git a/src/components/common/Pagination.tsx b/src/components/common/Pagination.tsx index aa3a282..f995b6c 100644 --- a/src/components/common/Pagination.tsx +++ b/src/components/common/Pagination.tsx @@ -10,20 +10,29 @@ import { useEffect, useState } from "react"; export default function Pagination() { const pathname = usePathname(); - const { setQueryString, getQueryString, getQueryStringEntry } = useQueryString({ - page: "1", - job_code: "", - tech_code: "", - name: "", - }); + const { setQueryString, getQueryString, getQueryStringEntry } = + useQueryString({ + page: "1", + job_code: "", + tech_code: "", + name: "", + }); const currentPageNumber = getQueryString("page"); + const recruitmentQuery = [ + getQueryStringEntry("job_code"), + getQueryStringEntry("tech_code"), + getQueryString("name"), + ] + .filter((item) => item) + .join("&"); + const numberOfPages = pathname === "/recruitments/" - ? GetNumberOfRecruitmentRequestListPages( - `${getQueryStringEntry("job_code")}&${getQueryStringEntry("tech_code")}&${getQueryStringEntry("name")}` - )?.data - : GetNumberOfCompaniesListPages(`${getQueryStringEntry("name")}`)?.data; + ? GetNumberOfRecruitmentRequestListPages(recruitmentQuery)?.data + : GetNumberOfCompaniesListPages( + `${getQueryStringEntry("name") ? getQueryStringEntry("name") : ""}` + )?.data; const [pagesArray, setPagesArray] = useState([]); useEffect(() => { @@ -73,7 +82,11 @@ export default function Pagination() { icon="Chevron" direction="right" size={16} - color={getQueryString("page") === String(pagesArray.length) ? "gray50" : "gray90"} + color={ + getQueryString("page") === String(pagesArray.length) + ? "gray50" + : "gray90" + } /> diff --git a/src/components/recruitments/RecruitmentsCard.tsx b/src/components/recruitments/RecruitmentsCard.tsx index 189c754..21905fb 100644 --- a/src/components/recruitments/RecruitmentsCard.tsx +++ b/src/components/recruitments/RecruitmentsCard.tsx @@ -1,33 +1,25 @@ "use client"; -import { Icon } from "@team-return/design-system"; import { SetBookmarks } from "@/apis/bookmarks"; +import { GetRecruitmentsList } from "@/apis/recruitments"; +import { Icon } from "@team-return/design-system"; import Image from "next/image"; -import React, { useEffect, useState } from "react"; import { useSearchParams } from "next/navigation"; -import { RecruitmentsListType } from "@/apis/recruitments/type"; -import { GetRecruitmentsList } from "@/apis/recruitments"; +import React from "react"; import HoverPrefetchLink from "../common/HoverPrefetchLink"; import RecruitmentSkelton from "../common/Skelton/SkeltonElement"; export default function RecruitmentsCard() { const getParams = useSearchParams(); - const [list, setList] = useState([]); const { data: recruitmentsList, isLoading } = GetRecruitmentsList(getParams.toString()); - useEffect(() => { - setList((prev) => recruitmentsList?.data.recruitments || prev); - }, [recruitmentsList]); const { mutate: SetBookmarksMutate } = SetBookmarks(); - const tagStyle = - "text-caption leading-caption text-lightBlue font-r border rounded-full border-[#135C9D] py-1 px-2"; - return (
{isLoading && } - {list.map( + {recruitmentsList?.recruitments.map( ( { company_profile_url, diff --git a/src/hook/useQueryString.ts b/src/hook/useQueryString.ts index 6444367..8852962 100644 --- a/src/hook/useQueryString.ts +++ b/src/hook/useQueryString.ts @@ -32,7 +32,8 @@ export const useQueryString = (initialState: QueryStringType) => { const refresh = () => { const queryString = Object.entries(value) - .map(([key, val]) => `${key}=${val}`) + .map(([key, val]) => val && `${key}=${val}`) + .filter((item) => item) .join("&"); router.push(`${pathname}?${queryString}`); }; @@ -47,7 +48,7 @@ export const useQueryString = (initialState: QueryStringType) => { return value[key]; }; const getQueryStringEntry = (key: keyof setQueryStringType) => { - return `${Object.keys(value).find((objectKey) => objectKey === key)}=${ + return value[key] && `${Object.keys(value).find((objectKey) => objectKey === key)}=${ value[key] }`; };