fixup edit wall page

crates/ascend/src/components/problem.rs

@@ -23,9 +23,7 @@ pub fn Problem(#[prop(into)] dim: Signal<models::WallDimensions>, #[prop(into)]
 
     view! {
         <div class="grid grid-cols-[auto,1fr] gap-8">
-            <div class=move || { grid_classes.clone() }>
+            <div class=move || { grid_classes.clone() }>{holds}</div>
-                {holds}
-            </div>
         </div>
     }
 }

crates/ascend/src/pages/edit_wall.rs

@@ -1,13 +1,13 @@
-use crate::codec::ron::Ron;
+use crate::components::StyledHeader;
-use crate::codec::ron::RonEncoded;
 use crate::components::header::HeaderItem;
 use crate::components::header::HeaderItems;
 use crate::models;
 use crate::models::HoldPosition;
-use crate::models::Wall;
+use leptos::Params;
 use leptos::ev::Event;
 use leptos::html::Input;
 use leptos::prelude::*;
+use leptos_router::params::Params;
 use serde::Deserialize;
 use serde::Serialize;
 use server_fn::codec::Cbor;
@@ -15,17 +15,28 @@ use wasm_bindgen::JsCast;
 use wasm_bindgen::prelude::*;
 use web_sys::FileList;
 
+#[derive(Params, PartialEq, Clone)]
+struct RouteParams {
+    wall_uid: Option<models::WallUid>,
+}
+
 #[component]
 pub fn EditWall() -> impl leptos::IntoView {
-    let load = async move {
+    let params = leptos_router::hooks::use_params::<RouteParams>();
-        // TODO: What to do about this unwrap?
+    let wall_uid = Signal::derive(move || {
-        load_initial_data().await.unwrap()
+        params
-    };
+            .get()
+            .expect("gets wall_uid from URL")
+            .wall_uid
+            .expect("wall_uid param is never None")
+    });
 
-    let header_items = HeaderItems {
+    let wall = crate::resources::wall_by_uid(wall_uid);
+
+    let header_items = move || HeaderItems {
         left: vec![HeaderItem {
             text: "← Ascend".to_string(),
-            link: Some("/".to_string()),
+            link: Some(format!("/wall/{}", wall_uid.get())),
         }],
         middle: vec![HeaderItem {
             text: "HOLDS".to_string(),
@@ -34,29 +45,43 @@ pub fn EditWall() -> impl leptos::IntoView {
         right: vec![],
     };
 
-    // leptos::view! {
+    leptos::view! {
-    //     <div class="min-w-screen min-h-screen bg-slate-900">
+        <div class="min-w-screen min-h-screen bg-slate-900">
-    //         <StyledHeader items=header_items />
+            <StyledHeader items=Signal::derive(header_items) />
 
-    //         <div class="container mx-auto mt-2">
+            <div class="container mx-auto mt-2">
-    //             <Await future=load let:data>
+                <Suspense fallback=move || {
-    //                 <Ready data=data.deref().to_owned() />
+                    view! { <p>"Loading..."</p> }
-    //             </Await>
+                }>
-    //         </div>
+                    {move || Suspend::new(async move {
-    //     </div>
+                        let wall = wall.await;
-    // }
+                        view! {
+                            <ErrorBoundary fallback=|_errors| {
+                                "error"
+                            }>
+                                {move || -> Result<_, ServerFnError> {
+                                    let wall = wall.clone()?;
+                                    Ok(view! { <Ready wall /> })
+                                }}
+                            </ErrorBoundary>
+                        }
+                    })}
+                </Suspense>
+            </div>
+        </div>
+    }
 }
 
 #[component]
-fn Ready(data: InitialData) -> impl leptos::IntoView {
+fn Ready(wall: models::Wall) -> impl leptos::IntoView {
     tracing::debug!("ready");
 
     let mut holds = vec![];
-    for hold in data.wall.holds.values().cloned() {
+    for hold in wall.holds.values().cloned() {
         holds.push(view! { <Hold hold /> });
     }
 
-    let grid_classes = format!("grid grid-rows-{} grid-cols-{} gap-3", data.wall.rows, data.wall.cols);
+    let grid_classes = format!("grid grid-rows-{} grid-cols-{} gap-3", wall.rows, wall.cols);
 
     view! {
         <div>
@@ -137,29 +162,12 @@ fn Hold(hold: models::Hold) -> impl leptos::IntoView {
     }
 }
 
-#[derive(Debug, Serialize, Deserialize, Clone)]
-pub struct InitialData {
-    wall: Wall,
-}
-
 #[derive(Debug, Serialize, Deserialize, Clone)]
 pub struct Image {
     file_name: String,
     file_contents: Vec<u8>,
 }
 
-#[server(
-    input = Ron,
-    output = Ron,
-    custom = RonEncoded
-)]
-#[tracing::instrument(skip_all, err)]
-async fn load_initial_data() -> Result<RonEncoded<InitialData>, ServerFnError> {
-    todo!()
-    // let wall = state.persistent.with(|s| s.wall.clone()).await;
-    // Ok(RonCodec::new(InitialData { wall }))
-}
-
 #[server(name = SetImage, input = Cbor)]
 #[tracing::instrument(skip(image), err)]
 async fn set_image(hold_position: HoldPosition, image: Image) -> Result<models::Hold, ServerFnError> {

crates/ascend/src/pages/routes.rs

@@ -1,4 +1,3 @@
-use crate::codec::ron::Ron;
 use crate::components;
 use crate::components::header::HeaderItem;
 use crate::components::header::HeaderItems;
@@ -65,20 +64,14 @@ pub fn Routes() -> impl leptos::IntoView {
                             each=problems_sample
                             key=|problem| problem.uid
                             children=move |problem: models::Problem| {
-                                view! {
+                                view! { <Problem dim=wall_dimensions problem /> }
-                                    <Problem dim=wall_dimensions problem/>
-                                }
                             }
                         />
                     </div>
                 })
             };
 
-            view! {
+            view! { <ErrorBoundary fallback=|_errors| "error">{v}</ErrorBoundary> }
-                <ErrorBoundary fallback=|errors| "error">
-                 {v}
-                </ErrorBoundary>
-            }
         })
     };
 
@@ -87,11 +80,8 @@ pub fn Routes() -> impl leptos::IntoView {
             <StyledHeader items=header_items />
 
             <div class="container mx-auto mt-2">
-                {move ||  view! { <Import wall_uid=wall_uid.get() /> }}
+                {move || view! { <Import wall_uid=wall_uid.get() /> }}
-
+                <Suspense fallback=|| view! { <p>"loading"</p> }>{suspend}</Suspense>
-                <Suspense fallback=|| view! {<p>"loading"</p>}>
-                     {suspend}
-                </Suspense>
             </div>
         </div>
     }
@@ -104,7 +94,7 @@ fn Problem(#[prop(into)] dim: Signal<models::WallDimensions>, #[prop(into)] prob
 
     view! {
         <components::Problem dim problem />
-        <p>{ move || problem.get().name.clone() }</p>
+        <p>{move || problem.get().name.clone()}</p>
     }
 }
 

crates/ascend/src/pages/wall.rs

@@ -59,7 +59,7 @@ pub fn Wall() -> impl IntoView {
                     {move || Suspend::new(async move {
                         let wall: Option<models::Wall> = wall.get().and_then(Result::ok);
                         wall.map(|wall| {
-                            view! { <Ready wall/> }
+                            view! { <Ready wall /> }
                         })
                     })}
                 </Suspense>
@@ -121,9 +121,9 @@ fn Ready(wall: models::Wall) -> impl leptos::IntoView {
             </div>
 
             <div>
-                <div>// TODO:
+                // TODO:
                 // <p>{current_problem.read().as_ref().map(|p| p.name.clone())}</p>
-                // <p>{current_problem.read().as_ref().map(|p| p.set_by.clone())}</p>
+                <div>// <p>{current_problem.read().as_ref().map(|p| p.set_by.clone())}</p>
                 </div>
 
                 <Button onclick=move |_| problem_fetcher.mark_dirty() text="➤ Next problem" />