e687047401
Splits the Login component into smaller, more manageable parts and extracts related logic into hooks to improve code organization and readability.
75 lines
2.3 KiB
TypeScript
75 lines
2.3 KiB
TypeScript
|
|
import React from "react";
|
|
import { Link } from "react-router-dom";
|
|
import { ArrowRight, Shield } from "lucide-react";
|
|
|
|
interface TestResultProps {
|
|
testResults: {
|
|
url?: string;
|
|
usingProxy?: boolean;
|
|
proxyUrl?: string;
|
|
client?: boolean;
|
|
restApi?: boolean;
|
|
auth?: boolean;
|
|
database?: boolean;
|
|
errors: string[];
|
|
} | null;
|
|
}
|
|
|
|
const SupabaseConnectionStatus: React.FC<TestResultProps> = ({ testResults }) => {
|
|
if (!testResults) {
|
|
return null;
|
|
}
|
|
|
|
return (
|
|
<details className="neuro-flat p-3 text-xs mb-4">
|
|
<summary className="cursor-pointer text-gray-500 font-medium">고급 진단 정보</summary>
|
|
<div className="mt-2 space-y-2">
|
|
<div>
|
|
<p className="font-medium">Supabase URL:</p>
|
|
<p className="break-all bg-gray-100 p-1 rounded">{testResults?.url || '알 수 없음'}</p>
|
|
</div>
|
|
{testResults?.usingProxy && (
|
|
<div>
|
|
<p className="font-medium">CORS 프록시:</p>
|
|
<div className="flex items-center gap-1">
|
|
<Shield className="h-3 w-3 text-blue-500" />
|
|
<p className="break-all text-blue-500">활성화됨 - {testResults.proxyUrl}</p>
|
|
</div>
|
|
</div>
|
|
)}
|
|
<div>
|
|
<p className="font-medium">클라이언트 초기화:</p>
|
|
<p>{testResults?.client ? '성공' : '실패'}</p>
|
|
</div>
|
|
<div>
|
|
<p className="font-medium">브라우저 정보:</p>
|
|
<p className="break-all">{navigator.userAgent}</p>
|
|
</div>
|
|
<div>
|
|
<p className="font-medium">앱 버전:</p>
|
|
<p>1.0.0</p>
|
|
</div>
|
|
{testResults && (
|
|
<div className="border-t pt-2 mt-2">
|
|
<p>REST API: {testResults.restApi ? '✅' : '❌'}</p>
|
|
<p>인증: {testResults.auth ? '✅' : '❌'}</p>
|
|
<p>데이터베이스: {testResults.database ? '✅' : '❌'}</p>
|
|
</div>
|
|
)}
|
|
<div className="text-right pt-1">
|
|
<Link
|
|
to="/supabase-settings"
|
|
className="inline-flex items-center text-neuro-income hover:underline"
|
|
>
|
|
<span>Supabase 설정 변경</span>
|
|
<ArrowRight className="h-3 w-3 ml-1" />
|
|
</Link>
|
|
</div>
|
|
</div>
|
|
</details>
|
|
);
|
|
};
|
|
|
|
export default SupabaseConnectionStatus;
|