Files
stock_chart_site/web/app/page.tsx
claude-owner aa58761176 feat(ui): 최근 본 종목 (localStorage + 홈 카드 + TopNav popover)
- web/lib/recent.ts: stockchart.recent KEY, push/get/clear/subscribe (storage + custom event)
- [code]/page.tsx: 페이지 진입 시 recent.push(code) — 자동 트래킹
- web/components/RecentTiles.tsx: 홈 카드 그리드 (최대 10개, 2~5컬럼)
- web/app/page.tsx: SearchBox 아래에 RecentTiles 배치 (빈 리스트면 자동 숨김)
- TopNav: 검색어 비면서 포커스 시 최근 본 종목 popover 표시 + "지우기" 버튼

토스 "최근 본 종목" 톤 — 검색 빈 상태에서도 popover 가 비어 있지 않게.

Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com>
2026-05-28 15:14:40 +09:00

62 lines
1.9 KiB
TypeScript

import Link from "next/link";
import { IndicesPanel } from "../components/IndicesPanel";
import { MarketsOverview } from "../components/MarketsOverview";
import { RecentTiles } from "../components/RecentTiles";
import { SearchBox } from "../components/SearchBox";
import { SeedTiles } from "../components/SeedTiles";
import { ThemeTiles } from "../components/ThemeTiles";
export default function HomePage() {
return (
<main className="mx-auto max-w-5xl px-6 py-12">
<div className="flex items-start justify-between gap-3">
<div>
<h1 className="text-3xl font-bold tracking-tight text-zinc-50"> </h1>
<p className="mt-2 text-sm text-zinc-400">
, <b className="text-rose-300"> </b>
15·30·1 .
</p>
</div>
<Link
href="/watchlist"
className="shrink-0 rounded-full border border-amber-500/40 bg-amber-500/10 px-3 py-1.5 text-xs text-amber-300 hover:bg-amber-500/20"
>
</Link>
</div>
<div className="mt-6">
<SearchBox autoFocus />
</div>
<div className="mt-8">
<RecentTiles />
</div>
<div className="mt-8">
<IndicesPanel />
</div>
<div className="mt-8">
<SeedTiles />
</div>
<div className="mt-8">
<ThemeTiles />
</div>
<div className="mt-6">
<MarketsOverview />
</div>
<div className="mt-6 rounded-lg border border-zinc-800 bg-zinc-900/30 p-4 text-xs text-zinc-500">
<div className="font-medium text-zinc-300"> · </div>
<div className="mt-1">
16:30 KST , 02:00 KST LGBM .
Chronos(zero-shot) + LightGBM.
</div>
</div>
</main>
);
}