diff --git a/README.md b/README.md index 7dbf7eb..5b00b76 100644 --- a/README.md +++ b/README.md @@ -1,73 +1,82 @@ -# React + TypeScript + Vite +# ExoLauncher -This template provides a minimal setup to get React working in Vite with HMR and some ESLint rules. +![ExoLauncher Banner](src/assets/logo.png) -Currently, two official plugins are available: +> **The Premium Human-in-the-Loop Gateway for AI Agents.** -- [@vitejs/plugin-react](https://github.com/vitejs/vite-plugin-react/blob/main/packages/plugin-react) uses [Oxc](https://oxc.rs) -- [@vitejs/plugin-react-swc](https://github.com/vitejs/vite-plugin-react/blob/main/packages/plugin-react-swc) uses [SWC](https://swc.rs/) +ExoLauncher is a high-performance, professional-grade HitL (Human-in-the-Loop) gateway designed to provide a secure and efficient interface for reviewing AI agent outputs. Built with **Tauri**, **Rust**, and **React**, it bridges the gap between autonomous agents and human oversight through a modern SSE (Server-Sent Events) architecture. -## React Compiler +## ✨ Features -The React Compiler is not enabled on this template because of its impact on dev & build performances. To add it, see [this documentation](https://react.dev/learn/react-compiler/installation). +- **Master-Detail Interface**: A sophisticated 1:3 split-view layout designed for high-efficiency item processing and detailed content review. +- **SSE Architecture**: Decoupled communication via Server-Sent Events, allowing multiple agents to connect simultaneously without local path constraints. +- **Obsidian Dark Theme**: A premium, obsidian-inspired dark mode with glassmorphism effects and optimized typography (Fira Code). +- **Dual-Axis Resizing**: Fully adjustable layout with independent resizers for the navigation sidebar and the master-detail split. +- **Internationalization**: Full multi-language support (English/Japanese) with persistent settings and browser language detection. +- **Cross-Platform**: Native performance on Windows, macOS, and Linux powered by Tauri. -## Expanding the ESLint configuration +## 🏗 Architecture -If you are developing a production application, we recommend updating the configuration to enable type-aware lint rules: +```mermaid +graph LR + subgraph "AI Agents" + A[Claude Desktop] + B[Custom Agent] + C[MCP Client] + end -```js -export default defineConfig([ - globalIgnores(['dist']), - { - files: ['**/*.{ts,tsx}'], - extends: [ - // Other configs... + subgraph "ExoLauncher (Tauri/Rust)" + GW[SSE Gateway] + UI[React Dashboard] + API[Approval API] + end - // Remove tseslint.configs.recommended and replace with this - tseslint.configs.recommendedTypeChecked, - // Alternatively, use this for stricter rules - tseslint.configs.strictTypeChecked, - // Optionally, add this for stylistic rules - tseslint.configs.stylisticTypeChecked, - - // Other configs... - ], - languageOptions: { - parserOptions: { - project: ['./tsconfig.node.json', './tsconfig.app.json'], - tsconfigRootDir: import.meta.dirname, - }, - // other options... - }, - }, -]) + A -- "MCP Tools" --> GW + B -- "HTTP/SSE" --> GW + GW -- "Real-time Update" --> UI + UI -- "Approve/Reject" --> API + API -- "Callback" --> A ``` -You can also install [eslint-plugin-react-x](https://github.com/Rel1cx/eslint-react/tree/main/packages/plugins/eslint-plugin-react-x) and [eslint-plugin-react-dom](https://github.com/Rel1cx/eslint-react/tree/main/packages/plugins/eslint-plugin-react-dom) for React-specific lint rules: +## 🚀 Quick Start -```js -// eslint.config.js -import reactX from 'eslint-plugin-react-x' -import reactDom from 'eslint-plugin-react-dom' +### 1. Prerequisites +- [Node.js](https://nodejs.org/) (v18+) +- [Rust](https://www.rust-lang.org/) (Latest stable) -export default defineConfig([ - globalIgnores(['dist']), - { - files: ['**/*.{ts,tsx}'], - extends: [ - // Other configs... - // Enable lint rules for React - reactX.configs['recommended-typescript'], - // Enable lint rules for React DOM - reactDom.configs.recommended, - ], - languageOptions: { - parserOptions: { - project: ['./tsconfig.node.json', './tsconfig.app.json'], - tsconfigRootDir: import.meta.dirname, - }, - // other options... - }, - }, -]) +### 2. Installation +```bash +git clone https://gitbucket.tmworks.club/git/dev-team/ExoLauncher.git +cd ExoLauncher +npm install ``` + +### 3. Running in Development +```bash +npm run tauri dev +``` + +### 4. Connecting your Agent +To connect **Claude Desktop** to ExoLauncher, add the following to your `claude_desktop_config.json`: + +```json +{ + "mcpServers": { + "exolauncher": { + "type": "sse", + "url": "http://localhost:3001/mcp/sse" + } + } +} +``` + +## 🛠 Tech Stack + +- **Backend**: Rust, Tauri, Axum (SSE Server) +- **Frontend**: React 19, TypeScript, Vite +- **Styling**: Vanilla CSS (Custom Design System) +- **Internationalization**: i18next, react-i18next + +## 📜 License + +© 2026 ExoLauncher Team. All rights reserved.