// Frontend development skill for Quest Keeper AI Tauri application. Use when working on React components, Zustand stores, Three.js battlemaps, TailwindCSS styling, or Tauri shell integration. Triggers on mentions of frontend, React, Zustand, Three.js, battlemap, UI, viewport, or Tauri.
| name | quest-keeper-frontend |
| description | Frontend development skill for Quest Keeper AI Tauri application. Use when working on React components, Zustand stores, Three.js battlemaps, TailwindCSS styling, or Tauri shell integration. Triggers on mentions of frontend, React, Zustand, Three.js, battlemap, UI, viewport, or Tauri. |
C:\Users\mnehm\Desktop\Quest Keeper AI attempt 2
src/
โโโ components/
โ โโโ viewport/ # BattlemapCanvas, CharacterSheet, WorldMap
โ โโโ adventure/ # Main layout (AdventureView.tsx)
โ โโโ terminal/ # Chat interface
โ โโโ sidebar/ # Navigation
โโโ stores/ # Zustand state management
โโโ services/ # MCP client, LLM providers
โโโ hooks/ # Custom React hooks
โโโ utils/ # Helpers
npm run tauri dev # Development with hot reload
npm run build # Production build
import { parseMcpResponse } from '@/utils/mcpUtils';
const result = await mcpClient.callTool('get_character', { id });
const character = parseMcpResponse<Character>(result, null);
Key classes: terminal-green, terminal-dim, terminal-dark, crt-glow, font-mono