37 lines
1.4 KiB
TypeScript
37 lines
1.4 KiB
TypeScript
import Link from "next/link";
|
|
import { Button } from "@/components/ui/button";
|
|
|
|
interface DashboardAccessGateProps {
|
|
canAccess: boolean;
|
|
}
|
|
|
|
/**
|
|
* @description KIS 인증 여부에 따라 대시보드 접근 가이드를 렌더링합니다.
|
|
* @param canAccess 대시보드 접근 가능 여부
|
|
* @see features/dashboard/components/DashboardContainer.tsx 인증되지 않은 경우 이 컴포넌트를 렌더링합니다.
|
|
*/
|
|
export function DashboardAccessGate({ canAccess }: DashboardAccessGateProps) {
|
|
if (canAccess) return null;
|
|
|
|
return (
|
|
<div className="flex h-full items-center justify-center p-6">
|
|
<section className="w-full max-w-xl rounded-2xl border border-brand-200 bg-background p-6 shadow-sm dark:border-brand-800/45 dark:bg-brand-900/18">
|
|
{/* ========== UNVERIFIED NOTICE ========== */}
|
|
<h2 className="text-lg font-semibold text-foreground">
|
|
대시보드를 보려면 한국투자증권 연결이 필요합니다.
|
|
</h2>
|
|
<p className="mt-2 text-sm text-muted-foreground">
|
|
설정 페이지에서 앱키, 앱시크릿키, 계좌번호를 입력하고 연결을 완료해 주세요.
|
|
</p>
|
|
|
|
{/* ========== ACTION ========== */}
|
|
<div className="mt-4">
|
|
<Button asChild className="bg-brand-600 hover:bg-brand-700">
|
|
<Link href="/settings">설정 페이지로 이동</Link>
|
|
</Button>
|
|
</div>
|
|
</section>
|
|
</div>
|
|
);
|
|
}
|