Updating components to use the database.

This commit is contained in:
2025-09-08 18:39:30 -04:00
parent 417c0d01e4
commit 1f502a7386
6 changed files with 150 additions and 128 deletions

View File

@ -1,6 +1,4 @@
use dioxus::prelude::*;
use tavern::{Adventurer, Legend, Lore, Tale};
use crate::page::Page;
@ -15,51 +13,42 @@ const POST_CSS: Asset = asset!("/assets/css/blog_post.css");
const TAG_CSS: Asset = asset!("/assets/css/blog_tag.css");
#[derive(Clone, Copy, PartialEq)]
pub enum TagStyle
fn convert_tag<S>(text: S) -> (String, String)
where S: AsRef<str>
{
Regular,
Easy,
Medium,
Hard
if let Some((first, second)) = text.as_ref().split_once('-')
{
(first.to_owned(), second.to_owned())
}
else
{
(text.as_ref().to_owned(), "none".to_owned())
}
}
#[derive(Clone, Copy, PartialEq)]
pub enum Tag
fn strip_tag(text: &str) -> &str
{
LeetCode,
Embedded,
Simulation,
Web
if let Some((first, _)) = text.split_once('-')
{
first
}
else
{
text
}
}
#[component]
pub fn TagItem(tag: Tag, style: TagStyle) -> Element
pub fn TagItem(tag: String, style: String) -> Element
{
let text = match tag
{
Tag::LeetCode => { "LeetCode" }
Tag::Embedded => { "Embedded" }
Tag::Simulation => { "Simulation" }
Tag::Web => { "Web" }
};
let tag_style = match style
{
TagStyle::Regular => { "none" }
TagStyle::Easy => { "easy" }
TagStyle::Medium => { "medium" }
TagStyle::Hard => { "hard" }
};
rsx!
{
rsx! {
li
{
class: "tag_item",
a { class: "{tag_style}", "{text}" }
a { class: "{style}", "{tag}" }
}
}
}
@ -67,8 +56,7 @@ pub fn TagItem(tag: Tag, style: TagStyle) -> Element
#[component]
pub fn TagList(children: Element) -> Element
{
rsx!
{
rsx! {
document::Link { rel: "stylesheet", href: TAG_CSS }
h5
@ -87,8 +75,7 @@ pub fn TagList(children: Element) -> Element
#[component]
pub fn BlogAuthor() -> Element
{
rsx!
{
rsx! {
document::Link { rel: "stylesheet", href: AUTHOR_CSS }
section
@ -101,11 +88,14 @@ pub fn BlogAuthor() -> Element
#[component]
pub fn BlogItem(title: String, slug: String, author: String,
summary: String, tags: Vec<(Tag, TagStyle)>) -> Element
pub fn BlogItem(title: String, slug: String, author: String, summary: String,
tags: Vec<String>)
-> Element
{
rsx!
{
let tags: Vec<(String, String)> =
tags.iter().map(|t| convert_tag(t)).collect();
rsx! {
li
{
class: "blog_item",
@ -120,8 +110,8 @@ pub fn BlogItem(title: String, slug: String, author: String,
{
TagItem
{
tag: tag,
style: style
tag: tag.clone(),
style: style.clone()
}
}
}
@ -135,17 +125,12 @@ pub fn BlogItem(title: String, slug: String, author: String,
#[component]
pub fn BlogList(tags: Vec<String>, children: Element) -> Element
{
let summaries = use_server_future(move ||
{
let summaries = use_server_future(move || {
let categories = tags.clone();
async move
{
get_blog_list(categories).await
}
async move { get_blog_list(categories).await }
})?;
rsx!
{
rsx! {
document::Link { rel: "stylesheet", href: LIST_CSS }
section
@ -155,6 +140,44 @@ pub fn BlogList(tags: Vec<String>, children: Element) -> Element
{
class: "blog_list",
match &*summaries.read()
{
Some(Ok(lores)) =>
{
rsx!
{
for lore in lores
{
BlogItem
{
title: lore.title.clone(),
slug: lore.slug.clone(),
author: lore.author.clone(),
summary: lore.summary.clone(),
tags: lore.tags.clone()
}
}
}
}
Some(Err(e)) =>
{
rsx!
{
p { "Unable to show post header." }
p { "{e}" }
}
}
None =>
{
rsx!
{
p { "Loading..." }
}
}
}
{children}
}
}
@ -164,16 +187,9 @@ pub fn BlogList(tags: Vec<String>, children: Element) -> Element
#[component]
pub fn BlogNav() -> Element
{
let tags = use_server_future(move ||
{
async move
{
get_tags().await
}
})?;
let tags = use_server_future(move || async move { get_tags().await })?;
rsx!
{
rsx! {
document::Link { rel: "stylesheet", href: NAV_CSS }
section
@ -186,38 +202,52 @@ pub fn BlogNav() -> Element
ul
{
class: "tag_list",
match &*tags.read()
{
Some(Ok(categories)) =>
{
rsx!
{
for tag in categories
{
li
{
class: "tag_item",
a { href: "/blog/LeetCode", "LeetCode" }
a { href: "/blog/{strip_tag(tag)}", "{strip_tag(tag)}" }
}
li
{
class: "tag_item",
a { href: "/blog/Embedded", "Embedded" }
}
}
li
}
Some(Err(e)) =>
{
rsx!
{
class: "tag_item",
a { href: "/blog/Simulation", "Simulation" }
p { "Unable to show desired post." }
p { "{e}" }
}
li
}
None =>
{
rsx!
{
class: "tag_item",
a { href: "/blog/Web", "Web" }
p { "Loading..." }
}
}
}
}
}
}
}
}
#[component]
pub fn PostHeaderAuthor(name: String, handle: String, profile_link: String) -> Element
pub fn PostHeaderAuthor(name: String, handle: String, profile_link: String)
-> Element
{
rsx!
{
rsx! {
h4 { "Author: ", a { href: "{profile_link}", "{name} @{handle}" } }
}
}
@ -225,27 +255,25 @@ pub fn PostHeaderAuthor(name: String, handle: String, profile_link: String) -> E
#[component]
pub fn PostHeader(title: String, author: String, tags: Vec<String>) -> Element
{
let author = use_server_future(move ||
{
let author = use_server_future(move || {
let target_author = author.clone();
async move
{
get_author(target_author).await
}
async move { get_author(target_author).await }
})?;
rsx!
{
let converted_tags: Vec<(String, String)> =
tags.iter().map(|t| convert_tag(t)).collect();
rsx! {
h1 { "{title}" }
TagList
{
for category in tags
for (tag, style) in converted_tags
{
TagItem
{
tag: Tag::LeetCode,
style: TagStyle::Regular
tag: tag.clone(),
style: style.clone()
}
}
}
@ -288,17 +316,12 @@ pub fn PostHeader(title: String, author: String, tags: Vec<String>) -> Element
#[component]
pub fn BlogPost(slug: String, children: Element) -> Element
{
let post = use_server_future(move ||
{
let post = use_server_future(move || {
let url_slug = slug.clone();
async move
{
get_blog_post(url_slug).await
}
async move { get_blog_post(url_slug).await }
})?;
rsx!
{
rsx! {
document::Link { rel: "stylesheet", href: POST_CSS }
article