Merge pull request #1 from taruma/1.x

Update v1.0

.gitignore

@@ -159,3 +159,4 @@ cython_debug/
 #  option (not recommended) you can uncomment the following to ignore the entire idea folder.
 #.idea/
 playground.ipynb
+uv.lock

.python-version

@@ -0,0 +1 @@
+3.12

LICENSE

@@ -1,6 +1,6 @@
 MIT License
 
-Copyright (c) 2024 taruma sakti megariansyah
+Copyright (c) 2024 Taruma Sakti Megariansyah
 
 Permission is hereby granted, free of charge, to any person obtaining a copy
 of this software and associated documentation files (the "Software"), to deal

app.py

@@ -1,36 +1,109 @@
 """Main Application File"""
 
 import dash
-from dash import Output, Input, dcc, html
+from dash import Output, Input, State, dcc, _dash_renderer
 from appconfig import appconfig
+import dash_mantine_components as dmc
+import dash_bootstrap_components as dbc
+import pyfigure
+import pylayout
+import pyfunc
+import plotly.graph_objects as go
+_dash_renderer._set_react_version("18.2.0")
+
+# Dash app configuration
+APP_TITLE = appconfig.dash.title
+PAGE_TITLE = appconfig.dash.page_title
+LOADING_MESSAGE = appconfig.dash.loading_message
+DEBUG_MODE = appconfig.dash.debug
+THEME = appconfig.template.theme
 
 # Initialize the Dash app
-app = dash.Dash(__name__)
-
-# Define the layout of the app
-app.layout = html.Div(
-    children=[
-        html.H1(children="Hello Dash"),
-        html.Div(
-            children="""
-        Dash: A web application framework for Python.
-    """
-        ),
-        dcc.Input(id="input-text", value="initial value", type="text"),
-        html.Div(id="output-text"),
-    ]
+app = dash.Dash(
+    name=APP_TITLE,
+    external_stylesheets=[
+        getattr(dbc.themes, THEME),
+        # dmc.styles.ALL,
+        dmc.styles.DATES,
+        dbc.icons.FONT_AWESOME,
+    ],
+    title=PAGE_TITLE,
+    # meta_tags=[{"name": "viewport", "content": "width=device-width, initial-scale=1"}],
+    suppress_callback_exceptions=True,
+    prevent_initial_callbacks=False,
 )
+server = app.server
+
+# Load data
+
+mta_daily = pyfunc.get_mta_daily()
+mta_daily_ridership = pyfunc.get_mta_ridership_recovery(mta_daily, is_ridership=True)
+mta_daily_recovery = pyfunc.get_mta_ridership_recovery(mta_daily, is_ridership=False)
+
+
+# LAYOUT
+
+app.layout = pylayout.appshell_layout
+
+# CALLBACKS
 
 
 # Define callback to update the output text
 @app.callback(
-    Output(component_id="output-text", component_property="children"),
-    [Input(component_id="input-text", component_property="value")],
+    Output(component_id="plot-mta-ridership-recovery", component_property="figure"),
+    [
+        Input(component_id="radiogroup-resample", component_property="value"),
+        Input(component_id="date-picker-start", component_property="value"),
+        Input(component_id="date-picker-end", component_property="value"),
+        Input(component_id="multi-select-transportation", component_property="value"),
+    ],
 )
-def update_output_div(input_value):
-    return f"You've entered: {input_value} and {appconfig.DASH_APP.APP_TITLE}"
+def update_output_div(resample_period, date_start, date_end, transportation_modes):
+    return pyfigure.generate_ridership_recovery(
+        mta_daily_ridership,
+        mta_daily_recovery,
+        resample_period,
+        date_start,
+        date_end,
+        transportation_modes,
+    )
+
+
+@app.callback(
+    Output(component_id="insight-text", component_property="children"),
+    [
+        Input("button-llm", "n_clicks"),
+        State("plot-mta-ridership-recovery", "figure"),
+        State("llm-model", "value"),
+        State("llm-api-key", "value"),
+        State("date-picker-start", "value"),
+        State("date-picker-end", "value"),
+        State("radiogroup-resample", "value"),
+    ],
+    prevent_initial_call=True,
+)
+def update_insight(
+    _, fig, llm_models, llm_api_key, start_date, end_date, resample_period
+):
+    system_prompt = pyfunc.read_text_file("text/system_prompt.md")
+    context_overview = pyfunc.read_text_file("text/context_overview.md")
+
+    figure = pyfunc.fig_to_base64(go.Figure(fig))
+
+    insight = pyfunc.generate_insight(
+        system_prompt,
+        context_overview,
+        figure,
+        model=llm_models,
+        llm_api_key=llm_api_key,
+        start_date=start_date,
+        end_date=end_date,
+        resample_period=resample_period
+    )
+
+    return dcc.Markdown(insight)
 
 
 # Run the app
 if __name__ == "__main__":
-    app.run_server(debug=True)
+    app.run_server(debug=DEBUG_MODE)

appconfig.py

@@ -10,7 +10,14 @@ def dict_to_namespace(d):
             d[key] = dict_to_namespace(value)
     return SimpleNamespace(**d)
 
-with open('config.toml', 'rb') as f:
+_CONFIG_PATH = 'appconfig.toml'
+
+with open(_CONFIG_PATH, 'rb') as f:
     config_dict = tomllib.load(f)
 
-appconfig = dict_to_namespace(config_dict)
+appconfig = dict_to_namespace(config_dict)
+
+# temporary override for development
+
+# appconfig.dash.debug = True
+# appconfig.template.theme = "SKETCHY"

appconfig.toml

@@ -1,14 +1,15 @@
-[DASH_APP]
-APP_TITLE = "MTA DASH"
-HEAD_TITLE = "taruma-mtadash | MTA DASH"
-UPDATE_TITLE = "Updating..."
-DEBUG = false
-ALIAS = "taruma-mtadash"
+[dash]
+title = "MTA Ridership Explorer: Trends and Post-Pandemic Recovery"
+subtitle = "An interactive dashboard to explore MTA ridership trends and post-pandemic recovery"
+page_title = "MTA Ridership Explorer by taruma"
+loading_message = "Updating..."
+debug = false
+alias = "taruma-mtadash"
 
-[TEMPLATE]
-WATERMARK_SOURCE = ""
-THEME = "MATERIA"
+[template]
+theme = "FLATLY"
+watermark_source = ""
 
-VERSION = "v1.2.0"
-GITHUB_LINK = "https://github.com/taruma/anfrek"
-GITHUB_REPO = "taruma/anfrek"
+[repository]
+github_url = "https://github.com/taruma/mtadash"
+github_repo = "taruma/mtadash"

assets/quarto_styles.css

@@ -0,0 +1,4 @@
+figcaption {
+    margin: auto;
+    text-align: center;
+}

assets/styles.css

@@ -0,0 +1,21 @@
+.footer-center, .footer-right {
+    bottom: 0;
+    right: 0;
+    position: fixed;
+    height: 3.875rem;
+    margin-right: 1rem;
+}
+
+.footer-center {
+    left:0;
+    margin-right: 0;
+}
+
+.footer-center a, .footer-right a {
+    text-decoration: none;
+    color: rgb(134, 142, 150);
+}
+
+.footer-center a:hover {
+    text-decoration: underline;
+}