Update webi_* and envman to work with leptos 0.7.

crate/webi_components/src/home.rs → crate/webi_components/src/app.rs

@@ -1,6 +1,15 @@
-use leptos::{component, view, IntoView};
+use std::time::Duration;
+
+use leptos::{
+    component,
+    prelude::{signal, ClassAttribute, ElementChild, Get},
+    view, IntoView,
+};
 use leptos_meta::{provide_meta_context, Link, Stylesheet};
-use leptos_router::{Route, Router, Routes};
+use leptos_router::{
+    components::{Route, Router, Routes, RoutingProgress},
+    StaticSegment,
+};
 
 use crate::ChildrenFn;
 
@@ -10,26 +19,41 @@ use crate::ChildrenFn;
 ///
 /// * `flow_component`: The web component to render for the flow.
 #[component]
-pub fn Home(app_home: ChildrenFn) -> impl IntoView {
+pub fn App(app_home: ChildrenFn) -> impl IntoView {
     // Provides context that manages stylesheets, titles, meta tags, etc.
     provide_meta_context();
 
     let site_prefix = option_env!("SITE_PREFIX").unwrap_or("");
     let favicon_path = format!("{site_prefix}/webi/favicon.ico");
     let fonts_path = format!("{site_prefix}/webi/fonts/fonts.css");
 
+    let (is_routing, set_is_routing) = signal(false);
+
     view! {
         <Link rel="shortcut icon" type_="image/ico" href=favicon_path />
         <Stylesheet id="fonts" href=fonts_path />
-        <Router>
+        <Router set_is_routing>
+            <div class="routing-progress">
+                <RoutingProgress is_routing max_time=Duration::from_millis(250)/>
+            </div>
             <main>
-                <Routes>
+                <Routes fallback=RouterFallback>
                     <Route
-                        path=site_prefix
+                        path=StaticSegment(site_prefix)
                         view=move || app_home.call()
                     />
                 </Routes>
             </main>
         </Router>
     }
 }
+
+#[component]
+fn RouterFallback() -> impl IntoView {
+    let location = leptos_router::hooks::use_location();
+    let pathname = move || location.pathname.get();
+
+    view! {
+        <p>"Path not found: " {pathname}</p>
+    }
+}

crate/webi_components/src/children_fn.rs

@@ -1,6 +1,10 @@
 use std::{fmt, sync::Arc};
 
-use leptos::{Fragment, IntoView, ToChildren};
+use leptos::{
+    children::ToChildren,
+    prelude::{AnyView, IntoAny, Render},
+    IntoView,
+};
 
 /// Allows a consumer to pass in the view fragment for a
 /// [`leptos_router::Route`].
@@ -15,40 +19,41 @@ use leptos::{Fragment, IntoView, ToChildren};
 /// When we migrate to `leptos 0.7`, `ChildrenFn` is an alias for `Arc<_>` so we
 /// can use it directly.
 #[derive(Clone)]
-pub struct ChildrenFn(Arc<dyn Fn() -> Fragment + Send + Sync>);
+pub struct ChildrenFn(Arc<dyn Fn() -> AnyView + Send + Sync>);
 
 impl ChildrenFn {
     /// Returns a new `ChildrenFn`;
     pub fn new<F, IV>(f: F) -> Self
     where
         F: Fn() -> IV + Send + Sync + 'static,
-        IV: IntoView,
+        IV: IntoView + 'static,
+        <IV as Render>::State: 'static,
     {
-        Self(Arc::new(move || Fragment::from(f().into_view())))
+        Self(Arc::new(move || f().into_view().into_any()))
     }
 
     /// Returns the underlying function.
-    pub fn into_inner(self) -> Arc<dyn Fn() -> Fragment + Send + Sync> {
+    pub fn into_inner(self) -> Arc<dyn Fn() -> AnyView + Send + Sync> {
         self.0
     }
 
     /// Calls the inner function to render the view.
-    pub fn call(&self) -> Fragment {
+    pub fn call(&self) -> AnyView {
         (self.0)()
     }
 }
 
 impl fmt::Debug for ChildrenFn {
     fn fmt(&self, f: &mut fmt::Formatter<'_>) -> fmt::Result {
         f.debug_tuple("ChildrenFn")
-            .field(&"Arc<dyn Fn() -> Fragment + Send + Sync>")
+            .field(&"Arc<dyn Fn() -> AnyView + Send + Sync>")
             .finish()
     }
 }
 
 impl<F> ToChildren<F> for ChildrenFn
 where
-    F: Fn() -> Fragment + 'static + Send + Sync,
+    F: Fn() -> AnyView + 'static + Send + Sync,
 {
     #[inline]
     fn to_children(f: F) -> Self {

crate/webi_components/src/flow_graph.rs

@@ -3,7 +3,11 @@ use dot_ix::{
     rt::IntoGraphvizDotSrc,
     web_components::DotSvg,
 };
-use leptos::{component, server, view, IntoView, ServerFnError, SignalSet, Transition};
+use leptos::{
+    component,
+    prelude::{ClassAttribute, ElementChild, ServerFnError, Set, Transition},
+    server, view, IntoView,
+};
 
 /// Renders the flow graph.
 ///
@@ -25,18 +29,19 @@ pub fn FlowGraph() -> impl IntoView {
 
 #[server]
 async fn progress_info_graph_fetch() -> Result<InfoGraph, ServerFnError> {
-    use leptos::{ReadSignal, SignalGet};
+    use leptos::prelude::{Get, ReadSignal};
     use peace_core::FlowId;
     use peace_webi_model::FlowProgressInfoGraphs;
 
-    let flow_id = leptos::use_context::<ReadSignal<FlowId>>();
-    let flow_progress_info_graphs = leptos::use_context::<FlowProgressInfoGraphs<FlowId>>();
+    let flow_id = leptos::prelude::use_context::<ReadSignal<FlowId>>();
+    let flow_progress_info_graphs =
+        leptos::prelude::use_context::<FlowProgressInfoGraphs<FlowId>>();
     let progress_info_graph = if let Some(flow_progress_info_graphs) = flow_progress_info_graphs {
         let flow_progress_info_graphs = flow_progress_info_graphs.lock().ok();
 
         flow_id
             .as_ref()
-            .map(SignalGet::get)
+            .map(Get::get)
             .zip(flow_progress_info_graphs)
             .and_then(|(flow_id, flow_progress_info_graphs)| {
                 flow_progress_info_graphs.get(&flow_id).cloned()
@@ -52,25 +57,21 @@ async fn progress_info_graph_fetch() -> Result<InfoGraph, ServerFnError> {
 #[component]
 fn ProgressGraph() -> impl IntoView {
     let (progress_info_graph, progress_info_graph_set) =
-        leptos::create_signal(InfoGraph::default());
-    let (dot_src_and_styles, dot_src_and_styles_set) = leptos::create_signal(None);
-
-    leptos::create_local_resource(
-        move || (),
-        move |()| async move {
-            let progress_info_graph = progress_info_graph_fetch().await.unwrap_or_default();
-            let dot_src_and_styles =
-                IntoGraphvizDotSrc::into(&progress_info_graph, &GraphvizDotTheme::default());
-
-            if let Ok(progress_info_graph_serialized) = serde_yaml::to_string(&progress_info_graph)
-            {
-                leptos::logging::log!("{progress_info_graph_serialized}");
-            }
-
-            progress_info_graph_set.set(progress_info_graph);
-            dot_src_and_styles_set.set(Some(dot_src_and_styles));
-        },
-    );
+        leptos::prelude::signal(InfoGraph::default());
+    let (dot_src_and_styles, dot_src_and_styles_set) = leptos::prelude::signal(None);
+
+    leptos::prelude::LocalResource::new(move || async move {
+        let progress_info_graph = progress_info_graph_fetch().await.unwrap_or_default();
+        let dot_src_and_styles =
+            IntoGraphvizDotSrc::into(&progress_info_graph, &GraphvizDotTheme::default());
+
+        if let Ok(progress_info_graph_serialized) = serde_yaml::to_string(&progress_info_graph) {
+            leptos::logging::log!("{progress_info_graph_serialized}");
+        }
+
+        progress_info_graph_set.set(progress_info_graph);
+        dot_src_and_styles_set.set(Some(dot_src_and_styles));
+    });
 
     view! {
         <Transition fallback=move || view! { <p>"Loading graph..."</p> }>
@@ -84,18 +85,18 @@ fn ProgressGraph() -> impl IntoView {
 
 #[server]
 async fn outcome_info_graph_fetch() -> Result<InfoGraph, ServerFnError> {
-    use leptos::{ReadSignal, SignalGet};
+    use leptos::prelude::{Get, ReadSignal};
     use peace_core::FlowId;
     use peace_webi_model::FlowOutcomeInfoGraphs;
 
-    let flow_id = leptos::use_context::<ReadSignal<FlowId>>();
-    let flow_outcome_info_graphs = leptos::use_context::<FlowOutcomeInfoGraphs<FlowId>>();
+    let flow_id = leptos::prelude::use_context::<ReadSignal<FlowId>>();
+    let flow_outcome_info_graphs = leptos::prelude::use_context::<FlowOutcomeInfoGraphs<FlowId>>();
     let outcome_info_graph = if let Some(flow_outcome_info_graphs) = flow_outcome_info_graphs {
         let flow_outcome_info_graphs = flow_outcome_info_graphs.lock().ok();
 
         flow_id
             .as_ref()
-            .map(SignalGet::get)
+            .map(Get::get)
             .zip(flow_outcome_info_graphs)
             .and_then(|(flow_id, flow_outcome_info_graphs)| {
                 flow_outcome_info_graphs.get(&flow_id).cloned()
@@ -110,24 +111,22 @@ async fn outcome_info_graph_fetch() -> Result<InfoGraph, ServerFnError> {
 
 #[component]
 fn OutcomeGraph() -> impl IntoView {
-    let (outcome_info_graph, outcome_info_graph_set) = leptos::create_signal(InfoGraph::default());
-    let (dot_src_and_styles, dot_src_and_styles_set) = leptos::create_signal(None);
-
-    leptos::create_local_resource(
-        move || (),
-        move |()| async move {
-            let outcome_info_graph = outcome_info_graph_fetch().await.unwrap_or_default();
-            let dot_src_and_styles =
-                IntoGraphvizDotSrc::into(&outcome_info_graph, &GraphvizDotTheme::default());
-
-            if let Ok(outcome_info_graph_serialized) = serde_yaml::to_string(&outcome_info_graph) {
-                leptos::logging::log!("{outcome_info_graph_serialized}");
-            }
-
-            outcome_info_graph_set.set(outcome_info_graph);
-            dot_src_and_styles_set.set(Some(dot_src_and_styles));
-        },
-    );
+    let (outcome_info_graph, outcome_info_graph_set) =
+        leptos::prelude::signal(InfoGraph::default());
+    let (dot_src_and_styles, dot_src_and_styles_set) = leptos::prelude::signal(None);
+
+    leptos::prelude::LocalResource::new(move || async move {
+        let outcome_info_graph = outcome_info_graph_fetch().await.unwrap_or_default();
+        let dot_src_and_styles =
+            IntoGraphvizDotSrc::into(&outcome_info_graph, &GraphvizDotTheme::default());
+
+        if let Ok(outcome_info_graph_serialized) = serde_yaml::to_string(&outcome_info_graph) {
+            leptos::logging::log!("{outcome_info_graph_serialized}");
+        }
+
+        outcome_info_graph_set.set(outcome_info_graph);
+        dot_src_and_styles_set.set(Some(dot_src_and_styles));
+    });
 
     view! {
         <Transition fallback=move || view! { <p>"Loading graph..."</p> }>

crate/webi_components/src/flow_graph_current.rs

@@ -4,7 +4,9 @@ use dot_ix::{
     web_components::DotSvg,
 };
 use leptos::{
-    component, server, view, IntoView, ServerFnError, SignalGetUntracked, SignalSet, Transition,
+    component,
+    prelude::{ClassAttribute, ElementChild, GetUntracked, ServerFnError, Set, Transition},
+    server, view, IntoView,
 };
 
 /// Renders the flow graph.
@@ -18,54 +20,48 @@ use leptos::{
 #[component]
 pub fn FlowGraphCurrent() -> impl IntoView {
     let (progress_info_graph_get, progress_info_graph_set) =
-        leptos::create_signal(InfoGraph::default());
+        leptos::prelude::signal(InfoGraph::default());
     let (progress_dot_src_and_styles, progress_dot_src_and_styles_set) =
-        leptos::create_signal(None);
+        leptos::prelude::signal(None);
 
     let (outcome_info_graph_get, outcome_info_graph_set) =
-        leptos::create_signal(InfoGraph::default());
-    let (outcome_dot_src_and_styles, outcome_dot_src_and_styles_set) = leptos::create_signal(None);
-
-    leptos::create_local_resource(
-        move || (),
-        move |()| async move {
-            use gloo_timers::future::TimeoutFuture;
-
-            loop {
-                if let Ok(Some((progress_info_graph, outcome_info_graph))) =
-                    info_graphs_fetch().await
-                {
-                    // Progress
-                    let progress_dot_src_and_styles = IntoGraphvizDotSrc::into(
-                        &progress_info_graph,
-                        &GraphvizDotTheme::default(),
-                    );
-
-                    if progress_info_graph != progress_info_graph_get.get_untracked() {
-                        progress_info_graph_set.set(progress_info_graph);
-                        progress_dot_src_and_styles_set.set(Some(progress_dot_src_and_styles));
-                    }
-
-                    // Outcome
-                    let outcome_dot_src_and_styles =
-                        IntoGraphvizDotSrc::into(&outcome_info_graph, &GraphvizDotTheme::default());
+        leptos::prelude::signal(InfoGraph::default());
+    let (outcome_dot_src_and_styles, outcome_dot_src_and_styles_set) =
+        leptos::prelude::signal(None);
+
+    leptos::prelude::LocalResource::new(move || async move {
+        use gloo_timers::future::TimeoutFuture;
+
+        loop {
+            if let Ok(Some((progress_info_graph, outcome_info_graph))) = info_graphs_fetch().await {
+                // Progress
+                let progress_dot_src_and_styles =
+                    IntoGraphvizDotSrc::into(&progress_info_graph, &GraphvizDotTheme::default());
+
+                if progress_info_graph != progress_info_graph_get.get_untracked() {
+                    progress_info_graph_set.set(progress_info_graph);
+                    progress_dot_src_and_styles_set.set(Some(progress_dot_src_and_styles));
+                }
 
-                    if outcome_info_graph != outcome_info_graph_get.get_untracked() {
-                        if let Ok(outcome_info_graph_serialized) =
-                            serde_yaml::to_string(&outcome_info_graph)
-                        {
-                            leptos::logging::log!("{outcome_info_graph_serialized}");
-                        }
+                // Outcome
+                let outcome_dot_src_and_styles =
+                    IntoGraphvizDotSrc::into(&outcome_info_graph, &GraphvizDotTheme::default());
 
-                        outcome_info_graph_set.set(outcome_info_graph);
-                        outcome_dot_src_and_styles_set.set(Some(outcome_dot_src_and_styles));
+                if outcome_info_graph != outcome_info_graph_get.get_untracked() {
+                    if let Ok(outcome_info_graph_serialized) =
+                        serde_yaml::to_string(&outcome_info_graph)
+                    {
+                        leptos::logging::log!("{outcome_info_graph_serialized}");
                     }
-                }
 
-                TimeoutFuture::new(250).await;
+                    outcome_info_graph_set.set(outcome_info_graph);
+                    outcome_dot_src_and_styles_set.set(Some(outcome_dot_src_and_styles));
+                }
             }
-        },
-    );
+
+            TimeoutFuture::new(250).await;
+        }
+    });
 
     view! {
         <div class="flex items-center justify-center">
@@ -90,9 +86,11 @@ async fn info_graphs_fetch() -> Result<Option<(InfoGraph, InfoGraph)>, ServerFnE
     use peace_cmd_model::CmdExecutionId;
     use peace_webi_model::{FlowOutcomeInfoGraphs, FlowProgressInfoGraphs};
 
-    let cmd_execution_id = leptos::use_context::<Arc<Mutex<Option<CmdExecutionId>>>>();
-    let flow_progress_info_graphs = leptos::use_context::<FlowProgressInfoGraphs<CmdExecutionId>>();
-    let flow_outcome_info_graphs = leptos::use_context::<FlowOutcomeInfoGraphs<CmdExecutionId>>();
+    let cmd_execution_id = leptos::prelude::use_context::<Arc<Mutex<Option<CmdExecutionId>>>>();
+    let flow_progress_info_graphs =
+        leptos::prelude::use_context::<FlowProgressInfoGraphs<CmdExecutionId>>();
+    let flow_outcome_info_graphs =
+        leptos::prelude::use_context::<FlowOutcomeInfoGraphs<CmdExecutionId>>();
 
     if let Some(((cmd_execution_id, flow_progress_info_graphs), flow_outcome_info_graphs)) =
         cmd_execution_id