Feat: 로그인 여부에 따른 메인페이지 이동 및 dashboard 처리
This commit is contained in:
@@ -11,6 +11,7 @@ import {
|
||||
CardTitle,
|
||||
} from "@/components/ui/card";
|
||||
import Link from "next/link";
|
||||
import { AUTH_ROUTES } from "@/features/auth/constants";
|
||||
|
||||
/**
|
||||
* [비밀번호 찾기 페이지]
|
||||
@@ -72,7 +73,7 @@ export default async function ForgotPasswordPage({
|
||||
|
||||
<div className="text-center">
|
||||
<Link
|
||||
href="/login"
|
||||
href={AUTH_ROUTES.LOGIN}
|
||||
className="text-sm font-medium text-gray-700 hover:text-black dark:text-gray-300 dark:hover:text-white"
|
||||
>
|
||||
로그인 페이지로 돌아가기
|
||||
|
||||
@@ -1,4 +1,5 @@
|
||||
import Link from "next/link";
|
||||
import { AUTH_ROUTES } from "@/features/auth/constants";
|
||||
import FormMessage from "@/components/form-message";
|
||||
import SignupForm from "@/features/auth/components/signup-form";
|
||||
import {
|
||||
@@ -42,7 +43,7 @@ export default async function SignupPage({
|
||||
<p className="text-center text-sm text-gray-600 dark:text-gray-400">
|
||||
이미 계정이 있으신가요?{" "}
|
||||
<Link
|
||||
href="/login"
|
||||
href={AUTH_ROUTES.LOGIN}
|
||||
className="font-semibold text-gray-900 transition-colors hover:text-black dark:text-gray-100 dark:hover:text-white"
|
||||
>
|
||||
로그인 하러 가기
|
||||
|
||||
126
app/(home)/page.tsx
Normal file
126
app/(home)/page.tsx
Normal file
@@ -0,0 +1,126 @@
|
||||
import Link from "next/link";
|
||||
import { Button } from "@/components/ui/button";
|
||||
import { createClient } from "@/utils/supabase/server";
|
||||
import { UserMenu } from "@/features/layout/components/user-menu";
|
||||
import { AUTH_ROUTES } from "@/features/auth/constants";
|
||||
|
||||
export default async function HomePage() {
|
||||
const supabase = await createClient();
|
||||
const {
|
||||
data: { user },
|
||||
} = await supabase.auth.getUser();
|
||||
|
||||
return (
|
||||
<div className="flex min-h-screen flex-col">
|
||||
<header className="sticky top-0 z-40 flex h-14 w-full items-center justify-between border-b border-zinc-200 bg-white/75 px-6 backdrop-blur-md dark:border-zinc-800 dark:bg-black/75">
|
||||
<Link href={AUTH_ROUTES.HOME} className="flex items-center gap-2">
|
||||
<div className="h-6 w-6 rounded-md bg-zinc-900 dark:bg-zinc-50" />
|
||||
<span className="text-lg font-bold tracking-tight text-zinc-900 dark:text-zinc-50">
|
||||
AutoTrade
|
||||
</span>
|
||||
</Link>
|
||||
<div className="flex items-center gap-4">
|
||||
{user ? (
|
||||
<>
|
||||
<Button asChild variant="ghost" size="sm">
|
||||
<Link href={AUTH_ROUTES.DASHBOARD}>대시보드</Link>
|
||||
</Button>
|
||||
<UserMenu user={user} />
|
||||
</>
|
||||
) : (
|
||||
<>
|
||||
<Button asChild variant="ghost" size="sm">
|
||||
<Link href={AUTH_ROUTES.LOGIN}>로그인</Link>
|
||||
</Button>
|
||||
<Button asChild size="sm">
|
||||
<Link href={AUTH_ROUTES.SIGNUP}>무료로 시작하기</Link>
|
||||
</Button>
|
||||
</>
|
||||
)}
|
||||
</div>
|
||||
</header>
|
||||
|
||||
<main className="flex-1">
|
||||
<section className="space-y-6 pb-8 pt-6 md:pb-12 md:pt-10 lg:py-32">
|
||||
<div className="container flex max-w-5xl flex-col items-center gap-4 text-center">
|
||||
<h1 className="font-heading text-3xl sm:text-5xl md:text-6xl lg:text-7xl">
|
||||
투자의 미래,{" "}
|
||||
<span className="text-gradient bg-linear-to-r from-indigo-500 to-purple-600 bg-clip-text text-transparent">
|
||||
자동화하세요
|
||||
</span>
|
||||
</h1>
|
||||
<p className="max-w-2xl leading-normal text-muted-foreground sm:text-xl sm:leading-8">
|
||||
AutoTrade는 최첨단 알고리즘을 통해 당신의 암호화폐 투자를 24시간
|
||||
관리합니다. 감정에 휘둘리지 않는 투자를 경험하세요.
|
||||
</p>
|
||||
<div className="space-x-4">
|
||||
{user ? (
|
||||
<Button asChild size="lg" className="h-11 px-8">
|
||||
<Link href={AUTH_ROUTES.DASHBOARD}>대시보드로 이동</Link>
|
||||
</Button>
|
||||
) : (
|
||||
<Button asChild size="lg" className="h-11 px-8">
|
||||
<Link href={AUTH_ROUTES.LOGIN}>지금 시작하기</Link>
|
||||
</Button>
|
||||
)}
|
||||
{!user && (
|
||||
<Button
|
||||
asChild
|
||||
variant="outline"
|
||||
size="lg"
|
||||
className="h-11 px-8"
|
||||
>
|
||||
<Link href={AUTH_ROUTES.LOGIN}>데모 체험</Link>
|
||||
</Button>
|
||||
)}
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<section className="container space-y-6 bg-slate-50 py-8 dark:bg-transparent md:py-12 lg:py-24">
|
||||
<div className="mx-auto flex max-w-[58rem] flex-col items-center space-y-4 text-center">
|
||||
<h2 className="font-heading text-3xl leading-[1.1] sm:text-3xl md:text-6xl">
|
||||
주요 기능
|
||||
</h2>
|
||||
<p className="max-w-[85%] leading-normal text-muted-foreground sm:text-lg sm:leading-7">
|
||||
성공적인 투자를 위해 필요한 모든 도구가 준비되어 있습니다.
|
||||
</p>
|
||||
</div>
|
||||
<div className="mx-auto grid justify-center gap-4 sm:grid-cols-2 md:max-w-5xl md:grid-cols-3">
|
||||
{[
|
||||
{
|
||||
title: "실시간 모니터링",
|
||||
description:
|
||||
"시장 상황을 실시간으로 분석하고 최적의 타이밍을 포착합니다.",
|
||||
},
|
||||
{
|
||||
title: "알고리즘 트레이딩",
|
||||
description:
|
||||
"검증된 전략을 기반으로 자동으로 매수와 매도를 실행합니다.",
|
||||
},
|
||||
{
|
||||
title: "포트폴리오 관리",
|
||||
description:
|
||||
"자산 분배와 리스크 관리를 통해 안정적인 수익을 추구합니다.",
|
||||
},
|
||||
].map((feature, index) => (
|
||||
<div
|
||||
key={index}
|
||||
className="relative overflow-hidden rounded-lg border bg-background p-2"
|
||||
>
|
||||
<div className="flex h-[180px] flex-col justify-between rounded-md p-6">
|
||||
<div className="space-y-2">
|
||||
<h3 className="font-bold">{feature.title}</h3>
|
||||
<p className="text-sm text-muted-foreground">
|
||||
{feature.description}
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
))}
|
||||
</div>
|
||||
</section>
|
||||
</main>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
103
app/(main)/dashboard/page.tsx
Normal file
103
app/(main)/dashboard/page.tsx
Normal file
@@ -0,0 +1,103 @@
|
||||
import { createClient } from "@/utils/supabase/server";
|
||||
import { Card, CardContent, CardHeader, CardTitle } from "@/components/ui/card";
|
||||
import { Activity, CreditCard, DollarSign, Users } from "lucide-react";
|
||||
|
||||
export default async function DashboardPage() {
|
||||
const supabase = await createClient();
|
||||
const {
|
||||
data: { user },
|
||||
} = await supabase.auth.getUser();
|
||||
|
||||
return (
|
||||
<div className="flex-1 space-y-4 p-8 pt-6">
|
||||
<div className="flex items-center justify-between space-y-2">
|
||||
<h2 className="text-3xl font-bold tracking-tight">대시보드</h2>
|
||||
</div>
|
||||
<div className="grid gap-4 md:grid-cols-2 lg:grid-cols-4">
|
||||
<Card>
|
||||
<CardHeader className="flex flex-row items-center justify-between space-y-0 pb-2">
|
||||
<CardTitle className="text-sm font-medium">총 수익</CardTitle>
|
||||
<DollarSign className="h-4 w-4 text-muted-foreground" />
|
||||
</CardHeader>
|
||||
<CardContent>
|
||||
<div className="text-2xl font-bold">$45,231.89</div>
|
||||
<p className="text-xs text-muted-foreground">지난달 대비 +20.1%</p>
|
||||
</CardContent>
|
||||
</Card>
|
||||
<Card>
|
||||
<CardHeader className="flex flex-row items-center justify-between space-y-0 pb-2">
|
||||
<CardTitle className="text-sm font-medium">구독자</CardTitle>
|
||||
<Users className="h-4 w-4 text-muted-foreground" />
|
||||
</CardHeader>
|
||||
<CardContent>
|
||||
<div className="text-2xl font-bold">+2350</div>
|
||||
<p className="text-xs text-muted-foreground">지난달 대비 +180.1%</p>
|
||||
</CardContent>
|
||||
</Card>
|
||||
<Card>
|
||||
<CardHeader className="flex flex-row items-center justify-between space-y-0 pb-2">
|
||||
<CardTitle className="text-sm font-medium">판매량</CardTitle>
|
||||
<CreditCard className="h-4 w-4 text-muted-foreground" />
|
||||
</CardHeader>
|
||||
<CardContent>
|
||||
<div className="text-2xl font-bold">+12,234</div>
|
||||
<p className="text-xs text-muted-foreground">지난달 대비 +19%</p>
|
||||
</CardContent>
|
||||
</Card>
|
||||
<Card>
|
||||
<CardHeader className="flex flex-row items-center justify-between space-y-0 pb-2">
|
||||
<CardTitle className="text-sm font-medium">현재 활동 중</CardTitle>
|
||||
<Activity className="h-4 w-4 text-muted-foreground" />
|
||||
</CardHeader>
|
||||
<CardContent>
|
||||
<div className="text-2xl font-bold">+573</div>
|
||||
<p className="text-xs text-muted-foreground">지난 시간 대비 +201</p>
|
||||
</CardContent>
|
||||
</Card>
|
||||
</div>
|
||||
<div className="grid gap-4 grid-cols-1 md:grid-cols-2 lg:grid-cols-7">
|
||||
<Card className="col-span-4">
|
||||
<CardHeader>
|
||||
<CardTitle>개요</CardTitle>
|
||||
</CardHeader>
|
||||
<CardContent className="pl-2">
|
||||
{/* Chart placeholder */}
|
||||
<div className="h-[200px] w-full bg-slate-100 dark:bg-slate-800 rounded-md flex items-center justify-center text-muted-foreground">
|
||||
차트 영역 (준비 중)
|
||||
</div>
|
||||
</CardContent>
|
||||
</Card>
|
||||
<Card className="col-span-3">
|
||||
<CardHeader>
|
||||
<CardTitle>최근 활동</CardTitle>
|
||||
<div className="text-sm text-muted-foreground">
|
||||
이번 달 265건의 거래가 있었습니다.
|
||||
</div>
|
||||
</CardHeader>
|
||||
<CardContent>
|
||||
<div className="space-y-8">
|
||||
<div className="flex items-center">
|
||||
<div className="ml-4 space-y-1">
|
||||
<p className="text-sm font-medium leading-none">
|
||||
비트코인 매수
|
||||
</p>
|
||||
<p className="text-sm text-muted-foreground">BTC/USDT</p>
|
||||
</div>
|
||||
<div className="ml-auto font-medium">+$1,999.00</div>
|
||||
</div>
|
||||
<div className="flex items-center">
|
||||
<div className="ml-4 space-y-1">
|
||||
<p className="text-sm font-medium leading-none">
|
||||
이더리움 매도
|
||||
</p>
|
||||
<p className="text-sm text-muted-foreground">ETH/USDT</p>
|
||||
</div>
|
||||
<div className="ml-auto font-medium">+$39.00</div>
|
||||
</div>
|
||||
</div>
|
||||
</CardContent>
|
||||
</Card>
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
@@ -1,63 +0,0 @@
|
||||
export default function DashboardPage() {
|
||||
return (
|
||||
<div className="space-y-6">
|
||||
<div>
|
||||
<h2 className="text-3xl font-bold tracking-tight">대시보드</h2>
|
||||
<p className="text-muted-foreground">
|
||||
자동매매 시스템 현황을 한눈에 확인하세요.
|
||||
</p>
|
||||
</div>
|
||||
<div className="grid gap-4 md:grid-cols-2 lg:grid-cols-4">
|
||||
{/* 예시 카드들 */}
|
||||
<div className="rounded-xl border bg-card text-card-foreground shadow p-6">
|
||||
<div className="flex flex-col space-y-1.5 p-6 pt-0 px-0">
|
||||
<span className="text-sm font-medium text-muted-foreground">
|
||||
총 자산
|
||||
</span>
|
||||
<span className="text-2xl font-bold">₩ 0</span>
|
||||
</div>
|
||||
</div>
|
||||
<div className="rounded-xl border bg-card text-card-foreground shadow p-6">
|
||||
<div className="flex flex-col space-y-1.5 p-6 pt-0 px-0">
|
||||
<span className="text-sm font-medium text-muted-foreground">
|
||||
평가 손익
|
||||
</span>
|
||||
<span className="text-2xl font-bold text-green-500">+0%</span>
|
||||
</div>
|
||||
</div>
|
||||
<div className="rounded-xl border bg-card text-card-foreground shadow p-6">
|
||||
<div className="flex flex-col space-y-1.5 p-6 pt-0 px-0">
|
||||
<span className="text-sm font-medium text-muted-foreground">
|
||||
실현 손익
|
||||
</span>
|
||||
<span className="text-2xl font-bold">₩ 0</span>
|
||||
</div>
|
||||
</div>
|
||||
<div className="rounded-xl border bg-card text-card-foreground shadow p-6">
|
||||
<div className="flex flex-col space-y-1.5 p-6 pt-0 px-0">
|
||||
<span className="text-sm font-medium text-muted-foreground">
|
||||
가동 봇
|
||||
</span>
|
||||
<span className="text-2xl font-bold">0개</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{/* 차트나 로그 영역 예시 */}
|
||||
<div className="grid gap-4 md:grid-cols-2 lg:grid-cols-7">
|
||||
<div className="col-span-4 rounded-xl border bg-card text-card-foreground shadow min-h-[300px] p-6">
|
||||
<div className="text-lg font-semibold mb-4">매매 추입</div>
|
||||
<div className="flex items-center justify-center h-full text-muted-foreground">
|
||||
차트 영역 준비중...
|
||||
</div>
|
||||
</div>
|
||||
<div className="col-span-3 rounded-xl border bg-card text-card-foreground shadow min-h-[300px] p-6">
|
||||
<div className="text-lg font-semibold mb-4">최근 활동</div>
|
||||
<div className="flex items-center justify-center h-full text-muted-foreground">
|
||||
로그 영역 준비중...
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
@@ -14,8 +14,8 @@ const geistMono = Geist_Mono({
|
||||
});
|
||||
|
||||
export const metadata: Metadata = {
|
||||
title: "Create Next App",
|
||||
description: "Generated by create next app",
|
||||
title: "AutoTrade",
|
||||
description: "Automated Crypto Trading Platform",
|
||||
};
|
||||
|
||||
export default function RootLayout({
|
||||
|
||||
Reference in New Issue
Block a user