import plotly.express as px
import streamlit as st
import pandas as pd

def render_site_map(df, site_name):
    site_df = df[df['site'] == site_name].head(10)  # show 10 poles only

    # Determine color
    def get_color(faults):
        if faults == 0:
            return 'green'
        elif faults == 1:
            return 'yellow'
        else:
            return 'red'

    site_df['color'] = site_df['faults'].apply(get_color)

    fig = px.scatter_mapbox(
        site_df,
        lat="latitude",
        lon="longitude",
        hover_name="id",
        color="color",
        color_discrete_map={"green": "green", "yellow": "yellow", "red": "red"},
        zoom=10,
        height=300
    )

    fig.update_layout(mapbox_style="open-street-map")
    fig.update_traces(marker=dict(size=14))
    fig.update_layout(margin={"r":0,"t":0,"l":0,"b":0})

    st.plotly_chart(fig, use_container_width=True, key=site_name)