sycamore_helpers 0.3.0

Helper functions for sycamore
Documentation
#![allow(clippy::type_complexity)]
#![allow(non_snake_case)]

// This is required because Component must be caps in order for it to work with the view! macro
use sycamore::prelude::*;
use web_sys::Event;

pub fn make_list<'a, G: Html, T: Clone + PartialEq>(
    Component: &'a dyn Fn(Scope<'a>, (&'a Signal<T>, Box<dyn Fn(Event) + 'a>)) -> View<G>,
    items: &'a Signal<Vec<&'a Signal<T>>>
) -> impl Fn(Scope<'a>, ()) -> View<G> + 'a {
    move |ctx, _| {
        let memo: &'a ReadSignal<Vec<(&'a Signal<T>, &'a Signal<Vec<&'a Signal<T>>>)>> = create_memo(ctx, move || items.get().iter().cloned().map(|item| (item, items)).collect());
        
        let tmp = create_memo(ctx, move || {
            let views: Vec<View<G>> = memo.get().iter().map(|(item, items)| {
                let remove = |_| {
                    items.set(
                        items.get().iter().cloned()
                            .filter(|i| i.get() != item.get())
                            .collect()
                    );
                };
                view!{ctx, 
                    Component((item, Box::new(remove)))
                }
            }).collect();
            View::new_dyn(ctx, move || View::new_fragment(views.clone()))
        });

        view!{ctx,
            (tmp.get().as_ref().clone())
        }
    }
}


#[cfg(test)]
mod tests {
    use sycamore::prelude::*;
    use web_sys::Event;
    use super::make_list;

    #[component]
    fn _TestComponent<G: Html>(ctx: Scope) -> View<G> {
        let items = create_signal(ctx, vec![create_signal(ctx, 1)]);
        let EnhancedComponent = make_list(&_Child, items);
        view! { ctx,
            EnhancedComponent()
        }
    }

    #[component]
    fn _Child<'a, G: Html>(ctx: Scope<'a>, props: (&'a Signal<i32>, Box<dyn Fn(Event) + 'a>)) -> View<G> {
        let (item, callback) = props;
        view! { ctx,
            p {(item.get())}
            input(type="button", on:click=callback)
        }
    }
}