import dash_bootstrap_components as dbc
import dash_mantine_components as dmc
from dash import html

def main_layout(modal_list, tab_list, variable_list):
    selected_tab_list = [dbc.Tab(tab.layout(), label=tab.label)for tab in tab_list]
    layout = dbc.Container(
        [
            dmc.NotificationsProvider(
                [
                    html.Div(
                        id="notifications-container", style={"position": "fixed", "z-index": 9999}
                    ),
                    html.P(id="update-status", style={"font-size": "60%", "visibility": "hidden"}),
                    html.Div(
                        id="main-layout",
                        style={
                            "height": "100vh",
                            "overflow": "hidden",
                            "display": "grid",
                            "grid-template-columns": "5% 95%",
                        },
                        children=[
                            html.Div(
                                className="bg-secondary",
                                style={
                                    "display": "flex",
                                    "flex-direction": "column",
                                    "height": "100%",
                                },
                                children=modal_list
                            ),
                            html.Div(
                                children=[
                                    dbc.Row(
                                        children=variable_list
                                    ),
                                    dbc.Tabs(
                                        selected_tab_list,
                                    ),
                                ],
                            ),
                        ],
                    ),
                ],
            ),
        ],
        fluid=True,
        className="dbc dbc-ag-grid"
    )
    return layout