Update app.py

app.py

@@ -9,7 +9,7 @@ from dotenv import load_dotenv
 load_dotenv()
 
 # API Configuration - Hugging Face Spaces stores secrets in environment variables
-API_KEY = os.getenv('StableCogKey', '')
+API_KEY = os.getenv('STABLECOG_API_KEY', '')
 if not API_KEY:
     # For local testing fallback
     API_KEY = "StableCogKey"
@@ -31,9 +31,6 @@ def check_credits():
         if response.status_code == 200:
             res_json = response.json()
             
-            # Debug: Print raw response to see structure
-            print(f"Raw API Response: {json.dumps(res_json, indent=2)}")
-            
             # Parse the actual response structure
             total_remaining_credits = res_json.get('total_remaining_credits', 0)
             credits_list = res_json.get('credits', [])
@@ -92,7 +89,6 @@ def check_credits():
                 "raw_data": json.dumps(res_json, indent=2)
             }
             
-            print(f"Parsed result: Total={total_credits}, Remaining={total_remaining_credits}, Used={total_used_credits}")
             return result
             
         else:
@@ -263,23 +259,19 @@ def get_recommendation(remaining_credits, percentage_used):
     else:
         return "🚀 **Plenty of credits!** Ready for extensive image generation work and experimentation."
 
-# Create Gradio interface with Gradio 5 theme
+# Create Gradio interface with custom theme
 theme = gr.themes.Soft(
     primary_hue="purple",
     secondary_hue="indigo",
     font=[gr.themes.GoogleFont("Inter"), "ui-sans-serif", "system-ui", "sans-serif"]
+).set(
+    button_primary_background_fill="linear-gradient(135deg, #667eea 0%, #764ba2 100%)",
+    button_primary_background_fill_hover="linear-gradient(135deg, #764ba2 0%, #667eea 100%)",
+    button_primary_text_color="white",
+    button_primary_border_color="rgba(255,255,255,0.2)",
 )
 
-with gr.Blocks(
-    theme=theme, 
-    title="StableCog Credit Monitor",
-    css="""
-    footer {display: none !important;}
-    .gradio-container {max-width: 1200px !important;}
-    .stat-box input {font-weight: bold !important; font-size: 18px !important;}
-    .recommendation-box textarea {font-size: 16px !important; line-height: 1.5 !important;}
-    """
-) as demo:
+with gr.Blocks(theme=theme, title="StableCog Credit Monitor", css="footer {display: none !important;}") as demo:
     gr.Markdown("""
     # 🎯 StableCog Credit Dashboard
     
@@ -327,27 +319,12 @@ with gr.Blocks(
         check_btn = gr.Button(
             "🔄 Check Credits Now", 
             variant="primary", 
-            scale=1,
-            size="lg"
-        )
-        gr.Button(
-            "📖 View Documentation",
-            variant="secondary",
-            scale=0,
             size="lg",
-            link="https://stablecog.com/docs/api"
+            elem_classes="refresh-btn"
         )
     
     # Auto-check on load
-    demo.load(
-        fn=update_display, 
-        inputs=None, 
-        outputs=[html_output, raw_output, credits_display, usage_display]
-    ).then(
-        fn=get_recommendation,
-        inputs=[credits_display, usage_display],
-        outputs=recommendation_box
-    )
+    demo.load(fn=update_display, inputs=None, outputs=[html_output, raw_output, credits_display, usage_display])
     
     # Connect button and update recommendation
     def update_all():
@@ -395,11 +372,10 @@ with gr.Blocks(
     """)
 
 if __name__ == "__main__":
-    # For Hugging Face Spaces - Gradio 5 syntax
+    # For Hugging Face Spaces
     demo.launch(
         server_name="0.0.0.0",
         server_port=7860,
         share=False,
-        show_error=True,
-        debug=False
+        show_error=True
     )