Update app.py

app.py

@@ -1020,23 +1020,24 @@ with gr.Blocks(css_paths=["app.css"], theme=theme) as demo:
 
             def deploy_to_vercel(code: str):
                 try:
-                    token = "A8IFZmgW2cqA4yUNlLPnci0N"  # 실제 토큰 필요
+                    if not code or len(code.strip()) < 10:
+                        return "<div style='color:red; padding:10px; border:1px solid red; border-radius:5px;'>배포할 코드가 없습니다. 먼저 게임 코드를 생성해주세요.</div>"
+            
+                    token = "A8IFZmgW2cqA4yUNlLPnci0N"
                     if not token:
-                        return """
-            <div class="deploy-section">
-                <div class="deploy-error">
-                    <div class="error-icon">⚠️</div>
-                    <div class="error-message">Vercel 토큰이 설정되지 않았습니다.</div>
-                </div>
-            </div>
-            """
-        
+                        return "<div style='color:red; padding:10px; border:1px solid red; border-radius:5px;'>Vercel 토큰이 설정되지 않았습니다.</div>"
+            
+        # 프로젝트 이름 생성
                     project_name = ''.join(random.choice(string.ascii_lowercase) for i in range(6))
+        
+        # Vercel API 요청 준비
                     deploy_url = "https://api.vercel.com/v13/deployments"
                     headers = {
                         "Authorization": f"Bearer {token}",
                         "Content-Type": "application/json"
                     }
+        
+        # 패키지 정보
                     package_json = {
                         "name": project_name,
                         "version": "1.0.0",
@@ -1048,59 +1049,53 @@ with gr.Blocks(css_paths=["app.css"], theme=theme) as demo:
                             "preview": "vite preview"
                         }
                     }
+        
+        # 배포할 파일들
                     files = [
                         {"file": "index.html", "data": code},
                         {"file": "package.json", "data": json.dumps(package_json, indent=2)}
                     ]
+        
+        # 프로젝트 설정
                     project_settings = {
                         "buildCommand": "npm run build",
                         "outputDirectory": "dist",
                         "installCommand": "npm install",
                         "framework": None
                     }
+        
+        # 배포 데이터
                     deploy_data = {
                         "name": project_name,
                         "files": files,
                         "target": "production",
                         "projectSettings": project_settings
                     }
+        
+        # API 요청 및 응답 처리
                     deploy_response = requests.post(deploy_url, headers=headers, json=deploy_data)
                     if deploy_response.status_code != 200:
-                        return f"""
-            <div class="deploy-section">
-                <div class="deploy-error">
-                    <div class="error-icon">⚠️</div>
-                    <div class="error-message">배포 실패: {deploy_response.text}</div>
-                </div>
-            </div>
-            """
+                        return f"<div style='color:red; padding:10px; border:1px solid red; border-radius:5px;'>배포 실패: {deploy_response.text}</div>"
         
+        # 배포 URL 생성 
                     deployment_url = f"https://{project_name}.vercel.app"
-                    time.sleep(5)
         
+        # 배포 완료 기다리기
+                    time.sleep(3)
+        
+        # 결과 반환
                     return f"""
-        <div class="deploy-section">
-            <div class="deploy-header">📤 배포 결과</div>
-            <div class="deploy-success">
-                <div class="success-icon">✅</div>
-                <div class="success-message">배포 완료!</div>
-                <div class="url-box">
-                    <a href="{deployment_url}" target="_blank">{deployment_url}</a>
-                    <button class="copy-btn" onclick="navigator.clipboard.writeText('{deployment_url}')">복사</button>
-                </div>
-            </div>
-        </div>
-        """
+                    <div style='padding: 15px; background-color: #f0fff4; border: 1px solid #34c759; border-radius: 8px;'>
+                        <h3 style='margin-top: 0; color: #34c759;'>✅ 배포 완료!</h3>
+                        <p>게임이 성공적으로 배포되었습니다.</p>
+                        <div style='margin-top: 10px; padding: 10px; background: #f8fafc; border-radius: 6px; display: flex; justify-content: space-between; align-items: center;'>
+                            <a href="{deployment_url}" target="_blank" style='color: #0066cc; text-decoration: none; word-break: break-all;'>{deployment_url}</a>
+                            <button onclick="navigator.clipboard.writeText('{deployment_url}')" style='background: #0066cc; color: white; border: none; border-radius: 4px; padding: 5px 10px; cursor: pointer;'>복사</button>
+                        </div>
+                    </div>
+                    """
                 except Exception as e:
-                    return f"""
-        <div class="deploy-section">
-            <div class="deploy-error">
-                <div class="error-icon">⚠️</div>
-                <div class="error-message">배포 중 오류 발생: {str(e)}</div>
-            </div>
-        </div>
-        """
-
+                    return f"<div style='color:red; padding:10px; border:1px solid red; border-radius:5px;'>오류 발생: {str(e)}</div>"
 
 
             # handle_deploy
@@ -1204,21 +1199,12 @@ with gr.Blocks(css_paths=["app.css"], theme=theme) as demo:
                         "url": ""
                     }
 
-
-
+            # deploy_btn.click 함수를 찾아 다음으로 완전히 교체하세요
             deploy_btn.click(
-                fn=lambda code: deploy_to_vercel(remove_code_block(code)) if code else """
-                <div class="deploy-section">
-                    <div class="deploy-error">
-                        <div class="error-icon">⚠️</div>
-                        <div class="error-message">배포할 코드가 없습니다. 먼저 게임 코드를 생성해주세요.</div>
-                    </div>
-                </div>
-                """,
+                fn=lambda code: deploy_to_vercel(remove_code_block(code)),
                 inputs=[code_output],
                 outputs=[deploy_result_container]
-            )
-
+)
 # ------------------------
 # 8) 실제 실행
 # ------------------------