xfy/yggdrasil
1
0
Fork 0
Code Issues Pull Requests Actions 1 Packages Projects Releases Wiki Activity

feat(pages): add empty state to tags and tag detail pages

Browse Source
This commit is contained in:
xfy 2026-06-29 13:50:05 +08:00
parent 373498870a
commit 528a79fb83
1 changed files with 44 additions and 25 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

69
src/pages/tags.rs
View File

@ -18,6 +18,7 @@ use crate::api::posts::{get_posts_by_tag, list_tags, PostListResponse, TagListRe
use crate::components::post_card::PostCard; use crate::components::post_card::PostCard;
use crate::components::skeletons::delayed_skeleton::DelayedSkeleton; use crate::components::skeletons::delayed_skeleton::DelayedSkeleton;
use crate::components::skeletons::tags_skeleton::{TagDetailSkeleton, TagsSkeleton}; use crate::components::skeletons::tags_skeleton::{TagDetailSkeleton, TagsSkeleton};
use crate::components::empty_state::EmptyState;
use crate::router::Route; use crate::router::Route;
/// 标签云页面组件，对应路由 `/tags`。 /// 标签云页面组件，对应路由 `/tags`。
@ -49,25 +50,34 @@ fn TagsContent() -> Element {
match tags_data { match tags_data {
Some(Ok(tags)) => { Some(Ok(tags)) => {
let total = tags.iter().map(|t| t.post_count).sum::<i64>(); if tags.is_empty() {
rsx! { rsx! {
div { class: "mt-2 text-base text-paper-secondary", EmptyState {
"共 " title: "暂无标签",
span { class: "font-medium text-paper-primary", "{tags.len()}" } description: "当前还没有任何标签。"
" 个标签，" }
span { class: "font-medium text-paper-primary", "{total}" }
" 篇文章"
} }
ul { class: "flex flex-wrap gap-4 mt-6", } else {
for tag in tags { let total = tags.iter().map(|t| t.post_count).sum::<i64>();
li { key: "{tag.name}", rsx! {
Link { div { class: "mt-2 text-base text-paper-secondary",
class: "inline-flex items-center px-3 py-1.5 text-base font-medium bg-paper-accent-soft text-paper-accent rounded-lg hover:bg-paper-accent hover:text-white transition-all duration-200", "共 "
to: Route::TagDetail { span { class: "font-medium text-paper-primary", "{tags.len()}" }
tag: tag.name.clone(), " 个标签，"
}, span { class: "font-medium text-paper-primary", "{total}" }
"{tag.name}" " 篇文章"
sup { class: "ml-1 text-sm text-paper-secondary", "{tag.post_count}" } }
ul { class: "flex flex-wrap gap-4 mt-6",
for tag in tags {
li { key: "{tag.name}",
Link {
class: "inline-flex items-center px-3 py-1.5 text-base font-medium bg-paper-accent-soft text-paper-accent rounded-lg hover:bg-paper-accent hover:text-white transition-all duration-200",
to: Route::TagDetail {
tag: tag.name.clone(),
},
"{tag.name}"
sup { class: "ml-1 text-sm text-paper-secondary", "{tag.post_count}" }
}
} }
} }
} }
@ -116,14 +126,23 @@ fn TagDetailContent(tag: String) -> Element {
match posts_data { match posts_data {
Some(Ok((posts, total))) => { Some(Ok((posts, total))) => {
rsx! { if posts.is_empty() {
div { class: "mt-2 text-base text-paper-secondary", rsx! {
"共 " EmptyState {
span { class: "font-medium text-paper-primary", "{total}" } title: "暂无文章",
" 篇文章" description: "该标签下还没有发布任何文章。"
}
} }
for post in posts.iter() { } else {
PostCard { key: "{post.id}", post: post.clone() } rsx! {
div { class: "mt-2 text-base text-paper-secondary",
"共 "
span { class: "font-medium text-paper-primary", "{total}" }
" 篇文章"
}
for post in posts.iter() {
PostCard { key: "{post.id}", post: post.clone() }
}
} }
} }
} }