Merge pull request #23 from R15-Software-Dev/feature/chipslist-kv-pairs

Implement key-value pairs for ChipsList
This commit was merged in pull request #23.
This commit is contained in:
Lucas Vas authored and GitHub committed 2025-11-20 11:43:25 -05:00
commit c47ea1d86e
2 files changed
+26 -10

No files matched your search

+11 -8
View File
@@ -22,6 +22,7 @@ use crate::common::ValueType;
/// ``` /// ```
#[component] #[component]
pub fn Chip( pub fn Chip(
#[prop(into)] display_text: String,
#[prop(into)] value: String, #[prop(into)] value: String,
#[prop(into)] name: String, #[prop(into)] name: String,
#[prop(into)] on_change: Callback<(), ()>, #[prop(into)] on_change: Callback<(), ()>,
@@ -38,7 +39,7 @@ pub fn Chip(
view! { view! {
<label for=id> <label for=id>
<input <input
type="checkbox" r#type="checkbox"
class="relative peer shrink-0 hidden" class="relative peer shrink-0 hidden"
name=name.clone() name=name.clone()
id=id.clone() id=id.clone()
@@ -54,7 +55,7 @@ pub fn Chip(
peer-disabled:peer-checked:border-gray-700 peer-disabled:peer-checked:border-gray-700
peer-disabled:cursor-default peer-disabled:cursor-default
transition-all duration-150"> transition-all duration-150">
<span>{value.clone()}</span> <span>{display_text.clone()}</span>
</div> </div>
</label> </label>
} }
@@ -71,7 +72,8 @@ pub fn Chip(
pub fn ChipsList( pub fn ChipsList(
#[prop(into)] data_member: String, #[prop(into)] data_member: String,
#[prop()] data_map: RwSignal<HashMap<String, ValueType>>, #[prop()] data_map: RwSignal<HashMap<String, ValueType>>,
#[prop()] items: Vec<String>, #[prop()] displayed_text: Vec<String>,
#[prop()] values: Vec<String>,
#[prop(default = RwSignal::new(false))] disabled: RwSignal<bool>, #[prop(default = RwSignal::new(false))] disabled: RwSignal<bool>,
#[prop(optional, into)] label: String, #[prop(optional, into)] label: String,
) -> impl IntoView { ) -> impl IntoView {
@@ -79,11 +81,11 @@ pub fn ChipsList(
<div class="m-1.5 mt-0 mb-0"> <div class="m-1.5 mt-0 mb-0">
<span class="font-bold">{label}</span> <span class="font-bold">{label}</span>
<div class="flex flex-row flex-wrap gap-2 mt-1"> <div class="flex flex-row flex-wrap gap-2 mt-1">
{items {displayed_text.into_iter().zip(values)
.into_iter() .into_iter()
.map(|item| { .map(|(text, value)| {
let checked_signal = Signal::derive({ let checked_signal = Signal::derive({
let item_name = item.clone(); let item_name = value.clone();
let data_member = data_member.clone(); let data_member = data_member.clone();
move || { move || {
data_map.get() data_map.get()
@@ -97,7 +99,7 @@ pub fn ChipsList(
}); });
let on_change = { let on_change = {
let item_name = item.clone(); let item_name = value.clone();
let data_member = data_member.clone(); let data_member = data_member.clone();
move || { move || {
let result = ValueType::String(Some(item_name.clone())); let result = ValueType::String(Some(item_name.clone()));
@@ -133,7 +135,8 @@ pub fn ChipsList(
checked=checked_signal checked=checked_signal
name=data_member.clone() name=data_member.clone()
on_change=on_change on_change=on_change
value=item.clone() value=value.clone()
display_text=text.clone()
disabled=disabled disabled=disabled
/> />
} }
+15 -2
View File
@@ -271,7 +271,7 @@ pub fn HomePage() -> impl IntoView {
<ChipsList <ChipsList
data_member="athletic_requirements" data_member="athletic_requirements"
data_map=expandable_react.data data_map=expandable_react.data
items=vec!( displayed_text=vec!(
"Football", "Soccer", "Cross Country", "Cheerleading", "Football", "Soccer", "Cross Country", "Cheerleading",
"Swimming", "Wrestling", "Ski", "Basketball", "Swimming", "Wrestling", "Ski", "Basketball",
"Lacrosse", "Softball", "Indoor/Outdoor Track", "Lacrosse", "Softball", "Indoor/Outdoor Track",
@@ -279,6 +279,14 @@ pub fn HomePage() -> impl IntoView {
) )
.into_iter().map(|s| s.to_owned()) .into_iter().map(|s| s.to_owned())
.collect() .collect()
values=vec!(
"football", "soccer", "cross_country", "cheerleading",
"swimming", "wrestling", "ski", "basketball",
"lacrosse", "softball", "track",
"golf", "tennis", "volleyball"
)
.into_iter().map(|s| s.to_owned())
.collect()
disabled=elements_disabled disabled=elements_disabled
label="Sports/Athletic Requirements" label="Sports/Athletic Requirements"
/> />
@@ -287,12 +295,17 @@ pub fn HomePage() -> impl IntoView {
<ChipsList <ChipsList
data_member="community_involvement" data_member="community_involvement"
data_map=expandable_react.data data_map=expandable_react.data
items=vec!( displayed_text=vec!(
"Lion's Club", "Knights of Columbus", "Lion's Club", "Knights of Columbus",
"Community Service > 20hrs" "Community Service > 20hrs"
) )
.into_iter().map(|s| s.to_owned()) .into_iter().map(|s| s.to_owned())
.collect() .collect()
values=vec!(
"lions_club", "koc", "serv_20h"
)
.into_iter().map(|s| s.to_owned())
.collect()
disabled=elements_disabled disabled=elements_disabled
label="Required Community Involvement" label="Required Community Involvement"
/> />