Skip to content

Latest commit

 

History

History

README.md

Build Status Static Badge Discord

TruffleBox UI

TruffleBox UI is the web-based management interface for BharatMLStack's Online Feature Store. It provides an intuitive dashboard for managing feature stores, discovering features, handling approval workflows, and administering users across your ML infrastructure.

🌟 Overview

TruffleBox UI serves as the primary frontend interface for the BharatMLStack ecosystem, offering:

  • Feature Discovery & Cataloging - Browse and explore features across entities and feature groups
  • Feature Store Management - Register and manage feature stores, jobs, and entities
  • Approval Workflows - Streamlined approval processes for feature store components
  • User Management - Role-based access control and user administration
  • Real-time Monitoring - Monitor feature store health and performance

🏗️ Architecture

Built with modern web technologies:

  • Frontend: React 18.3+ with Material-UI and Bootstrap styling
  • Routing: React Router for single-page application navigation
  • Authentication: JWT-based authentication with protected routes
  • Backend Integration: RESTful API integration with Horizon, Skye, and Model Inference services
  • Deployment: Dockerized with Nginx for production serving

🚀 Quick Start

Prerequisites

  • Node.js 16+ and yarn
  • Docker and Docker Compose (for containerized deployment)
  • Access to BharatMLStack backend services (Horizon, Skye)

Development Setup

  1. Clone and Navigate

    cd trufflebox-ui
  2. Install Dependencies

    yarn install
  3. Configure Environment

    cp env.example .env
    # Edit .env with your backend service URLs
  4. Start Development Server

    yarn start

    Open http://localhost:3000 to view the application.

Production Deployment

Using Docker

# Build the Docker image
docker build -t trufflebox-ui .

# Run with environment variables
docker run -p 80:80 \
  -e REACT_APP_HORIZON_BASE_URL=http://your-horizon-url:8082 \
  trufflebox-ui

Using Docker Compose

docker-compose up -d

📱 Features

Feature Discovery

  • Entity Explorer - Browse available entities in your feature store
  • Feature Group Navigation - Explore feature groups within entities
  • Feature Catalog - Detailed view of individual features with metadata
  • Client Discovery - Identify applications consuming features

Feature Management

  • Store Registry - Register and configure new feature stores
  • Job Registry - Manage feature engineering jobs and pipelines
  • Entity Registry - Define and register business entities
  • Feature Group Registry - Create and manage feature groups
  • Feature Addition - Add new features to existing groups

Approval Workflows

  • Multi-level Approvals - Configurable approval chains for different components
  • Store Approvals - Review and approve new feature stores
  • Job Approvals - Validate feature engineering jobs before deployment
  • Feature Approvals - Ensure quality and compliance of new features

User Administration

  • Role-based Access Control - Manage user permissions and roles
  • User Management - Add, modify, and deactivate user accounts
  • Authentication - Secure login and registration system

🔧 Configuration

Environment Variables

Variable Description Default
REACT_APP_HORIZON_BASE_URL Horizon backend service URL http://localhost:8082
PUBLIC_USER_BASE_URL Base URL for public routes /

Runtime Configuration

The application generates runtime configuration in env.js to support dynamic environment variable injection in containerized deployments.

🛠️ Development

Available Scripts

Command Description
yarn start Start development server with hot reload
yarn test Run test suite
yarn run build Build optimized production bundle
yarn run eject Eject from Create React App (⚠️ irreversible)

Project Structure

src/
├── pages/
│   ├── Auth/                    # Authentication components
│   ├── Header/                  # Navigation and header
│   ├── Layout/                  # Layout components
│   ├── OnlineFeatureStore/      # Feature store functionality
│   │   └── components/
│   │       ├── Discovery/       # Feature discovery components
│   │       ├── FeatureRegistry/ # Feature registration
│   │       └── FeatureApproval/ # Approval workflows
│   └── UserManagement/          # User administration
├── common/                      # Shared components and utilities
├── constants/                   # Application constants
└── config.js                    # Configuration management

Key Components

  • FeatureDiscovery - Main feature exploration interface
  • EntityDiscovery - Entity browsing and selection
  • FeatureGroupDiscovery - Feature group navigation
  • FeatureList - Detailed feature listing and metadata
  • UserManagement - Complete user administration panel

🔐 Authentication

TruffleBox UI implements JWT-based authentication with:

  • Protected Routes - Secure access to authenticated features
  • Role-based Authorization - Different access levels based on user roles
  • Session Management - Automatic token refresh and logout
  • Registration Flow - New user onboarding process

🚢 Deployment

Container Configuration

The application uses a multi-stage Docker build:

  1. Build Stage - Compiles React application with Node.js
  2. Runtime Stage - Serves static files with Nginx Alpine

Health Checks

Health check endpoint available at /health for monitoring deployment status.

Release Management

Version management through VERSION file and automated release scripts (release.sh).

🔗 Integration

TruffleBox UI integrates seamlessly with BharatMLStack components:

  • Horizon - Primary backend service for feature store management
  • Skye - Advanced analytics and monitoring
  • Model Inference - Real-time model serving integration
  • ONFS CLI - Command-line tool compatibility

📚 Learn More

Contributing

We welcome contributions from the community! Please see our Contributing Guide for details on how to get started.

Community & Support

License

BharatMLStack is open-source software licensed under the BharatMLStack Business Source License 1.1.


Built with ❤️ for the ML community from Meesho
If you find this useful, ⭐️ the repo — your support means the world to us!