File size: 4,453 Bytes
48d98a3 |
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 100 101 102 103 104 105 106 107 108 109 110 111 112 113 114 115 116 117 118 119 120 121 122 123 124 125 126 127 128 129 130 131 132 133 134 135 136 137 138 139 140 141 142 143 |
import gradio as gr
import sqlite3
import pandas as pd
from themes import IndonesiaTheme # Tema custom
DB_PATH = "spaces.db"
def load_data(status_filter="All", keyword=""):
conn = sqlite3.connect(DB_PATH)
query = "SELECT name, author, desc, likes, updated, status, link FROM spaces"
df = pd.read_sql_query(query, conn)
conn.close()
if status_filter != "All":
df = df[df['status'].str.contains(status_filter, case=False, na=False)]
if keyword.strip():
df = df[df['name'].str.contains(keyword, case=False, na=False)]
df = df.sort_values("likes", ascending=False).head(20)
# Kolom Visit tetap
df["🔗 Visit"] = df["link"].apply(lambda url: f"<a href='{url}' target='_blank'>🌐 Visit</a>")
# Kolom Name: bold
df["name"] = df["name"].apply(lambda name: f"<b>{name}</b>")
# Kolom Status: warna dinamis
def format_status(s):
if "running" in s.lower():
return f"<span style='color:green;font-weight:bold'>{s}</span>"
else:
return f"<span style='color:red;font-weight:bold'>{s}</span>"
df["status"] = df["status"].apply(format_status)
# Susun ulang kolom
df = df[["name", "author", "desc", "likes", "updated", "status", "🔗 Visit"]]
df.columns = ["📛 Name", "👤 Author", "📝 Description", "❤️ Likes", "🕒 Updated", "⚙️ Status", "🔗 Visit"]
return df.reset_index(drop=True)
def view_leaderboard(status, keyword):
return load_data(status, keyword)
css = """
table {
width: 100%;
border-collapse: collapse;
margin-top: 1rem;
font-size: 0.92rem;
}
th {
background: #f0f0f0;
padding: 8px;
text-align: left;
font-weight: bold;
border-bottom: 2px solid #ccc;
}
td {
padding: 8px;
border-bottom: 1px solid #eee;
vertical-align: top;
}
tr:hover {
background-color: #f9f9f9;
}
td a {
text-decoration: none;
color: #1e90ff;
font-weight: bold;
}
"""
# === Gradio App UI ===
with gr.Blocks(theme=IndonesiaTheme()) as demo:
with gr.Column():
gr.Markdown("## 🌌 HuggingFace Spaces Leaderboard")
gr.Markdown("🎯 Menampilkan 20 space dengan jumlah like terbanyak + link kunjungan langsung")
with gr.Row():
with gr.Column(elem_id="col-left"):
status_choice = gr.Dropdown(["All", "Running", "Zero", "Stopped"],
label="🎛️ Filter Status", value="All")
with gr.Column(elem_id="col-mid"):
keyword_input = gr.Textbox(label="🔍 Search by Name",
placeholder="e.g. llama, tts, image")
with gr.Column(elem_id="col-bott"):
output_table = gr.HTML(label="Leaderboard Table")
def render_html_table(status, keyword):
df = load_data(status, keyword)
html_table = df.to_html(escape=False, index=False, classes="styled-table")
return f"""
<style>
.styled-table {{
width: 100%;
border-collapse: collapse;
font-size: 0.9rem;
font-family: 'Segoe UI', sans-serif;
background-color: #1e1e1e;
color: #e0e0e0;
}}
.styled-table th {{
background-color: #2e2e2e;
text-align: left;
padding: 10px;
border-bottom: 2px solid #444;
}}
.styled-table td {{
padding: 10px;
border-bottom: 1px solid #333;
vertical-align: top;
}}
.styled-table tr:hover td {{
background-color: #2a2a2a;
}}
a {{
color: #4da6ff;
text-decoration: none;
font-weight: bold;
}}
</style>
{html_table}
"""
status_choice.change(fn=render_html_table, inputs=[status_choice, keyword_input], outputs=output_table)
keyword_input.change(fn=render_html_table, inputs=[status_choice, keyword_input], outputs=output_table)
gr.Button("🔄 Refresh").click(fn=render_html_table,
inputs=[status_choice, keyword_input], outputs=output_table)
gr.Markdown("#### Made with ❤️ by Deddy | HuggingFace Leaderboard Mirror", elem_id="footer")
demo.launch()
|