Wuxia Arena

Inspiration

Wuxia — the Chinese literary tradition of martial arts heroes — has captivated audiences for centuries with tales of wandering swordsmen, ancient sects, and epic duels. Yet the gaming world lacks a dedicated platform that curates and celebrates this genre. We built Wuxia Arena to be that home: a unified game lobby where players can discover, launch, and track their progress across multiple wuxia games — starting with our debut title, Wenxia: Wind and Cloud Decision.

The idea was simple: what if there were a "Steam for Wuxia"? A single destination where your achievements, play sessions, and progression persist across every game in the ecosystem.

What it does

Wuxia Arena is a game platform lobby application featuring:

• User authentication powered by Supabase Auth — register and log in with email/password
• Personal profile displaying your nickname, level, and total play time across all games
• Game catalog with launch capability — currently featuring Wenxia: Wind and Cloud Decision, a wuxia RPG
• Achievement system with 6 achievements to unlock (from "First Steps" to "Grandmaster")
• Play session tracking — every gaming session is recorded with start/end timestamps
• Real-time data sync between the lobby and running games via Supabase Realtime — unlock an achievement in-game, see it appear in the lobby instantly

When a player clicks "Start Game," the lobby passes Supabase credentials and user context to the game via URL parameters, enabling the game to write achievement unlocks and play session data directly back to the shared database. The lobby subscribes to Realtime changes and updates the UI live.

How we built it

• Frontend: React + TypeScript + Vite, styled with Tailwind CSS
• Backend: Supabase (MEDO's built-in instance) for Auth, PostgreSQL database, and Realtime subscriptions
• Platform: Built entirely within MEDO, using its integrated Supabase backend services
• Game integration: URL parameter-based credential passing + Supabase Realtime for bidirectional data flow between the lobby and standalone game projects
• Database schema: 5 tables (profiles, games, achievements, user_achievements, play_sessions) with Row Level Security policies ensuring users can only read/write their own data

Challenges we ran into

This project pushed us through a gauntlet of infrastructure challenges:

1. Supabase proxy issues in MEDO sandbox: The MEDO development sandbox intercepts outbound requests via a local proxy at 127.0.0.1:3067. This proxy stripped custom headers like apikey, causing 401 errors. We tried multiple approaches — base64 path encoding, query parameter proxying through a Cloudflare Worker — before MEDO introduced native Supabase integration, which eliminated the proxy entirely.

2. Schema drift between code and database: The profiles table was initially created with a nickname column, but the code expected username and total_play_time. This caused 400 errors that looked like auth failures but were actually column-not-found errors. We aligned the schema and code multiple times across versions before getting it right.

3. formatPlayTime is not defined crash: MEDO's AI agent restructured LobbyPage.tsx and accidentally moved the formatPlayTime function inside the component scope where it wasn't hoisted properly, causing a runtime ReferenceError and a white screen. The fix was moving it to module-level scope as a regular function declaration.

4. Cross-project data integration: Connecting two independent MEDO projects (the lobby and the game) through a shared Supabase instance required careful design — passing auth tokens via URL parameters, ensuring RLS policies allow the game to write on behalf of the user, and setting up Realtime subscriptions for live UI updates.

What we learned

• MEDO's built-in Supabase is a game-changer for rapid prototyping — when it works, Auth + DB + Realtime come for free
• Proxy environments are treacherous: always verify that headers survive the hop, and have fallback strategies (query params) ready
• Schema-first development matters: defining your database schema before writing frontend code saves hours of 400-error debugging
• Real-time features are surprisingly easy with Supabase's postgres_changes API — a few lines of code give you live cross-app data sync

What's next for Wuxia Arena

• More games: Add additional wuxia titles spanning strategy, card games, and visual novels
• Leaderboards: Global and friend-based rankings for competitive play
• Social features: Friend lists, in-platform messaging, and guild/clan system
• Game SDK: A reusable JavaScript SDK that any game developer can integrate to connect to the Wuxia Arena platform with minimal setup

Built With

• postgresql
• react
• supabase
• tailwind-css
• typescript
• vite