From 94c2930d2a1ff34710fd51e87f6d0e3e9a607ee1 Mon Sep 17 00:00:00 2001
From: Lucas Vas <lvas463@gmail.com>
Date: Mon, 29 Dec 2025 19:08:28 -0500
Subject: [PATCH] feat: signal refactor for loaner page

---
 src/components/text_field.rs |   3 -
 src/pages/loaner_page.rs     | 148 +++++++++++++++++------------------
 2 files changed, 72 insertions(+), 79 deletions(-)

diff --git a/src/components/text_field.rs b/src/components/text_field.rs
index 5c22009..7ef089b 100644
--- a/src/components/text_field.rs
+++ b/src/components/text_field.rs
@@ -21,7 +21,6 @@ pub enum TextFieldType {
 
 /// Entry point for validating a text field.
 fn validate(required: bool, value: &str, input_type: &TextFieldType) -> ValidationState {
-    log!("Input information: required: {}, value: \"{}\", input_type: {:?}", required, value, input_type);
     if required && value.is_empty() {
         ValidationState::Invalid("This field is required.".to_string())
     } else {
@@ -36,7 +35,6 @@ fn validate(required: bool, value: &str, input_type: &TextFieldType) -> Validati
 /// Validates an email address.
 fn validate_email(input: &str) -> ValidationState {
     // TODO Accept more than just Region 15 addresses.
-    log!("Validating email: {}", input);
     let pattern = regex::Regex::new(r"^[a-zA-Z0-9._%+-]+@region15\.org$").expect("Invalid regex pattern");
 
     if pattern.is_match(input) {
@@ -48,7 +46,6 @@ fn validate_email(input: &str) -> ValidationState {
 
 /// Validates a number.
 fn validate_number(input: &str) -> ValidationState {
-    log!("Validating number: {}", input);
     if input.parse::<i32>().is_ok() {
         ValidationState::Valid
     } else {
diff --git a/src/pages/loaner_page.rs b/src/pages/loaner_page.rs
index b03cd9b..a916cbe 100644
--- a/src/pages/loaner_page.rs
+++ b/src/pages/loaner_page.rs
@@ -5,9 +5,7 @@ use aws_sdk_dynamodb::{Client, error::ProvideErrorMetadata, types::AttributeValu
 use serde_dynamo::{from_item, to_item};
 
 use crate::common::{ExpandableInfo, ValueType};
-use crate::components::{
-    ActionButton, Banner, DashboardButton, OutlinedTextField, Panel, Row, Select,
-};
+use crate::components::{ActionButton, Banner, DashboardButton, OutlinedTextField, Panel, Row, Select, TextFieldType, ValidatedForm};
 use chrono::{FixedOffset, TimeZone};
 use leptos::Params;
 use leptos::either::{Either, EitherOf3};
@@ -247,81 +245,79 @@ pub fn LoanerBorrowForm() -> impl IntoView {
     let create_entry_action = ServerAction::<CreateBorrowEntry>::new();
     let navigate = use_navigate();
 
-    let temp = ExpandableInfo::new(uuid::Uuid::new_v4().to_string());
-    let temp_reactive = temp.as_reactive();
-    let elements_disabled = RwSignal::new(false);
+    let data = RwSignal::new(HashMap::new());
+    let elements_disabled = Signal::derive(move || create_entry_action.pending().get());
+
+    let on_submit = move |_| {
+        create_entry_action.dispatch(CreateBorrowEntry {
+            input: ExpandableInfo {
+                subject: uuid::Uuid::new_v4().to_string(),
+                data: data.get(),
+            }
+        });
+    };
 
     view! {
-        <div class="flex flex-col justify-center gap-2 mb-1 py-3 px-2">
-            <h2 class="text-2xl font-bold">"Borrower Information"</h2>
-            <p class="text-lg">"Please fill out the form below."</p>
-        </div>
-        <Row>
-            <OutlinedTextField
-                label="First Name:"
-                placeholder="John"
-                disabled=elements_disabled
-                data_member="first_name"
-                data_map=temp_reactive.data
-            />
-            <OutlinedTextField
-                label="Last Name:"
-                placeholder="Smith"
-                disabled=elements_disabled
-                data_member="last_name"
-                data_map=temp_reactive.data
-            />
-        </Row>
-        <Row>
-            <OutlinedTextField
-                label="Region 15 Email:"
-                placeholder="example@region15.org"
-                disabled=elements_disabled
-                data_member="email"
-                data_map=temp_reactive.data
-            />
-        </Row>
-        <Row>
-            <Select
-                label="Collateral:"
-                value_list=vec![
-                    "Phone".to_string(),
-                    "Earbuds/Headphones".to_string(),
-                    "Keys".to_string(),
-                    "Wallet".to_string(),
-                    "Laptop".to_string(),
-                ]
-                disabled=elements_disabled
-                data_member="collateral"
-                data_map=temp_reactive.data
-            />
-        </Row>
-        <Row>
-            <Select
-                label="Loan Taken:"
-                value_list=vec![
-                    "Chromebook".to_string(),
-                    "Charger".to_string(),
-                    "Headphones".to_string(),
-                ]
-                disabled=elements_disabled
-                data_member="loan"
-                data_map=temp_reactive.data
-            />
-        </Row>
-        <Row>
-            <ActionButton
-                on:click=move |_| {
-                    let captured = temp_reactive.capture();
-                    log!("Loaner record taken.");
-                    log!("{:?}", captured);
-                    create_entry_action.dispatch(CreateBorrowEntry {
-                        input: captured
-                    });
-                    navigate("/loaners", Default::default());
-                }
-            >"Submit"</ActionButton>
-        </Row>
+        <ValidatedForm on_submit=Callback::new(on_submit)>
+            <div class="flex flex-col justify-center gap-2 mb-1 py-3 px-2">
+                <h2 class="text-2xl font-bold">"Borrower Information"</h2>
+                <p class="text-lg">"Please fill out the form below."</p>
+            </div>
+            <Row>
+                <OutlinedTextField
+                    label="First Name:"
+                    placeholder="John"
+                    disabled=elements_disabled
+                    data_member="first_name"
+                    data_map=data
+                />
+                <OutlinedTextField
+                    label="Last Name:"
+                    placeholder="Smith"
+                    disabled=elements_disabled
+                    data_member="last_name"
+                    data_map=data
+                />
+            </Row>
+            <Row>
+                <OutlinedTextField
+                    label="Region 15 Email:"
+                    placeholder="example@region15.org"
+                    disabled=elements_disabled
+                    data_member="email"
+                    data_map=data
+                    input_type=TextFieldType::Email
+                />
+            </Row>
+            <Row>
+                <Select
+                    label="Collateral:"
+                    value_list=vec![
+                        "Phone".to_string(),
+                        "Earbuds/Headphones".to_string(),
+                        "Keys".to_string(),
+                        "Wallet".to_string(),
+                        "Laptop".to_string(),
+                    ]
+                    disabled=elements_disabled
+                    data_member="collateral"
+                    data_map=data
+                />
+            </Row>
+            <Row>
+                <Select
+                    label="Loan Taken:"
+                    value_list=vec![
+                        "Chromebook".to_string(),
+                        "Charger".to_string(),
+                        "Headphones".to_string(),
+                    ]
+                    disabled=elements_disabled
+                    data_member="loan"
+                    data_map=data
+                />
+            </Row>
+        </ValidatedForm>
     }
 }