feat: implement into for all applicable props

This commit is contained in:
alphafetus committed 2025-08-28 11:14:11 -04:00
1 parent df8b248ae4
commit 71ff8e6dc9
8 files changed
+113 -37

No files matched your search

+1
View File
@@ -6,4 +6,5 @@ pub struct StudentInfo {
pub first_name: String,
pub last_name: String,
pub math_sat_score: i32,
pub student_email: String,
}
+12 -1
View File
@@ -4,5 +4,16 @@ mod multi_entry;
mod text_field;
mod select;
mod checkboxes;
mod panel;
mod row;
pub use self::{action_button::*, loading::*, multi_entry::*, text_field::*, select::*, checkboxes::*};
pub use self::{
action_button::*,
loading::*,
multi_entry::*,
text_field::*,
select::*,
checkboxes::*,
panel::*,
row::*
};
+37
View File
@@ -0,0 +1,37 @@
use leptos::prelude::*;
/// A panel for use in visual separation of a group of components. A `Panel` arranges
/// a series of elements within a shaded rectangle using the flexbox column layout.
///
/// It takes a series of children. Usually these would be in the form of a `Row` element,
/// which will arrange its own children in a row within the panel, however it can be any
/// HTML element.
///
/// Example:
/// ```
/// view! {
/// <Panel>
/// <Row>
/// <OutlinedTextField
/// // ...
/// />
/// <CheckboxList
/// // ...
/// />
/// </Row>
/// </Panel>
/// }
/// ```
#[component]
pub fn Panel(
children: Children
) -> impl IntoView {
view! {
<div
class="flex flex-col gap-2 p-2 m-4 flex-1
border-1 border-gray-600/10
rounded-md shadow-[0_0_6px_rgba(0,0,0,0.50)]">
{children()}
</div>
}
}
+12
View File
@@ -0,0 +1,12 @@
use leptos::prelude::*;
#[component]
pub fn Row(
children: Children
) -> impl IntoView {
view! {
<div class="flex flex-row gap-2 flex-1">
{children()}
</div>
}
}
+1 -1
View File
@@ -1,4 +1,4 @@
use leptos::prelude::*;
use leptos::prelude::*;
/// A custom-styled select input.
///
+10 -9
View File
@@ -3,12 +3,12 @@ use leptos::prelude::*;
#[component]
pub fn OutlinedTextField<T>(
#[prop(default = String::from(""))] placeholder: String,
#[prop(default = T::default(), into)] placeholder: T,
#[prop(default = RwSignal::new(T::default()))] value: RwSignal<T>,
#[prop(default = RwSignal::new(false))] disabled: RwSignal<bool>,
#[prop(default = String::from(""))] name: String,
#[prop(default = String::from(""))] label: String,
#[prop(default = String::from(""))] input_type: String,
#[prop(default = String::from(""), into)] name: String,
#[prop(default = String::from(""), into)] label: String,
#[prop(default = String::from(""), into)] input_type: String,
) -> impl IntoView
where
T: Default + 'static + FromStr + ToString + PartialEq + Send + Sync + Clone
@@ -22,16 +22,17 @@ where
};
view! (
<div>
<label>
{ label }
<div class="flex flex-1">
<label class="flex flex-col flex-1">
<span class="block ml-1.5 mb-0">{label}</span>
<input
class="border-2 m-1.5 p-1.5 rounded-md bg-transparent mt-6 relative transition-all duration-150
class="border-2 m-1.5 p-1.5 mt-0 rounded-md bg-transparent relative flex-1
transition-all duration-150
border-red-700 bg-transparent
disabled:border-gray-600 disabled:pointer-events-none disabled:bg-gray-600/33"
r#type={input_type}
disabled={disabled}
placeholder={placeholder}
placeholder={placeholder.to_string()}
prop:name=name
prop:value={move || value.get().to_string()} // Sets the initial value.
on:input=on_input // Sets the value on each input.
+37 -23
View File
@@ -2,7 +2,7 @@
use aws_sdk_dynamodb::{error::ProvideErrorMetadata, types::AttributeValue, Client};
use crate::app::Unauthenticated;
use crate::common::{StudentInfo, StudentInfoReactive, UserClaims};
use crate::components::{ActionButton, Loading, OutlinedTextField, Select, CheckboxList};
use crate::components::{ActionButton, Loading, OutlinedTextField, Select, CheckboxList, Panel, Row};
use leptos::leptos_dom::logging::console_log;
use leptos::prelude::*;
use leptos_oidc::{Algorithm, AuthLoaded, AuthSignal, Authenticated};
@@ -42,12 +42,19 @@ pub async fn get_submission(id: String) -> Result<StudentInfo, ServerFnError> {
.map(|n| n.parse::<i32>().unwrap_or(0))
.unwrap_or_default();
let student_email = item
.get("studentEmail")
.and_then(|attr| attr.as_s().ok())
.map(|s| s.to_owned())
.unwrap_or_default();
console_log(format!("Got values from API: {} {}", first_name, last_name).as_str());
Ok(StudentInfo {
first_name,
last_name,
math_sat_score,
student_email,
})
}
Err(err) => {
@@ -130,14 +137,16 @@ pub fn HomePage() -> impl IntoView {
console_log(e.to_string().as_str());
StudentInfo {
first_name: String::from("Error"),
last_name: String::from(""),
last_name: String::new(),
math_sat_score: 0,
student_email: String::new()
}
}),
None => StudentInfo {
first_name: String::new(),
last_name: String::new(),
math_sat_score: 0,
student_email: String::new()
},
},
);
@@ -158,31 +167,35 @@ pub fn HomePage() -> impl IntoView {
let elements_disabled = RwSignal::new(false);
view! {
<p>
"Current user's reported full name from the API: "
{reactive_info.first_name}" "{reactive_info.last_name}
</p>
<form
class="flex flex-col gap-4">
<div class="flex flex-row gap-2">
<div class="flex flex-row">
<Panel>
<p>"Testing paragraph! This panel should be the same size as the other."</p>
</Panel>
<Panel>
<Row>
<p>
"Current user's reported full name from the API: "
{reactive_info.first_name}" "{reactive_info.last_name}
</p>
</Row>
<Row>
<OutlinedTextField
label="First Name".into()
placeholder="John".into()
label="First Name:"
placeholder="John"
disabled=elements_disabled
value=reactive_info.first_name />
<OutlinedTextField
label="Last Name".into()
placeholder="Smith".into()
label="Last Name:"
placeholder="Smith"
disabled=elements_disabled
value=reactive_info.last_name />
<OutlinedTextField
label="Testing".into()
placeholder="Test".into()
label="Contact Email"
placeholder="temp@region15.org"
disabled=elements_disabled
value=reactive_info.math_sat_score />
</div>
<div class="flex flex-row gap-2">
value=reactive_info.student_email />
</Row>
<Row>
<Select
value_list = vec!["Math".into(), "English".into(), "Science".into()]
value = select_value
@@ -192,8 +205,8 @@ pub fn HomePage() -> impl IntoView {
selected = chk_select
items = vec!["Testing 1".into(), "Testing 2".into()]
disabled=elements_disabled />
</div>
<div>
</Row>
<Row>
<ActionButton
on:click=move |_| {
console_log(format!("Found value {:?}", chk_select.get()).as_str());
@@ -205,8 +218,9 @@ pub fn HomePage() -> impl IntoView {
>
"Submit"
</ActionButton>
</div>
</form>
</Row>
</Panel>
</div>
}
})
}}
+3 -3
View File
@@ -25,9 +25,9 @@ pub fn ProviderEntry() -> impl IntoView {
<h2>It would usually have a series of questions that we ask the providers</h2>
<div>
<OutlinedTextField
placeholder = "Testing information...".into()
name = "testing_input".into()
label = "This is a testing question.".into()
placeholder = "Testing information..."
name = "testing_input"
label = "This is a testing question."
value = RwSignal::new("".to_owned())
/>
</div>