56 lines
2.3 KiB
TypeScript
56 lines
2.3 KiB
TypeScript
"use client";
|
|
|
|
import { useState } from "react";
|
|
|
|
export default function Home() {
|
|
const [response, setResponse] = useState<any>(null);
|
|
const [loading, setLoading] = useState(false);
|
|
|
|
const testGrpc = async () => {
|
|
setLoading(true);
|
|
try {
|
|
const res = await fetch("/api/grpc-test?msg=HelloBot");
|
|
const data = await res.json();
|
|
setResponse(data);
|
|
} catch (err) {
|
|
setResponse({ success: false, error: "Fetch error" });
|
|
} finally {
|
|
setLoading(false);
|
|
}
|
|
};
|
|
|
|
return (
|
|
<div className="grid grid-rows-[20px_1fr_20px] items-center justify-items-center min-h-screen p-8 pb-20 gap-16 sm:p-20 font-[family-name:var(--font-geist-sans)]">
|
|
<main className="flex flex-col gap-8 row-start-2 items-center sm:items-start text-center sm:text-left">
|
|
<h1 className="text-4xl font-bold">Kord Dashboard (gRPC Test)</h1>
|
|
<p className="text-gray-500">대시보드와 봇 간의 gRPC 통신망을 테스트합니다.</p>
|
|
|
|
<div className="flex gap-4 items-center flex-col sm:flex-row w-full justify-center">
|
|
<button
|
|
onClick={testGrpc}
|
|
disabled={loading}
|
|
className="rounded-full border border-solid border-transparent transition-colors flex items-center justify-center bg-foreground text-background gap-2 hover:bg-[#383838] dark:hover:bg-[#ccc] text-sm sm:text-base h-10 sm:h-12 px-6 sm:px-8 font-medium"
|
|
>
|
|
{loading ? "통신 중..." : "봇에게 Ping 보내기"}
|
|
</button>
|
|
</div>
|
|
|
|
{response && (
|
|
<div className={`mt-8 p-6 rounded-lg border w-full max-w-md ${response.success ? 'bg-green-50 border-green-200' : 'bg-red-50 border-red-200'}`}>
|
|
<h2 className="text-lg font-semibold mb-2">테스트 결과</h2>
|
|
<pre className="text-sm font-mono whitespace-pre-wrap">
|
|
{JSON.stringify(response, null, 2)}
|
|
</pre>
|
|
{response.success && (
|
|
<p className="mt-2 text-green-700 font-medium text-sm">✅ 봇으로부터 성공적으로 응답을 받았습니다!</p>
|
|
)}
|
|
{!response.success && (
|
|
<p className="mt-2 text-red-700 font-medium text-sm">❌ 봇과 통신에 실패했습니다. (봇 구동 여부를 확인하세요)</p>
|
|
)}
|
|
</div>
|
|
)}
|
|
</main>
|
|
</div>
|
|
);
|
|
}
|