Spaces:
Sleeping
Sleeping
File size: 6,280 Bytes
74dd3f1 |
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 144 145 146 147 148 |
import streamlit as st
import datetime
def model_list(models, on_select_callback):
"""Render a list of model cards with enhanced UI and metadata badges"""
if not models:
st.info("No models found. Create your first repository to get started!")
return
# Display the models in a grid
cols = st.columns(2)
for i, model in enumerate(models):
with cols[i % 2]:
with st.container():
st.markdown(
f"""
<div class="model-card">
<div class="model-card-header">
<div class="model-card-title">{model.modelId}</div>
<div>
<span class="badge hf-badge">
<img src="https://huggingface.co/front/assets/huggingface_logo-noborder.svg" alt="HF">
HF
</span>
<span class="tooltip">
ℹ️
<span class="tooltip-text">Last updated: {datetime.datetime.now().strftime("%Y-%m-%d")}</span>
</span>
</div>
</div>
<div class="model-card-description">
{getattr(model, 'description', 'No description available.') or 'No description available.'}
</div>
<div class="model-card-footer">
<div class="model-card-tags">
{generate_tags(model)}
</div>
<div>
<span style="color: #6B7280; font-size: 0.8rem; margin-right: 8px;">
<span title="Downloads">📥 {getattr(model, 'downloads', 0)}</span>
</span>
<span style="color: #6B7280; font-size: 0.8rem;">
<span title="Likes">❤️ {getattr(model, 'likes', 0)}</span>
</span>
</div>
</div>
</div>
""",
unsafe_allow_html=True,
)
# Button to select model below the card
if st.button(
f"View Details",
key=f"view_{model.modelId}",
use_container_width=True,
):
on_select_callback(model.modelId)
def generate_tags(model):
"""Generate HTML for model tags"""
tags = getattr(model, "tags", []) or []
if not tags:
tags = ["untagged"]
tags_html = ""
for tag in tags[:3]: # Limit to 3 tags to avoid clutter
tags_html += f'<span class="model-tag">{tag}</span>'
if len(tags) > 3:
tags_html += f'<span class="model-tag">+{len(tags) - 3} more</span>'
return tags_html
def model_detail_card(model):
"""Render a detailed model card with badges, stats, and actions"""
st.markdown(
f"""
<div class="hf-card" style="padding: 20px; margin-bottom: 24px;">
<div style="display: flex; justify-content: space-between; align-items: flex-start; margin-bottom: 16px;">
<div>
<h2 style="margin-top: 0; margin-bottom: 8px;">{model.modelId}</h2>
<div style="display: flex; gap: 8px; margin-bottom: 16px;">
<a href="https://huggingface.co/{st.session_state.username}/{model.modelId}" target="_blank" class="badge hf-badge">
<img src="https://huggingface.co/front/assets/huggingface_logo-noborder.svg" alt="HF">
View on Hugging Face
</a>
<a href="#" class="badge github-badge">
<img src="https://github.githubassets.com/images/modules/logos_page/GitHub-Mark.png" alt="GitHub">
View on GitHub
</a>
</div>
</div>
<div style="display: flex; gap: 8px; align-items: center;">
<span title="Downloads" class="tooltip">
📥 {getattr(model, 'downloads', 0)}
<span class="tooltip-text">Total downloads</span>
</span>
<span title="Likes" class="tooltip">
❤️ {getattr(model, 'likes', 0)}
<span class="tooltip-text">Total likes</span>
</span>
</div>
</div>
<div style="margin-bottom: 16px;">
<h4 style="margin-bottom: 4px;">Description</h4>
<p>{getattr(model, 'description', 'No description available.') or 'No description available.'}</p>
</div>
<div style="margin-bottom: 16px;">
<h4 style="margin-bottom: 4px;">Tags</h4>
<div style="display: flex; flex-wrap: wrap; gap: 8px;">
{generate_detailed_tags(model)}
</div>
</div>
<div style="display: grid; grid-template-columns: 1fr 1fr; gap: 16px; margin-bottom: 16px;">
<div>
<h4 style="margin-bottom: 4px;">Last Updated</h4>
<p>{datetime.datetime.now().strftime("%B %d, %Y")}</p>
</div>
<div>
<h4 style="margin-bottom: 4px;">Model Size</h4>
<p>{getattr(model, 'size', 'Unknown')} MB</p>
</div>
</div>
</div>
""",
unsafe_allow_html=True,
)
def generate_detailed_tags(model):
"""Generate HTML for detailed model tags view"""
tags = getattr(model, "tags", []) or []
if not tags:
return '<span class="model-tag">untagged</span>'
tags_html = ""
for tag in tags:
tags_html += f'<span class="model-tag">{tag}</span>'
return tags_html
|