Update app.py

app.py

@@ -528,16 +528,32 @@ def generate_space_name():
     letters = string.ascii_lowercase
     return ''.join(random.choice(letters) for i in range(6))
 
-# 배포 함수를 수정하여 모달 팝업과 좌측 화면 하단 알림 모두 업데이트
+# 배포 함수 단순화
 def deploy_to_vercel(code: str):
     """
-    Vercel에 배포하는 함수 - 명확한 UI 표시 방식으로 개선
+    Vercel에 배포하는 함수 - 직접 HTML 결과 반환
     """
     try:
+        if not code or code.strip() == '':
+            return """
+            <div style="padding: 15px; background: #ffebee; border-left: 5px solid #f44336; margin-bottom: 15px; border-radius: 4px;">
+                <strong style="color: #d32f2f;">⚠️ 배포 실패</strong>
+                <p style="margin: 5px 0 0 0;">배포할 코드가 없습니다. 먼저 게임 코드를 생성해주세요.</p>
+            </div>
+            """
+        
         token = "A8IFZmgW2cqA4yUNlLPnci0N"  # 실제 토큰 필요
         if not token:
-            return {"status": "error", "message": "Vercel 토큰이 설정되지 않았습니다."}
+            return """
+            <div style="padding: 15px; background: #ffebee; border-left: 5px solid #f44336; margin-bottom: 15px; border-radius: 4px;">
+                <strong style="color: #d32f2f;">⚠️ 배포 실패</strong>
+                <p style="margin: 5px 0 0 0;">Vercel 토큰이 설정되지 않았습니다.</p>
+            </div>
+            """
 
+        # 코드 전처리
+        clean_code = remove_code_block(code)
+        
         project_name = ''.join(random.choice(string.ascii_lowercase) for i in range(6))
         deploy_url = "https://api.vercel.com/v13/deployments"
         headers = {
@@ -560,7 +576,7 @@ def deploy_to_vercel(code: str):
         files = [
             {
                 "file": "index.html",
-                "data": code
+                "data": clean_code
             },
             {
                 "file": "package.json",
@@ -579,22 +595,43 @@ def deploy_to_vercel(code: str):
             "target": "production",
             "projectSettings": project_settings
         }
+        
+        # Vercel API 호출
         deploy_response = requests.post(deploy_url, headers=headers, json=deploy_data)
         if deploy_response.status_code != 200:
-            return {"status": "error", "message": f"배포 실패: {deploy_response.text}"}
+            return f"""
+            <div style="padding: 15px; background: #ffebee; border-left: 5px solid #f44336; margin-bottom: 15px; border-radius: 4px;">
+                <strong style="color: #d32f2f;">⚠️ 배포 실패</strong>
+                <p style="margin: 5px 0 0 0;">API 오류: {deploy_response.text}</p>
+            </div>
+            """
         
-        deployment_url = f"{project_name}.vercel.app"
+        deployment_url = f"https://{project_name}.vercel.app"
         time.sleep(5)
         
-        # 배포 성공 시 반환되는 정보
-        return {
-            "status": "success", 
-            "url": f"https://{deployment_url}", 
-            "project_name": project_name
-        }
+        # 성공 시 HTML로 결과 직접 반환 (게임 링크 + 복사 버튼)
+        return f"""
+        <div style="padding: 15px; background: #e8f5e9; border-left: 5px solid #4caf50; margin-bottom: 15px; border-radius: 4px;">
+            <strong style="color: #2e7d32;">✅ 배포 완료!</strong>
+            <p style="margin: 5px 0;">게임이 성공적으로 배포되었습니다.</p>
+            <div style="background: #f5f5f5; padding: 10px; border-radius: 4px; margin-top: 10px; display: flex; align-items: center; justify-content: space-between;">
+                <a href="{deployment_url}" target="_blank" style="color: #1976d2; text-decoration: none; word-break: break-all; flex: 1;">
+                    {deployment_url}
+                </a>
+                <button onclick="navigator.clipboard.writeText('{deployment_url}').then(() => this.textContent = '복사됨!', setTimeout(() => this.textContent = '복사', 1000))"
+                    style="background: #1976d2; color: white; border: none; border-radius: 4px; padding: 5px 10px; margin-left: 10px; cursor: pointer;">
+                    복사
+                </button>
+            </div>
+        </div>
+        """
     except Exception as e:
-        return {"status": "error", "message": f"배포 중 오류 발생: {str(e)}"}
-        
+        return f"""
+        <div style="padding: 15px; background: #ffebee; border-left: 5px solid #f44336; margin-bottom: 15px; border-radius: 4px;">
+            <strong style="color: #d32f2f;">⚠️ 시스템 오류</strong>
+            <p style="margin: 5px 0 0 0;">배포 중 오류 발생: {str(e)}</p>
+        </div>
+        """
 
 
 def remove_code_block(text):
@@ -1525,12 +1562,12 @@ with gr.Blocks(css_paths=["app.css"], theme=theme) as demo:
                     }
 
             # 배포 버튼 클릭 - JavaScript 트리거 및 상태 업데이트
+
             deploy_btn.click(
-                fn=handle_deploy,
-                inputs=[code_output, deploy_status],
-                outputs=[js_trigger, deploy_status]
+                fn=lambda code: deploy_to_vercel(code),  # 직접 HTML 반환
+                inputs=[code_output],
+                outputs=[deploy_result_container]  # 결과 컨테이너에 직접 출력
             )
-
 # ------------------------
 # 8) 실제 실행
 # ------------------------