From f1a6edd9c3a3f80d13a44dedd37cb7a2c96162c2 Mon Sep 17 00:00:00 2001
From: minbo <smb5174@naver.com>
Date: Sun, 1 Dec 2024 15:12:57 +0900
Subject: [PATCH 1/4] =?UTF-8?q?refactor:=20=ED=95=84=ED=84=B0=EB=A7=81=20?=
 =?UTF-8?q?=EC=98=81=EC=97=AD=20=EB=84=93=EC=9D=B4=20=EC=A0=9C=ED=95=9C?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../common/Filter/Filter.module.scss          | 26 +++++++++----------
 .../components/helpMeLayout.module.scss       | 17 ++++++------
 .../helpMeLayout/components/helpMeLayout.tsx  |  2 +-
 3 files changed, 22 insertions(+), 23 deletions(-)

diff --git a/src/components/common/Filter/Filter.module.scss b/src/components/common/Filter/Filter.module.scss
index 849aaff..d36b343 100644
--- a/src/components/common/Filter/Filter.module.scss
+++ b/src/components/common/Filter/Filter.module.scss
@@ -1,10 +1,19 @@
 .container {
-  display: flex;
-  flex-direction: column;
-  width: 75%;
+  @include flexSort(column, null, null, null);
   position: relative;
   top: 3rem;
-  z-index: 1;
+  max-width: 150rem;
+  text-align: center;
+  width: 100%;
+}
+
+.prevArrow {
+  position: absolute;
+  top: 1rem;
+  width: 2.3rem;
+  height: 2.3rem;
+  transform: rotate(90deg);
+  cursor: pointer;
 }
 
 .sliderContainer {
@@ -53,15 +62,6 @@
   border-color: #97b8f9;
 }
 
-.prevArrow {
-  position: absolute;
-  top: 1rem;
-  width: 2.3rem;
-  height: 2.3rem;
-  transform: rotate(90deg);
-  cursor: pointer;
-}
-
 .nextArrow {
   position: absolute;
   top: 1rem;
diff --git a/src/components/page-layout/helpMeLayout/components/helpMeLayout.module.scss b/src/components/page-layout/helpMeLayout/components/helpMeLayout.module.scss
index c307040..259edaa 100644
--- a/src/components/page-layout/helpMeLayout/components/helpMeLayout.module.scss
+++ b/src/components/page-layout/helpMeLayout/components/helpMeLayout.module.scss
@@ -3,17 +3,16 @@
   padding: 5rem 10rem;
 }
 
+.filterContainer {
+  width: 100%;
+  @include flexSort(column, null, center, null);
+}
+
 .title {
   color: black;
   @include nsnFont(2.8rem, 400, 4.2rem);
 }
 
-.typeContainer {
-  text-align: center;
-  width: 100%;
-  @include flexSort(column, center, center, null);
-}
-
 .cardListContainer {
   @include flexSort(column, null, center, 4rem);
 }
@@ -31,12 +30,12 @@
 
 .button {
   z-index: 1;
-  @include flexSort(null, null, center,1rem);
+  @include flexSort(null, null, center, 1rem);
   right: 5%;
   align-self: flex-end;
-  border: 0.1rem solid #9D9D9D;
+  border: 0.1rem solid #9d9d9d;
   border-radius: 1rem;
-  color: #9D9D9D;
+  color: #9d9d9d;
   position: relative;
   top: 7rem;
   @include nsnFont(1.8rem, 400, normal);
diff --git a/src/components/page-layout/helpMeLayout/components/helpMeLayout.tsx b/src/components/page-layout/helpMeLayout/components/helpMeLayout.tsx
index d084e02..2e5638c 100644
--- a/src/components/page-layout/helpMeLayout/components/helpMeLayout.tsx
+++ b/src/components/page-layout/helpMeLayout/components/helpMeLayout.tsx
@@ -84,7 +84,7 @@ export default function HelpMeLayout() {
 
   return (
     <main className={cn("container")}>
-      <div className={cn("typeContainer")}>
+      <div className={cn("filterContainer")}>
         <p className={cn("title")}>
           버디브릿지는 일상에서 모두가 서로에게 <br />
           따뜻한 온정을 전하는 세상을 만듭니다.

From c9adb8451135827b7bd549329de4226f480a1aeb Mon Sep 17 00:00:00 2001
From: minbo <smb5174@naver.com>
Date: Sun, 1 Dec 2024 16:13:49 +0900
Subject: [PATCH 2/4] =?UTF-8?q?feat:=20=ED=95=84=ED=84=B0=EB=A7=81=20?=
 =?UTF-8?q?=EC=A0=84=EC=B2=B4=20=EB=B2=84=ED=8A=BC=20=EC=B6=94=EA=B0=80?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../common/Filter/Filter.module.scss          | 36 ++++++++++-----
 src/components/common/Filter/Filter.tsx       |  3 +-
 .../common/Filter/constants/index.ts          |  9 ++--
 .../common/Pagenation/apis/getHelpMeList.ts   |  5 +-
 .../helpMeLayout/components/helpMeLayout.tsx  | 35 +++++++++++++-
 .../components/helpYouLayout.tsx              | 46 +++++++++++++++----
 6 files changed, 104 insertions(+), 30 deletions(-)

diff --git a/src/components/common/Filter/Filter.module.scss b/src/components/common/Filter/Filter.module.scss
index d36b343..7ec1499 100644
--- a/src/components/common/Filter/Filter.module.scss
+++ b/src/components/common/Filter/Filter.module.scss
@@ -26,16 +26,28 @@
   margin: auto;
 }
 
+.allType {
+  @include nsnFont(1.5rem, 400, normal);
+  background-color: white;
+  padding: 1rem 0rem;
+  border: 0.2rem solid #2825d6;
+  border-radius: 5rem;
+
+  &.selected {
+    background-color: #e7efff;
+  }
+}
+
 .disabilityType {
   @include nsnFont(1.5rem, 400, normal);
   background-color: white;
   padding: 1rem 0rem;
   border: 0.2rem solid #6562e2;
   border-radius: 5rem;
-}
-.disabilityType.selected {
-  background-color: #e7efff;
-  border-color: #97b8f9;
+
+  &.selected {
+    background-color: #e7efff;
+  }
 }
 
 .assistanceType {
@@ -44,10 +56,10 @@
   padding: 1rem 0rem;
   border: 0.2rem solid #81c1ee;
   border-radius: 5rem;
-}
-.assistanceType.selected {
-  background-color: #e7efff;
-  border-color: #97b8f9;
+
+  &.selected {
+    background-color: #e7efff;
+  }
 }
 
 .postStatus {
@@ -56,10 +68,10 @@
   padding: 1rem 0rem;
   border: 0.2rem solid #b7b7b7;
   border-radius: 5rem;
-}
-.postStatus.selected {
-  background-color: #e7efff;
-  border-color: #97b8f9;
+
+  &.selected {
+    background-color: #e7efff;
+  }
 }
 
 .nextArrow {
diff --git a/src/components/common/Filter/Filter.tsx b/src/components/common/Filter/Filter.tsx
index 80904d3..cfc7e2e 100644
--- a/src/components/common/Filter/Filter.tsx
+++ b/src/components/common/Filter/Filter.tsx
@@ -56,8 +56,7 @@ export default function Filter({ searchParams, handleFilter }: FilterProps) {
                 <div key={option}>
                   <button
                     key={option}
-                    className={cn("slideItem", {
-                      [`${categoryName}`]: true,
+                    className={cn("slideItem", categoryName, {
                       selected: isSelected,
                     })}
                     onClick={() => handleFilter(categoryName, option)}
diff --git a/src/components/common/Filter/constants/index.ts b/src/components/common/Filter/constants/index.ts
index d36a4a9..0891fb4 100644
--- a/src/components/common/Filter/constants/index.ts
+++ b/src/components/common/Filter/constants/index.ts
@@ -1,5 +1,6 @@
 export const Categories = {
-    disabilityType: ['시각장애', '청각장애', '지적장애', '지체장애', '자폐성장애', '뇌병변장애', '정신장애'],
-    assistanceType: ['식사', '이동', '학습'],
-    postStatus: ['RECRUITING', 'FINISHED']
-};
\ No newline at end of file
+  allType: ["전체"],
+  disabilityType: ["시각장애", "청각장애", "지적장애", "지체장애", "자폐성장애", "뇌병변장애", "정신장애"],
+  assistanceType: ["식사", "이동", "학습"],
+  postStatus: ["RECRUITING", "FINISHED"],
+};
diff --git a/src/components/common/Pagenation/apis/getHelpMeList.ts b/src/components/common/Pagenation/apis/getHelpMeList.ts
index ce42764..88455d0 100644
--- a/src/components/common/Pagenation/apis/getHelpMeList.ts
+++ b/src/components/common/Pagenation/apis/getHelpMeList.ts
@@ -4,11 +4,14 @@ export default async function getPagenationItems(
   postType: string,
   page: number,
   limit: number,
+  allType: string,
   postStatus: string,
   disabilityType: string,
   assistanceType: string,
 ) {
-  const url = `posts?post-type=${postType}&page=${page}&size=${limit}&sorted=modifiedAt,DESC&post-status=${postStatus}&disability-type=${disabilityType}&assistance-type=${assistanceType}`;
+  const url = allType
+    ? `posts?post-type=${postType}&page=${page}&size=${limit}&sorted=modifiedAt,DESC`
+    : `posts?post-type=${postType}&page=${page}&size=${limit}&sorted=modifiedAt,DESC&post-status=${postStatus}&disability-type=${disabilityType}&assistance-type=${assistanceType}`;
 
   const { data } = await axiosInstance.get(url);
 
diff --git a/src/components/page-layout/helpMeLayout/components/helpMeLayout.tsx b/src/components/page-layout/helpMeLayout/components/helpMeLayout.tsx
index 2e5638c..27e7c61 100644
--- a/src/components/page-layout/helpMeLayout/components/helpMeLayout.tsx
+++ b/src/components/page-layout/helpMeLayout/components/helpMeLayout.tsx
@@ -1,4 +1,7 @@
+import { useEffect } from "react";
+
 import { keepPreviousData, useQuery } from "@tanstack/react-query";
+import { all } from "axios";
 import classNames from "classnames/bind";
 
 import Link from "next/link";
@@ -19,7 +22,9 @@ const cn = classNames.bind(styles);
 export default function HelpMeLayout() {
   const router = useRouter();
   const params = new URLSearchParams(router.query as any);
+
   const currentPage = params.get("page");
+  const allType = params.get("allType") ?? "";
   const disabilityType = params.get("disabilityType") ?? "";
   const assistanceType = params.get("assistanceType") ?? "";
   const postStatus = params.get("postStatus") ?? "";
@@ -33,30 +38,47 @@ export default function HelpMeLayout() {
       query: { ...Object.fromEntries(params.entries()) },
     });
   };
+  console.log(allType);
 
   const { data } = useQuery({
     queryKey: ["post", page, disabilityType, assistanceType, postStatus],
-    queryFn: () => getPagenationItems("TAKER", page, 8, `${postStatus}`, `${disabilityType}`, `${assistanceType}`),
+    queryFn: () => getPagenationItems("TAKER", page, 8, allType, postStatus, disabilityType, assistanceType),
     placeholderData: keepPreviousData,
+    enabled: !!allType || !!disabilityType || !!assistanceType || !!postStatus,
   });
 
   const handleFilter = (category: string, optionId: string) => {
     const searchParams = new URLSearchParams(params.toString());
+    const selectedAllType = searchParams.get("allType") ?? "";
     const selectedDisabilityType = searchParams.get("disabilityType") ?? "";
     const selectedAssistanceType = searchParams.get("assistanceType") ?? "";
     const selectedPostStatus = searchParams.get("postStatus") ?? "";
 
+    let allTypeList = selectedAllType ? selectedAllType.split(",") : [];
     let disabilityTypeList = selectedDisabilityType ? selectedDisabilityType.split(",") : [];
     let assistanceTypeList = selectedAssistanceType ? selectedAssistanceType.split(",") : [];
     let postStatusList = selectedPostStatus ? selectedPostStatus.split(",") : [];
 
-    if (category === "disabilityType") {
+    if (category === "allType") {
+      if (allTypeList.includes(optionId)) {
+        allTypeList = allTypeList.filter((e) => e !== optionId);
+        searchParams.set("allType", allTypeList.join(","));
+        searchParams.delete("allType");
+      } else {
+        allTypeList.push(optionId);
+        searchParams.set("allType", allTypeList.join(","));
+        searchParams.delete("disabilityType");
+        searchParams.delete("assistanceType");
+        searchParams.delete("postStatus");
+      }
+    } else if (category === "disabilityType") {
       if (disabilityTypeList.includes(optionId)) {
         disabilityTypeList = disabilityTypeList.filter((e) => e !== optionId);
         searchParams.set("disabilityType", disabilityTypeList.join(","));
       } else {
         disabilityTypeList.push(optionId);
         searchParams.set("disabilityType", disabilityTypeList.join(","));
+        searchParams.delete("allType");
       }
     } else if (category === "assistanceType") {
       if (assistanceTypeList.includes(optionId)) {
@@ -65,6 +87,7 @@ export default function HelpMeLayout() {
       } else {
         assistanceTypeList.push(optionId);
         searchParams.set("assistanceType", assistanceTypeList.join(","));
+        searchParams.delete("allType");
       }
     } else if (category === "postStatus") {
       if (postStatusList.includes(optionId)) {
@@ -73,6 +96,7 @@ export default function HelpMeLayout() {
       } else {
         postStatusList.push(optionId);
         searchParams.set("postStatus", postStatusList.join(","));
+        searchParams.delete("allType");
       }
     }
 
@@ -82,6 +106,13 @@ export default function HelpMeLayout() {
     });
   };
 
+  useEffect(() => {
+    if (!params.has("allType")) {
+      params.set("allType", "전체");
+      router.replace(`${router.pathname}?${params.toString()}`);
+    }
+  }, []);
+
   return (
     <main className={cn("container")}>
       <div className={cn("filterContainer")}>
diff --git a/src/components/page-layout/helpYouLayout/components/helpYouLayout.tsx b/src/components/page-layout/helpYouLayout/components/helpYouLayout.tsx
index a1b17ac..26f0669 100644
--- a/src/components/page-layout/helpYouLayout/components/helpYouLayout.tsx
+++ b/src/components/page-layout/helpYouLayout/components/helpYouLayout.tsx
@@ -1,3 +1,5 @@
+import { useEffect } from "react";
+
 import { keepPreviousData, useQuery } from "@tanstack/react-query";
 import classNames from "classnames/bind";
 
@@ -20,6 +22,7 @@ export default function HelpYouLayout() {
   const router = useRouter();
   const params = new URLSearchParams(router.query as any);
   const currentPage = params.get("page");
+  const allType = params.get("allType") ?? "";
   const disabilityType = params.get("disabilityType") ?? "";
   const assistanceType = params.get("assistanceType") ?? "";
   const postStatus = params.get("postStatus") ?? "";
@@ -36,27 +39,43 @@ export default function HelpYouLayout() {
 
   const { data } = useQuery({
     queryKey: ["post", page, postStatus, disabilityType, assistanceType, postStatus],
-    queryFn: () => getPagenationItems("GIVER", page, 8, `${postStatus}`, `${disabilityType}`, `${assistanceType}`),
+    queryFn: () => getPagenationItems("GIVER", page, 8, allType, postStatus, disabilityType, assistanceType),
     placeholderData: keepPreviousData,
+    enabled: !!allType || !!disabilityType || !!assistanceType || !!postStatus,
   });
 
   const handleFilter = (category: string, optionId: string) => {
     const searchParams = new URLSearchParams(params.toString());
+    const selectedAllType = searchParams.get("allType") ?? "";
     const selectedDisabilityType = searchParams.get("disabilityType") ?? "";
     const selectedAssistanceType = searchParams.get("assistanceType") ?? "";
     const selectedPostStatus = searchParams.get("postStatus") ?? "";
 
-    let disabililtyTypeList = selectedDisabilityType ? selectedDisabilityType.split(",") : [];
+    let allTypeList = selectedAllType ? selectedAllType.split(",") : [];
+    let disabilityTypeList = selectedDisabilityType ? selectedDisabilityType.split(",") : [];
     let assistanceTypeList = selectedAssistanceType ? selectedAssistanceType.split(",") : [];
     let postStatusList = selectedPostStatus ? selectedPostStatus.split(",") : [];
 
-    if (category === "disabilityType") {
-      if (disabililtyTypeList.includes(optionId)) {
-        disabililtyTypeList = disabililtyTypeList.filter((e) => e !== optionId);
-        searchParams.set("disabilityType", disabililtyTypeList.join(","));
+    if (category === "allType") {
+      if (allTypeList.includes(optionId)) {
+        allTypeList = allTypeList.filter((e) => e !== optionId);
+        searchParams.set("allType", allTypeList.join(","));
+        searchParams.delete("allType");
+      } else {
+        allTypeList.push(optionId);
+        searchParams.set("allType", allTypeList.join(","));
+        searchParams.delete("disabilityType");
+        searchParams.delete("assistanceType");
+        searchParams.delete("postStatus");
+      }
+    } else if (category === "disabilityType") {
+      if (disabilityTypeList.includes(optionId)) {
+        disabilityTypeList = disabilityTypeList.filter((e) => e !== optionId);
+        searchParams.set("disabilityType", disabilityTypeList.join(","));
       } else {
-        disabililtyTypeList.push(optionId);
-        searchParams.set("disabilityType", disabililtyTypeList.join(","));
+        disabilityTypeList.push(optionId);
+        searchParams.set("disabilityType", disabilityTypeList.join(","));
+        searchParams.delete("allType");
       }
     } else if (category === "assistanceType") {
       if (assistanceTypeList.includes(optionId)) {
@@ -65,6 +84,7 @@ export default function HelpYouLayout() {
       } else {
         assistanceTypeList.push(optionId);
         searchParams.set("assistanceType", assistanceTypeList.join(","));
+        searchParams.delete("allType");
       }
     } else if (category === "postStatus") {
       if (postStatusList.includes(optionId)) {
@@ -73,6 +93,7 @@ export default function HelpYouLayout() {
       } else {
         postStatusList.push(optionId);
         searchParams.set("postStatus", postStatusList.join(","));
+        searchParams.delete("allType");
       }
     }
 
@@ -82,6 +103,13 @@ export default function HelpYouLayout() {
     });
   };
 
+  useEffect(() => {
+    if (!params.has("allType")) {
+      params.set("allType", "전체");
+      router.replace(`${router.pathname}?${params.toString()}`);
+    }
+  }, []);
+
   return (
     <main className={cn("container")}>
       <div className={cn("typeContainer")}>
@@ -93,7 +121,7 @@ export default function HelpYouLayout() {
       </div>
       <Link href={ROUTE.HELP_YOU_REGISTER} className={cn("button")}>
         작성하기
-        <RegisterArrow className={cn("arrow")}/>
+        <RegisterArrow className={cn("arrow")} />
       </Link>
       <div className={cn("cardListContainer")}>
         <div className={cn("cardListBox")}>

From 6b0f4ffd24455d21e2ec9f9c1457894fe2199c93 Mon Sep 17 00:00:00 2001
From: minbo <smb5174@naver.com>
Date: Sun, 1 Dec 2024 16:22:10 +0900
Subject: [PATCH 3/4] =?UTF-8?q?refactor:=20=EC=BD=98=EC=86=94=EB=AC=B8=20?=
 =?UTF-8?q?=EC=A0=9C=EA=B1=B0?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../page-layout/helpMeLayout/components/helpMeLayout.tsx         | 1 -
 1 file changed, 1 deletion(-)

diff --git a/src/components/page-layout/helpMeLayout/components/helpMeLayout.tsx b/src/components/page-layout/helpMeLayout/components/helpMeLayout.tsx
index 27e7c61..de7f501 100644
--- a/src/components/page-layout/helpMeLayout/components/helpMeLayout.tsx
+++ b/src/components/page-layout/helpMeLayout/components/helpMeLayout.tsx
@@ -38,7 +38,6 @@ export default function HelpMeLayout() {
       query: { ...Object.fromEntries(params.entries()) },
     });
   };
-  console.log(allType);
 
   const { data } = useQuery({
     queryKey: ["post", page, disabilityType, assistanceType, postStatus],

From b4769fe3c4109d4e4dacaf3b873b201e76b74cc5 Mon Sep 17 00:00:00 2001
From: minbo <smb5174@naver.com>
Date: Sun, 1 Dec 2024 17:47:38 +0900
Subject: [PATCH 4/4] =?UTF-8?q?refactor:=20=ED=95=84=ED=84=B0=EB=A7=81=20?=
 =?UTF-8?q?=EB=B0=A9=EC=8B=9D=20=EB=B3=80=EA=B2=BD?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

유요한 쿼리 파라미터만 api 요청으로 전달
---
 .../common/Filter/Filter.module.scss          |  2 +-
 src/components/common/Filter/Filter.tsx       |  4 +-
 .../common/Filter/constants/index.ts          |  2 +-
 .../common/Pagenation/apis/getHelpMeList.ts   |  6 ++-
 .../helpMeLayout/components/helpMeLayout.tsx  | 51 ++++++++++---------
 5 files changed, 37 insertions(+), 28 deletions(-)

diff --git a/src/components/common/Filter/Filter.module.scss b/src/components/common/Filter/Filter.module.scss
index 7ec1499..47f5816 100644
--- a/src/components/common/Filter/Filter.module.scss
+++ b/src/components/common/Filter/Filter.module.scss
@@ -26,7 +26,7 @@
   margin: auto;
 }
 
-.allType {
+.all {
   @include nsnFont(1.5rem, 400, normal);
   background-color: white;
   padding: 1rem 0rem;
diff --git a/src/components/common/Filter/Filter.tsx b/src/components/common/Filter/Filter.tsx
index cfc7e2e..0f23573 100644
--- a/src/components/common/Filter/Filter.tsx
+++ b/src/components/common/Filter/Filter.tsx
@@ -45,7 +45,9 @@ export default function Filter({ searchParams, handleFilter }: FilterProps) {
               const selectedOptions = searchParams.get(categoryName)?.split(",") || [];
               const isSelected = selectedOptions.includes(option);
               const displayOption =
-                categoryName === "postStatus"
+                categoryName === "all"
+                  ? "전체"
+                  : categoryName === "postStatus"
                   ? option === "RECRUITING"
                     ? "모집중"
                     : option === "FINISHED"
diff --git a/src/components/common/Filter/constants/index.ts b/src/components/common/Filter/constants/index.ts
index 0891fb4..bdb65ac 100644
--- a/src/components/common/Filter/constants/index.ts
+++ b/src/components/common/Filter/constants/index.ts
@@ -1,5 +1,5 @@
 export const Categories = {
-  allType: ["전체"],
+  all: ["true"],
   disabilityType: ["시각장애", "청각장애", "지적장애", "지체장애", "자폐성장애", "뇌병변장애", "정신장애"],
   assistanceType: ["식사", "이동", "학습"],
   postStatus: ["RECRUITING", "FINISHED"],
diff --git a/src/components/common/Pagenation/apis/getHelpMeList.ts b/src/components/common/Pagenation/apis/getHelpMeList.ts
index 88455d0..b589a5e 100644
--- a/src/components/common/Pagenation/apis/getHelpMeList.ts
+++ b/src/components/common/Pagenation/apis/getHelpMeList.ts
@@ -11,8 +11,10 @@ export default async function getPagenationItems(
 ) {
   const url = allType
     ? `posts?post-type=${postType}&page=${page}&size=${limit}&sorted=modifiedAt,DESC`
-    : `posts?post-type=${postType}&page=${page}&size=${limit}&sorted=modifiedAt,DESC&post-status=${postStatus}&disability-type=${disabilityType}&assistance-type=${assistanceType}`;
-
+    : `posts?post-type=${postType}&page=${page}&size=${limit}&sorted=modifiedAt,DESC` +
+      (postStatus ? `&post-status=${postStatus}` : "") +
+      (disabilityType ? `&disability-type=${disabilityType}` : "") +
+      (assistanceType ? `&assistance-type=${assistanceType}` : "");
   const { data } = await axiosInstance.get(url);
 
   return data;
diff --git a/src/components/page-layout/helpMeLayout/components/helpMeLayout.tsx b/src/components/page-layout/helpMeLayout/components/helpMeLayout.tsx
index de7f501..7d8d126 100644
--- a/src/components/page-layout/helpMeLayout/components/helpMeLayout.tsx
+++ b/src/components/page-layout/helpMeLayout/components/helpMeLayout.tsx
@@ -1,7 +1,6 @@
 import { useEffect } from "react";
 
 import { keepPreviousData, useQuery } from "@tanstack/react-query";
-import { all } from "axios";
 import classNames from "classnames/bind";
 
 import Link from "next/link";
@@ -24,7 +23,7 @@ export default function HelpMeLayout() {
   const params = new URLSearchParams(router.query as any);
 
   const currentPage = params.get("page");
-  const allType = params.get("allType") ?? "";
+  const all = params.get("all") ?? "";
   const disabilityType = params.get("disabilityType") ?? "";
   const assistanceType = params.get("assistanceType") ?? "";
   const postStatus = params.get("postStatus") ?? "";
@@ -41,9 +40,9 @@ export default function HelpMeLayout() {
 
   const { data } = useQuery({
     queryKey: ["post", page, disabilityType, assistanceType, postStatus],
-    queryFn: () => getPagenationItems("TAKER", page, 8, allType, postStatus, disabilityType, assistanceType),
+    queryFn: () => getPagenationItems("TAKER", page, 8, all, postStatus, disabilityType, assistanceType),
     placeholderData: keepPreviousData,
-    enabled: !!allType || !!disabilityType || !!assistanceType || !!postStatus,
+    enabled: !!all || !!disabilityType || !!assistanceType || !!postStatus,
   });
 
   const handleFilter = (category: string, optionId: string) => {
@@ -58,44 +57,50 @@ export default function HelpMeLayout() {
     let assistanceTypeList = selectedAssistanceType ? selectedAssistanceType.split(",") : [];
     let postStatusList = selectedPostStatus ? selectedPostStatus.split(",") : [];
 
-    if (category === "allType") {
-      if (allTypeList.includes(optionId)) {
-        allTypeList = allTypeList.filter((e) => e !== optionId);
-        searchParams.set("allType", allTypeList.join(","));
-        searchParams.delete("allType");
-      } else {
-        allTypeList.push(optionId);
-        searchParams.set("allType", allTypeList.join(","));
-        searchParams.delete("disabilityType");
-        searchParams.delete("assistanceType");
-        searchParams.delete("postStatus");
-      }
+    if (category === "all") {
+      allTypeList.push(optionId);
+      searchParams.set("all", allTypeList.join(","));
+      searchParams.delete("disabilityType");
+      searchParams.delete("assistanceType");
+      searchParams.delete("postStatus");
     } else if (category === "disabilityType") {
       if (disabilityTypeList.includes(optionId)) {
         disabilityTypeList = disabilityTypeList.filter((e) => e !== optionId);
-        searchParams.set("disabilityType", disabilityTypeList.join(","));
+        if (disabilityTypeList.length === 0) {
+          searchParams.delete("disabilityType");
+        } else {
+          searchParams.set("disabilityType", disabilityTypeList.join(","));
+        }
       } else {
         disabilityTypeList.push(optionId);
         searchParams.set("disabilityType", disabilityTypeList.join(","));
-        searchParams.delete("allType");
+        searchParams.delete("all");
       }
     } else if (category === "assistanceType") {
       if (assistanceTypeList.includes(optionId)) {
         assistanceTypeList = assistanceTypeList.filter((e) => e !== optionId);
-        searchParams.set("assistanceType", assistanceTypeList.join(","));
+        if (assistanceTypeList.length === 0) {
+          searchParams.delete("assistanceType");
+        } else {
+          searchParams.set("assistanceType", assistanceTypeList.join(","));
+        }
       } else {
         assistanceTypeList.push(optionId);
         searchParams.set("assistanceType", assistanceTypeList.join(","));
-        searchParams.delete("allType");
+        searchParams.delete("all");
       }
     } else if (category === "postStatus") {
       if (postStatusList.includes(optionId)) {
         postStatusList = postStatusList.filter((e) => e !== optionId);
-        searchParams.set("postStatus", postStatusList.join(","));
+        if (postStatusList.length === 0) {
+          searchParams.delete("postStatus");
+        } else {
+          searchParams.set("postStatus", postStatusList.join(","));
+        }
       } else {
         postStatusList.push(optionId);
         searchParams.set("postStatus", postStatusList.join(","));
-        searchParams.delete("allType");
+        searchParams.delete("all");
       }
     }
 
@@ -107,7 +112,7 @@ export default function HelpMeLayout() {
 
   useEffect(() => {
     if (!params.has("allType")) {
-      params.set("allType", "전체");
+      params.set("all", "true");
       router.replace(`${router.pathname}?${params.toString()}`);
     }
   }, []);