diff --git a/src/atom.js b/src/atom.js
index 3ca25f4..652d80d 100644
--- a/src/atom.js
+++ b/src/atom.js
@@ -20,5 +20,6 @@ export const selectedDateState = atom({
});
export const selectedPriceState = atom({
key: "selectedPrice",
- default: { min: 0, max: 100000 },
+ default: {},
+ // default: { min: 0, max: 100000 },
});
diff --git a/src/components/Common/MapCon.jsx b/src/components/Common/MapCon.jsx
index e3852f2..97f32b5 100644
--- a/src/components/Common/MapCon.jsx
+++ b/src/components/Common/MapCon.jsx
@@ -100,7 +100,7 @@ export default function MapCon() {
const OverlayWrapper = styled.div`
background-color: #4aabf9;
width: 191px;
- height: 34px;
+ height: 20px;
border-radius: 10px;
padding: 11px;
box-shadow: 0 0 5px rgba(0, 0, 0, 0.2);
diff --git a/src/components/MainPage/SelectedContentBox.jsx b/src/components/MainPage/SelectedContentBox.jsx
index bed9dbe..c267330 100644
--- a/src/components/MainPage/SelectedContentBox.jsx
+++ b/src/components/MainPage/SelectedContentBox.jsx
@@ -1,4 +1,4 @@
-import React from "react";
+import React, { useEffect } from "react";
import styled from "styled-components";
import { useRecoilState } from "recoil";
import { selectedRegionState } from "../../atom";
@@ -6,8 +6,11 @@ import { selectedSportTypeState } from "../../atom";
import { selectedDisabilityTypeState } from "../../atom";
import { selectedDateState } from "../../atom";
import { selectedPriceState } from "../../atom";
+import { useLocation } from "react-router-dom";
const SelectedContentBox = ({ handleClearSelection, regionOptions = [] }) => {
+ const location = useLocation();
+ const currentPath = location.pathname;
const [selectedRegion, setsSlectedRegion] =
useRecoilState(selectedRegionState);
const [selectedSportType, setSelectedSportType] = useRecoilState(
@@ -35,6 +38,10 @@ const SelectedContentBox = ({ handleClearSelection, regionOptions = [] }) => {
return mainRegion ? mainRegion.name : null;
};
+ useEffect(() => {
+ if (currentPath === "/") setSelectedPrice({});
+ }, []);
+
return (
<>
{selectedRegion.map((item, index) => {
@@ -88,11 +95,13 @@ const SelectedContentBox = ({ handleClearSelection, regionOptions = [] }) => {
))}
-
- #
- {selectedPrice.min.toLocaleString()}원 ~{" "}
- {selectedPrice.max.toLocaleString()}원
-
+ {selectedPrice.min !== undefined && selectedPrice.max !== undefined && (
+
+ #
+ {selectedPrice.min.toLocaleString()}원 ~{" "}
+ {selectedPrice.max.toLocaleString()}원
+
+ )}
>
);
};