21961208242

Committed 12 Feb 2026 07:29PM UTC coverage: 51.569% (-13.4%) from 64.947%

Build # 21961208242

Build Type

push

github

Committed by

web-flow

Commit Message

feat: complete Expo → Capacitor/Vite migration (#130)

## Summary

Full framework migration from Expo/React Native to Vite + Capacitor + React Router:

- **Framework**: Expo SDK 52 → Vite 6 + Capacitor 7
- **Routing**: expo-router → react-router-dom v7
- **Styling**: NativeWind → Tailwind CSS v4
- **Testing**: Jest → Vitest + @testing-library/react
- **Components**: React Native primitives → HTML/JSX (View→div, Text→span, etc.)
- **Build**: Metro bundler → Vite with HMR

### Key changes
- Removed all React Native and Expo dependencies
- Migrated 50+ components from RN to web HTML/JSX
- Rewrote 70 test files (844 tests passing)
- Replaced deploy-gh-pages.yml: Astro docs → Vite static site deployment
- Added android-release.yml: per-architecture debug APKs on GitHub releases
- Added ABI splits to build.gradle (armeabi-v7a, arm64-v8a, x86_64, universal)
- Fixed all biome lint, TypeScript, and E2E test issues
- Deleted dead `app/` directory (old Expo Router screens)

### CI Status
All critical checks passing: Lint & Type Check, Run Tests (844 passing), Build Web, Build Web + Capacitor Sync, E2E Tests (Web), Security Scan, CodeQL, Validate PR.

Run Details

1329 of 2944 branches covered (45.14%)

Branch coverage included in aggregate %.

138 of 866 new or added lines in 82 files covered. (15.94%)

120 existing lines in 23 files now uncovered.

2188 of 3876 relevant lines covered (56.45%)

9.8 hits per line

Source File
Press 'n' to go to next uncovered line, 'b' for previous

0.0

/src/hooks/useAppRouter.ts

/**
 * useAppRouter Hook
 *
 * Wraps React Router's navigation hooks to provide an API similar to
 * expo-router's useRouter/useLocalSearchParams, easing the migration.
 */

import { useCallback } from 'react';
import { useLocation, useNavigate, useParams } from 'react-router-dom';

/**
 * Navigation hook that mirrors expo-router's useRouter API.
 *
 * Usage:
 *   const router = useAppRouter();
 *   router.push('/projects');
 *   router.replace('/welcome');
 *   router.back();
 */
export function useAppRouter() {
  const navigate = useNavigate();

  const push = useCallback(
    (path: string) => {
      navigate(path);
    },
    [navigate]
  );

  const replace = useCallback(
    (path: string) => {
      navigate(path, { replace: true });
    },
    [navigate]
  );

  const back = useCallback(() => {
    navigate(-1);
  }, [navigate]);

  return { push, replace, back, navigate };
}

/**
 * Typed params hook matching expo-router's useLocalSearchParams pattern.
 *
 * Usage:
 *   const { id } = useRouteParams<{ id: string }>();
 */
export function useRouteParams<
  T extends Record<string, string | undefined> = Record<string, string | undefined>,
>(): T {
  return useParams() as T;
}

/**
 * Returns current pathname segments (like expo-router's useSegments).
 *
 * Usage:
 *   const segments = useRouteSegments();
 *   // pathname "/onboarding/welcome" → ["onboarding", "welcome"]
 */
export function useRouteSegments(): string[] {
  const location = useLocation();
  return location.pathname.split('/').filter(Boolean);
}

1	/**
2	* useAppRouter Hook
3	*
4	* Wraps React Router's navigation hooks to provide an API similar to
5	* expo-router's useRouter/useLocalSearchParams, easing the migration.
6	*/
7
8	import { useCallback } from 'react';
9	import { useLocation, useNavigate, useParams } from 'react-router-dom';
10
11	/**
12	* Navigation hook that mirrors expo-router's useRouter API.
13	*
14	* Usage:
15	* const router = useAppRouter();
16	* router.push('/projects');
17	* router.replace('/welcome');
18	* router.back();
19	*/
20	export function useAppRouter() {
NEW 21	const navigate = useNavigate();	×
22
NEW 23	const push = useCallback(	×
24	(path: string) => {
NEW 25	navigate(path);	×
26	},
27	[navigate]
28	);
29
NEW 30	const replace = useCallback(	×
31	(path: string) => {
NEW 32	navigate(path, { replace: true });	×
33	},
34	[navigate]
35	);
36
NEW 37	const back = useCallback(() => {	×
NEW 38	navigate(-1);	×
39	}, [navigate]);
40
NEW 41	return { push, replace, back, navigate };	×
42	}
43
44	/**
45	* Typed params hook matching expo-router's useLocalSearchParams pattern.
46	*
47	* Usage:
48	* const { id } = useRouteParams<{ id: string }>();
49	*/
50	export function useRouteParams<
51	T extends Record<string, string \| undefined> = Record<string, string \| undefined>,
52	>(): T {
NEW 53	return useParams() as T;	×
54	}
55
56	/**
57	* Returns current pathname segments (like expo-router's useSegments).
58	*
59	* Usage:
60	* const segments = useRouteSegments();
61	* // pathname "/onboarding/welcome" → ["onboarding", "welcome"]
62	*/
63	export function useRouteSegments(): string[] {
NEW 64	const location = useLocation();	×
NEW 65	return location.pathname.split('/').filter(Boolean);	×
66	}

agentic-dev-library / thumbcode / 21961208242

Source File Press 'n' to go to next uncovered line, 'b' for previous

Source File
Press 'n' to go to next uncovered line, 'b' for previous