From 3d04e38f8d6ed127d4b23c08dc94573c86c02c16 Mon Sep 17 00:00:00 2001
From: MU-Software <musoftware@daum.net>
Date: Wed, 2 Oct 2024 11:43:02 +0900
Subject: [PATCH] =?UTF-8?q?=EC=84=B8=EC=85=98=20=EC=A0=9C=EB=AA=A9?=
 =?UTF-8?q?=EC=9D=84=20=EC=A2=80=20=EB=8D=94=20URLSafe=ED=95=98=EA=B2=8C?=
 =?UTF-8?q?=20=EB=B3=80=EA=B2=BD?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/pages/Session/list.tsx      |  3 ++-
 src/pages/Session/timetable.tsx | 21 +++++++++++----------
 2 files changed, 13 insertions(+), 11 deletions(-)

diff --git a/src/pages/Session/list.tsx b/src/pages/Session/list.tsx
index 37cb8ad..181a375 100644
--- a/src/pages/Session/list.tsx
+++ b/src/pages/Session/list.tsx
@@ -20,6 +20,7 @@ const SessionItem: React.FC<{ session: APIPretalxSessions[0] }> = ({ session })
     || R.isArray(session.speakers) && !R.isEmpty(session.speakers) && session.speakers[0].avatar
     || ""
   )
+  const urlSafeTitle = session.title.replace(/ /g, "-").replace(/(?![A-Za-zㄱ-ㅣ가-힣-])./g, "")
 
   return (
     <SessionItemEl>
@@ -31,7 +32,7 @@ const SessionItem: React.FC<{ session: APIPretalxSessions[0] }> = ({ session })
         />
       </SessionItemImgContainer>
       <SessionItemInfoContainer>
-        <h4 onClick={() => navigate(`/session/${session.code}??${session.title.replace(/ /g, "-")}`)}>{session.title}</h4>
+        <h4 onClick={() => navigate(`/session/${session.code}#${urlSafeTitle}`)}>{session.title}</h4>
         <p>{session.abstract}</p>
         <SessionSpeakerContainer>
           by{" "}
diff --git a/src/pages/Session/timetable.tsx b/src/pages/Session/timetable.tsx
index c1eb787..e1abca1 100644
--- a/src/pages/Session/timetable.tsx
+++ b/src/pages/Session/timetable.tsx
@@ -1,13 +1,13 @@
-import { wrap } from "@suspensive/react";
-import React from "react";
-import * as R from "remeda";
-import styled from "styled-components";
+import { wrap } from "@suspensive/react"
+import React from "react"
+import * as R from "remeda"
+import styled from "styled-components"
 
-import Page from "components/common/Page";
-import { APIPretalxSessions } from "models/api/session";
-import { useNavigate } from "react-router";
-import { useListSessionsQuery } from "utils/hooks/useAPI";
-import useTranslation from "utils/hooks/useTranslation";
+import Page from "components/common/Page"
+import { APIPretalxSessions } from "models/api/session"
+import { useNavigate } from "react-router"
+import { useListSessionsQuery } from "utils/hooks/useAPI"
+import useTranslation from "utils/hooks/useTranslation"
 
 const TD_HEIGHT = 2.5;
 const TD_WIDTH = 12.5;
@@ -110,10 +110,11 @@ const SessionColumn: React.FC<{
   const clickable = R.isArray(session.speakers) && !R.isEmpty(session.speakers);
   // Firefox는 rowSpan된 td의 height를 계산할 때 rowSpan을 고려하지 않습니다. 따라서 직접 계산하여 height를 설정합니다.
   const sessionBoxHeight = `${TD_HEIGHT * rowSpan}rem`;
+  const urlSafeTitle = session.title.replace(/ /g, "-").replace(/(?![A-Za-zㄱ-ㅣ가-힣-])./g, "")
   return (
     <td rowSpan={rowSpan} colSpan={colSpan}>
       <SessionBox
-        onClick={() => clickable && navigate(`/session/${session.code}?${session.title.replace(/ /g, "-")}`)}
+        onClick={() => clickable && navigate(`/session/${session.code}#${urlSafeTitle}`)}
         className={clickable ? "clickable" : ""}
         style={{ height: sessionBoxHeight }}
       >