use a vec

doordesk/app/src/components/slingshot.rs

@@ -1,8 +1,8 @@
 use leptos::*;
 use serde::{Deserialize, Serialize};
 
-use std::time::Duration;
 use std::thread::sleep;
+use std::time::Duration;
 
 pub fn fetch(path: &str) -> String {
     format!("https://dennis.doordesk.net/{path}")
@@ -17,14 +17,22 @@ pub struct ArticleData {
 }
 
 #[server(Slingshot)]
-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"),
-    };
+pub async fn slingshot() -> Result<Vec<ArticleData>, ServerFnError> {
+    let data_vec = vec![
+        ArticleData {
+            content_type: String::from("Blog"),
+            title: String::from("Test article"),
+            date: String::from("12/21/2022"),
+            content: String::from("Testicles"),
+        },
+        ArticleData {
+            content_type: String::from("Blog"),
+            title: String::from("Test article 2"),
+            date: String::from("12/22/2022"),
+            content: String::from("Testicless"),
+        },
+    ];
 
     sleep(Duration::from_secs(1));
-    Ok(data)
+    Ok(data_vec)
 }

doordesk/app/src/routes/home.rs

@@ -6,15 +6,17 @@ use leptos::*;
 pub fn Home() -> impl IntoView {
     let data_resource = create_local_resource(|| (), |_| async move { slingshot().await });
 
+    let articles_view = move || {
+        data_resource.and_then(|data| {
+            data.iter()
+            .map(|article| view! { <Article data=article.clone()/> })
+            .collect_view()
+        })
+    };
+
     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>
+        }>{articles_view}</Suspense>
     }
 }