Refactor Login component

Splits the Login component into smaller, more manageable parts and extracts related logic into hooks to improve code organization and readability.

src/components/auth/SupabaseConnectionStatus.tsx

@@ -0,0 +1,74 @@
+
+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;