import streamlit as st
import pandas as pd
import plotly.express as px
from app_backend import fetch_weather, generate_synthetic_data, optimize_load

# Constants
API_KEY = "84e26811a314599e940f343b4d5894a7"
LOCATION = "Pakistan"

# Sidebar
st.sidebar.title("Smart Grid Dashboard")
location = st.sidebar.text_input("Enter Location", LOCATION)

# Fetch and display weather data
weather = fetch_weather(API_KEY, location)
if weather:
    st.sidebar.write(f"Temperature: {weather['temperature']} °C")
    st.sidebar.write(f"Wind Speed: {weather['wind_speed']} m/s")
    st.sidebar.write(f"Weather: {weather['weather']}")

# Main dashboard with tabs
tabs = st.tabs(["Home", "Storage", "Trading"])

with tabs[0]:
    st.title("Real-Time Smart Grid Dashboard")

    # Generate synthetic data
    data = generate_synthetic_data()

    # Plot total consumption, grid generation, and storage usage
    fig = px.line(data, x="timestamp", y=["total_consumption_kwh", "grid_generation_kwh", "storage_usage_kwh"],
                  title="Energy Consumption, Generation, and Storage Usage Over Time",
                  labels={"value": "Energy (kWh)", "variable": "Energy Source"})
    st.plotly_chart(fig)

    # Grid health overview
    st.subheader("Grid Health Overview")
    grid_health_counts = data["grid_health"].value_counts()
    st.bar_chart(grid_health_counts)

    # Optimization recommendations
    current_demand = data["total_consumption_kwh"].iloc[-1]
    current_solar = data["solar_output_kw"].iloc[-1]
    current_wind = data["wind_output_kw"].iloc[-1]
    recommendation = optimize_load(current_demand, current_solar, current_wind)

    st.subheader("Recommendations")
    st.write(f"Current Load Demand: {current_demand} kWh")
    st.write(f"Solar Output: {current_solar} kW")
    st.write(f"Wind Output: {current_wind} kW")
    st.write(f"Recommendation: {recommendation}")

with tabs[1]:
    st.title("Energy Storage Overview")

    # Total energy stored
    total_storage = 500  # Example of total energy storage
    st.subheader(f"Total Energy Stored: {total_storage} kWh")

    # Energy storage contribution from different sources
    st.subheader("Energy Storage Contributions")
    energy_sources = pd.DataFrame({
        "Source": ["Wind", "Solar", "Turbine"],
        "Energy (kW/min)": [5, 7, 10]
    })
    st.bar_chart(energy_sources.set_index("Source"))

    # Show energy storage status with a rounded circle
    st.subheader("Energy Storage Circle")
    st.markdown("Energy storage is a combination of contributions from different renewable sources.")

    # Visualization of energy storage circle using Plotly
    storage_data = {
        "Source": ["Wind", "Solar", "Turbine"],
        "Energy": [5, 7, 10],
    }
    storage_df = pd.DataFrame(storage_data)
    fig = px.pie(storage_df, names="Source", values="Energy", title="Energy Storage Sources")
    st.plotly_chart(fig)

with tabs[2]:
    st.title("Energy Trading Overview")

    # Energy cubes
    st.subheader("Energy Cubes Stored")
    energy_cubes = pd.DataFrame({
        "Country": ["China", "Sri Lanka", "Bangladesh"],
        "Energy (kWh)": [100, 200, 300],
        "Shareable": [True, True, False]
    })

    # Displaying the energy cubes in a grid
    st.write("Stored energy can be shared with other countries.")
    st.dataframe(energy_cubes)

    # Visualization of energy that can be shared
    st.subheader("Energy Trading Visualization")
    st.markdown("The following energy amounts are available for sharing with different countries.")
    trading_fig = px.bar(energy_cubes, x="Country", y="Energy (kWh)", color="Shareable", title="Energy Trading")
    st.plotly_chart(trading_fig)