Update app.py

app.py

@@ -223,23 +223,38 @@ def get_vercel_deployments():
         print(f"Error fetching Vercel deployments: {str(e)}")
         return []
 
+
 def get_vercel_card(deployment, index):
     """Generate HTML card for a Vercel deployment with like button"""
     raw_url = deployment.get('url', '')
-    project_name = raw_url[:6] if len(raw_url) >= 6 else raw_url
-    url = f"{project_name}.vercel.app"
+    
+    # URL 처리 로직 수정
+    if raw_url.startswith('http'):
+        url = raw_url  # 전체 URL이 제공된 경우 그대로 사용
+    else:
+        project_name = raw_url[:6] if len(raw_url) >= 6 else raw_url
+        url = f"{project_name}.vercel.app"
+    
+    # Hugging Face 스페이스 URL인 경우 직접 사용
+    if 'huggingface.co' in url:
+        final_url = url
+    else:
+        final_url = f"https://{url}" if not url.startswith('http') else url
     
     created = format_timestamp(deployment.get('created'))
     name = deployment.get('name', 'Unnamed Project')
     state = deployment.get('state', 'N/A')
     
     # 고유 ID 생성 (카드 식별용)
-    card_id = f"vercel-card-{project_name}"
+    card_id = f"vercel-card-{url.replace('.', '-').replace('/', '-')}"
+    
+
     
     bg_color = get_pastel_color(index + 20)
     tech_emojis = ['⚡', '🚀', '🌟', '✨', '💫', '🔥', '🌈', '🎯', '🎨', '🔮']
     random_emojis = random.sample(tech_emojis, 3)
-    
+
+
     return f"""
     <div id="{card_id}" class="vercel-card"
          data-likes="0"
@@ -254,28 +269,21 @@ def get_vercel_card(deployment, index):
                 overflow: hidden;'
          onmouseover='this.style.transform="translateY(-5px) scale(1.02)"; this.style.boxShadow="0 8px 25px rgba(0,0,0,0.15)"'
          onmouseout='this.style.transform="translateY(0) scale(1)"; this.style.boxShadow="0 4px 15px rgba(0,0,0,0.1)"'>
-        <div style='position: absolute; top: -15px; right: -15px; font-size: 100px; opacity: 0.1;'>
-            {random_emojis[0]}
-        </div>
-        <div style='position: absolute; top: 10px; right: 10px; font-size: 20px;'>
-            {random_emojis[1]}
-        </div>
-        <div style='position: absolute; bottom: 10px; left: 10px; font-size: 20px;'>
-            {random_emojis[2]}
-        </div>
-        <h3 style='color: #2d2d2d; 
-                   margin: 0 0 20px 0; 
-                   font-size: 1.4em;
-                   display: flex;
-                   align-items: center;
-                   gap: 10px;'>
-            <span style='font-size: 1.3em'>{random_emojis[0]}</span>
-            <a href='https://{url}' target='_blank' 
-               style='text-decoration: none; color: #2d2d2d;'>
-                {name}
-            </a>
-            <span style='font-size: 1.3em'>{random_emojis[1]}</span>
-        </h3>
+         <!-- ... (이전 코드와 동일) ... -->
+         <h3 style='color: #2d2d2d; 
+                    margin: 0 0 20px 0; 
+                    font-size: 1.4em;
+                    display: flex;
+                    align-items: center;
+                    gap: 10px;'>
+             <span style='font-size: 1.3em'>{random_emojis[0]}</span>
+             <a href='{final_url}' target='_blank' 
+                style='text-decoration: none; color: #2d2d2d;'>
+                 {name}
+             </a>
+             <span style='font-size: 1.3em'>{random_emojis[1]}</span>
+         </h3>    
+
         <div style='margin: 15px 0; color: #444; background: rgba(255,255,255,0.5); 
                     padding: 15px; border-radius: 12px;'>
             <p style='margin: 8px 0;'>
@@ -288,31 +296,31 @@ def get_vercel_card(deployment, index):
                 <strong>URL:</strong> 🔗 https://{url}
             </p>
         </div>
-        <div style='margin-top: 20px; display: flex; justify-content: space-between; align-items: center;'>
-            <div class="like-section" style="display: flex; align-items: center; gap: 10px;">
-                <button onclick="toggleLike('{card_id}')" class="like-button" 
-                        style="background: none; border: none; cursor: pointer; font-size: 1.5em; padding: 5px 10px;">
-                    🤍
-                </button>
-                <span class="like-count" style="font-size: 1.2em; color: #666;">0</span>
-            </div>
-            <a href='https://{url}' target='_blank' 
-               style='background: linear-gradient(45deg, #0084ff, #00a3ff);
-                      color: white; 
-                      padding: 10px 20px; 
-                      border-radius: 15px; 
-                      text-decoration: none; 
-                      display: inline-flex;
-                      align-items: center;
-                      gap: 8px;
-                      font-weight: 500; 
-                      transition: all 0.3s;
-                      box-shadow: 0 2px 8px rgba(0,132,255,0.3);'
-               onmouseover='this.style.transform="scale(1.05)"; this.style.boxShadow="0 4px 12px rgba(0,132,255,0.4)"'
-               onmouseout='this.style.transform="scale(1)"; this.style.boxShadow="0 2px 8px rgba(0,132,255,0.3)"'>
-                <span>View Deployment</span> 🚀 {random_emojis[0]}
-            </a>
-        </div>
+         <div style='margin-top: 20px; display: flex; justify-content: space-between; align-items: center;'>
+             <div class="like-section" style="display: flex; align-items: center; gap: 10px;">
+                 <button onclick="toggleLike('{card_id}')" class="like-button" 
+                         style="background: none; border: none; cursor: pointer; font-size: 1.5em; padding: 5px 10px;">
+                     🤍
+                 </button>
+                 <span class="like-count" style="font-size: 1.2em; color: #666;">0</span>
+             </div>
+             <a href='{final_url}' target='_blank' 
+                style='background: linear-gradient(45deg, #0084ff, #00a3ff);
+                       color: white; 
+                       padding: 10px 20px; 
+                       border-radius: 15px; 
+                       text-decoration: none; 
+                       display: inline-flex;
+                       align-items: center;
+                       gap: 8px;
+                       font-weight: 500; 
+                       transition: all 0.3s;
+                       box-shadow: 0 2px 8px rgba(0,132,255,0.3);'
+                onmouseover='this.style.transform="scale(1.05)"; this.style.boxShadow="0 4px 12px rgba(0,132,255,0.4)"'
+                onmouseout='this.style.transform="scale(1)"; this.style.boxShadow="0 2px 8px rgba(0,132,255,0.3)"'>
+                 <span>View Deployment</span> 🚀 {random_emojis[0]}
+             </a>
+         </div>
     </div>
     """