d-sports-engage-native

Native iOS and Android app for D-Sports Engage. Expo 54, React Native, Clerk, RevenueCat, Thirdweb, Supabase.

Overview

d-sports-engage-native (package name: engage-native, current version: 1.10.0) is the native mobile app for D-Sports. It mirrors the core PWA experience on iOS and Android: wallet, shop, leaderboard, locker room, and profile.

• Run: bunx expo start or bun run start — then press a for Android or i for iOS, or scan the QR code with Expo Go.

Tech stack

Category	Technology
Framework	Expo 54, React Native 0.81, React 19
Auth	Clerk (Expo)
Payments	RevenueCat (react-native-purchases)
Web3	Thirdweb
Database	Supabase (client-side)
State	Zustand
Storage	MMKV
UI	Lucide React Native
Navigation	Expo Router
Package	Bun

Features

• Wallet — Tokens, holdings, pack opening, crypto checkout (via PWA backend)
• Shop — Collectibles, cart, coin bundles, checkout
• Leaderboard — Rankings and filters
• Locker room — Social feed and engagement
• Profile — User profile and settings
• Theme — Dark/light mode (default dark)

Getting started

1. Clone the repository and run bun install.
2. Copy .env and configure the required environment variables (see below).
3. Run bunx expo start.
4. For development builds: bun run build:dev (EAS) or run with Expo dev client.

The app targets both native and web (responsive) and uses the same backend (d-sports-api) as the PWA for API and checkout flows.

Environment variables

All runtime variables use the EXPO_PUBLIC_ prefix so they are accessible inside the Expo app.

Variable	Purpose
EXPO_PUBLIC_CLERK_PUBLISHABLE_KEY	Clerk authentication
EXPO_PUBLIC_API_URL	Backend API base URL (https://api.d-sports.org)
EXPO_PUBLIC_TW_CLIENT_ID	Thirdweb client ID for Web3 features
EXPO_PUBLIC_REVENUECAT_API_KEY	RevenueCat API key for in-app purchases
EXPO_PUBLIC_REVENUECAT_APPSTORE_ID	RevenueCat App Store ID
EXPO_PUBLIC_REVENUECAT_ENTITLEMENT	RevenueCat entitlement identifier
EXPO_PUBLIC_SUPABASE_URL	Supabase project URL
EXPO_PUBLIC_SUPABASE_KEY	Supabase publishable (anon) key

API response format

As of v1.10.0, all backend API responses follow a standardized envelope:

{ "success": true, "data": { ... } }

Error responses use the same shape:

{ "success": false, "error": "message", "code": "OPTIONAL_CODE" }

Normalized routes include authentication (/api/auth/native-token, /api/auth/validate), user management (/api/user, /api/user/check-username, /api/user/onboarding), products, and coin prices.

Architecture

• File-based routing via Expo Router with route groups (tabs), (auth), (onboarding)
• Modular screen architecture — screen files contain only JSX; all state, effects, and handlers live in dedicated hooks (use-wallet-screen.ts, use-shop-screen.ts)
• Extracted sub-components — wallet and shop screens decomposed into components/wallet/ and components/shop/
• API client layer in lib/api/ with MMKV cache fallback
• Zustand + MMKV for global state with synchronous persistence
• React Context for auth, collectibles, and navbar visibility
• Crypto checkout via Thirdweb SDK calling the PWA backend for on-chain payments

Ecosystem overview

See how the native app fits with the PWA, site, and Mic’d Up.