darkicewolf50/personal_site
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

feat(blog): ready to hook up to backend, need to generate blogs page naviagation

Browse Source
This commit is contained in:
darkicewolf50 2025-05-13 16:34:07 -06:00
parent 3fa74f8fd0
commit b292bea28b
2 changed files with 45 additions and 20 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

63
src/views/blog.rs
View File

@ -1,5 +1,6 @@
use crate::Route;
use dioxus::{document::Link, prelude::*};
use dioxus::{logger::tracing, prelude::*};
use reqwest::{Client, Response};
const BLOG_CSS: Asset = asset!("/assets/styling/blog.css");
@ -9,33 +10,53 @@ const BLOG_CSS: Asset = asset!("/assets/styling/blog.css");
/// re-run and the rendered HTML will be updated.
#[component]
pub fn Blog(blog_title: String) -> Element {
let blog_content = use_signal(|| {
"<h1>This is a blog #blog_title</h1>
<p>
In blog #{blog_title}, we show how the Dioxus router works and
how URL parameters can be passed as props to our route components.
</p>"
.to_string()
});
rsx! {
document::Link { rel: "stylesheet", href: BLOG_CSS }
div { id: "blog",
// Content
h1 { "This is blog #{blog_title}!" }
p {
"In blog #{blog_title}, we show how the Dioxus router works and how URL parameters can be passed as props to our route components."
}
// h1 { "This is blog #{blog_title}!" }
// p {
// "In blog #{blog_title}, we show how the Dioxus router works and how URL parameters can be passed as props to our route components."
// }
// // Navigation links
// // The `Link` component lets us link to other routes inside our app. It takes a `to` prop of type `Route` and
// // any number of child nodes.
// Link {
// // The `to` prop is the route that the link should navigate to. We can use the `Route` enum to link to the
// // blog page with the id of -1. Since we are using an enum instead of a string, all of the routes will be checked
// // at compile time to make sure they are valid.
// to: Route::Blog { id: id - 1 },
// "Previous"
// }
// span { " <---> " }
// Link { to: Route::Blog { id: id + 1 }, "Next" }
// // Navigation links
// // The `Link` component lets us link to other routes inside our app. It takes a `to` prop of type `Route` and
// // any number of child nodes.
// Link {
// // The `to` prop is the route that the link should navigate to. We can use the `Route` enum to link to the
// // blog page with the id of -1. Since we are using an enum instead of a string, all of the routes will be checked
// // at compile time to make sure they are valid.
// to: Route::Blog { id: id - 1 },
// "Previous"
// }
// span { " <---> " }
// Link { to: Route::Blog { id: id + 1 }, "Next" }
Link { to: Route::Blogs { id: 0 }, "Go Back" }
div { dangerous_inner_html: blog_content }
}
}
}
async fn getBlog(blog_name: String) {
let res = reqwest::get("https://www.rust-lang.org")
.await
.unwrap()
.text()
.await
.unwrap_or("".to_string());
tracing::info!("{}", res);
}
#[component]
pub fn Blogs(id: i32) -> Element {
rsx! {
@ -43,9 +64,15 @@ pub fn Blogs(id: i32) -> Element {
div { id: "blogs",
h1 { "Page Under Development" }
p { "Please Try Again Later" }
dioxus::prelude::Link { to: Route::Home {},
Link { to: Route::Home {},
button { "Home" }
}
// Link {
// to: Route::Blog {
// blog_title: "Test_Blog".to_string(),
// },
// button { "To Test Blog" }
// }
}
}
}

2
src/views/contact_me.rs
View File

@ -28,7 +28,6 @@ pub fn ContactMe() -> Element {
}
}
div {
// div { id: "contact-me",
label { "Name" }
input {
oninput: move |event| {
@ -60,7 +59,6 @@ pub fn ContactMe() -> Element {
},
"Submit"
}
// }
}
}
Contact {}