SGS Suppliers Dashboard - OpenBB Workspace Application

October 17, 2025 ยท View on GitHub

A comprehensive ESG (Environmental, Social, Governance) supplier management and sustainability tracking dashboard built for OpenBB Workspace. This application provides dual-dashboard functionality for both general ESG discovery and company-specific analysis.

Features

ESG Discovery Dashboard

A comprehensive overview dashboard with organized tabs for different ESG aspects:

Overview Tab

  1. Key Performance Indicators Cards

    • Total suppliers count (1,000)
    • Total annual revenue (CHF format)
    • Regional and country coverage metrics
    • SAQ completion rates

  2. Regional Supplier Summary Table

    • Sortable and filterable regional data
    • Completion rates by region
    • Average revenue impact per region
    • Chart visualization capabilities

  3. Geographic Distribution & Status Charts

    • Top 12 countries by supplier count (Bar chart)
    • Supplier onboarding status breakdown (Pie chart)
    • Risk level distribution (Donut chart)
    • Sustainability maturity distribution (Donut chart)

Sustainability Tab

  1. Advanced ESG Analytics
    • Sustainability maturity by region (Grouped bar chart)
    • SDG prioritization distribution (Horizontal bar chart)
    • ESG performance trends (Plotly time series)
    • Carbon footprint reduction trends (Plotly stacked bar)

Compliance & Ethics Tab

  1. Compliance Monitoring
    • Business ethics compliance indicators
    • ESG score distribution heatmap (Plotly)
    • Detailed supplier information table with filtering

Company ESG Analysis Dashboard

Focused company-specific ESG analysis with parameter controls:

Overview Tab

  1. Company ESG Overview

    • Comprehensive ESG metrics for selected company
    • Dropdown parameter for ticker selection (20 major companies)
    • Score breakdown across E, S, G categories

  2. Company ESG Trends

    • Historical ESG score trends (2019-2024)
    • Line chart with Environmental, Social, Governance tracking
    • Interactive time series visualization

  3. ESG Peer Comparison

    • Compare selected company with industry peers
    • Grouped column chart for benchmark analysis
    • Sector-based peer selection

Risk Analysis Tab

  1. ESG Risk Breakdown
    • Detailed risk assessment across 12 categories
    • Risk level categorization (Low/Medium/High)
    • Mitigation status tracking
    • Donut chart visualization

News & Events Tab

  1. ESG News & Events
    • Recent ESG-related company news
    • Event type classification (Positive/Neutral/Negative)
    • Impact scoring and category filtering

Installation

  1. Install dependencies:

    pip install -r requirements.txt

  2. Run the application:

    python main.py

    Or using uvicorn directly:

    uvicorn main:app --reload --port 8019

  3. Access the API:

OpenBB Workspace Integration

To use this dashboard in OpenBB Workspace:

  1. Start the FastAPI application locally on port 8019
  2. In OpenBB Workspace, add a new backend connection:
    • URL: http://localhost:8019
    • The widgets and apps will be automatically discovered via the endpoints
  3. Access the two main applications:
    • ESG Discovery Dashboard - Comprehensive supplier ESG analytics
    • Company ESG Analysis - Company-specific deep-dive analysis

Color Theming

The dashboard uses a natural sustainability color palette that adapts to dark/light themes:

Dark Mode Palette

  • #C0FA00 - Bright lime green (C More brand)
  • #7BA05B - Natural forest green
  • #4A9EFF - Light blue
  • #D4A574 - Warm sand/beige
  • #FF8A65 - Light coral
  • #A8B8C0 - Light stone gray

Light Mode Palette

  • #7BA05B - Natural forest green
  • #4A6741 - Deep forest green
  • #141a32 - Deep navy (C More brand)
  • #D4A574 - Warm sand/beige
  • #8B4513 - Rich earth brown
  • #9FB3B8 - Stone gray

Data Structure

The application generates comprehensive sample data:

Supplier Data (1,000 records)

  • Geographic: 16 countries across 10 regions
  • Business: 15 industry sectors, revenue impact
  • Status: 4 onboarding stages
  • Risk Assessment: 3 risk levels with color coding
  • Sustainability: 3 maturity levels (Beginner/Intermediate/Advanced)
  • Compliance: SAQ completion, compliance scores (60-100)

Company Data (20 major companies)

  • ESG Scores: Environmental, Social, Governance metrics
  • Financial: Carbon intensity, water usage, waste metrics
  • Social: Employee satisfaction, board diversity
  • Risk: 12 risk categories with mitigation status
  • News: ESG-related events with impact scoring

API Endpoints

Core Configuration

  • GET / - API information
  • GET /widgets.json - Widget configuration for OpenBB Workspace
  • GET /apps.json - Application configuration with tabs and layouts

ESG Discovery Dashboard Endpoints

  • GET /kpi_cards - Key performance indicators
  • GET /regional_summary - Regional supplier data
  • GET /geographic_distribution - Country-wise distribution
  • GET /status_distribution - Status breakdown
  • GET /risk_distribution - Risk level distribution
  • GET /sustainability_maturity_distribution - Maturity levels
  • GET /sustainability_maturity_by_region - Regional maturity analysis
  • GET /sdg_prioritization - SDG goals prioritization
  • GET /business_ethics_compliance - Ethics compliance metrics
  • GET /detailed_suppliers - Comprehensive supplier data with filtering

Plotly Chart Endpoints

  • GET /esg_performance_trends - ESG performance time series
  • GET /carbon_footprint_trends - Carbon footprint analysis
  • GET /esg_score_heatmap - Regional ESG score heatmap

Company Analysis Endpoints

  • GET /company_esg_data - Unified company ESG endpoint with view parameter
    • view=overview - Company overview metrics
    • view=trends - Historical ESG trends
    • view=peer_comparison - Peer benchmark analysis
    • view=risk_breakdown - Risk assessment details
    • view=news_events - Recent ESG news and events

Technical Architecture

Code Structure

  • main.py - Main FastAPI application with all widgets and endpoints
  • plotly_config.py - Plotly chart configurations with theme-adaptive colors
  • apps.json - Application layouts and tab configurations
  • requirements.txt - Python dependencies

Widget Framework

  • @register_widget decorator - Automatic widget registration
  • Dynamic widget discovery - Auto-populated widgets.json
  • Parameter support - Company ticker dropdowns, text filters
  • Chart integration - AgGrid tables with embedded charts
  • Theme adaptation - Dark/light mode color schemes

Performance Features

  • CORS Configuration - Full OpenBB Workspace compatibility
  • Static file serving - Watermark image support
  • Efficient data generation - Seeded random data for consistency
  • Caching support - Configurable refresh intervals
  • Parameter validation - FastAPI query parameter validation

Widget Types Implemented

  1. Table Widgets - AgGrid tables with sorting, filtering, and embedded charts
  2. Chart Widgets - Plotly visualizations (line, bar, heatmap, pie, donut)
  3. Metric Widgets - KPI cards with formatted numbers and percentages
  4. Parameter Widgets - Dropdown selectors and text inputs
  5. Grouped Widgets - Parameter sharing across related widgets

Advanced Features

Multi-Tab Applications

  • ESG Discovery Dashboard: 3 tabs (Overview, Sustainability, Compliance)
  • Company ESG Analysis: 3 tabs (Overview, Risk Analysis, News & Events)

Interactive Parameters

  • Company ticker selection - 20 major companies (AAPL, MSFT, GOOGL, etc.)
  • Regional filtering - Multi-level geographic filtering
  • Status filtering - Onboarding stage selection
  • Risk level filtering - Risk category selection

Chart Capabilities

  • AgGrid integration - Tables with embedded chart views
  • Plotly charts - Professional visualizations with watermarks
  • Theme-adaptive colors - Automatic dark/light mode support
  • Custom colorscales - Natural sustainability color progressions

Development

Adding New Widgets

  1. Create a function with the @register_widget decorator:
@register_widget({
    "name": "Widget Name",
    "description": "Widget description",
    "endpoint": "widget_endpoint",
    "category": "ESG",
    "subCategory": "Analysis",
    "type": "table",
    "gridData": {"w": 40, "h": 15},
    # ... widget configuration
})
def get_widget_data():
    return data
  1. Register the endpoint:
app.get("/widget_endpoint")(get_widget_data)

Plotly Chart Integration

Use the plotly_config.py module for consistent theming:

from plotly_config import create_chart

@register_widget({
    "type": "chart",
    "raw": True,
})
def get_chart_data(raw: bool = False, theme: str = "dark"):
    fig, raw_data = create_chart("chart_type", theme=theme)
    return raw_data if raw else json.loads(fig.to_json())