Skip to content

Repository files navigation

WildSnacks - Vending Machine Fleet Management Platform

WildHacks 2026 | Theme: Time

Landing page: https://wildsnacks.tech/

View this link for dashboard and flagship features: https://wildsnacks.tech/dashboard

Authors: Gustavo Mercier, Jasmine Meyer, Vincent Yang

WildSnacks is an intelligent vending machine fleet management and restocking optimization platform. It helps logistics coordinators plan optimal restocking routes across geographic clusters of machines, manage warehouse inventory, and gives drivers a real-time execution view to follow their assigned routes — all designed to save time and maximize operational efficiency.


The Problem

Managing a distributed network of vending machines is a logistics headache. Which machines are running low? What's the most efficient route to restock them? How do you balance workloads across multiple drivers? How do you keep warehouse inventory in sync with field operations? WildSnacks solves all of this in one platform.


Features

Route Planning Dashboard

  • Interactive Map View — Leaflet-powered map showing all vending machines, color-coded by stock status (critical, low, active), organized into geographic clusters
  • Cluster Network View — Graph visualization of cluster relationships with travel times between them
  • Route Optimizer — Greedy multi-driver insertion algorithm that takes a time budget and number of drivers, then produces prioritized stop lists with ETAs. Accounts for machine urgency, travel times, service time, and target buffer days
  • Minimax Driver Assignment — Automatically balances workload across drivers to minimize the longest route duration

Driver App (Execution View)

  • Per-driver route panel — Each driver selects themselves and sees their assigned stops in order with ETAs
  • Stop-by-stop checklist — Drivers mark machines as complete as they visit them; stock levels update in real time
  • Route map — Companion map showing waypoints, completed stops, and route path
  • Start / Pause / Resume — Full lifecycle control over route execution
  • Progress tracking — Buffer days earned, completion percentage, estimated time remaining
  • Undo support — Uncomplete a stop if marked by mistake

Warehouse Management Dashboard

  • Inventory Overview — SKU counts, warehouse stock levels, product category breakdowns
  • Restock Queue — Machines ranked by urgency with critical/low stock predictions
  • Intake & Receiving — Receipt parsing and intake confirmation to add received items to warehouse inventory
  • Multi-Warehouse Support — CRUD operations for warehouse locations with capacity and coordinate tracking
  • Analytics & Pricing — Price history tracking, A/B test dashboard showing pricing experiments and revenue impact

Cookie AI Narration

  • Guided walkthrough mode — Toggle "Cookie AI On" in the header to get an ElevenLabs-powered voice narration that walks you through the dashboard
  • Smart UI interaction — Narration auto-scrolls to relevant sections, highlights buttons with animated pulses, and auto-clicks through the workflow
  • Floating subtitles — Real-time subtitle bar showing spoken text

Authentication

  • Clerk integration — Sign-in/sign-up with 2FA
  • JWT verification — All API endpoints validate Clerk tokens
  • Protected routes — Unauthenticated users are redirected from the dashboard

Tech Stack

Layer Technology
Frontend React 18, Vite, React Router
Maps Leaflet, React-Leaflet
Charts Recharts
3D Three.js (landing page visualization)
Auth Clerk (2FA, JWT)
Backend Python Flask
Database Supabase (PostgreSQL)
Voice AI ElevenLabs (Cookie AI narration)
AI Claude AI
Hosting Vercel (static frontend + serverless Python API)

Getting Started

Prerequisites

  • Node.js (npm)
  • Python 3.7+
  • A Clerk account (for auth)
  • Supabase project (for inventory data)
  • ElevenLabs API key (optional, for Cookie AI)

Development

# Terminal 1 — Backend API (runs on http://localhost:5000)
cd backend
pip install -r requirements.txt
python app.py

# Terminal 2 — Frontend (runs on http://localhost:5173)
cd frontend
npm install
npm run dev

The Vite dev server proxies /api/* requests to the Flask backend automatically.

Environment Variables

Create a .env file in frontend/:

VITE_CLERK_PUBLISHABLE_KEY=<your-clerk-key>
VITE_SUPABASE_URL=<your-supabase-url>
VITE_SUPABASE_ANON_KEY=<your-supabase-anon-key>

Production (Vercel)

The project deploys to Vercel with:

  • /api/* routed to api/index.py (serverless Python)
  • /* served from frontend/dist/ (static SPA)

Architecture

wildhacks-2026/
├── frontend/          # React + Vite SPA
│   ├── src/
│   │   ├── components/   # Dashboard, DriverView, WarehouseTab, etc.
│   │   ├── pages/        # Landing, SignIn, SignUp, Dashboard
│   │   └── ...
│   └── ...
├── backend/           # Flask API (local dev)
│   └── app.py
├── api/               # Vercel serverless API
│   ├── index.py       # Flask app for production
│   └── data/          # Mock datasets (1-4)
└── vercel.json        # Deployment config

How It Works

  1. Admin opens the dashboard and sees all vending machines on the map, clustered geographically
  2. Admin configures a route — sets time budget and number of drivers, then runs the optimizer
  3. Optimizer produces routes — machines are prioritized by urgency (days of inventory remaining, stock level), and stops are assigned to drivers using minimax balancing
  4. Drivers execute routes — each driver opens their view, starts their route, and checks off machines as they restock them
  5. Warehouse stays in sync — the warehouse dashboard tracks inventory levels, predicts restocking needs, and manages intake of new shipments

Processes We Developed

  1. Authentication — Clerk-based auth with JWT token passing on every API call. Added DNS CNAME and A records for custom domain support.

  2. Route Optimization — Greedy insertion heuristic (O(|M| * D * k)) that balances machine urgency against travel time and driver workload. Not an exact solver, but fast enough for real-time use.

  3. Multi-Dataset Demo System — 4 mock datasets with different machine network configurations for demo/judging purposes. Each dataset maintains independent state.

  4. Cookie AI Integration — Server-side ElevenLabs TTS proxy with time-synced frontend narration triggers that orchestrate UI highlights and auto-navigation.

About

Intelligent vending machine fleet management and restocking optimization platform. Plans optimal routes across geographic clusters of machines, manages warehouse inventory, and gives drivers a real-time execution view to follow their assigned routes.

Resources

Stars

1 star

Watchers

0 watching

Forks

Releases

Packages

Contributors

Languages