feat: MyTripPage String 변경

gamgyul-code · Sep 16, 2024 · d8f06c9 · d8f06c9
1 parent 773d95d
commit d8f06c9
Show file tree

Hide file tree

Showing 2 changed files with 53 additions and 9 deletions.
diff --git a/gamgyul-front/src/constants/String.jsx b/gamgyul-front/src/constants/String.jsx
@@ -59,6 +59,45 @@ export const TRIP_ROUTE_PAGE_TEXT = {
   CH: { NAVI_LINK_BUTTON: "", BOTTOM_SHEET_MAIN: "", BOTTOM_SHEET_SUB: "", ROUTE_SAVE_BUTTON: "" },
 };
 
+export const MY_TRIP_PAGE_TEXT = {
+  EN: {
+    HEADER_MAIN: "",
+    NAV_PLACE: "",
+    NAV_ROUTE: "",
+    ROUTE_CREATE_BUTTON: "",
+    SAVED_ROUTE: "",
+    CREATED_ROUTE: "",
+    ALERT_TOAST: "",
+  },
+  KR: {
+    HEADER_MAIN: "내 여행",
+    NAV_PLACE: "장소",
+    NAV_ROUTE: "경로",
+    ROUTE_CREATE_BUTTON: "내 경로 만들기",
+    SAVED_ROUTE: "저장한 경로",
+    CREATED_ROUTE: "내가 만든 경로",
+    ALERT_TOAST: "장소는 최대 N개까지 선택할 수 있어요.",
+  },
+  JP: {
+    HEADER_MAIN: "",
+    NAV_PLACE: "",
+    NAV_ROUTE: "",
+    ROUTE_CREATE_BUTTON: "",
+    SAVED_ROUTE: "",
+    CREATED_ROUTE: "",
+    ALERT_TOAST: "",
+  },
+  CH: {
+    HEADER_MAIN: "",
+    NAV_PLACE: "",
+    NAV_ROUTE: "",
+    ROUTE_CREATE_BUTTON: "",
+    SAVED_ROUTE: "",
+    CREATED_ROUTE: "",
+    ALERT_TOAST: "",
+  },
+};
+
 /** Modal String */
 export const MODAL_TEXT = {
   EN: { ROUTE_NAME: "", ROUTE_NAME_MESSAGE: "", ROUTE_PLACEHOLDER: "", ROUTE_DELETE_MESSAGE: "" },

diff --git a/gamgyul-front/src/pages/MyTripPage/index.jsx b/gamgyul-front/src/pages/MyTripPage/index.jsx
@@ -10,13 +10,18 @@ import NavigationBar from "../../components/common/NavigationBar";
 import Modal from "../../components/common/Modal";
 import { useLocation } from "react-router-dom";
 import Toast from "../../components/common/Toast";
+import { MY_TRIP_PAGE_TEXT } from "../../constants/String";
 
 const MyTripPage = () => {
   const [activeTab, setActiveTab] = useState("places");
   const [isModalOpen, setIsModalOpen] = useState(false);
   const [checkRoutes, setCheckRoutes] = useState([]);
   const location = useLocation();
 
+  // const language = window.localStorage.getItem("lanType");
+  const language = "KR";
+  const text = MY_TRIP_PAGE_TEXT[language];
+
   useEffect(() => {
     const queryParams = new URLSearchParams(location.search);
     const tab = queryParams.get("tab");
@@ -61,7 +66,7 @@ const MyTripPage = () => {
       <MyTripContainer>
         <StyledMyTripHeader>
           <Container>
-            <h2>내 여행</h2>
+            <h2>{text.HEADER_MAIN}</h2>
           </Container>
           <nav aria-label="내 여행 (장소 / 경로)">
             <TabButton
@@ -70,15 +75,15 @@ const MyTripPage = () => {
               fontSize={theme.font.body1}
               btnCnt={2}
             >
-              장소
+              {text.NAV_PLACE}
             </TabButton>
             <TabButton
               onClick={() => setActiveTab("routes")}
               isActive={activeTab === "routes"}
               fontSize={theme.font.body1}
               btnCnt={2}
             >
-              경로
+              {text.NAV_ROUTE}
             </TabButton>
           </nav>
         </StyledMyTripHeader>
@@ -110,13 +115,14 @@ const MyTripPage = () => {
               isChecked={checkRoutes.includes(5)}
               onCheckChange={() => handleCheckChange(5)}
             />
+            <Toast>{text.ALERT_TOAST}</Toast>
             {checkRoutes.length <= 1 ? (
               <MyTripButton isShadow={true} disabled={true}>
-                내 경로 만들기
+                {text.ROUTE_CREATE_BUTTON}
               </MyTripButton>
             ) : (
               <MyTripButton isShadow={true} onClick={handleCreateRouteClick}>
-                내 경로 만들기
+                {text.ROUTE_CREATE_BUTTON}
               </MyTripButton>
             )}
           </StyledPlacesSection>
@@ -125,15 +131,15 @@ const MyTripPage = () => {
           <>
             <StyledRoutesSection>
               <Container>
-                <h3>저장한 경로</h3>
+                <h3>{text.SAVED_ROUTE}</h3>
               </Container>
               <AttractionItem />
               <AttractionItem />
               <AttractionItem />
             </StyledRoutesSection>
             <StyledRoutesSection>
               <Container>
-                <h3>내가 만든 경로</h3>
+                <h3>{text.CREATED_ROUTE}</h3>
               </Container>
               <AttractionItem type="DELETE" onDelete={handleDeleteClick} />
               <AttractionItem type="DELETE" onDelete={handleDeleteClick} />
@@ -144,7 +150,7 @@ const MyTripPage = () => {
           </>
         )}
       </MyTripContainer>
-      <Toast>Toast 테스트</Toast>
+
       <NavigationBar />
     </MyTripLayout>
   );
@@ -186,5 +192,4 @@ const MyTripButton = styled(Button)`
   max-width: calc(${theme.maxWidth} - 40px);
 `;
 
-
 export default MyTripPage;