Function DropdownPref

src/components/prefs/components.rs:740–831

(
    #[prop()] key: String,
    #[prop()] title: K,
    #[prop()] tooltip: K1,
    #[prop()] mobile: bool,
)

#[tracing::instrument(level = "debug", skip(key, title, tooltip, mobile))]
#[component]
pub fn DropdownPref<K, H, K1, H1>(
    #[prop()] key: String,
    #[prop()] title: K,
    #[prop()] tooltip: K1,
    #[prop()] mobile: bool,
) -> impl IntoView
where
    K: Fn() -> H + Send + Sync + 'static,
    H: IntoView + Copy + 'static,
    K1: Fn() -> H1 + Send + Sync + 'static,
    H1: IntoView + Copy + 'static,
{
    let ui_store = expect_context::<RwSignal<UiStore>>();
    let is_mobile = create_read_slice(ui_store, |u| u.get_is_mobile()).get();
    if is_mobile && !mobile {
        return ().into_any();
    }

    let should_write = RwSignal::new(false);
    let pref_value = RwSignal::<Vec<CheckboxPreference>>::new(Default::default());
    let pref_key = key;
    load_selective(pref_key.clone(), pref_value.write_only());

    Effect::new(move || {
        let value = pref_value.get();
        if !should_write.get_untracked() {
            untrack(|| should_write.set(true));
            return;
        }

        save_selective(pref_key.clone(), value.clone());
    });

    let selected = create_read_slice(pref_value, |v| {
        v.iter().find(|i| i.enabled).map(|v| v.key.clone())
    });

    view! {
        <div class="container-fluid mt-4">
            <div class="row no-gutters">
                <div class="col-auto align-self-center title d-flex preference-title">
                    {title()}
                </div>
                <div class="col-auto ml-2">
                    <Tooltip>{tooltip()}</Tooltip>
                </div>
            </div>

            <div class="row no-gutters">
                <div class="col-auto">
                    <select
                        class="dropdown-list"
                        on:change=move |ev| {
                            let value = event_target_value(&ev);
                            pref_value
                                .update(|v| {
                                    for item in v {
                                        item.enabled = item.key == value;