Energy Conversion Chain

Energy Conversion Chain is a React app for exploring how different forms of energy can convert into one another. Pick a source and destination to see every possible conversion route, or use the "Everything to Electrical" view to see the most efficient path from each form to electrical energy.

Features

• Search and filter energy forms by category.
• Select source and destination energy forms to generate all possible conversion routes.
• Tree view with pan + zoom and connected nodes for energy forms and conversion methods.
• List view that flattens each route for easy comparison.
• Sort routes by shortest path or most efficient (highest retained energy).
• "Everything to Electrical" mode showing the best route from each energy form to electrical energy.
• Each conversion method shows estimated energy loss; destination nodes show retained energy.

Tech stack

• Vite + React (JavaScript)
• Tailwind CSS + SCSS
• ShadCN UI components

Getting started

1. Install dependencies:

npm install

2. Start the dev server:

npm run dev

3. Build for production:

npm run build

4. Preview the production build:

npm run preview

Project structure

• src/pages/Home.jsx: catalog, search, and route selection.
• src/pages/Routes.jsx: tree/list views, pan/zoom, sorting, and routing logic.
• src/components/energy/: shared UI components for tree/list routes.
• src/data/energy.js: energy forms and conversion methods (including loss %).
• src/lib/energy-graph.js: route discovery and path utilities.

Notes

• Routes avoid repeating the same energy form within a single path to prevent loops.
• Efficiency is calculated by multiplying retained energy across method steps.

---

Feel free to expand the energy catalog or conversion methods in src/data/energy.js.