dev deploy action 수정 반영 2

src/pages/CalendarView.tsx

@@ -47,7 +47,7 @@ const CalendarView = () => {
 	const [showSideMonth, setShowSideMonth] = useState<boolean>(false);
 	const [clickedDate, setClickedDate] = useState<Date>(new Date());
 
-	/** ----------------------  FETCH MONTH / WEEK / DAY data -------------------- */ 
+	/** ----------------------  FETCH MONTH / WEEK / DAY data -------------------- */
 
 	const navigate = useNavigate();
 

src/pages/MainDay.tsx

@@ -1,4 +1,4 @@
-import { useEffect, useState } from "react";
+import { useEffect } from "react";
 import { useNavigate } from "react-router-dom";
 import styles from "@styles/CalendarView.module.css";
 import MonthSideView from "@widgets/Month/MonthSideView/MonthSideView";
@@ -7,16 +7,13 @@ import BottomNav from "@/widgets/BottomNav";
 import { useEvents } from "@/contexts/EventContext";
 import { useDetail } from "@/contexts/DetailContext";
 import { FilterSheet } from "@/widgets/FilterSheet/FilterSheet";
-import Modal from "@/widgets/Modal";
 
 const MOBILE_MAX_WIDTH = 576;
 
 const MainDay = () => {
 	const navigate = useNavigate();
 	const { dayDate } = useEvents();
 	const { showDetail, clickedEventId } = useDetail();
-	const [isLoginModalOpen, setIsLoginModalOpen] = useState(false);
-
 
 	useEffect(() => {
 		const checkWidth = () => {
@@ -36,7 +33,7 @@ const MainDay = () => {
 	return (
 		<div className={`${styles.container} ${styles.mainDay}`}>
 			<div className={styles.calendarContainer}>
-				<MonthSideView day={dayDate} onClose={handleClose} onLoginPrompt={()=>setIsLoginModalOpen(true)} />
+				<MonthSideView day={dayDate} onClose={handleClose} />
 				{showDetail && clickedEventId !== undefined && (
 					<div className={`${styles.sidePanel} ${styles.detailPanel}`}>
 						<DetailView eventId={clickedEventId} />
@@ -45,17 +42,6 @@ const MainDay = () => {
 			</div>
 			<FilterSheet />
 			{!showDetail && <BottomNav />}
-			{isLoginModalOpen && (
-				<Modal
-					content="로그인 이후 이용해주세요"
-					leftText="로그인"
-					rightText="닫기"
-					onLeftClick={() => navigate("/")}
-					onRightClick={() => setIsLoginModalOpen(false)}
-					onClose={() => setIsLoginModalOpen(false)}
-				/>
-			)}
-
 		</div>
 	);
 };

src/styles/DayEvent.module.css

@@ -1,36 +1,43 @@
 .dayEventContainer {
-	height: 100%;
-	width: 100%;
-	padding: 4px 8px;
-	border-radius: 4px;
-	display: flex;
-	flex-direction: column;
-	align-items: center;
-	justify-content: center;
-	text-align: center;
-	opacity: 90%;
-	color: rgb(27, 27, 27);
-	font-size: 13px;
-	font-weight: 500;
-	line-height: 1.3;
-	box-sizing: border-box;
+  height: 100%;
+  width: 100%;
+  padding: 4px 8px;
+  border-radius: 4px;
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  justify-content: center;
+  text-align: center;
+  opacity: 90%;
+  color: rgb(27, 27, 27);
+  font-size: 13px;
+  font-weight: 500;
+  line-height: 1.3;
+  box-sizing: border-box;
 }
 
 .eventContent {
-	width: 100%;
-	height: fit-content;
-	word-wrap: break-word;
-	overflow-wrap: break-word;
+  width: 100%;
+  height: fit-content;
+  word-wrap: break-word;
+  overflow-wrap: break-word;
 }
 
 .eventTitle {
-	font-weight: 600;
+  font-weight: 600;
 }
 
 .eventMeta {
-	font-weight: 400;
-	font-size: 12px;
+  font-weight: 400;
+  font-size: 12px;
 }
+
+.blockLocation {
+  overflow: hidden;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+}
+
 /* 
 .arrowEventContainer {
   display: flex;

src/styles/DetailView.module.css

@@ -127,3 +127,16 @@
   height: auto !important;
   display: block !important;
 }
+
+.locationRow {
+  display: flex;
+  flex-flow: row nowrap;
+  margin-top: 5px;
+  gap: 5px;
+  align-items: center;
+}
+.locationRow > span {
+  font-size: 14px;
+  font-weight: 500;
+  color: #555555;
+}

src/widgets/Day/DayEvent.tsx

@@ -13,6 +13,9 @@ const DayEvent = ({ event: calendarEvent }: { event: CalendarEvent }) => {
 	const { event } = calendarEvent.resource;
 	const color = CATEGORY_COLORS[event.eventTypeId] || CATEGORY_COLORS[6];
 
+	const location = event.location?.trim();
+	const shouldShowLocation = location && location !== "-";
+
 	return (
 		<div
 			className={styles.dayEventContainer}
@@ -23,12 +26,16 @@ const DayEvent = ({ event: calendarEvent }: { event: CalendarEvent }) => {
 			<div className={`${styles.eventContent} ${styles.eventTitle}`}>
 				{event.title}
 			</div>
-			<div className={styles.eventContent}>
+			{!calendarEvent.allDay && (
+				<div className={styles.eventContent}>
 				{formatTime(calendarEvent.start)} - {formatTime(calendarEvent.end)}
+				</div>
+			)}
+			{shouldShowLocation && (
+			<div className={`${styles.eventContent} ${styles.eventMeta} ${styles.blockLocation}`}>
+				{location}
 			</div>
-			<div className={`${styles.eventContent} ${styles.eventMeta}`}>
-				{event.location === "-" ? "" : event.location}
-			</div>
+			)}
 		</div>
 	);
 };

src/widgets/DetailView/index.tsx

@@ -4,7 +4,7 @@ import { useNavigate } from "react-router-dom";
 import styles from "@styles/DetailView.module.css";
 import { getDDay } from "../../util/Calendar/getDday";
 import { CATEGORY_COLORS, CATEGORY_LIST } from "@constants";
-import { FaAnglesRight } from "react-icons/fa6";
+import { FaAnglesRight, FaLocationDot } from "react-icons/fa6";
 import type { CalendarEvent, EventDetail } from "@types";
 import DOMPurify from "isomorphic-dompurify";
 import parse from "html-react-parser";
@@ -157,6 +157,12 @@ const DetailView = ({ eventId }: { eventId: number }) => {
 			</button>
 			<h1 className={styles.title}>{event.title}</h1>
 			<EventDate event={event} />
+			{event.location && (
+				<div className={styles.locationRow}>
+					<FaLocationDot color="#555555" />
+					<span>{event.location}</span>
+				</div>
+			)}
 			<ul className={styles.chipsList}>
 				<li className={styles.deadlineChip}>{getDDay(ddayTargetDate)}</li>
 				<li

src/widgets/Month/MonthSideView/CardView.tsx

@@ -56,7 +56,7 @@ const MobileChipsList = ({ event }: { event: Event }) => {
 	)
 }
 
-const CardView = ({ event, onLoginPrompt }: { event: Event; onLoginPrompt: () => void; }) => {
+const CardView = ({ event, onLoginPrompt }: { event: Event; onLoginPrompt?: () => void; }) => {
 	const ddayTargetDate = event.applyEnd;
 	const {user} = useAuth();
 
@@ -72,7 +72,7 @@ const CardView = ({ event, onLoginPrompt }: { event: Event; onLoginPrompt: () =>
 		e.stopPropagation();
 
 		if (!user) {	
-			onLoginPrompt();
+			onLoginPrompt?.();
 			return;
 		}
 

src/widgets/Month/MonthSideView/MonthSideView.tsx

@@ -1,4 +1,5 @@
 import { useMemo, useState } from "react";
+import { useNavigate } from "react-router-dom";
 import { FaAngleLeft, FaAngleRight, FaAnglesRight } from "react-icons/fa6";
 import styles from "@styles/MonthSideView.module.css";
 import CardView from "./CardView";
@@ -12,16 +13,17 @@ import { useFilter } from "@/contexts/FilterContext";
 import { useUserData } from "@/contexts/UserDataContext";
 import { useDayEvents } from "@/contexts/useCalendarEvents";
 import { FilterButton } from "@/widgets/Toolbar";
+import Modal from "@/widgets/Modal";
 
 const MonthSideView = ({
 	day,
 	onClose,
-	onLoginPrompt,
 }: {
 	day: Date;
 	onClose: () => void;
-	onLoginPrompt: () => void;
 }) => {
+	const navigate = useNavigate();
+	const [isLoginModalOpen, setIsLoginModalOpen] = useState(false);
 	const { setShowDetail, setClickedEventId } = useDetail();
 	const [date, setDate] = useState<Date>(day);
 	const { globalCategory, globalOrg, globalStatus, setFilterSheetShowing } = useFilter();
@@ -76,6 +78,16 @@ const MonthSideView = ({
 
 	return (
 		<div className={styles.mainWrapper}>
+			{isLoginModalOpen && (
+				<Modal
+					content="로그인 이후 이용해주세요"
+					leftText="로그인"
+					rightText="닫기"
+					onLeftClick={() => navigate("/")}
+					onRightClick={() => setIsLoginModalOpen(false)}
+					onClose={() => setIsLoginModalOpen(false)}
+				/>
+			)}
 			<button type="button" className={styles.foldBtn} onClick={onClose}>
 				<FaAnglesRight
 					width={24}
@@ -112,7 +124,7 @@ const MonthSideView = ({
 						onKeyDown={(e) => e.key === "Enter" && handleDetailClick(event.id)}
 						className={styles.cardButton}
 					>
-						<CardView key={event.id} event={event} onLoginPrompt={onLoginPrompt} />
+						<CardView key={event.id} event={event} onLoginPrompt={() => setIsLoginModalOpen(true)} />
 					</div>
 				))}
 			</div>