Splits the Register page into smaller, more manageable components for better organization and maintainability.
46 lines
1.2 KiB
TypeScript
46 lines
1.2 KiB
TypeScript
|
|
import React from "react";
|
|
import { RefreshCcw } from "lucide-react";
|
|
import { Button } from "@/components/ui/button";
|
|
import { Alert, AlertTitle, AlertDescription } from "@/components/ui/alert";
|
|
|
|
interface ServerStatusAlertProps {
|
|
serverStatus: {
|
|
checked: boolean;
|
|
connected: boolean;
|
|
message: string;
|
|
};
|
|
checkServerConnection: () => Promise<void>;
|
|
}
|
|
|
|
const ServerStatusAlert: React.FC<ServerStatusAlertProps> = ({
|
|
serverStatus,
|
|
checkServerConnection,
|
|
}) => {
|
|
if (!serverStatus.checked || serverStatus.connected) {
|
|
return null;
|
|
}
|
|
|
|
return (
|
|
<Alert variant="destructive" className="mb-6">
|
|
<AlertTitle className="flex items-center">
|
|
서버 연결 문제
|
|
<Button
|
|
variant="ghost"
|
|
size="sm"
|
|
className="ml-2 h-6 w-6 p-0"
|
|
onClick={checkServerConnection}
|
|
>
|
|
<RefreshCcw className="h-4 w-4" />
|
|
</Button>
|
|
</AlertTitle>
|
|
<AlertDescription>
|
|
{serverStatus.message}
|
|
<p className="mt-1 text-xs">회원가입을 시도하기 전에 서버 연결 문제를 해결해주세요.</p>
|
|
</AlertDescription>
|
|
</Alert>
|
|
);
|
|
};
|
|
|
|
export default ServerStatusAlert;
|