WareSim/visualisation.py at main · AliBoukind13/WareSim · GitHub

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
"""
*********** TO LAUNCH SERVER: waresim % python -m solara run visualisation ***********

Warehouse Simulation Visualization App (Solara Frontend)

This script serves as the entry point for launching the Solara-based frontend of the warehouse simulation
tool. It provides users with an interactive dashboard to visualize and analyze simulation results.

Usage:
- Run the app from the command line:
    $ python -m solara run visualisation

Features:
- Allows users to toggle between:
    • Single Simulation: View metrics and visual state of one configuration.
    • Multiple Simulations: Compare performance across multiple configurations.
- Reactive selection interface powered by Solara.
- Custom layout with branding and dark mode toggle.
- Uses configuration from `backend/src/common/config.json`.

Environment Variables (Required):
CONFIG_PATH : str
    Path to the warehouse configuration JSON file.

Main Components:
- `Layout`: Wrapper for consistent app layout with custom color scheme.
- `Page`: Renders the main page, including app bar, logo, simulation selector, and dashboard views.
"""

import os
import json
import solara
from dotenv import load_dotenv
from backend.tests.config_tests import validate_config
from frontend.simulation_dashboard import SingleSimulationDashboard, MultipleSimulationDashboard

# Initiate a Reactive state to track the user's selection for different visualisation modes
choice = solara.reactive(None)

# Define Colour Scheme of the Webpage
@solara.component
def Layout(children=[]):
    """
    Defines the overall layout for the Solara application.

    Applies a consistent dark-themed layout to the app, providing a structured container
    for rendering Solara components.

    Args:
        children (list, optional): A list of Solara components to be displayed within the layout.
    """
    solara.AppLayout(color="#121a3e", children=children)

# Core Function that Orchestrates the Webpage Flow
@solara.component
def Page():
    """
    Main entry point for the Warehouse Simulation Tool frontend.

    Loads simulation configuration from a `.env` file and renders the interactive dashboard.

    UI Elements:
    - App bar with title and logo
    - Theme toggle (light/dark mode)
    - Dropdown selector to choose between simulation modes:
        • Single Simulation
        • Multiple Simulations

    Based on the user's selection, the corresponding dashboard is displayed,
    using the configuration file path specified by the CONFIG_PATH environment variable.
    """
    ############ 1. Title Bar at the Top ############
    # Simulation mode options (Either running the simulation once or multiple times)
    solara.lab.ThemeToggle()        # Toggle for light/dark UI theme

    # Create an app bar at the top of the page
    with solara.AppBar():
        # Display the app title
        with solara.AppBarTitle():
            solara.Text("📦 Welcome to the Warehouse Simulation Tool!")

        # Display Datasparq logo aligned to the right side of the app bar
        solara.Image("frontend/datasparq.jpg", width="170px", classes=["logo-img"])

    ############ 2. Load Warehouse Config ############
    # Extract warehouse simulation setups from .env file
    load_dotenv()
    # Error Handling 1: Catch missing keys or values in the config file
    try:
        config_path = os.getenv("CONFIG_PATH", "input/config.json")
        with open(config_path, 'r') as file:
            config = json.load(file)
    except Exception as e:
        solara.Error(f"Please check the config file is a valid JSON:\n{e}")
        return

    # Error Handling 2: Catch incorrect data types in the config file
    errors = validate_config(config)
    if errors:
        error_message = "\n".join(f"- {error}" for error in errors)
        solara.Error(f"Please check the config file for missing keys or values or incorrect data types\n{error_message}")
        return

    ############ 3. Run Simulations ############
    # Instructional message when no simulation type is selected
    if choice.value == None:
        solara.Markdown("Please select a simulation type.")

    # Dropdown menu to select between single and multiple simulation modes
    solara.Select(label="Select Simulation Type", value=choice, values=["Single Simulation", "Multiple Simulations"])

    # Conditionally display the appropriate dashboard based on user selection
    if choice.value == "Single Simulation":
        SingleSimulationDashboard(config_path)
    elif choice.value == "Multiple Simulations":
        MultipleSimulationDashboard(config_path)

# Run Solara
Page()