Code Editor for app.py

import streamlit as st
import pandas as pd
from st_aggrid import AgGrid, GridOptionsBuilder, GridUpdateMode

# Page configuration
st.set_page_config(page_title="SiSSuite", layout="wide", initial_sidebar_state="expanded")

# Custom CSS for styling
st.markdown("""
<style>
    .main-header {
        background-color: #f0f2f6;
        padding: 10px;
        border-radius: 5px;
        margin-bottom: 20px;
    }
    .sidebar .sidebar-content {
        background-color: #2c3e50;
    }
    .metric-card {
        background-color: white;
        padding: 15px;
        border-radius: 8px;
        box-shadow: 0 2px 4px rgba(0,0,0,0.1);
        margin-bottom: 10px;
    }
</style>
""", unsafe_allow_html=True)

# Sidebar
with st.sidebar:
    st.markdown("### SiSSuite")
    st.markdown("---")
    
    # Navigation menu
    st.markdown("**Quick Start**")
    st.markdown("📊 Dashboard")
    st.markdown("📋 Actions")
    st.markdown("👥 My Customers")
    st.markdown("🔄 Performance Transactions")
    
    st.markdown("---")
    st.markdown("**Toolbox**")
    st.markdown("📈 Analysis")
    st.markdown("📊 Charts")
    st.markdown("📋 EQCM")
    st.markdown("💰 Funds")
    st.markdown("📁 My Files")
    st.markdown("📊 Performance Time")
    st.markdown("📄 Documents")
    
    st.markdown("---")
    st.markdown("**Account settings**")
    st.markdown("⚙️ Conditions")
    st.markdown("🏢 Companies")
    st.markdown("⚙️ Settings")

# Main content
col1, col2, col3, col4 = st.columns([1, 1, 1, 1])

with col1:
    st.markdown("**Revision Number**")
    st.write("BSI")

with col2:
    st.markdown("**Organisation**")
    st.write("Henry Stephen Ltd")

with col3:
    st.markdown("**Checked By**")
    st.write("")

with col4:
    st.markdown("**Approved By**")
    st.write("")

# Description and Notes section
col1, col2 = st.columns(2)
with col1:
    st.markdown("**Description**")
    st.text_area("", value="Sill Cap Detail", height=60, label_visibility="collapsed")

with col2:
    st.markdown("**Notes**")
    st.text_area("", value="", height=60, label_visibility="collapsed")

# Process data and Instrument data sections
col1, col2 = st.columns(2)

with col1:
    st.markdown("### Process data")
    
    # Create sample process data
    process_data = pd.DataFrame({
        "Parameter": [
            "Top Rail",
            "Round Notch",
            "Round Notch Diameter",
            "Post Top Increment",
            "Process Notch Amplitude",
            "Primary Level",
            "Average Approach Angle",
            "Normalised Top Setting",
            "Process Safety Time"
        ],
        "Value": [
            "10 mm",
            "10 mm",
            "5.500 ± 100 μm",
            "3.100 mm",
            "10.00 ± 200 μm",
            "10 mm",
            "4.500 ± 0° ang",
            "5.500 - ESR",
            "14.5 ±4"
        ]
    })
    
    gb = GridOptionsBuilder.from_dataframe(process_data)
    gb.configure_column("Parameter", width=200)
    gb.configure_column("Value", width=150)
    gb.configure_grid_options(domLayout='autoHeight')
    gridOptions = gb.build()
    
    AgGrid(process_data, gridOptions=gridOptions, height=300, fit_columns_on_grid_load=True)

with col2:
    st.markdown("### Instrument data")
    
    # Create sample instrument data
    instrument_data = pd.DataFrame({
        "Parameter": [
            "Sensor Response Time",
            "Logic Response Time",
            "First Element Response Time",
            "SIF Response Time",
            "Max Allowable SIF Response Time",
            "Trip Point Tolerance",
            "Max Allowable Trip Tolerance",
            "Potential Trip Delay",
            "Potential SIF Execution Time",
            "Potential SIF Execution Time As % PFT"
        ],
        "Expected Value": ["", "1 s", "1 s", "", "", "GH ±", "", "", "9.21 s", ""],
        "Mission Time (MT) years": ["", "10", "10", "", "", "", "", "", "", ""],
        "Growth Factor (x)": ["", "1.0", "1.0", "", "", "1.0", "", "", "", ""],
        "Growth Characteristic": ["", "LIN", "LIN", "", "", "LIN", "", "", "", ""],
        "Response Time (RT) seconds": ["", "", "1.1 s", "", "10.5 s", "", "", "10.5 s", "10.9 s", ""],
        "Status": ["", "", "", "GRN", "", "GRN", "", "", "", "SIF RT Status: RED"]
    })
    
    gb2 = GridOptionsBuilder.from_dataframe(instrument_data)
    gb2.configure_column("Parameter", width=200)
    
    # Color coding for status column
    def color_status(val):
        if val == "GRN":
            return "background-color: green; color: white"
        elif val == "RED" or "RED" in str(val):
            return "background-color: red; color: white"
        elif val == "YEL":
            return "background-color: yellow; color: black"
        return ""
    
    gb2.configure_grid_options(domLayout='autoHeight')
    gridOptions2 = gb2.build()
    
    AgGrid(instrument_data, gridOptions=gridOptions2, height=300, fit_columns_on_grid_load=True)

# Footer
st.markdown("---")
col1, col2, col3 = st.columns([1, 1, 1])
with col1:
    st.markdown("**Help center** | **Instruction Request** | **Contact**")
with col3:
    st.markdown("**Dynamic Mod 771** | **© 2023 - SiSSuite™ Limited - v2.1.4**")