diff --git a/frontend/src/pages/DashboardPage.jsx b/frontend/src/pages/DashboardPage.jsx index 7f83240..fd6d1ab 100644 --- a/frontend/src/pages/DashboardPage.jsx +++ b/frontend/src/pages/DashboardPage.jsx @@ -129,6 +129,7 @@ export default function DashboardPage() { const [checkedIds, setCheckedIds] = useState(new Set()); // 내가 체크한 항목 id들 const [loading, setLoading] = useState(true); const [toggleError, setToggleError] = useState(''); // 체크 저장 실패 안내 + const [docs, setDocs] = useState([]); // 학습 문서 목록(주차별 과제집 연결용) // 학습 포인트: week가 바뀔 때마다 useEffect가 다시 실행된다 (의존성 배열 [week]). // 체크리스트와 내 진행 상황을 함께 불러온다. @@ -155,6 +156,11 @@ export default function DashboardPage() { }; }, [week]); + // 학습 문서 목록을 한 번 불러온다 — 대시보드에서 이 주차 학습 문서로 바로 잇기 위해. + useEffect(() => { + client.get('/documents').then((res) => setDocs(res.data)).catch(() => {}); + }, []); + async function toggle(itemId) { // 서버에 토글을 요청하고, 서버가 알려준 최종 상태(checked)로 화면을 맞춘다. // 학습 포인트: 저장이 실패하면(오프라인·세션만료·500) 조용히 넘어가면 학생은 "체크를 @@ -179,6 +185,9 @@ export default function DashboardPage() { const doneCount = items.filter((item) => checkedIds.has(item.id)).length; const percent = items.length === 0 ? 0 : Math.round((doneCount / items.length) * 100); + // 이 주차 학습 문서(주차별 과제집). 대시보드에서 "무엇부터 볼지"를 잇는 고리. + const weekDocs = docs.filter((d) => d.week === week); + // day별로 묶어서 보여준다 (day가 null인 항목은 "주간 공통"으로). const groups = new Map(); for (const item of items) { @@ -253,6 +262,19 @@ export default function DashboardPage() { ))} + {/* 이 주차 학습 문서로 가는 고리 — 대시보드를 "학습 허브"로. 문서 → 체크 흐름을 만든다. */} + {weekDocs.length > 0 && ( +
+ {weekDocs.map((d) => ( + + 📚 학습 문서 + {d.title} + 체크 전에 먼저 읽어 보세요 → + + ))} +
+ )} + {toggleError && (

{toggleError}

)}