From 7f595ff27a1a52410fe638afb2831d4db4c05ba6 Mon Sep 17 00:00:00 2001
From: Aaron Fenyes <aaron.fenyes@fareycircles.ooo>
Date: Wed, 30 Oct 2024 15:49:01 -0700
Subject: [PATCH] Factor out constraint outline item

---
 app-proto/src/outline.rs | 45 ++++++++++++++++++++++++----------------
 1 file changed, 27 insertions(+), 18 deletions(-)

diff --git a/app-proto/src/outline.rs b/app-proto/src/outline.rs
index 8edbe07..944e54a 100644
--- a/app-proto/src/outline.rs
+++ b/app-proto/src/outline.rs
@@ -32,6 +32,27 @@ fn LorentzProductInput(constraint: Constraint) -> View {
     }
 }
 
+// a list item that shows a constraint in an outline view of an element
+#[component(inline_props)]
+fn ConstraintOutlineItem(constraint_key: usize, element_key: usize) -> View {
+    let state = use_context::<AppState>();
+    let assembly = &state.assembly;
+    let constraint = assembly.constraints.with(|csts| csts[constraint_key].clone());
+    let other_arg = if constraint.args.0 == element_key {
+        constraint.args.1
+    } else {
+        constraint.args.0
+    };
+    let other_arg_label = assembly.elements.with(|elts| elts[other_arg].label.clone());
+    view! {
+        li(class="cst") {
+            input(r#type="checkbox", bind:checked=constraint.active)
+            div(class="cst-label") { (other_arg_label) }
+            LorentzProductInput(constraint=constraint)
+        }
+    }
+}
+
 // a component that lists the elements of the current assembly, showing the
 // constraints on each element as a collapsible sub-list. its implementation
 // is based on Kate Morley's HTML + CSS tree views:
@@ -150,25 +171,13 @@ pub fn Outline() -> View {
                                 ul(class="constraints") {
                                     Keyed(
                                         list=elt.constraints.into_iter().collect::<Vec<_>>(),
-                                        view=move |c_key: usize| {
-                                            let c_state = use_context::<AppState>();
-                                            let assembly = &c_state.assembly;
-                                            let cst = assembly.constraints.with(|csts| csts[c_key].clone());
-                                            let other_arg = if cst.args.0 == key {
-                                                cst.args.1
-                                            } else {
-                                                cst.args.0
-                                            };
-                                            let other_arg_label = assembly.elements.with(|elts| elts[other_arg].label.clone());
-                                            view! {
-                                                li(class="cst") {
-                                                    input(r#type="checkbox", bind:checked=cst.active)
-                                                    div(class="cst-label") { (other_arg_label) }
-                                                    LorentzProductInput(constraint=cst)
-                                                }
-                                            }
+                                        view=move |cst_key| view! {
+                                            ConstraintOutlineItem(
+                                                constraint_key=cst_key,
+                                                element_key=key
+                                            )
                                         },
-                                        key=|c_key| c_key.clone()
+                                        key=|cst_key| cst_key.clone()
                                     )
                                 }
                             }