feat: 세션 중, 끝났을 때 목표 표시

src/app/session/end/page.tsx

@@ -2,7 +2,7 @@
 "use client";
 
 import { useRouter, useSearchParams } from "next/navigation";
-import { useMemo } from "react";
+import { useMemo, useState } from "react";
 
 type Mode = "freeflow" | "sprint" | "deepwork";
 
@@ -34,11 +34,17 @@ export default function SessionEndPage() {
   const router = useRouter();
   const params = useSearchParams();
 
-  const mode = useMemo(() => clampMode(params.get("mode")), [params]);
-  const elapsed = useMemo(() => {
-    const v = Number(params.get("elapsed") ?? "0");
+  const [elapsed, setElapsed] = useState(() => {
+    const v = Number(localStorage.getItem("hushroom:session-elapsed") ?? "0");
     return Number.isFinite(v) ? v : 0;
-  }, [params]);
+  });
+
+  const [goal, setGoal] = useState(() => {
+    const goal = localStorage.getItem("hushroom:session-goal");
+    return goal;
+  });
+
+  const mode = useMemo(() => clampMode(params.get("mode")), [params]);
 
   return (
     <main className="min-h-screen w-full" style={{ backgroundColor: BG }}>
@@ -59,6 +65,22 @@ export default function SessionEndPage() {
           <div className="mt-3 text-[44px] font-semibold leading-none text-slate-900 tabular-nums">
             {hhmmss(elapsed)}
           </div>
+
+          {/* Goal */}
+          {goal && (
+            <div
+              className="mt-4 rounded-2xl border bg-[#F1F5FF] px-4 py-3"
+              style={{ borderColor: BORDER }}
+            >
+              <div className="text-xs font-semibold text-slate-600">
+                이번 목표
+              </div>
+              <div className="mt-1 text-xl font-semibold text-slate-900 line-clamp-2">
+                {goal}
+              </div>
+            </div>
+          )}
+
           <div className="mt-3 text-base text-slate-700">세션이 종료됐어요</div>
         </div>