//! Calendars and address books: the collection list beside each view, the
//! dialog that manages one collection, the client setup help and the import
//! of an `.ics` or `.vcf` file.

use std::collections::HashSet;

use api_types::{CreatePimCollection, CreatePimLink, UpdatePimCollection};
use leptos::prelude::*;
use wasm_bindgen_futures::spawn_local;

use crate::api::{
    self, Me, PimCollectionInfo, PimCollectionKind, PimImportResult, PimLinkInfo,
    PimShareCandidate, PimShareInfo, PimShareMode,
};
use crate::components::icon::{Icon, icon_svg};
use crate::components::modal::Modal;
use crate::components::toast::{ToastMsg, show, show_error};
use crate::i18n::{self, k};
use crate::icons::IconName;
use crate::router::{Location, Section, navigate, server_url};
use crate::util::{copy_to_clipboard, local_date_time, storage_get, storage_set};
use crate::views::calendar::CalendarMain;
use crate::views::contacts::ContactsMain;
use crate::views::dialogs::ConfirmDialog;
use crate::views::shares::expiry_to_rfc3339;

/// Colors offered for a collection; a custom one comes from the color input.
/// No gray: the server paints its generated collections gray.
const PALETTE: [&str; 8] = [
    "#3b82f6", "#22c55e", "#f59e0b", "#ef4444", "#a855f7", "#14b8a6", "#ec4899", "#f97316",
];

/// The first palette color no listed collection uses, so a new one stands
/// out. A collection without color shows the first palette color.
fn next_color(collections: &[PimCollectionInfo]) -> String {
    let used: HashSet<String> = collections
        .iter()
        .filter(|c| !c.generated)
        .map(|c| {
            c.color
                .as_deref()
                .unwrap_or(PALETTE[0])
                .to_ascii_lowercase()
        })
        .collect();
    PALETTE
        .iter()
        .find(|p| !used.contains(**p))
        .unwrap_or(&PALETTE[used.len() % PALETTE.len()])
        .to_string()
}

/// The collections the lists do not show, by id.
const HIDDEN_KEY: &str = "dovenest.pim-hidden";

/// Collection ids hidden in the calendar and contact views.
pub fn load_hidden() -> HashSet<i64> {
    storage_get(HIDDEN_KEY)
        .unwrap_or_default()
        .split(',')
        .filter_map(|s| s.parse().ok())
        .collect()
}

fn save_hidden(ids: &HashSet<i64>) {
    let list: Vec<String> = ids.iter().map(i64::to_string).collect();
    storage_set(HIDDEN_KEY, &list.join(","));
}

/// A collection's color for a style attribute. Colors of lent collections
/// come from other clients, so anything but a hex color falls back.
pub fn safe_color(c: Option<&str>) -> String {
    match c.and_then(|c| c.strip_prefix('#')) {
        Some(h) if [3, 6, 8].contains(&h.len()) && h.bytes().all(|b| b.is_ascii_hexdigit()) => {
            format!("#{h}")
        }
        _ => "var(--accent)".to_string(),
    }
}

/// Shows only `id` of the collections `ids`. On the only shown one, shows
/// them all again. Collections of the other kind keep their state.
fn solo(hidden: &mut HashSet<i64>, ids: &[i64], id: i64) {
    let alone = !hidden.contains(&id) && ids.iter().all(|o| *o == id || hidden.contains(o));
    for &o in ids {
        if alone || o == id {
            hidden.remove(&o);
        } else {
            hidden.insert(o);
        }
    }
}

/// The name to show: generated collections have translated names.
pub fn display_name(c: &PimCollectionInfo) -> String {
    match (c.generated, c.kind) {
        (true, PimCollectionKind::Calendar) => i18n::t(k::PIM_BIRTHDAYS).to_string(),
        (true, PimCollectionKind::Addressbook) => i18n::t(k::PIM_DIRECTORY).to_string(),
        _ => c.name.clone(),
    }
}

/// Whether the signed-in user may add objects to a collection.
pub fn writable(c: &PimCollectionInfo) -> bool {
    !c.generated && c.mode != Some(PimShareMode::Ro)
}

pub fn mode_label(m: PimShareMode) -> &'static str {
    match m {
        PimShareMode::Ro => i18n::t(k::PIM_MODE_RO),
        PimShareMode::Rw => i18n::t(k::PIM_MODE_RW),
        PimShareMode::RwSchedule => i18n::t(k::PIM_MODE_SCHEDULE),
    }
}

/// `webcal://` opens the calendar app; the transport stays HTTP(S).
pub fn webcal(url: &str) -> Option<String> {
    url.strip_prefix("https://")
        .or_else(|| url.strip_prefix("http://"))
        .map(|rest| format!("webcal://{rest}"))
}

/// The browser's IANA time zone, for dates the server resolves.
pub fn browser_tz() -> String {
    let opts = js_sys::Intl::DateTimeFormat::new(&js_sys::Array::new(), &js_sys::Object::new())
        .resolved_options();
    js_sys::Reflect::get(&opts, &"timeZone".into())
        .ok()
        .and_then(|v| v.as_string())
        .unwrap_or_else(|| "UTC".to_string())
}

/// A readable form of the precondition an import skip names.
fn skip_reason(reason: &str) -> String {
    let key = match reason {
        "valid-calendar-data" | "valid-address-data" | "valid-calendar-object-resource" => {
            k::PIM_SKIP_INVALID
        }
        "supported-calendar-component" => k::PIM_SKIP_COMPONENT,
        "unique-scheduling-object-resource" => k::PIM_SKIP_UID,
        "max-resource-size" => k::PIM_SKIP_SIZE,
        _ => return reason.to_string(),
    };
    i18n::t(key).to_string()
}

/// The calendar or contacts section: the collection list, and the view of
/// what the visible collections hold.
#[component]
pub fn PimView(
    kind: PimCollectionKind,
    me: ReadSignal<Option<Me>>,
    loc: ReadSignal<Location>,
) -> impl IntoView {
    let (collections, set_collections) = signal(Option::<Vec<PimCollectionInfo>>::None);
    let (load_err, set_load_err) = signal(Option::<String>::None);
    let hidden = RwSignal::new(load_hidden());
    let reload_seq = StoredValue::new(0u32);
    let reload = Callback::new(move |_| {
        set_load_err.set(None);
        let seq = reload_seq.get_value() + 1;
        reload_seq.set_value(seq);
        spawn_local(async move {
            let r = api::pim_collections().await;
            if reload_seq.try_get_value() != Some(seq) {
                return;
            }
            match r {
                Ok(v) => {
                    let _ = set_collections.try_set(Some(v));
                }
                Err(e) => {
                    let _ = set_load_err.try_set(Some(e.to_string()));
                }
            }
        });
    });
    reload.run(());
    // An open event or contact must belong to a shown collection. Only a
    // change of the shown set closes it, so a link to a hidden one still opens.
    Effect::new(move |prev: Option<()>| {
        let h = hidden.get();
        if prev.is_none() {
            return;
        }
        let open = loc.with_untracked(|l| {
            l.open
                .as_deref()
                .and_then(|o| o.split('/').next()?.parse::<i64>().ok())
        });
        if open.is_some_and(|id| h.contains(&id)) {
            crate::router::close_open();
        }
    });
    let main = match kind {
        PimCollectionKind::Calendar => {
            let week_start = Signal::derive(move || {
                me.with(|m| {
                    m.as_ref()
                        .and_then(|m| m.user.as_ref())
                        .map_or(1, |u| u32::from(u.week_start))
                })
            });
            view! {
                <CalendarMain collections=collections hidden=hidden loc=loc week_start=week_start/>
            }
            .into_any()
        }
        PimCollectionKind::Addressbook => {
            view! { <ContactsMain collections=collections hidden=hidden loc=loc/> }.into_any()
        }
    };
    view! {
        <div class="pim-view">
            <CollectionList
                kind=kind
                collections=collections
                load_err=load_err
                hidden=hidden
                reload=reload
                me=me
            />
            <section class="pim-main">{main}</section>
        </div>
    }
}

#[component]
fn CollectionList(
    kind: PimCollectionKind,
    collections: ReadSignal<Option<Vec<PimCollectionInfo>>>,
    load_err: ReadSignal<Option<String>>,
    hidden: RwSignal<HashSet<i64>>,
    reload: Callback<()>,
    me: ReadSignal<Option<Me>>,
) -> impl IntoView {
    let (managing, set_managing) = signal(Option::<PimCollectionInfo>::None);
    let (creating, set_creating) = signal(false);
    let (importing, set_importing) = signal(false);
    let (connecting, set_connecting) = signal(false);
    let calendars = kind == PimCollectionKind::Calendar;
    let (title, new_label) = match calendars {
        true => (k::PIM_CALENDARS, k::PIM_NEW_CALENDAR),
        false => (k::PIM_ADDRESS_BOOKS, k::PIM_NEW_ADDRESS_BOOK),
    };
    let ids_of_kind = move || {
        collections.with_untracked(|c| {
            c.iter()
                .flatten()
                .filter(|c| c.kind == kind)
                .map(|c| c.id)
                .collect::<Vec<_>>()
        })
    };
    let any_hidden = move || {
        collections.with(|c| {
            hidden.with(|h| {
                c.iter()
                    .flatten()
                    .any(|c| c.kind == kind && h.contains(&c.id))
            })
        })
    };
    let show_all = move |_| {
        let ids = ids_of_kind();
        hidden.update(|h| {
            for id in &ids {
                h.remove(id);
            }
            save_hidden(h);
        });
    };
    let row = move |c: PimCollectionInfo| {
        let id = c.id;
        let is_hidden = move || hidden.with(|h| h.contains(&id));
        let toggle = move |_| {
            hidden.update(|h| {
                if !h.remove(&id) {
                    h.insert(id);
                }
                save_hidden(h);
            });
        };
        let only_this = move |_| {
            let ids = ids_of_kind();
            hidden.update(|h| {
                solo(h, &ids, id);
                save_hidden(h);
            });
        };
        let note = match (c.generated, c.mode) {
            (true, _) => Some(i18n::t(k::PIM_AUTO).to_string()),
            (false, Some(_)) => Some(c.owner.clone()),
            _ => None,
        };
        let name = display_name(&c);
        let color = safe_color(c.color.as_deref());
        let info = c.clone();
        view! {
            <div class="pim-row" class:pim-row-hidden=is_hidden>
                <button
                    class="pim-toggle"
                    title=move || if is_hidden() { i18n::t(k::PIM_SHOW) } else { i18n::t(k::PIM_HIDE) }
                    // Pressed means shown. A label that flips with the state
                    // would read "Hide, pressed" to a screen reader.
                    aria-label=name.clone()
                    aria-pressed=move || (!is_hidden()).to_string()
                    on:click=toggle
                >
                    <span class="pim-swatch" style=format!("--swatch: {color}")></span>
                </button>
                <button
                    class="pim-row-main"
                    title=i18n::tr(k::PIM_SHOW_ONLY)
                    on:click=only_this
                >
                    <span class="pim-row-name">{name.clone()}</span>
                    {note.map(|n| view! { <span class="pim-row-note">{n}</span> })}
                </button>
                <button
                    class="icon-btn icon-btn-sm pim-row-gear"
                    title=i18n::tr(k::PIM_MANAGE)
                    aria-label=move || i18n::t_fmt(k::PIM_MANAGE_OF, &name)
                    on:click=move |_| set_managing.set(Some(info.clone()))
                >
                    <Icon name=IconName::Settings class="ic-btn".to_string()/>
                </button>
            </div>
        }
    };
    view! {
        <aside class="pim-side">
            <div class="pim-side-head">
                <h3 class="admin-section-title">{i18n::tr(title)}</h3>
                <button
                    class="icon-btn icon-btn-sm"
                    title=i18n::tr(k::PIM_CONNECT)
                    aria-label=i18n::tr(k::PIM_CONNECT)
                    on:click=move |_| set_connecting.set(true)
                >
                    <Icon name=IconName::Devices class="ic-btn".to_string()/>
                </button>
                <button
                    class="icon-btn icon-btn-sm"
                    title=i18n::tr(k::PIM_NEW_FROM_FILE)
                    aria-label=i18n::tr(k::PIM_NEW_FROM_FILE)
                    on:click=move |_| set_importing.set(true)
                >
                    <Icon name=IconName::Upload class="ic-btn".to_string()/>
                </button>
                <button
                    class="icon-btn icon-btn-sm"
                    title=i18n::tr(new_label)
                    aria-label=i18n::tr(new_label)
                    on:click=move |_| set_creating.set(true)
                >
                    <Icon name=IconName::Add class="ic-btn".to_string()/>
                </button>
            </div>
            {move || match collections.get() {
                None => match load_err.get() {
                    Some(msg) => view! {
                        <div class="card error-card">
                            <span>{msg}</span>
                            <button class="btn" on:click=move |_| reload.run(())>
                                {i18n::tr(k::RETRY)}
                            </button>
                        </div>
                    }
                    .into_any(),
                    None => view! { <p class="muted">{i18n::tr(k::LOADING)}</p> }.into_any(),
                },
                Some(list) => {
                    let (mine, lent): (Vec<_>, Vec<_>) = list
                        .into_iter()
                        .filter(|c| c.kind == kind)
                        .partition(|c| c.mode.is_none());
                    let lent_block = (!lent.is_empty()).then(|| view! {
                        <div class="pim-group-label">{i18n::tr(k::PIM_SHARED_WITH_ME)}</div>
                        {lent.into_iter().map(row).collect::<Vec<_>>()}
                    });
                    view! {
                        <div class="pim-list">
                            {mine.into_iter().map(row).collect::<Vec<_>>()}
                            {lent_block}
                        </div>
                        <Show when=any_hidden>
                            <button class="btn btn-sm pim-show-all" on:click=show_all>
                                {i18n::tr(k::PIM_SHOW_ALL)}
                            </button>
                        </Show>
                    }
                    .into_any()
                }
            }}
        </aside>
        {move || managing.get().map(|info| view! {
            <CollectionDialog
                info=info
                on_close=Callback::new(move |_| set_managing.set(None))
                on_changed=reload
            />
        })}
        <Show when=move || creating.get()>
            <NewCollectionDialog
                kind=kind
                collections=collections
                on_close=Callback::new(move |_| set_creating.set(false))
                on_created=reload
            />
        </Show>
        <Show when=move || importing.get()>
            <ImportNewDialog
                kind=kind
                collections=collections
                on_close=Callback::new(move |_| set_importing.set(false))
                on_created=reload
            />
        </Show>
        <Show when=move || connecting.get()>
            <ConnectDialog
                me=me
                collections=collections
                on_close=Callback::new(move |_| set_connecting.set(false))
            />
        </Show>
    }
}

/// The palette plus a custom color. `None` clears the color.
#[component]
fn ColorPicker(color: RwSignal<Option<String>>) -> impl IntoView {
    view! {
        <div class="pim-colors" role="radiogroup" aria-label=i18n::tr(k::PIM_COLOR)>
            {PALETTE
                .iter()
                .map(|&c| {
                    view! {
                        <button
                            type="button"
                            class="pim-color"
                            class:selected=move || color.with(|v| v.as_deref() == Some(c))
                            role="radio"
                            aria-checked=move || color.with(|v| v.as_deref() == Some(c)).to_string()
                            title=c
                            style=format!("--swatch: {c}")
                            on:click=move |_| color.set(Some(c.to_string()))
                        ></button>
                    }
                })
                .collect::<Vec<_>>()}
            <input
                type="color"
                class="pim-color-input"
                title=i18n::tr(k::PIM_CUSTOM_COLOR)
                aria-label=i18n::tr(k::PIM_CUSTOM_COLOR)
                prop:value=move || {
                    color.with(|v| {
                        // `safe_color` guarantees ASCII hex before slicing.
                        let c = safe_color(v.as_deref());
                        match c.len() >= 7 && c.starts_with('#') {
                            true => c[..7].to_string(),
                            false => "#3b82f6".to_string(),
                        }
                    })
                }
                on:input=move |ev| color.set(Some(event_target_value(&ev)))
            />
        </div>
    }
}

#[component]
fn NewCollectionDialog(
    kind: PimCollectionKind,
    collections: ReadSignal<Option<Vec<PimCollectionInfo>>>,
    on_close: Callback<()>,
    on_created: Callback<()>,
) -> impl IntoView {
    let toast = use_context::<ToastMsg>().expect("toast context");
    let (name, set_name) = signal(String::new());
    let color = RwSignal::new(Some(
        collections.with_untracked(|c| next_color(c.as_deref().unwrap_or_default())),
    ));
    let (description, set_description) = signal(String::new());
    let (busy, set_busy) = signal(false);
    let title = match kind {
        PimCollectionKind::Calendar => k::PIM_NEW_CALENDAR,
        PimCollectionKind::Addressbook => k::PIM_NEW_ADDRESS_BOOK,
    };
    let submit = move |ev: web_sys::SubmitEvent| {
        ev.prevent_default();
        let n = name.get().trim().to_string();
        if n.is_empty() || busy.get() {
            return;
        }
        set_busy.set(true);
        let body = CreatePimCollection {
            kind,
            name: n,
            color: color.get(),
            description: Some(description.get()).filter(|d| !d.trim().is_empty()),
            components: Vec::new(),
        };
        spawn_local(async move {
            match api::pim_create_collection(body).await {
                Ok(_) => {
                    show(toast, i18n::t(k::PIM_CREATED));
                    let _ = on_created.try_run(());
                    let _ = on_close.try_run(());
                }
                Err(e) => {
                    show_error(toast, e.to_string());
                    let _ = set_busy.try_set(false);
                }
            }
        });
    };
    view! {
        <Modal class="pim-modal" on_close=on_close>
            <form on:submit=submit>
                <h2 class="modal-title">{i18n::tr(title)}</h2>
                <label class="field">
                    <span class="field-label">{i18n::tr(k::NAME)}</span>
                    <input
                        class="field-input"
                        required=true
                        maxlength="200"
                        autofocus=true
                        prop:value=move || name.get()
                        on:input=move |ev| set_name.set(event_target_value(&ev))
                    />
                </label>
                <div class="field">
                    <span class="field-label">{i18n::tr(k::PIM_COLOR)}</span>
                    <ColorPicker color=color/>
                </div>
                <label class="field">
                    <span class="field-label">{i18n::tr(k::PIM_DESCRIPTION)}</span>
                    <textarea
                        class="field-input"
                        rows="2"
                        prop:value=move || description.get()
                        on:input=move |ev| set_description.set(event_target_value(&ev))
                    ></textarea>
                </label>
                <div class="modal-actions">
                    <button type="button" class="btn" on:click=move |_| on_close.run(())>
                        {i18n::tr(k::CANCEL)}
                    </button>
                    <button type="submit" class="btn btn-primary" disabled=move || busy.get()>
                        {i18n::tr(k::CREATE)}
                    </button>
                </div>
            </form>
        </Modal>
    }
}

/// A read-only URL with a copy button.
fn url_row(url: String, toast: ToastMsg) -> impl IntoView {
    let copy = url.clone();
    view! {
        <div class="share-link-row">
            <input
                class="share-link-input"
                readonly=true
                value=url
                on:click={|ev| event_target::<web_sys::HtmlInputElement>(&ev).select()}
            />
            <button
                type="button"
                class="btn"
                on:click=move |_| copy_to_clipboard(&copy, i18n::t(k::LINK_COPIED), toast)
            >
                {icon_svg(IconName::Copy, "ic-btn")}
                {i18n::t(k::COPY)}
            </button>
        </div>
    }
}

/// Everything about one collection: its settings, who it is lent to, its
/// public links, export and deletion.
#[component]
fn CollectionDialog(
    info: PimCollectionInfo,
    on_close: Callback<()>,
    on_changed: Callback<()>,
) -> impl IntoView {
    let toast = use_context::<ToastMsg>().expect("toast context");
    let own = info.mode.is_none() && !info.generated;
    let url = server_url(&info.url);
    let lent_note = info.mode.map(|m| {
        format!(
            "{} · {}",
            i18n::t_fmt(k::PIM_SHARED_BY, &info.owner),
            mode_label(m)
        )
    });
    let generated_note = info.generated.then(|| i18n::t(k::PIM_GENERATED_HINT));
    view! {
        <Modal class="pim-modal" on_close=on_close>
            <h2 class="modal-title pim-modal-title">
                <span class="pim-swatch" style=format!("--swatch: {}", safe_color(info.color.as_deref()))></span>
                <span>{display_name(&info)}</span>
            </h2>
            {lent_note.map(|n| view! { <p class="muted pim-note">{n}</p> })}
            {generated_note.map(|n| view! { <p class="muted pim-note">{n}</p> })}
            {own.then(|| view! { <GeneralSection info=info.clone() on_changed=on_changed/> })}
            <section class="pim-section">
                <h3 class="pim-section-title">{i18n::tr(k::PIM_ADDRESS)}</h3>
                {url_row(url, toast)}
            </section>
            {own.then(|| view! { <SharingSection info=info.clone()/> })}
            {own.then(|| view! { <LinksSection info=info.clone()/> })}
            {writable(&info).then(|| view! { <ImportSection info=info.clone() on_changed=on_changed/> })}
            <ExportSection info=info.clone()/>
            {(!info.generated).then(|| view! {
                <DeleteSection info=info.clone() on_close=on_close on_changed=on_changed/>
            })}
            <div class="modal-actions">
                <button class="btn" on:click=move |_| on_close.run(())>{i18n::tr(k::CLOSE)}</button>
            </div>
        </Modal>
    }
}

#[component]
fn GeneralSection(info: PimCollectionInfo, on_changed: Callback<()>) -> impl IntoView {
    let toast = use_context::<ToastMsg>().expect("toast context");
    let id = info.id;
    let calendar = info.kind == PimCollectionKind::Calendar;
    let (name, set_name) = signal(info.name.clone());
    let color = RwSignal::new(info.color.clone());
    let (description, set_description) = signal(info.description.clone().unwrap_or_default());
    let (transparent, set_transparent) = signal(info.transparent);
    let (busy, set_busy) = signal(false);
    let save = move |ev: web_sys::SubmitEvent| {
        ev.prevent_default();
        if busy.get() || name.get().trim().is_empty() {
            return;
        }
        set_busy.set(true);
        let body = UpdatePimCollection {
            name: Some(name.get()),
            color: Some(color.get().unwrap_or_default()),
            description: Some(description.get()),
            transparent: calendar.then(|| transparent.get()),
        };
        spawn_local(async move {
            match api::pim_update_collection(id, body).await {
                Ok(_) => {
                    show(toast, i18n::t(k::SAVED));
                    let _ = on_changed.try_run(());
                }
                Err(e) => show_error(toast, i18n::t_fmt(k::PIM_SAVE_ERR, &e.to_string())),
            }
            let _ = set_busy.try_set(false);
        });
    };
    view! {
        <form class="pim-section" on:submit=save>
            <h3 class="pim-section-title">{i18n::tr(k::PIM_GENERAL)}</h3>
            <label class="field">
                <span class="field-label">{i18n::tr(k::NAME)}</span>
                <input
                    class="field-input"
                    required=true
                    maxlength="200"
                    prop:value=move || name.get()
                    on:input=move |ev| set_name.set(event_target_value(&ev))
                />
            </label>
            <div class="field">
                <span class="field-label">{i18n::tr(k::PIM_COLOR)}</span>
                <ColorPicker color=color/>
            </div>
            <label class="field">
                <span class="field-label">{i18n::tr(k::PIM_DESCRIPTION)}</span>
                <textarea
                    class="field-input"
                    rows="2"
                    prop:value=move || description.get()
                    on:input=move |ev| set_description.set(event_target_value(&ev))
                ></textarea>
            </label>
            {calendar.then(|| view! {
                <label class="check-row">
                    <input
                        type="checkbox"
                        prop:checked=move || transparent.get()
                        on:change=move |ev| set_transparent.set(event_target_checked(&ev))
                    />
                    {i18n::tr(k::PIM_TRANSPARENT)}
                </label>
            })}
            <div class="pim-section-actions">
                <button type="submit" class="btn btn-primary btn-sm" disabled=move || busy.get()>
                    {move || if busy.get() { i18n::t(k::SAVING) } else { i18n::t(k::SAVE) }}
                </button>
            </div>
        </form>
    }
}

#[component]
fn SharingSection(info: PimCollectionInfo) -> impl IntoView {
    let toast = use_context::<ToastMsg>().expect("toast context");
    let id = info.id;
    let calendar = info.kind == PimCollectionKind::Calendar;
    let modes: Vec<PimShareMode> = match calendar {
        true => vec![PimShareMode::Ro, PimShareMode::Rw, PimShareMode::RwSchedule],
        false => vec![PimShareMode::Ro, PimShareMode::Rw],
    };
    let (shares, set_shares) = signal(Option::<Vec<PimShareInfo>>::None);
    let (candidates, set_candidates) = signal(Vec::<PimShareCandidate>::new());
    let (user, set_user) = signal(String::new());
    let (mode, set_mode) = signal(PimShareMode::Ro);
    // Borrowers drop out of the candidates, so both lists reload together.
    let load = move || {
        spawn_local(async move {
            match api::pim_shares(id).await {
                Ok(v) => {
                    let _ = set_shares.try_set(Some(v));
                }
                Err(e) => show_error(toast, e.to_string()),
            }
            if let Ok(v) = api::pim_share_candidates(id).await {
                let _ = set_candidates.try_set(v);
            }
        });
    };
    let list_id = format!("pim-users-{id}");
    load();
    let set = move |who: String, m: PimShareMode| {
        spawn_local(async move {
            match api::pim_share(id, &who, m).await {
                Ok(s) => {
                    show(toast, i18n::t_fmt(k::PIM_SHARED_OK, &s.user_name));
                    let _ = set_user.try_set(String::new());
                }
                Err(e) => show_error(toast, e.to_string()),
            }
            // Also on failure, so a changed select shows the real mode again.
            load();
        });
    };
    let add = move |ev: web_sys::SubmitEvent| {
        ev.prevent_default();
        let who = user.get().trim().to_string();
        if !who.is_empty() {
            set(who, mode.get());
        }
    };
    let mode_options = move |current: PimShareMode| {
        modes
            .iter()
            .map(|&m| {
                view! {
                    <option value=m.as_str() selected=m == current>{mode_label(m)}</option>
                }
            })
            .collect::<Vec<_>>()
    };
    let mode_options_add = mode_options.clone();
    view! {
        <section class="pim-section">
            <h3 class="pim-section-title">{i18n::tr(k::PIM_SHARING)}</h3>
            <p class="muted pim-hint">{i18n::tr(k::PIM_SHARING_HINT)}</p>
            {move || match shares.get() {
                None => view! { <p class="muted">{i18n::tr(k::LOADING)}</p> }.into_any(),
                Some(list) if list.is_empty() => {
                    view! { <p class="muted pim-hint">{i18n::tr(k::PIM_NO_SHARES)}</p> }.into_any()
                }
                Some(list) => {
                    let options = mode_options.clone();
                    view! {
                        <div class="pim-items">
                            {list
                                .into_iter()
                                .map(|s| {
                                    let (uid, who) = (s.user_id, s.user_name.clone());
                                    view! {
                                        <div class="pim-item">
                                            <span class="pim-item-name">{s.user_name.clone()}</span>
                                            <select
                                                class="pim-mode"
                                                aria-label=i18n::tr(k::PIM_ACCESS)
                                                on:change=move |ev| {
                                                    if let Some(m) = PimShareMode::from_wire(&event_target_value(&ev)) {
                                                        set(who.clone(), m);
                                                    }
                                                }
                                            >
                                                {options(s.mode)}
                                            </select>
                                            <button
                                                type="button"
                                                class="icon-btn icon-btn-sm"
                                                title=i18n::tr(k::PIM_UNSHARE)
                                                aria-label=i18n::tr(k::PIM_UNSHARE)
                                                on:click=move |_| {
                                                    spawn_local(async move {
                                                        match api::pim_unshare(id, uid).await {
                                                            Ok(_) => {
                                                                show(toast, i18n::t(k::PIM_UNSHARED));
                                                                load();
                                                            }
                                                            Err(e) => show_error(toast, e.to_string()),
                                                        }
                                                    });
                                                }
                                            >
                                                <Icon name=IconName::Close class="ic-btn".to_string()/>
                                            </button>
                                        </div>
                                    }
                                })
                                .collect::<Vec<_>>()}
                        </div>
                    }
                    .into_any()
                }
            }}
            <form class="pim-add" on:submit=add>
                <input
                    class="field-input"
                    required=true
                    placeholder=i18n::tr(k::PIM_USER_NAME)
                    aria-label=i18n::tr(k::PIM_USER_NAME)
                    autocomplete="off"
                    list=list_id.clone()
                    prop:value=move || user.get()
                    on:input=move |ev| set_user.set(event_target_value(&ev))
                />
                <datalist id=list_id>
                    {move || {
                        candidates
                            .get()
                            .into_iter()
                            .map(|c| {
                                let label = match c.display_name.filter(|d| *d != c.name) {
                                    Some(d) => format!("{d} ({})", c.name),
                                    None => c.name.clone(),
                                };
                                view! { <option value=c.name>{label}</option> }
                            })
                            .collect::<Vec<_>>()
                    }}
                </datalist>
                <select
                    class="pim-mode"
                    aria-label=i18n::tr(k::PIM_ACCESS)
                    on:change=move |ev| {
                        if let Some(m) = PimShareMode::from_wire(&event_target_value(&ev)) {
                            set_mode.set(m);
                        }
                    }
                >
                    {mode_options_add(PimShareMode::Ro)}
                </select>
                <button type="submit" class="btn btn-sm">{i18n::tr(k::PIM_ADD)}</button>
            </form>
        </section>
    }
}

#[component]
fn LinksSection(info: PimCollectionInfo) -> impl IntoView {
    let toast = use_context::<ToastMsg>().expect("toast context");
    let id = info.id;
    let calendar = info.kind == PimCollectionKind::Calendar;
    let (links, set_links) = signal(Option::<Vec<PimLinkInfo>>::None);
    let (busy_only, set_busy_only) = signal(false);
    let (choice, set_choice) = signal("never".to_string());
    let (custom, set_custom) = signal(String::new());
    let (password, set_password) = signal(String::new());
    let (busy, set_busy) = signal(false);
    let load = move || {
        spawn_local(async move {
            match api::pim_links(id).await {
                Ok(v) => {
                    let _ = set_links.try_set(Some(v));
                }
                Err(e) => show_error(toast, e.to_string()),
            }
        });
    };
    load();
    let create = move |ev: web_sys::SubmitEvent| {
        ev.prevent_default();
        if busy.get() {
            return;
        }
        let Ok(expires_at) = expiry_to_rfc3339(&choice.get(), &custom.get()) else {
            show_error(toast, i18n::t(k::ERR_BAD_EXPIRES_AT));
            return;
        };
        set_busy.set(true);
        let pw = password.get().trim().to_string();
        let body = CreatePimLink {
            busy_only: busy_only.get(),
            expires_at,
            password: (!pw.is_empty()).then_some(pw),
        };
        spawn_local(async move {
            match api::pim_create_link(id, body).await {
                Ok(_) => {
                    let _ = set_password.try_set(String::new());
                    load();
                }
                Err(e) => show_error(toast, e.to_string()),
            }
            let _ = set_busy.try_set(false);
        });
    };
    let link_row = move |l: PimLinkInfo| {
        let full = server_url(&l.path);
        let webcal = webcal(&full);
        let mut meta = Vec::new();
        if calendar {
            meta.push(if l.busy_only {
                i18n::t(k::PIM_LINK_BUSY).to_string()
            } else {
                i18n::t(k::PIM_LINK_FULL).to_string()
            });
        }
        if let Some(e) = &l.expires_at {
            meta.push(i18n::t_fmt(k::META_EXPIRES, &local_date_time(e)));
        }
        if l.has_password {
            meta.push(i18n::t(k::SHARE_PROTECTED).to_string());
        }
        let link_id = l.id;
        let copy = full.clone();
        view! {
            <div class="pim-link">
                <div class="pim-link-main">
                    <span class="pim-link-url" title=full.clone()>{full.clone()}</span>
                    <span class="muted pim-link-meta">{meta.join(" · ")}</span>
                </div>
                <div class="pim-link-actions">
                    <button
                        type="button"
                        class="btn btn-sm"
                        on:click=move |_| copy_to_clipboard(&copy, i18n::t(k::LINK_COPIED), toast)
                    >
                        {icon_svg(IconName::Copy, "ic-btn")}
                        {i18n::t(k::COPY)}
                    </button>
                    {calendar.then(|| webcal.map(|w| view! {
                        <a class="btn btn-sm" href=w>{i18n::t(k::PIM_SUBSCRIBE)}</a>
                    }))}
                    <button
                        type="button"
                        class="btn btn-sm btn-danger"
                        on:click=move |_| {
                            spawn_local(async move {
                                match api::pim_delete_link(id, link_id).await {
                                    Ok(_) => {
                                        show(toast, i18n::t(k::PIM_LINK_REVOKED));
                                        load();
                                    }
                                    Err(e) => show_error(toast, e.to_string()),
                                }
                            });
                        }
                    >
                        {i18n::t(k::DELETE)}
                    </button>
                </div>
            </div>
        }
    };
    view! {
        <section class="pim-section">
            <h3 class="pim-section-title">{i18n::tr(k::PIM_LINKS)}</h3>
            <p class="muted pim-hint">
                {move || match calendar {
                    true => i18n::t(k::PIM_LINKS_HINT),
                    false => i18n::t(k::PIM_LINKS_HINT_CARDS),
                }}
            </p>
            {move || match links.get() {
                None => view! { <p class="muted">{i18n::tr(k::LOADING)}</p> }.into_any(),
                Some(list) if list.is_empty() => {
                    view! { <p class="muted pim-hint">{i18n::tr(k::PIM_NO_LINKS)}</p> }.into_any()
                }
                Some(list) => view! {
                    <div class="pim-items">{list.into_iter().map(link_row).collect::<Vec<_>>()}</div>
                }
                .into_any(),
            }}
            <form class="pim-link-form" on:submit=create>
                {calendar.then(|| view! {
                    <label class="pim-inline">
                        <span>{i18n::tr(k::PIM_DETAIL)}</span>
                        <select on:change=move |ev| set_busy_only.set(event_target_value(&ev) == "busy")>
                            <option value="full">{i18n::t(k::PIM_DETAIL_FULL)}</option>
                            <option value="busy">{i18n::t(k::PIM_DETAIL_BUSY)}</option>
                        </select>
                    </label>
                })}
                <label class="pim-inline">
                    <span>{i18n::tr(k::EXPIRES)}</span>
                    <select on:change=move |ev| set_choice.set(event_target_value(&ev))>
                        <option value="never">{i18n::t(k::NEVER)}</option>
                        <option value="1d">{i18n::t(k::EXPIRY_1D)}</option>
                        <option value="1w">{i18n::t(k::EXPIRY_1W)}</option>
                        <option value="1mo">{i18n::t(k::EXPIRY_1MO)}</option>
                        <option value="custom">{i18n::t(k::CUSTOM)}</option>
                    </select>
                </label>
                <Show when=move || choice.get() == "custom">
                    <label class="pim-inline">
                        <span>{i18n::tr(k::UNTIL)}</span>
                        <input
                            type="datetime-local"
                            prop:value=move || custom.get()
                            on:change=move |ev| set_custom.set(event_target_value(&ev))
                        />
                    </label>
                </Show>
                <label class="pim-inline">
                    <span>{i18n::tr(k::PASSWORD)}</span>
                    <input
                        type="password"
                        autocomplete="new-password"
                        prop:value=move || password.get()
                        on:input=move |ev| set_password.set(event_target_value(&ev))
                    />
                </label>
                <div class="pim-section-actions">
                    <button type="submit" class="btn btn-sm" disabled=move || busy.get()>
                        {i18n::tr(k::CREATE_LINK)}
                    </button>
                </div>
            </form>
        </section>
    }
}

/// A file name for an export: the collection name without path separators.
fn export_file(info: &PimCollectionInfo) -> String {
    let ext = match info.kind {
        PimCollectionKind::Calendar => "ics",
        PimCollectionKind::Addressbook => "vcf",
    };
    let base: String = display_name(info)
        .chars()
        .map(|c| {
            if matches!(c, '/' | '\\' | ':') {
                '_'
            } else {
                c
            }
        })
        .collect();
    format!("{}.{ext}", base.trim())
}

#[component]
fn ExportSection(info: PimCollectionInfo) -> impl IntoView {
    let id = info.id;
    let file = export_file(&info);
    view! {
        <section class="pim-section">
            <h3 class="pim-section-title">{i18n::tr(k::PIM_EXPORT)}</h3>
            <div class="pim-section-actions pim-left">
                <button
                    type="button"
                    class="btn btn-sm"
                    on:click=move |_| api::trigger_download(&api::pim_export_url(id), &file)
                >
                    {icon_svg(IconName::Download, "ic-btn")}
                    {i18n::t(k::DOWNLOAD)}
                </button>
            </div>
        </section>
    }
}

/// Upload an `.ics` or `.vcf` file into the collection.
#[component]
fn ImportSection(info: PimCollectionInfo, on_changed: Callback<()>) -> impl IntoView {
    let toast = use_context::<ToastMsg>().expect("toast context");
    let id = info.id;
    let input: NodeRef<leptos::html::Input> = NodeRef::new();
    let (busy, set_busy) = signal(false);
    let (result, set_result) = signal(Option::<PimImportResult>::None);
    let picked = move |_| {
        let Some(file) = input
            .get_untracked()
            .and_then(|el| el.files())
            .and_then(|list| list.get(0))
        else {
            return;
        };
        set_busy.set(true);
        set_result.set(None);
        spawn_local(async move {
            match api::pim_import(id, file).await {
                Ok(r) => {
                    let _ = set_result.try_set(Some(r));
                    let _ = on_changed.try_run(());
                }
                Err(e) => show_error(toast, e.to_string()),
            }
            let _ = set_busy.try_set(false);
            // The same file again must fire `change` again.
            if let Some(Some(el)) = input.try_get_untracked() {
                el.set_value("");
            }
        });
    };
    view! {
        <section class="pim-section">
            <h3 class="pim-section-title">{i18n::tr(k::PIM_IMPORT)}</h3>
            <p class="muted pim-hint">{i18n::tr(match info.kind {
                PimCollectionKind::Calendar => k::PIM_IMPORT_HINT_CAL,
                PimCollectionKind::Addressbook => k::PIM_IMPORT_HINT_CARDS,
            })}</p>
            <input
                node_ref=input
                type="file"
                class="pim-file-input"
                accept=".ics,.vcf,text/calendar,text/vcard"
                on:change=picked
            />
            <div class="pim-section-actions pim-left">
                <button
                    type="button"
                    class="btn btn-sm"
                    disabled=move || busy.get()
                    on:click=move |_| {
                        if let Some(el) = input.get_untracked() {
                            el.click();
                        }
                    }
                >
                    {icon_svg(IconName::Upload, "ic-btn")}
                    {move || if busy.get() { i18n::t(k::PIM_IMPORTING) } else { i18n::t(k::PIM_IMPORT_FILE) }}
                </button>
            </div>
            {move || result.get().map(import_summary)}
        </section>
    }
}

/// What an import created, updated and skipped, and why.
fn import_summary(r: PimImportResult) -> impl IntoView {
    let more = r.skipped_total.saturating_sub(r.skipped.len());
    view! {
        <p class="pim-hint">
            {i18n::t_fmt2(k::PIM_IMPORT_DONE, &r.created.to_string(), &r.updated.to_string())}
        </p>
        {(r.skipped_total > 0).then(|| view! {
            <p class="pim-hint">{i18n::t_fmt(k::PIM_IMPORT_SKIPPED, &r.skipped_total.to_string())}</p>
            <ul class="pim-sample">
                {r.skipped
                    .into_iter()
                    .map(|s| view! {
                        <li>{format!("{} · {}", s.uid.unwrap_or_else(|| "—".to_string()), skip_reason(&s.reason))}</li>
                    })
                    .collect::<Vec<_>>()}
                {(more > 0).then(|| view! { <li class="muted">{i18n::t_fmt(k::AND_MORE, &more.to_string())}</li> })}
            </ul>
        })}
    }
}

/// A file as a new calendar or address book. The name field is optional:
/// the server then takes the name the file gives itself, or the file name.
#[component]
fn ImportNewDialog(
    kind: PimCollectionKind,
    collections: ReadSignal<Option<Vec<PimCollectionInfo>>>,
    on_close: Callback<()>,
    on_created: Callback<()>,
) -> impl IntoView {
    let toast = use_context::<ToastMsg>().expect("toast context");
    let input: NodeRef<leptos::html::Input> = NodeRef::new();
    let (name, set_name) = signal(String::new());
    let (busy, set_busy) = signal(false);
    let (done, set_done) = signal(Option::<api::PimImportNew>::None);
    let title = match kind {
        PimCollectionKind::Calendar => k::PIM_NEW_CALENDAR_FROM_FILE,
        PimCollectionKind::Addressbook => k::PIM_NEW_BOOK_FROM_FILE,
    };
    let submit = move |ev: web_sys::SubmitEvent| {
        ev.prevent_default();
        let Some(file) = input
            .get_untracked()
            .and_then(|el| el.files())
            .and_then(|list| list.get(0))
        else {
            return;
        };
        if busy.get() {
            return;
        }
        set_busy.set(true);
        let color = collections.with_untracked(|c| next_color(c.as_deref().unwrap_or_default()));
        let n = name.get().trim().to_string();
        spawn_local(async move {
            match api::pim_import_new(kind, &n, &color, file).await {
                Ok(r) => {
                    if r.collection.is_some() {
                        let _ = on_created.try_run(());
                    }
                    let _ = set_done.try_set(Some(r));
                }
                Err(e) => show_error(toast, e.to_string()),
            }
            let _ = set_busy.try_set(false);
        });
    };
    view! {
        <Modal class="pim-modal" on_close=on_close>
            <h2 class="modal-title">{i18n::tr(title)}</h2>
            {move || match done.get() {
                None => view! {
                    <form on:submit=submit>
                        <p class="muted pim-hint">{i18n::tr(match kind {
                            PimCollectionKind::Calendar => k::PIM_IMPORT_NEW_HINT_CAL,
                            PimCollectionKind::Addressbook => k::PIM_IMPORT_NEW_HINT_CARDS,
                        })}</p>
                        <label class="field">
                            <span class="field-label">{i18n::tr(k::PIM_FILE)}</span>
                            <input
                                node_ref=input
                                type="file"
                                class="field-input"
                                required=true
                                accept=".ics,.vcf,text/calendar,text/vcard"
                            />
                        </label>
                        <label class="field">
                            <span class="field-label">{i18n::tr(k::NAME)}</span>
                            <input
                                class="field-input"
                                maxlength="200"
                                placeholder=i18n::tr(k::PIM_NAME_FROM_FILE)
                                prop:value=move || name.get()
                                on:input=move |ev| set_name.set(event_target_value(&ev))
                            />
                        </label>
                        <div class="modal-actions">
                            <button type="button" class="btn" on:click=move |_| on_close.run(())>
                                {i18n::tr(k::CANCEL)}
                            </button>
                            <button type="submit" class="btn btn-primary" disabled=move || busy.get()>
                                {move || if busy.get() { i18n::t(k::PIM_IMPORTING) } else { i18n::t(k::PIM_IMPORT) }}
                            </button>
                        </div>
                    </form>
                }
                .into_any(),
                Some(r) => {
                    let head = match &r.collection {
                        Some(c) => i18n::t_fmt(k::PIM_IMPORTED_AS, &c.name),
                        None => i18n::t(k::PIM_IMPORT_NOTHING).to_string(),
                    };
                    view! {
                        <p class="pim-hint">{head}</p>
                        {import_summary(r.result)}
                        <div class="modal-actions">
                            <button class="btn btn-primary" on:click=move |_| on_close.run(())>
                                {i18n::tr(k::CLOSE)}
                            </button>
                        </div>
                    }
                    .into_any()
                }
            }}
        </Modal>
    }
}

#[component]
fn DeleteSection(
    info: PimCollectionInfo,
    on_close: Callback<()>,
    on_changed: Callback<()>,
) -> impl IntoView {
    let toast = use_context::<ToastMsg>().expect("toast context");
    let (confirm, set_confirm) = signal(false);
    let id = info.id;
    let lent = info.mode.is_some();
    let name = display_name(&info);
    let run = Callback::new(move |_| {
        set_confirm.set(false);
        spawn_local(async move {
            match api::pim_delete_collection(id).await {
                Ok(_) => {
                    show(
                        toast,
                        match lent {
                            true => i18n::t(k::PIM_REMOVED),
                            false => i18n::t(k::DELETED),
                        },
                    );
                    let _ = on_changed.try_run(());
                    let _ = on_close.try_run(());
                }
                Err(e) => show_error(toast, e.to_string()),
            }
        });
    });
    view! {
        <section class="pim-section">
            {match (lent, info.is_default) {
                (_, true) => view! { <p class="muted pim-hint">{i18n::tr(k::PIM_DEFAULT_HINT)}</p> }.into_any(),
                (true, _) => view! {
                    <button type="button" class="btn btn-sm" on:click=move |_| set_confirm.set(true)>
                        {i18n::tr(k::PIM_REMOVE_FROM_LIST)}
                    </button>
                }
                .into_any(),
                (false, _) => view! {
                    <button type="button" class="btn btn-sm btn-danger" on:click=move |_| set_confirm.set(true)>
                        {icon_svg(IconName::Delete, "ic-btn")}
                        {i18n::t(k::DELETE)}
                    </button>
                }
                .into_any(),
            }}
        </section>
        <Show when=move || confirm.get()>
            <ConfirmDialog
                title=i18n::t_fmt(k::PIM_DELETE_TITLE, &name)
                message=match lent {
                    true => i18n::t(k::PIM_REMOVE_MSG).to_string(),
                    false => i18n::t(k::PIM_DELETE_MSG).to_string(),
                }
                submit=match lent {
                    true => i18n::t(k::PIM_REMOVE_FROM_LIST).to_string(),
                    false => i18n::t(k::DELETE).to_string(),
                }
                danger=!lent
                on_submit=run
                on_close=Callback::new(move |_| set_confirm.set(false))
            />
        </Show>
    }
}

/// How to set up a calendar or contacts app against this server.
#[component]
fn ConnectDialog(
    me: ReadSignal<Option<Me>>,
    collections: ReadSignal<Option<Vec<PimCollectionInfo>>>,
    on_close: Callback<()>,
) -> impl IntoView {
    let toast = use_context::<ToastMsg>().expect("toast context");
    let user = me.with_untracked(|m| {
        m.as_ref()
            .and_then(|m| m.user.as_ref())
            .map(|u| u.name.clone())
            .unwrap_or_default()
    });
    let app_passwords = move |_| {
        on_close.run(());
        navigate(&Location {
            section: Section::Settings,
            path: vec!["security".to_string()],
            ..Location::root()
        });
    };
    view! {
        <Modal class="pim-modal" on_close=on_close>
            <h2 class="modal-title">{i18n::tr(k::PIM_CONNECT_TITLE)}</h2>
            <section class="pim-section">
                <h3 class="pim-section-title">{i18n::tr(k::PIM_SERVER_ADDRESS)}</h3>
                {url_row(server_url("/"), toast)}
                <p class="muted pim-hint">{i18n::tr(k::PIM_SERVER_ADDRESS_HINT)}</p>
                {url_row(server_url(&format!("{}/", api_types::PIM)), toast)}
            </section>
            <section class="pim-section">
                <h3 class="pim-section-title">{i18n::tr(k::PIM_USER)}</h3>
                {url_row(user, toast)}
                <p class="muted pim-hint">{i18n::tr(k::PIM_PASSWORD_HINT)}</p>
                <div class="pim-section-actions pim-left">
                    <button type="button" class="btn btn-sm" on:click=app_passwords>
                        {i18n::tr(k::PIM_APP_PASSWORDS)}
                    </button>
                </div>
            </section>
            <section class="pim-section">
                <h3 class="pim-section-title">{i18n::tr(k::PIM_CLIENTS)}</h3>
                <ul class="pim-hints">
                    <li>{i18n::tr(k::PIM_HINT_APPLE)}</li>
                    <li>{i18n::tr(k::PIM_HINT_DAVX5)}</li>
                    <li>{i18n::tr(k::PIM_HINT_THUNDERBIRD)}</li>
                    <li>{i18n::tr(k::PIM_HINT_GNOME)}</li>
                </ul>
            </section>
            <section class="pim-section">
                <h3 class="pim-section-title">{i18n::tr(k::PIM_COLLECTION_URLS)}</h3>
                <div class="pim-items">
                    {move || {
                        collections
                            .get()
                            .unwrap_or_default()
                            .into_iter()
                            .map(|c| {
                                let url = server_url(&c.url);
                                let copy = url.clone();
                                view! {
                                    <div class="pim-item">
                                        <span class="pim-swatch" style=format!("--swatch: {}", safe_color(c.color.as_deref()))></span>
                                        <span class="pim-item-name" title=url.clone()>{display_name(&c)}</span>
                                        <button
                                            type="button"
                                            class="btn btn-sm"
                                            on:click=move |_| copy_to_clipboard(&copy, i18n::t(k::LINK_COPIED), toast)
                                        >
                                            {icon_svg(IconName::Copy, "ic-btn")}
                                            {i18n::t(k::COPY)}
                                        </button>
                                    </div>
                                }
                            })
                            .collect::<Vec<_>>()
                    }}
                </div>
            </section>
            <div class="modal-actions">
                <button class="btn" on:click=move |_| on_close.run(())>{i18n::tr(k::CLOSE)}</button>
            </div>
        </Modal>
    }
}

#[cfg(test)]
mod tests {
    use super::*;

    fn col(id: i64, color: Option<&str>, generated: bool) -> PimCollectionInfo {
        PimCollectionInfo {
            id,
            kind: PimCollectionKind::Calendar,
            name: String::new(),
            url: String::new(),
            owner: String::new(),
            mode: None,
            generated,
            color: color.map(str::to_string),
            description: None,
            components: Vec::new(),
            transparent: false,
            is_default: false,
            shares: 0,
            links: 0,
        }
    }

    #[test]
    fn a_new_collection_gets_an_unused_color() {
        // No color counts as the first one; generated ones do not count.
        let list = [
            col(1, None, false),
            col(2, Some("#22C55E"), false),
            col(-1, Some("#f59e0b"), true),
        ];
        assert_eq!(next_color(&list), "#f59e0b");
        let full: Vec<_> = PALETTE.iter().map(|c| col(1, Some(c), false)).collect();
        assert_eq!(next_color(&full), PALETTE[0]);
    }

    #[test]
    fn solo_toggles_between_one_and_all() {
        let ids = [1, 2, 3];
        let mut h = HashSet::from([9]);
        solo(&mut h, &ids, 2);
        assert_eq!(h, HashSet::from([1, 3, 9]));
        // Again on the only shown one: all of this kind shown, 9 untouched.
        solo(&mut h, &ids, 2);
        assert_eq!(h, HashSet::from([9]));
        // From a partly hidden list, a click shows just that one.
        let mut h = HashSet::from([1]);
        solo(&mut h, &ids, 1);
        assert_eq!(h, HashSet::from([2, 3]));
    }
}