actually feed articles properly

doordesk/app/src/components/article.rs

@@ -2,40 +2,17 @@ use crate::components::slingshot::*;
 use leptos::*;
 
 #[component]
-pub fn Article() -> impl IntoView {
+pub fn Article(data: ArticleData) -> impl IntoView {
-    let data = create_resource(
-        || (),
-        |_| async move {
-            logging::log!("loading data from slingshot");
-            slingshot().await
-        },
-    );
 
     view! {
         <Transition>
             <article class="p-7 my-5 mx-auto w-11/12 max-w-screen-xl bg-opacity-10 rounded-md bg-zinc-700 shadow-1g">
                 <h1 class="text-3xl font-light text-orange-600 capitalize max-6-xs">
-                    {move || match data.get() {
+                    {&data.title}
-                        None => "Loading...".to_string(),
-                        Some(data) => data.unwrap().title,
-                    }}
-
                 </h1>
                 <hr class="opacity-50"/>
-                <span class="pt-0 pb-3.5 text-xs opacity-50 m-t">
+                <span class="pt-0 pb-3.5 text-xs opacity-50 m-t">{&data.date}</span>
-                    {move || match data.get() {
+                <div>{&data.content}</div>
-                        None => "Loading...".to_string(),
-                        Some(data) => data.unwrap().date,
-                    }}
-
-                </span>
-                <div>
-                    {move || match data.get() {
-                        None => "Loading...".to_string(),
-                        Some(data) => data.unwrap().content,
-                    }}
-
-                </div>
             </article>
         </Transition>
     }

doordesk/app/src/components/slingshot.rs

@@ -1,5 +1,12 @@
 use leptos::*;
-use serde::{Serialize, Deserialize};
+use serde::{Deserialize, Serialize};
+
+use std::time::Duration;
+use std::thread::sleep;
+
+pub fn fetch(path: &str) -> String {
+    format!("https://dennis.doordesk.net/{path}")
+}
 
 #[derive(Debug, Clone, Serialize, Deserialize)]
 pub struct ArticleData {
@@ -18,5 +25,6 @@ pub async fn slingshot() -> Result<ArticleData, ServerFnError> {
         content: String::from("Testicles"),
     };
 
+    sleep(Duration::from_secs(1));
     Ok(data)
 }

doordesk/app/src/lib.rs

@@ -1,34 +1,29 @@
 use crate::error_template::{AppError, ErrorTemplate};
 
-//use crate::routes::{blog::*, home::*, projects::*};
 use leptos::*;
 use leptos_meta::*;
 use leptos_router::*;
 
-pub mod error_template;
 pub mod components;
+pub mod error_template;
 pub mod routes;
 
-use crate::routes::{home::*, blog::*, projects::*};
+// use crate::routes::{blog::*, home::*, projects::*};
+use crate::routes::home::Home;
 
 #[component]
 pub fn App() -> impl IntoView {
-    // Provides context that manages stylesheets, titles, meta tags, etc.
     provide_meta_context();
 
     view! {
         <Stylesheet id="leptos" href="/pkg/doordesk.css"/>
-
-        // sets the document title
         <Title text="doordesk"/>
-
-        // content for this welcome page
         <Router fallback=|| {
             let mut outside_errors = Errors::default();
             outside_errors.insert_with_default_key(AppError::NotFound);
             view! { <ErrorTemplate outside_errors/> }.into_view()
         }>
-            <nav class="bg-gradient-to-b from-zinc-800 to-zinc-900 shadow-lg sticky top-0">
+            <nav class="sticky top-0 bg-gradient-to-b shadow-lg from-zinc-800 to-zinc-900">
                 <ul class="container flex items-center p-3">
                     <li class="mx-1.5 sm:mx-6">"DoorDesk"</li>
                     <li class="mx-1.5 sm:mx-6">
@@ -42,16 +37,19 @@ pub fn App() -> impl IntoView {
                     <li class="mx-1.5 sm:mx-6">
                         <A href="/projects">"Projects"</A>
                     </li>
+                    <li class="mx-1.5 sm:mx-6">
+                        <a href="https://git.doordesk.net">"Git"</a>
+                    </li>
                 </ul>
             </nav>
             <main>
                 <Routes>
                     <Route path="" view=Home/>
-                    <Route path="blog" view=Blog/>
+                // <Route path="blog" view=Blog/>
-                    <Route path="projects" view=Projects/>
+                // <Route path="projects" view=Projects/>
                 </Routes>
             </main>
-            <p class="text-center hover:rotate-180 duration-200 w-8 m-auto">
+            <p class="m-auto w-8 text-center duration-200 hover:rotate-180">
                 <a href="https://open.spotify.com/playlist/3JRNw9gpt1w5ptsw8uDeYc?si=8f7e4191113f41f9">
                     ":)"
                 </a>

doordesk/app/src/routes.rs

@@ -1,3 +1,3 @@
 pub mod home;
-pub mod blog;
+// pub mod blog;
-pub mod projects;
+// pub mod projects;

doordesk/app/src/routes/home.rs

@@ -1,7 +1,20 @@
 use crate::components::article::*;
+use crate::components::slingshot::*;
 use leptos::*;
 
 #[component]
 pub fn Home() -> impl IntoView {
-    view! { <Article/> }
+    let data_resource = create_local_resource(|| (), |_| async move { slingshot().await });
+
+    view! {
+        <Suspense fallback=move || {
+            view! { <p>"Loading..."</p> }
+        }>
+            {move || match data_resource.get() {
+                None => view! { <p>"Loading..."</p> }.into_view(),
+                Some(data) => view! { <Article data=data.unwrap()/> }.into_view(),
+            }}
+
+        </Suspense>
+    }
 }