✨ feat(figgos): add figure generation V1 + re-scaffold mobile app

Backend: figures CRUD API with rarity system and random stats
Mobile: re-scaffolded with create-expo-app (SDK 54), NativeWind 4 design system,
create form + shelf grid. Auth disabled for faster iteration.
Shared: types inlined for Node v24 ESM compat.

See CLAUDE.md for current status, known issues, and next steps.

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>

apps/figgos/CLAUDE.md

@@ -28,11 +28,20 @@ pnpm figgos:db:push          # Push schema to database
 pnpm figgos:db:studio        # Open Drizzle Studio
 ```
 
+### From mobile directory
+
+```bash
+npx expo start               # Start Expo Go
+npx expo start --dev-client  # Start with dev build
+npx expo start --clear       # Start with clean cache
+```
+
 ## Technology Stack
 
-- **Mobile**: React Native 0.76 + Expo SDK 52, NativeWind, Expo Router
+- **Mobile**: React Native 0.81 + Expo SDK 54, NativeWind 4, Expo Router
 - **Backend**: NestJS 10, Drizzle ORM, PostgreSQL
 - **Auth**: Mana Core Auth (JWT via @manacore/shared-nestjs-auth)
+- **Shared**: `@figgos/shared` — all types inlined in `src/index.ts` (Node v24 ESM compat)
 - **AI**: Google Gemini API (planned)
 - **Storage**: MinIO (local) / Hetzner S3 (production)
 
@@ -51,6 +60,8 @@ pnpm figgos:db:studio        # Open Drizzle Studio
 PORT=3025
 DATABASE_URL=postgresql://manacore:devpassword@localhost:5432/figgos
 MANA_CORE_AUTH_URL=http://localhost:3001
+DEV_BYPASS_AUTH=true
+DEV_USER_ID=test-user-id
 ```
 
 ### Mobile (.env)
@@ -62,7 +73,59 @@ EXPO_PUBLIC_MANA_CORE_AUTH_URL=http://localhost:3001
 
 ## Game Concept
 
-- Users create fantasy figures by providing a name/subject
-- AI generates character info (description, lore, items) + image
+- Users create fantasy figures by providing a name + description
+- Backend rolls rarity (common 60%, rare 25%, epic 12%, legendary 3%) and generates random stats
+- AI generates character info + image (planned V2)
 - Figures have rarities: common, rare, epic, legendary
 - Users can browse public figures, like them, and collect their own
+
+## Current Status (V1 — Figure Generation)
+
+### Done
+
+- **Backend CRUD**: `POST/GET/DELETE /api/v1/figures` — working, tested via curl
+- **DB Schema**: `figures` table with JSONB columns (`userInput`, `stats`)
+- **Shared Types**: `@figgos/shared` with `FigureRarity`, `FigureResponse`, rarity weights/ranges
+- **Mobile Scaffold**: Expo SDK 54, NativeWind 4 design system, tab navigation (Create, Shelf)
+- **Mobile Screens**: Create form (name + description), result card with rarity badge, shelf grid
+- **API Service**: `services/api.ts` with typed fetch wrapper + auth token injection
+
+### Known Issues / TODOs
+
+- **Mobile app not yet verified on device** — Expo Go had `PlatformConstants` TurboModule errors with SDK 54. Reanimated downgraded to v3, worklets plugin disabled. Needs testing with `npx expo start --clear`
+- **Auth disabled** — `_layout.tsx` currently skips AuthGuard/AuthProvider for faster iteration. Login screen exists at `app/(auth)/login.tsx` but is not wired up
+- **No AI image generation** — `imageUrl` is always null, placeholder emoji shown
+- **No stats display** — Stats are generated server-side but not shown in the mobile UI
+- **Placeholder assets** — icon/splash are default Expo template images
+
+### Next Steps (V2)
+
+1. **Fix mobile runtime** — verify app loads in Expo Go or create a dev build
+2. **Wire up auth** — re-enable AuthGuard in `_layout.tsx`, test login flow
+3. **Stats display** — show attack/defense/special bars on figure card
+4. **AI character generation** — integrate Gemini to populate `characterInfo` JSONB
+5. **AI image generation** — generate figure artwork, store in S3, populate `imageUrl`
+6. **Shelf improvements** — pull-to-refresh, empty state, delete swipe
+7. **Public feed** — browse community figures, like system
+
+## Architecture Notes
+
+### Shared Package (`@figgos/shared`)
+
+- Uses `"type": "module"` for Node v24 ESM compatibility
+- All types inlined in `src/index.ts` (no subdirectory imports — avoids ESM extension issues)
+- Imported at runtime by backend (Node v24 type stripping) and bundled by Metro for mobile
+
+### Backend
+
+- Global prefix `api/v1` set by `@manacore/shared-nestjs-setup` — controllers use resource-only names (e.g. `@Controller('figures')`)
+- `DEV_BYPASS_AUTH=true` skips JWT validation in development
+- Rarity + stats rolled server-side in `figures.service.ts`
+
+### Mobile (Expo SDK 54)
+
+- Re-scaffolded with `create-expo-app` (tabs template) for clean setup
+- NativeWind 4 with `react-native-css-interop` as explicit dep (pnpm strict hoisting)
+- `babel-preset-expo` configured with `worklets: false` (using Reanimated v3 for Expo Go compat)
+- `newArchEnabled: false` in app.json (Expo Go doesn't fully support new architecture)
+- Path alias: `~/` maps to project root via tsconfig

apps/figgos/apps/backend/src/app.module.ts

@@ -3,6 +3,7 @@ import { ConfigModule } from '@nestjs/config';
 import { MetricsModule } from '@manacore/shared-nestjs-metrics';
 import { HealthModule } from '@manacore/shared-nestjs-health';
 import { DatabaseModule } from './db/database.module';
+import { FiguresModule } from './figures/figures.module';
 
 @Module({
 	imports: [
@@ -16,6 +17,7 @@ import { DatabaseModule } from './db/database.module';
 		}),
 		DatabaseModule,
 		HealthModule.forRoot({ serviceName: 'figgos-backend' }),
+		FiguresModule,
 	],
 })
 export class AppModule {}

apps/figgos/apps/backend/src/db/schema/figures.schema.ts

@@ -0,0 +1,34 @@
+import {
+	pgTable,
+	uuid,
+	text,
+	timestamp,
+	varchar,
+	boolean,
+	jsonb,
+	index,
+} from 'drizzle-orm/pg-core';
+import type { FigureRarity, FigureUserInput } from '@figgos/shared';
+
+export const figures = pgTable(
+	'figures',
+	{
+		id: uuid('id').primaryKey().defaultRandom(),
+		userId: text('user_id').notNull(),
+		name: varchar('name', { length: 200 }).notNull(),
+		userInput: jsonb('user_input').$type<FigureUserInput>().notNull(),
+		imageUrl: text('image_url'),
+		rarity: varchar('rarity', { length: 20 }).default('common').notNull().$type<FigureRarity>(),
+		isPublic: boolean('is_public').default(false).notNull(),
+		isArchived: boolean('is_archived').default(false).notNull(),
+		createdAt: timestamp('created_at', { withTimezone: true }).defaultNow().notNull(),
+		updatedAt: timestamp('updated_at', { withTimezone: true }).defaultNow().notNull(),
+	},
+	(table) => ({
+		userIdx: index('figures_user_idx').on(table.userId),
+		createdAtIdx: index('figures_created_at_idx').on(table.createdAt),
+	})
+);
+
+export type Figure = typeof figures.$inferSelect;
+export type NewFigure = typeof figures.$inferInsert;

apps/figgos/apps/backend/src/db/schema/index.ts

@@ -1,3 +1 @@
-// Database schema exports
-// Will be populated as features are added
-export {};
+export * from './figures.schema';

apps/figgos/apps/backend/src/figures/dto/create-figure.dto.ts

@@ -0,0 +1,15 @@
+import { IsString, IsNotEmpty, MaxLength, MinLength } from 'class-validator';
+
+export class CreateFigureDto {
+	@IsString()
+	@IsNotEmpty()
+	@MinLength(1)
+	@MaxLength(200)
+	name!: string;
+
+	@IsString()
+	@IsNotEmpty()
+	@MinLength(1)
+	@MaxLength(2000)
+	description!: string;
+}

apps/figgos/apps/backend/src/figures/figures.controller.ts

@@ -0,0 +1,43 @@
+import {
+	Controller,
+	Get,
+	Post,
+	Delete,
+	Body,
+	Param,
+	UseGuards,
+	ParseUUIDPipe,
+} from '@nestjs/common';
+import { JwtAuthGuard, CurrentUser, CurrentUserData } from '@manacore/shared-nestjs-auth';
+import { FiguresService } from './figures.service';
+import { CreateFigureDto } from './dto/create-figure.dto';
+
+@Controller('figures')
+@UseGuards(JwtAuthGuard)
+export class FiguresController {
+	constructor(private readonly figuresService: FiguresService) {}
+
+	@Post()
+	async create(@CurrentUser() user: CurrentUserData, @Body() dto: CreateFigureDto) {
+		const figure = await this.figuresService.create(user.userId, dto.name, dto.description);
+		return { figure };
+	}
+
+	@Get()
+	async findAll(@CurrentUser() user: CurrentUserData) {
+		const figures = await this.figuresService.findByUserId(user.userId);
+		return { figures };
+	}
+
+	@Get(':id')
+	async findOne(@CurrentUser() user: CurrentUserData, @Param('id', ParseUUIDPipe) id: string) {
+		const figure = await this.figuresService.findById(id, user.userId);
+		return { figure };
+	}
+
+	@Delete(':id')
+	async delete(@CurrentUser() user: CurrentUserData, @Param('id', ParseUUIDPipe) id: string) {
+		await this.figuresService.delete(id, user.userId);
+		return { success: true };
+	}
+}

apps/figgos/apps/backend/src/figures/figures.module.ts

@@ -0,0 +1,10 @@
+import { Module } from '@nestjs/common';
+import { FiguresController } from './figures.controller';
+import { FiguresService } from './figures.service';
+
+@Module({
+	controllers: [FiguresController],
+	providers: [FiguresService],
+	exports: [FiguresService],
+})
+export class FiguresModule {}

apps/figgos/apps/backend/src/figures/figures.service.ts

@@ -0,0 +1,71 @@
+import { Injectable, Inject, NotFoundException } from '@nestjs/common';
+import { eq, and, desc } from 'drizzle-orm';
+import { DATABASE_CONNECTION } from '../db/database.module';
+import type { Database } from '../db/connection';
+import { figures } from '../db/schema';
+import type { Figure } from '../db/schema';
+import { RARITY_WEIGHTS, type FigureRarity } from '@figgos/shared';
+
+@Injectable()
+export class FiguresService {
+	constructor(@Inject(DATABASE_CONNECTION) private db: Database) {}
+
+	rollRarity(): FigureRarity {
+		const total = Object.values(RARITY_WEIGHTS).reduce((sum, w) => sum + w, 0);
+		let roll = Math.random() * total;
+		for (const [rarity, weight] of Object.entries(RARITY_WEIGHTS)) {
+			roll -= weight;
+			if (roll <= 0) return rarity as FigureRarity;
+		}
+		return 'common';
+	}
+
+	async create(userId: string, name: string, description: string): Promise<Figure> {
+		const rarity = this.rollRarity();
+
+		const [figure] = await this.db
+			.insert(figures)
+			.values({
+				userId,
+				name,
+				userInput: { description },
+				rarity,
+			})
+			.returning();
+
+		return figure;
+	}
+
+	async findByUserId(userId: string): Promise<Figure[]> {
+		return this.db
+			.select()
+			.from(figures)
+			.where(and(eq(figures.userId, userId), eq(figures.isArchived, false)))
+			.orderBy(desc(figures.createdAt));
+	}
+
+	async findById(id: string, userId: string): Promise<Figure> {
+		const [figure] = await this.db
+			.select()
+			.from(figures)
+			.where(and(eq(figures.id, id), eq(figures.userId, userId)));
+
+		if (!figure) {
+			throw new NotFoundException('Figure not found');
+		}
+		return figure;
+	}
+
+	async delete(id: string, userId: string): Promise<void> {
+		const [figure] = await this.db
+			.select()
+			.from(figures)
+			.where(and(eq(figures.id, id), eq(figures.userId, userId)));
+
+		if (!figure) {
+			throw new NotFoundException('Figure not found');
+		}
+
+		await this.db.delete(figures).where(eq(figures.id, id));
+	}
+}

apps/figgos/apps/mobile/.gitignore

@@ -1,14 +1,41 @@
+# Learn more https://docs.github.com/en/get-started/getting-started-with-git/ignoring-files
+
+# dependencies
 node_modules/
+
+# Expo
 .expo/
 dist/
-npm-debug.*
+web-build/
+expo-env.d.ts
+
+# Native
+.kotlin/
+*.orig.*
 *.jks
 *.p8
 *.p12
 *.key
 *.mobileprovision
-*.orig.*
-web-build/
-ios/
-android/
-.env
+
+# Metro
+.metro-health-check*
+
+# debug
+npm-debug.*
+yarn-debug.*
+yarn-error.*
+
+# macOS
+.DS_Store
+*.pem
+
+# local env files
+.env*.local
+
+# typescript
+*.tsbuildinfo
+
+# generated native folders
+/ios
+/android

apps/figgos/apps/mobile/app-env.d.ts

@@ -1 +0,0 @@
-/// <reference types="expo/types" />

apps/figgos/apps/mobile/app.json

@@ -4,48 +4,36 @@
 		"slug": "figgos",
 		"version": "1.0.0",
 		"scheme": "figgos",
-		"web": {
-			"bundler": "metro",
-			"output": "server",
-			"favicon": "./assets/favicon.png"
-		},
-		"plugins": [
-			"expo-router",
-			[
-				"expo-dev-launcher",
-				{
-					"launchMode": "most-recent"
-				}
-			]
-		],
-		"experiments": {
-			"typedRoutes": true,
-			"tsconfigPaths": true
-		},
 		"orientation": "portrait",
-		"icon": "./assets/icon.png",
-		"userInterfaceStyle": "light",
+		"icon": "./assets/images/icon.png",
+		"userInterfaceStyle": "automatic",
+		"newArchEnabled": false,
 		"splash": {
-			"image": "./assets/splash.png",
+			"image": "./assets/images/splash-icon.png",
 			"resizeMode": "contain",
 			"backgroundColor": "#ffffff"
 		},
-		"assetBundlePatterns": ["**/*"],
 		"ios": {
 			"supportsTablet": true,
-			"bundleIdentifier": "com.tilljs.figgos"
+			"bundleIdentifier": "com.tilljs.figgos",
+			"appleTeamId": "FTD9P2JU85"
 		},
 		"android": {
 			"adaptiveIcon": {
-				"foregroundImage": "./assets/adaptive-icon.png",
+				"foregroundImage": "./assets/images/adaptive-icon.png",
 				"backgroundColor": "#ffffff"
 			},
+			"edgeToEdgeEnabled": true,
 			"package": "com.tilljs.figgos"
 		},
-		"extra": {
-			"router": {
-				"origin": false
-			}
+		"web": {
+			"bundler": "metro",
+			"output": "static",
+			"favicon": "./assets/images/favicon.png"
+		},
+		"plugins": ["expo-router", "expo-secure-store"],
+		"experiments": {
+			"typedRoutes": true
 		}
 	}
 }

apps/figgos/apps/mobile/app/(auth)/login.tsx

@@ -64,9 +64,7 @@ export default function LoginScreen() {
 					<Pressable
 						onPress={handleLogin}
 						disabled={loading}
-						className={({ pressed }) =>
-							`bg-primary rounded-lg py-3 mt-4 ${pressed ? 'opacity-80' : ''} ${loading ? 'opacity-50' : ''}`
-						}
+						className={`bg-primary rounded-lg py-3 mt-4 active:opacity-80 ${loading ? 'opacity-50' : ''}`}
 					>
 						<Text className="text-primary-foreground text-center font-semibold text-base">
 							{loading ? 'Signing in...' : 'Sign In'}

apps/figgos/apps/mobile/app/(tabs)/create.tsx

@@ -1,15 +1,150 @@
-import { View, Text } from 'react-native';
+import { useState } from 'react';
+import {
+	View,
+	Text,
+	TextInput,
+	Pressable,
+	ScrollView,
+	KeyboardAvoidingView,
+	Platform,
+	ActivityIndicator,
+} from 'react-native';
 import { SafeAreaView } from 'react-native-safe-area-context';
+import { api } from '~/services/api';
+import type { FigureResponse, FigureRarity } from '@figgos/shared';
+
+const RARITY_STYLES: Record<FigureRarity, { bg: string; text: string }> = {
+	common: { bg: 'bg-rarity-common', text: 'text-rarity-common-foreground' },
+	rare: { bg: 'bg-rarity-rare', text: 'text-rarity-rare-foreground' },
+	epic: { bg: 'bg-rarity-epic', text: 'text-rarity-epic-foreground' },
+	legendary: { bg: 'bg-rarity-legendary', text: 'text-rarity-legendary-foreground' },
+};
+
+function RarityBadge({ rarity }: { rarity: FigureRarity }) {
+	const s = RARITY_STYLES[rarity];
+	return (
+		<View className={`${s.bg} px-3 py-1 rounded-full`}>
+			<Text className={`${s.text} text-xs font-bold uppercase`}>{rarity}</Text>
+		</View>
+	);
+}
 
 export default function CreateScreen() {
+	const [name, setName] = useState('');
+	const [description, setDescription] = useState('');
+	const [loading, setLoading] = useState(false);
+	const [error, setError] = useState<string | null>(null);
+	const [result, setResult] = useState<FigureResponse | null>(null);
+
+	const handleGenerate = async () => {
+		if (!name.trim() || !description.trim()) {
+			setError('Please enter a name and description');
+			return;
+		}
+		setLoading(true);
+		setError(null);
+		try {
+			const { figure } = await api.figures.create(name.trim(), description.trim());
+			setResult(figure);
+		} catch (e: any) {
+			setError(e.message || 'Failed to create figure');
+		} finally {
+			setLoading(false);
+		}
+	};
+
+	const handleReset = () => {
+		setName('');
+		setDescription('');
+		setResult(null);
+		setError(null);
+	};
+
+	if (result) {
+		return (
+			<SafeAreaView className="flex-1 bg-background" edges={['bottom']}>
+				<ScrollView className="flex-1 px-6 pt-4">
+					<View className="bg-surface rounded-2xl border border-border p-6 items-center">
+						<View className="w-48 h-48 bg-muted rounded-xl items-center justify-center mb-4">
+							<Text className="text-4xl">🎭</Text>
+						</View>
+						<Text className="text-xl font-bold text-foreground">{result.name}</Text>
+						<Text className="text-sm text-muted-foreground mt-1 text-center">
+							{result.userInput.description}
+						</Text>
+						<View className="mt-3">
+							<RarityBadge rarity={result.rarity} />
+						</View>
+					</View>
+
+					<Pressable
+						onPress={handleReset}
+						className="bg-primary rounded-lg py-3 mt-6 mb-8 active:opacity-80"
+					>
+						<Text className="text-primary-foreground text-center font-semibold">
+							Create Another
+						</Text>
+					</Pressable>
+				</ScrollView>
+			</SafeAreaView>
+		);
+	}
+
 	return (
 		<SafeAreaView className="flex-1 bg-background" edges={['bottom']}>
-			<View className="flex-1 items-center justify-center px-6">
-				<Text className="text-2xl font-bold text-foreground">Create</Text>
-				<Text className="text-muted-foreground mt-2 text-center">
-					Generate your own AI-powered action figures.
-				</Text>
-			</View>
+			<KeyboardAvoidingView
+				behavior={Platform.OS === 'ios' ? 'padding' : 'height'}
+				className="flex-1"
+			>
+				<ScrollView className="flex-1 px-6 pt-4">
+					<Text className="text-2xl font-bold text-foreground mb-2">Create a Figure</Text>
+					<Text className="text-muted-foreground mb-6">
+						Describe your character and we'll generate a collectible figure.
+					</Text>
+
+					<Text className="text-sm font-medium text-foreground mb-1">Name</Text>
+					<TextInput
+						className="bg-surface border border-border rounded-lg px-4 py-3 text-foreground mb-4"
+						placeholder="e.g. Captain Thunderstrike"
+						placeholderTextColor="rgb(99 110 114)"
+						value={name}
+						onChangeText={setName}
+						maxLength={200}
+					/>
+
+					<Text className="text-sm font-medium text-foreground mb-1">Description</Text>
+					<TextInput
+						className="bg-surface border border-border rounded-lg px-4 py-3 text-foreground mb-4"
+						placeholder="e.g. A cyberpunk warrior with lightning gauntlets"
+						placeholderTextColor="rgb(99 110 114)"
+						value={description}
+						onChangeText={setDescription}
+						multiline
+						numberOfLines={3}
+						style={{ textAlignVertical: 'top', minHeight: 80 }}
+						maxLength={2000}
+					/>
+
+					{error && <Text className="text-destructive text-center mb-4">{error}</Text>}
+
+					<Pressable
+						onPress={handleGenerate}
+						disabled={loading}
+						className={`bg-primary rounded-lg py-4 active:opacity-80 ${loading ? 'opacity-50' : ''}`}
+					>
+						{loading ? (
+							<View className="flex-row items-center justify-center">
+								<ActivityIndicator color="white" size="small" />
+								<Text className="text-primary-foreground font-semibold ml-2">Generating...</Text>
+							</View>
+						) : (
+							<Text className="text-primary-foreground text-center font-semibold text-base">
+								Generate Figure
+							</Text>
+						)}
+					</Pressable>
+				</ScrollView>
+			</KeyboardAvoidingView>
 		</SafeAreaView>
 	);
 }

apps/figgos/apps/mobile/app/(tabs)/shelf.tsx

@@ -1,15 +1,95 @@
-import { View, Text } from 'react-native';
+import { useState, useEffect, useCallback } from 'react';
+import { View, Text, FlatList, ActivityIndicator } from 'react-native';
 import { SafeAreaView } from 'react-native-safe-area-context';
+import { api } from '~/services/api';
+import type { FigureResponse, FigureRarity } from '@figgos/shared';
+
+const RARITY_STYLES: Record<FigureRarity, { bg: string; text: string }> = {
+	common: { bg: 'bg-rarity-common', text: 'text-rarity-common-foreground' },
+	rare: { bg: 'bg-rarity-rare', text: 'text-rarity-rare-foreground' },
+	epic: { bg: 'bg-rarity-epic', text: 'text-rarity-epic-foreground' },
+	legendary: { bg: 'bg-rarity-legendary', text: 'text-rarity-legendary-foreground' },
+};
+
+function RarityBadge({ rarity }: { rarity: FigureRarity }) {
+	const s = RARITY_STYLES[rarity];
+	return (
+		<View className={`${s.bg} px-2 py-0.5 rounded-full`}>
+			<Text className={`${s.text} text-[10px] font-bold uppercase`}>{rarity}</Text>
+		</View>
+	);
+}
+
+function FigureCard({ figure }: { figure: FigureResponse }) {
+	return (
+		<View className="flex-1 bg-surface rounded-xl border border-border p-3 m-1.5 items-center">
+			<View className="w-full aspect-square bg-muted rounded-lg items-center justify-center mb-2">
+				<Text className="text-3xl">🎭</Text>
+			</View>
+			<Text className="text-sm font-semibold text-foreground text-center" numberOfLines={1}>
+				{figure.name}
+			</Text>
+			<View className="mt-1">
+				<RarityBadge rarity={figure.rarity} />
+			</View>
+		</View>
+	);
+}
 
 export default function ShelfScreen() {
+	const [figures, setFigures] = useState<FigureResponse[]>([]);
+	const [loading, setLoading] = useState(true);
+	const [refreshing, setRefreshing] = useState(false);
+
+	const loadFigures = useCallback(async () => {
+		try {
+			const { figures: data } = await api.figures.list();
+			setFigures(data);
+		} catch (e) {
+			console.error('Failed to load figures:', e);
+		} finally {
+			setLoading(false);
+			setRefreshing(false);
+		}
+	}, []);
+
+	useEffect(() => {
+		loadFigures();
+	}, [loadFigures]);
+
+	const handleRefresh = () => {
+		setRefreshing(true);
+		loadFigures();
+	};
+
+	if (loading) {
+		return (
+			<SafeAreaView className="flex-1 bg-background items-center justify-center" edges={['bottom']}>
+				<ActivityIndicator size="large" color="rgb(108, 92, 231)" />
+			</SafeAreaView>
+		);
+	}
+
 	return (
 		<SafeAreaView className="flex-1 bg-background" edges={['bottom']}>
-			<View className="flex-1 items-center justify-center px-6">
-				<Text className="text-2xl font-bold text-foreground">My Collection</Text>
-				<Text className="text-muted-foreground mt-2 text-center">
-					Your collected figures will appear here.
-				</Text>
-			</View>
+			<FlatList
+				data={figures}
+				keyExtractor={(item) => item.id}
+				numColumns={2}
+				contentContainerStyle={{ padding: 12 }}
+				renderItem={({ item }) => <FigureCard figure={item} />}
+				onRefresh={handleRefresh}
+				refreshing={refreshing}
+				ListEmptyComponent={
+					<View className="flex-1 items-center justify-center pt-20">
+						<Text className="text-4xl mb-4">📦</Text>
+						<Text className="text-lg font-semibold text-foreground">No figures yet</Text>
+						<Text className="text-muted-foreground mt-1 text-center">
+							Head to the Create tab to generate your first figure!
+						</Text>
+					</View>
+				}
+			/>
 		</SafeAreaView>
 	);
 }

apps/figgos/apps/mobile/app/_layout.tsx

@@ -1,47 +1,14 @@
 import '../global.css';
 
-import { Stack, useRouter, useSegments } from 'expo-router';
+import { Stack } from 'expo-router';
 import { GestureHandlerRootView } from 'react-native-gesture-handler';
-import { AuthProvider, useAuth } from '~/contexts/AuthContext';
-import { useEffect } from 'react';
 
-function AuthGuard({ children }: { children: React.ReactNode }) {
-	const { user, loading } = useAuth();
-	const segments = useSegments();
-	const router = useRouter();
-
-	useEffect(() => {
-		if (loading) return;
-
-		const inAuthGroup = segments[0] === '(auth)';
-
-		if (!user && !inAuthGroup) {
-			router.replace('/(auth)/login');
-		} else if (user && inAuthGroup) {
-			router.replace('/(tabs)');
-		}
-	}, [user, loading, segments]);
-
-	return <>{children}</>;
-}
-
-function Layout() {
+export default function RootLayout() {
 	return (
 		<GestureHandlerRootView style={{ flex: 1 }}>
 			<Stack>
 				<Stack.Screen name="(tabs)" options={{ headerShown: false }} />
-				<Stack.Screen name="(auth)" options={{ headerShown: false }} />
 			</Stack>
 		</GestureHandlerRootView>
 	);
 }
-
-export default function RootLayout() {
-	return (
-		<AuthProvider>
-			<AuthGuard>
-				<Layout />
-			</AuthGuard>
-		</AuthProvider>
-	);
-}

apps/figgos/apps/mobile/babel.config.js

@@ -1,12 +1,10 @@
 module.exports = function (api) {
 	api.cache(true);
-	const plugins = [];
-
-	plugins.push('react-native-reanimated/plugin');
-
 	return {
-		presets: [['babel-preset-expo', { jsxImportSource: 'nativewind' }], 'nativewind/babel'],
-
-		plugins,
+		presets: [
+			['babel-preset-expo', { jsxImportSource: 'nativewind', worklets: false }],
+			'nativewind/babel',
+		],
+		plugins: ['react-native-reanimated/plugin'],
 	};
 };

apps/figgos/apps/mobile/eas.json

@@ -1,18 +0,0 @@
-{
-	"cli": {
-		"version": ">= 5.0.0"
-	},
-	"build": {
-		"development": {
-			"developmentClient": true,
-			"distribution": "internal"
-		},
-		"preview": {
-			"distribution": "internal"
-		},
-		"production": {}
-	},
-	"submit": {
-		"production": {}
-	}
-}

apps/figgos/apps/mobile/metro.config.js

@@ -1,9 +1,6 @@
-// Learn more https://docs.expo.io/guides/customizing-metro
 const { getDefaultConfig } = require('expo/metro-config');
 const { withNativeWind } = require('nativewind/metro');
 
-/** @type {import('expo/metro-config').MetroConfig} */
-// eslint-disable-next-line no-undef
 const config = getDefaultConfig(__dirname);
 
 module.exports = withNativeWind(config, { input: './global.css' });

apps/figgos/apps/mobile/package.json

@@ -2,59 +2,48 @@
 	"name": "@figgos/mobile",
 	"version": "1.0.0",
 	"main": "expo-router/entry",
-	"type": "commonjs",
+	"private": true,
 	"scripts": {
-		"dev": "expo start --dev-client",
-		"start": "expo start --dev-client",
+		"dev": "expo start",
+		"dev:client": "expo start --dev-client",
+		"start": "expo start",
 		"ios": "expo run:ios",
 		"android": "expo run:android",
 		"build:dev": "eas build --profile development",
 		"build:preview": "eas build --profile preview",
 		"build:prod": "eas build --profile production",
-		"prebuild": "expo prebuild",
-		"lint": "eslint .",
-		"format": "eslint . --fix"
+		"prebuild": "expo prebuild"
 	},
 	"dependencies": {
-		"@expo/vector-icons": "^14.0.0",
+		"@expo/vector-icons": "^15.0.3",
+		"@figgos/shared": "workspace:*",
 		"@manacore/shared-auth": "workspace:*",
-		"@react-native-async-storage/async-storage": "1.23.1",
-		"@react-navigation/bottom-tabs": "^7.0.5",
-		"@react-navigation/native": "^7.0.3",
-		"expo": "^52.0.39",
-		"expo-constants": "~17.0.8",
-		"expo-dev-client": "~5.0.4",
-		"expo-dev-launcher": "^5.0.17",
-		"expo-linking": "~7.0.5",
-		"expo-router": "~4.0.6",
-		"expo-secure-store": "~14.0.1",
-		"expo-status-bar": "~2.0.1",
-		"expo-system-ui": "~4.0.8",
-		"expo-web-browser": "~14.0.2",
-		"nativewind": "latest",
-		"react": "18.3.1",
-		"react-dom": "18.3.1",
-		"react-native": "0.76.7",
-		"react-native-gesture-handler": "~2.20.2",
-		"react-native-reanimated": "3.16.2",
-		"react-native-safe-area-context": "4.12.0",
-		"react-native-screens": "~4.4.0",
-		"react-native-web": "~0.19.10"
+		"@react-navigation/native": "^7.1.8",
+		"expo": "~54.0.33",
+		"expo-constants": "~18.0.13",
+		"expo-font": "~14.0.11",
+		"expo-linking": "~8.0.11",
+		"expo-router": "~6.0.23",
+		"expo-secure-store": "~15.0.8",
+		"expo-splash-screen": "~31.0.13",
+		"expo-status-bar": "~3.0.9",
+		"expo-web-browser": "~15.0.10",
+		"nativewind": "^4.2.1",
+		"react": "19.1.0",
+		"react-dom": "19.1.0",
+		"react-native": "0.81.5",
+		"react-native-css-interop": "0.2.1",
+		"react-native-gesture-handler": "~2.28.0",
+		"react-native-reanimated": "~3.16.0",
+		"react-native-safe-area-context": "~5.6.0",
+		"react-native-screens": "~4.16.0",
+		"react-native-web": "~0.21.0",
+		"@react-native-async-storage/async-storage": "2.2.0"
 	},
 	"devDependencies": {
 		"@babel/core": "^7.20.0",
-		"@types/react": "~18.3.12",
-		"dotenv": "^16.4.7",
-		"eslint": "^9.39.1",
-		"eslint-config-universe": "^12.0.1",
-		"prettier": "^3.2.5",
-		"prettier-plugin-tailwindcss": "^0.5.11",
+		"@types/react": "~19.1.0",
 		"tailwindcss": "^3.4.0",
-		"typescript": "~5.3.3"
-	},
-	"eslintConfig": {
-		"extends": "universe/native",
-		"root": true
-	},
-	"private": true
+		"typescript": "~5.9.2"
+	}
 }

apps/figgos/apps/mobile/services/api.ts

@@ -1,4 +1,5 @@
 import { authService } from '~/contexts/AuthContext';
+import type { FigureResponse } from '@figgos/shared';
 
 const BACKEND_URL = process.env.EXPO_PUBLIC_BACKEND_URL || 'http://localhost:3025';
 
@@ -23,4 +24,19 @@ export async function fetchApi<T = any>(path: string, options?: RequestInit): Pr
 
 export const api = {
 	health: () => fetchApi('/health'),
+
+	figures: {
+		create: (name: string, description: string) =>
+			fetchApi<{ figure: FigureResponse }>('/api/v1/figures', {
+				method: 'POST',
+				body: JSON.stringify({ name, description }),
+			}),
+
+		list: () => fetchApi<{ figures: FigureResponse[] }>('/api/v1/figures'),
+
+		get: (id: string) => fetchApi<{ figure: FigureResponse }>(`/api/v1/figures/${id}`),
+
+		delete: (id: string) =>
+			fetchApi<{ success: boolean }>(`/api/v1/figures/${id}`, { method: 'DELETE' }),
+	},
 };

apps/figgos/apps/mobile/tsconfig.json

@@ -2,10 +2,8 @@
 	"extends": "expo/tsconfig.base",
 	"compilerOptions": {
 		"strict": true,
-		"jsx": "react-jsx",
-		"baseUrl": ".",
 		"paths": {
-			"~/*": ["*"]
+			"~/*": ["./*"]
 		}
 	},
 	"include": ["**/*.ts", "**/*.tsx", ".expo/types/**/*.ts", "expo-env.d.ts", "nativewind-env.d.ts"]

apps/figgos/packages/shared/package.json

@@ -2,6 +2,7 @@
 	"name": "@figgos/shared",
 	"version": "1.0.0",
 	"private": true,
+	"type": "module",
 	"main": "./src/index.ts",
 	"types": "./src/index.ts",
 	"exports": {

apps/figgos/packages/shared/src/index.ts

@@ -1,3 +1,25 @@
-// @figgos/shared - Shared types and constants
-// Will be populated as features are added
-export {};
+export type FigureRarity = 'common' | 'rare' | 'epic' | 'legendary';
+
+export const RARITY_WEIGHTS: Record<FigureRarity, number> = {
+	common: 60,
+	rare: 25,
+	epic: 12,
+	legendary: 3,
+};
+
+export interface FigureUserInput {
+	description: string;
+}
+
+export interface FigureResponse {
+	id: string;
+	userId: string;
+	name: string;
+	userInput: FigureUserInput;
+	imageUrl: string | null;
+	rarity: FigureRarity;
+	isPublic: boolean;
+	isArchived: boolean;
+	createdAt: string;
+	updatedAt: string;
+}

apps/figgos/packages/shared/tsconfig.json

@@ -1,15 +1,16 @@
 {
 	"compilerOptions": {
-		"target": "ES2021",
-		"module": "commonjs",
-		"declaration": true,
+		"target": "ES2022",
+		"module": "ESNext",
+		"moduleResolution": "bundler",
 		"strict": true,
 		"esModuleInterop": true,
 		"skipLibCheck": true,
 		"forceConsistentCasingInFileNames": true,
-		"outDir": "./dist",
-		"rootDir": "./src"
+		"declaration": true,
+		"declarationMap": true,
+		"noEmit": true
 	},
 	"include": ["src/**/*"],
-	"exclude": ["node_modules", "dist"]
+	"exclude": ["node_modules"]
 }