use crate::models::{MemberRole, OrgMember};
use dioxus::prelude::*;

/// Renders a table row for an organization member with a role dropdown.
///
/// # Arguments
///
/// * `member` - The organization member data to render
/// * `on_role_change` - Callback fired with (member_id, new_role) when role changes
#[component]
pub fn MemberRow(member: OrgMember, on_role_change: EventHandler<(String, String)>) -> Element {
    rsx! {
        tr { class: "member-row",
            td { class: "member-row-name", "{member.name}" }
            td { "{member.email}" }
            td {
                select {
                    class: "member-role-select",
                    value: "{member.role.label()}",
                    onchange: {
                        let id = member.id.clone();
                        move |evt: Event<FormData>| {
                            on_role_change.call((id.clone(), evt.value()));
                        }
                    },
                    for role in MemberRole::all() {
                        option {
                            value: "{role.label()}",
                            selected: *role == member.role,
                            "{role.label()}"
                        }
                    }
                }
            }
            td { "{member.joined_at}" }
        }
    }
}