pain

doordesk/Cargo.lock

@@ -86,6 +86,7 @@ dependencies = [
  "leptos_axum",
  "leptos_meta",
  "leptos_router",
+ "serde",
  "thiserror",
 ]
 
@@ -1877,9 +1878,9 @@ checksum = "58bf37232d3bb9a2c4e641ca2a11d83b5062066f88df7fed36c28772046d65ba"
 
 [[package]]
 name = "serde"
-version = "1.0.194"
+version = "1.0.195"
 source = "registry+https://github.com/rust-lang/crates.io-index"
-checksum = "0b114498256798c94a0689e1a15fec6005dee8ac1f41de56404b67afc2a4b773"
+checksum = "63261df402c67811e9ac6def069e4786148c4563f4b50fd4bf30aa370d626b02"
 dependencies = [
  "serde_derive",
 ]
@@ -1897,9 +1898,9 @@ dependencies = [
 
 [[package]]
 name = "serde_derive"
-version = "1.0.194"
+version = "1.0.195"
 source = "registry+https://github.com/rust-lang/crates.io-index"
-checksum = "a3385e45322e8f9931410f01b3031ec534c3947d0e94c18049af4d9f9907d4e0"
+checksum = "46fe8f8603d81ba86327b23a2e9cdf49e1255fb94a4c5f297f6ee0547178ea2c"
 dependencies = [
  "proc-macro2",
  "quote",

doordesk/app/Cargo.toml

@@ -14,6 +14,7 @@ leptos_axum = { workspace = true, optional = true }
 http.workspace = true
 cfg-if.workspace = true
 thiserror.workspace = true
+serde = "1.0.195"
 
 [features]
 default = []

doordesk/app/src/components.rs

@@ -1 +1,2 @@
 pub mod article;
+pub mod slingshot;

doordesk/app/src/components/article.rs

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

doordesk/app/src/components/slingshot.rs

@@ -0,0 +1,22 @@
+use leptos::*;
+use serde::{Serialize, Deserialize};
+
+#[derive(Debug, Clone, Serialize, Deserialize)]
+pub struct ArticleData {
+    pub content_type: String,
+    pub title: String,
+    pub date: String, // make datetime?
+    pub content: String,
+}
+
+#[server(Slingshot, "/api", "Cbor")]
+pub async fn slingshot() -> Result<ArticleData, ServerFnError> {
+    let data = ArticleData {
+        content_type: String::from("Blog"),
+        title: String::from("Test article"),
+        date: String::from("12/21/2022"),
+        content: String::from("Testicles"),
+    };
+
+    Ok(data)
+}

doordesk/app/src/lib.rs

@@ -30,11 +30,11 @@ pub fn App() -> impl IntoView {
         }>
             <nav class="bg-gradient-to-b from-zinc-800 to-zinc-900 shadow-lg sticky top-0">
                 <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">
-                        "DoorDesk"
-                    </li>
-                    <li class="mx-1.5 sm:mx-6">
-                        <A href="" exact=true>"Home"</A>
+                        <A href="" exact=true>
+                            "Home"
+                        </A>
                     </li>
                     <li class="mx-1.5 sm:mx-6">
                         <A href="/blog">"Blog"</A>
@@ -52,7 +52,9 @@ pub fn App() -> impl IntoView {
                 </Routes>
             </main>
             <p class="text-center hover:rotate-180 duration-200 w-8 m-auto">
-                <a href="https://open.spotify.com/playlist/3JRNw9gpt1w5ptsw8uDeYc?si=8f7e4191113f41f9">":)"</a>
+                <a href="https://open.spotify.com/playlist/3JRNw9gpt1w5ptsw8uDeYc?si=8f7e4191113f41f9">
+                    ":)"
+                </a>
             </p>
             <br/>
         </Router>

doordesk/app/src/routes/blog.rs

@@ -3,8 +3,5 @@ use leptos::*;
 
 #[component]
 pub fn Blog() -> impl IntoView {
-    view! {
-        <Article />
-        <p>Blog</p>
-    }
+    view! { <Article/> }
 }

doordesk/app/src/routes/home.rs

@@ -3,8 +3,5 @@ use leptos::*;
 
 #[component]
 pub fn Home() -> impl IntoView {
-    view! {
-        <Article />
-        <p>Home</p>
-    }
+    view! { <Article/> }
 }

doordesk/app/src/routes/projects.rs

@@ -3,8 +3,5 @@ use leptos::*;
 
 #[component]
 pub fn Projects() -> impl IntoView {
-    view! {
-        <Article />
-        <p>Projects</p>
-    }
+    view! { <Article/> }
 }