From 0c0771a30d04a27143d28ab013769cc4d9d1d022 Mon Sep 17 00:00:00 2001
From: sangkyu <doesol1301@gmail.com>
Date: Sat, 7 Mar 2026 21:08:32 +0900
Subject: [PATCH 1/2] =?UTF-8?q?[FE]=20=EC=B6=9C=EC=84=9D=EC=A1=B0=ED=9A=8C?=
 =?UTF-8?q?=20=EC=84=B8=EC=85=98=20=EC=84=A0=ED=83=9D=20=EC=A0=84=20?=
 =?UTF-8?q?=EC=A4=91=EB=B3=B5=20=EB=B0=9C=EC=83=9D=20=ED=95=B4=EA=B2=B0?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../components/attendance/SessionManage.jsx   | 18 +++++++++---
 .../attendance/SessionSelectBox.jsx           | 12 +++++---
 frontend/src/pages/Attendance.jsx             | 28 +++++++++++++++++--
 3 files changed, 48 insertions(+), 10 deletions(-)

diff --git a/frontend/src/components/attendance/SessionManage.jsx b/frontend/src/components/attendance/SessionManage.jsx
index 55eb009a..fe0ba42c 100644
--- a/frontend/src/components/attendance/SessionManage.jsx
+++ b/frontend/src/components/attendance/SessionManage.jsx
@@ -2,6 +2,9 @@ import { useMemo } from 'react';
 import styles from './SessionManage.module.css';
 import { ClipboardCheck } from 'lucide-react';
 
+const normalizeSessionTitle = (sessionTitle) =>
+  typeof sessionTitle === 'string' && sessionTitle.trim() !== '' ? sessionTitle.trim() : '기타';
+
 const getRoundKey = (session) => session.roundId || `${session.roundDate || ''}-${session.roundStartAt || ''}`;
 
 const getTimestamp = (session) => {
@@ -44,7 +47,7 @@ const SessionManage = ({ sessions = [], selectedSession = '', loading, error })
   const roundIndexMapBySession = useMemo(() => {
     const roundMapBySession = new Map();
     sessions.forEach((session) => {
-      const sessionTitle = session.sessionTitle || '기타';
+      const sessionTitle = normalizeSessionTitle(session.sessionTitle);
       if (!roundMapBySession.has(sessionTitle)) {
         roundMapBySession.set(sessionTitle, new Map());
       }
@@ -75,11 +78,18 @@ const SessionManage = ({ sessions = [], selectedSession = '', loading, error })
   }, [sessions]);
 
   const visibleSessions = useMemo(() => {
+    const selectedSessionTitle = normalizeSessionTitle(selectedSession);
+
     const filtered = selectedSession
-      ? sessions.filter((session) => session.sessionTitle === selectedSession)
+      ? sessions.filter((session) => normalizeSessionTitle(session.sessionTitle) === selectedSessionTitle)
       : sessions;
 
-    return [...filtered].sort((a, b) => getTimestamp(a) - getTimestamp(b));
+    const deduplicated = filtered.filter((session, index, array) => {
+      if (!session?.attendanceId) return true;
+      return array.findIndex((item) => item?.attendanceId === session.attendanceId) === index;
+    });
+
+    return [...deduplicated].sort((a, b) => getTimestamp(a) - getTimestamp(b));
   }, [sessions, selectedSession]);
 
   if (error) return <div>{error}</div>;
@@ -106,7 +116,7 @@ const SessionManage = ({ sessions = [], selectedSession = '', loading, error })
 
         <tbody>
           {rows.map((s) => {
-            const sessionTitle = s.sessionTitle || '기타';
+            const sessionTitle = normalizeSessionTitle(s.sessionTitle);
             const roundKey = getRoundKey(s);
             const roundIndex = roundIndexMapBySession.get(sessionTitle)?.get(roundKey) ?? '-';
 
diff --git a/frontend/src/components/attendance/SessionSelectBox.jsx b/frontend/src/components/attendance/SessionSelectBox.jsx
index 0dbb5693..1f221c07 100644
--- a/frontend/src/components/attendance/SessionSelectBox.jsx
+++ b/frontend/src/components/attendance/SessionSelectBox.jsx
@@ -1,6 +1,9 @@
 import styles from './SessionSelectBox.module.css';
 import { ClipboardCheck } from 'lucide-react';
 
+const normalizeSessionTitle = (sessionTitle) =>
+  typeof sessionTitle === 'string' ? sessionTitle.trim() : '';
+
 const SessionSelectBox = ({
   sessions = [],
   selectedSession = '',
@@ -10,11 +13,13 @@ const SessionSelectBox = ({
   const sessionList = Array.from(
     new Set(
       sessions
-        .map((session) => session.sessionTitle)
-        .filter((sessionTitle) => typeof sessionTitle === 'string' && sessionTitle.trim() !== ''),
+        .map((session) => normalizeSessionTitle(session.sessionTitle))
+        .filter((sessionTitle) => sessionTitle !== ''),
     ),
   );
 
+  const currentValue = sessionList.includes(selectedSession) ? selectedSession : sessionList[0] || '';
+
   return (
     <div className={styles.box}>
       <div className={styles.title}>
@@ -24,11 +29,10 @@ const SessionSelectBox = ({
       <select
         id="session-select"
         className={styles.session}
-        value={selectedSession}
+        value={currentValue}
         onChange={(event) => onChange?.(event.target.value)}
         disabled={disabled}
       >
-        <option value="">세션선택</option>
         {sessionList.map((item) => (
           <option key={item} value={item}>
             {item}
diff --git a/frontend/src/pages/Attendance.jsx b/frontend/src/pages/Attendance.jsx
index 00d0da53..68f4759d 100644
--- a/frontend/src/pages/Attendance.jsx
+++ b/frontend/src/pages/Attendance.jsx
@@ -1,5 +1,5 @@
 import styles from './Attendance.module.css';
-import { useEffect, useState } from 'react';
+import { useEffect, useMemo, useState } from 'react';
 import SessionSelectBox from '../components/attendance/SessionSelectBox';
 // import ExcusedTime from '../components/attendance/ExcusedTime';
 import SessionManage from '../components/attendance/SessionManage';
@@ -17,6 +17,30 @@ const Attendance = () => {
   const [loading, setLoading] = useState(true);
   const [error, setError] = useState(null);
 
+  const sessionOptions = useMemo(() => {
+    const uniqueSessionTitles = new Set();
+
+    attendanceSessions.forEach((session) => {
+      const title = typeof session?.sessionTitle === 'string' ? session.sessionTitle.trim() : '';
+      if (title) uniqueSessionTitles.add(title);
+    });
+
+    return Array.from(uniqueSessionTitles);
+  }, [attendanceSessions]);
+
+  useEffect(() => {
+    if (sessionOptions.length === 0) {
+      if (selectedSession !== '') {
+        setSelectedSession('');
+      }
+      return;
+    }
+
+    if (!selectedSession || !sessionOptions.includes(selectedSession)) {
+      setSelectedSession(sessionOptions[0]);
+    }
+  }, [selectedSession, sessionOptions]);
+
   useEffect(() => {
     const fetchAttendance = async () => {
       try {
@@ -40,7 +64,7 @@ const Attendance = () => {
           sessions={attendanceSessions}
           selectedSession={selectedSession}
           onChange={setSelectedSession}
-          disabled={loading || !!error}
+          disabled={loading || !!error || sessionOptions.length === 0}
         />
         {/* <ExcusedTime /> */}
       </div>

From f5bfbdfa0c4b80c5d131c1efc3a1e3b2c92125e4 Mon Sep 17 00:00:00 2001
From: sangkyu <doesol1301@gmail.com>
Date: Sat, 7 Mar 2026 21:17:15 +0900
Subject: [PATCH 2/2] =?UTF-8?q?[FE]=20PR=20=EC=9A=94=EC=B2=AD=EC=82=AC?=
 =?UTF-8?q?=ED=95=AD=20=ED=95=B4=EA=B2=B0?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../components/attendance/SessionManage.jsx   | 24 +++++--
 .../attendance/SessionSelectBox.jsx           |  8 +--
 frontend/src/pages/Attendance.jsx             |  4 +-
 frontend/src/utils/attendanceList.js          | 64 ++++++++++++++++++-
 frontend/src/utils/normalizeSessionTitle.js   | 10 +++
 5 files changed, 94 insertions(+), 16 deletions(-)
 create mode 100644 frontend/src/utils/normalizeSessionTitle.js

diff --git a/frontend/src/components/attendance/SessionManage.jsx b/frontend/src/components/attendance/SessionManage.jsx
index fe0ba42c..6f9a5ae9 100644
--- a/frontend/src/components/attendance/SessionManage.jsx
+++ b/frontend/src/components/attendance/SessionManage.jsx
@@ -1,9 +1,7 @@
 import { useMemo } from 'react';
 import styles from './SessionManage.module.css';
 import { ClipboardCheck } from 'lucide-react';
-
-const normalizeSessionTitle = (sessionTitle) =>
-  typeof sessionTitle === 'string' && sessionTitle.trim() !== '' ? sessionTitle.trim() : '기타';
+import { normalizeSessionTitle } from '../../utils/normalizeSessionTitle';
 
 const getRoundKey = (session) => session.roundId || `${session.roundDate || ''}-${session.roundStartAt || ''}`;
 
@@ -84,9 +82,23 @@ const SessionManage = ({ sessions = [], selectedSession = '', loading, error })
       ? sessions.filter((session) => normalizeSessionTitle(session.sessionTitle) === selectedSessionTitle)
       : sessions;
 
-    const deduplicated = filtered.filter((session, index, array) => {
-      if (!session?.attendanceId) return true;
-      return array.findIndex((item) => item?.attendanceId === session.attendanceId) === index;
+    const seenAttendanceIds = new Set();
+    const deduplicated = [];
+
+    filtered.forEach((session) => {
+      const attendanceId = session?.attendanceId;
+
+      if (!attendanceId) {
+        deduplicated.push(session);
+        return;
+      }
+
+      if (seenAttendanceIds.has(attendanceId)) {
+        return;
+      }
+
+      seenAttendanceIds.add(attendanceId);
+      deduplicated.push(session);
     });
 
     return [...deduplicated].sort((a, b) => getTimestamp(a) - getTimestamp(b));
diff --git a/frontend/src/components/attendance/SessionSelectBox.jsx b/frontend/src/components/attendance/SessionSelectBox.jsx
index 1f221c07..e3daeed5 100644
--- a/frontend/src/components/attendance/SessionSelectBox.jsx
+++ b/frontend/src/components/attendance/SessionSelectBox.jsx
@@ -1,8 +1,6 @@
 import styles from './SessionSelectBox.module.css';
 import { ClipboardCheck } from 'lucide-react';
-
-const normalizeSessionTitle = (sessionTitle) =>
-  typeof sessionTitle === 'string' ? sessionTitle.trim() : '';
+import { normalizeSessionTitle } from '../../utils/normalizeSessionTitle';
 
 const SessionSelectBox = ({
   sessions = [],
@@ -12,9 +10,7 @@ const SessionSelectBox = ({
 }) => {
   const sessionList = Array.from(
     new Set(
-      sessions
-        .map((session) => normalizeSessionTitle(session.sessionTitle))
-        .filter((sessionTitle) => sessionTitle !== ''),
+      sessions.map((session) => normalizeSessionTitle(session.sessionTitle)),
     ),
   );
 
diff --git a/frontend/src/pages/Attendance.jsx b/frontend/src/pages/Attendance.jsx
index 68f4759d..222b8c78 100644
--- a/frontend/src/pages/Attendance.jsx
+++ b/frontend/src/pages/Attendance.jsx
@@ -4,6 +4,7 @@ import SessionSelectBox from '../components/attendance/SessionSelectBox';
 // import ExcusedTime from '../components/attendance/ExcusedTime';
 import SessionManage from '../components/attendance/SessionManage';
 import { attendanceList } from '../utils/attendanceList';
+import { normalizeSessionTitle } from '../utils/normalizeSessionTitle';
 
 import { useAuthGuard } from '../hooks/useAuthGuard';
 import { useCheckIn } from '../hooks/useCheckIn';
@@ -21,8 +22,7 @@ const Attendance = () => {
     const uniqueSessionTitles = new Set();
 
     attendanceSessions.forEach((session) => {
-      const title = typeof session?.sessionTitle === 'string' ? session.sessionTitle.trim() : '';
-      if (title) uniqueSessionTitles.add(title);
+      uniqueSessionTitles.add(normalizeSessionTitle(session?.sessionTitle));
     });
 
     return Array.from(uniqueSessionTitles);
diff --git a/frontend/src/utils/attendanceList.js b/frontend/src/utils/attendanceList.js
index 2cfe565d..f7f18d4c 100644
--- a/frontend/src/utils/attendanceList.js
+++ b/frontend/src/utils/attendanceList.js
@@ -1,10 +1,70 @@
 import { api } from './axios.js';
+import { getAttendanceSessions, getRounds } from './attendanceManage';
+
+const getSessionId = (session) =>
+  session?.sessionId || session?.attendanceSessionId || session?.id || null;
+
+const getSessionTitle = (session) =>
+  session?.session?.title || session?.title || session?.sessionTitle || '';
+
+const buildRoundMetaMap = async () => {
+  const sessions = await getAttendanceSessions();
+  if (!Array.isArray(sessions) || sessions.length === 0) return new Map();
+
+  const perSessionRoundMeta = await Promise.all(
+    sessions.map(async (session) => {
+      const sessionId = getSessionId(session);
+      if (!sessionId) return [];
+
+      try {
+        const rounds = await getRounds(sessionId);
+        if (!Array.isArray(rounds)) return [];
+
+        const sessionTitle = getSessionTitle(session);
+        return rounds
+          .filter((round) => !!round?.roundId)
+          .map((round) => [
+            round.roundId,
+            {
+              sessionTitle,
+              roundDate: round.roundDate,
+              roundStartAt: round.startAt || round.roundStartAt,
+            },
+          ]);
+      } catch {
+        return [];
+      }
+    }),
+  );
+
+  return new Map(perSessionRoundMeta.flat());
+};
 
 export const attendanceList = async () => {
   try {
     const res = await api.get('/api/attendance/me');
-    // console.log('API BASE URL:', import.meta.env.VITE_API_URL);
-    return res.data;
+
+    const records = Array.isArray(res.data) ? res.data : [];
+    if (records.length === 0) return records;
+
+    try {
+      const roundMetaMap = await buildRoundMetaMap();
+
+      return records.map((record) => {
+        const roundMeta = roundMetaMap.get(record?.roundId);
+        if (!roundMeta) return record;
+
+        return {
+          ...record,
+          sessionTitle: record?.sessionTitle || roundMeta.sessionTitle,
+          roundDate: record?.roundDate || roundMeta.roundDate,
+          roundStartAt: record?.roundStartAt || roundMeta.roundStartAt,
+        };
+      });
+    } catch {
+      // Keep attendance view available even if metadata enrichment fails.
+      return records;
+    }
   } catch (err) {
     console.error('출석 세션 불러오기 중 오류 발생: ', err);
     throw err;
diff --git a/frontend/src/utils/normalizeSessionTitle.js b/frontend/src/utils/normalizeSessionTitle.js
new file mode 100644
index 00000000..7ccc64cc
--- /dev/null
+++ b/frontend/src/utils/normalizeSessionTitle.js
@@ -0,0 +1,10 @@
+const SESSION_TITLE_FALLBACK = '기타';
+
+export const normalizeSessionTitle = (sessionTitle) => {
+  if (typeof sessionTitle !== 'string') return SESSION_TITLE_FALLBACK;
+
+  const normalizedTitle = sessionTitle.trim();
+  return normalizedTitle !== '' ? normalizedTitle : SESSION_TITLE_FALLBACK;
+};
+
+export const getSessionTitleFallback = () => SESSION_TITLE_FALLBACK;