feat: add Expo React Native client scaffold

- Expo SDK 54 / React Native 0.81 with expo-router
- Tailscale devcontainer feature for direct device connectivity
- Dev proxy for React Native DevTools access over Tailscale
- EAS build configuration for development/preview/production
- Ona automation for Expo dev server

Co-authored-by: Ona <no-reply@ona.com>

.devcontainer/devcontainer.json

@@ -11,12 +11,12 @@
 		"dockerfile": "Dockerfile"
 	},
 	"postCreateCommand": "bun install",
-	"postStartCommand": "./scripts/setup-git.sh && ./scripts/setup-nvim.sh"
+	"postStartCommand": "./scripts/setup-git.sh && ./scripts/setup-nvim.sh",
 	// Features add additional features to your environment. See https://containers.dev/features
 	// Beware: features are not supported on all platforms and may have unintended side-effects.
-	// "features": {
-	//   "ghcr.io/devcontainers/features/docker-in-docker": {
-	//     "moby": false
-	//   }
-	// }
+	"features": {
+		"ghcr.io/tailscale/codespace/tailscale": {
+			"version": "latest"
+		}
+	}
 }

.ona/automations.yaml

@@ -0,0 +1,8 @@
+services:
+  expo:
+    name: Expo Dev Server
+    description: Expo development server for aris-client
+    triggeredBy:
+      - postDevcontainerStart
+    commands:
+      start: cd apps/aris-client && ./scripts/run-dev-server.sh

apps/aris-backend/src/feed/service.test.ts

@@ -0,0 +1,162 @@
+import { describe, expect, mock, test } from "bun:test"
+
+import { LocationService } from "../location/service.ts"
+import { FeedEngineService } from "./service.ts"
+
+describe("FeedEngineService", () => {
+	test("engineForUser creates engine on first call", () => {
+		const locationService = new LocationService()
+		const service = new FeedEngineService([locationService])
+
+		const engine = service.engineForUser("user-1")
+
+		expect(engine).toBeDefined()
+	})
+
+	test("engineForUser returns same engine for same user", () => {
+		const locationService = new LocationService()
+		const service = new FeedEngineService([locationService])
+
+		const engine1 = service.engineForUser("user-1")
+		const engine2 = service.engineForUser("user-1")
+
+		expect(engine1).toBe(engine2)
+	})
+
+	test("engineForUser returns different engines for different users", () => {
+		const locationService = new LocationService()
+		const service = new FeedEngineService([locationService])
+
+		const engine1 = service.engineForUser("user-1")
+		const engine2 = service.engineForUser("user-2")
+
+		expect(engine1).not.toBe(engine2)
+	})
+
+	test("engineForUser registers sources from all providers", async () => {
+		const locationService = new LocationService()
+		const service = new FeedEngineService([locationService])
+
+		const engine = service.engineForUser("user-1")
+		const result = await engine.refresh()
+
+		expect(result.errors).toHaveLength(0)
+	})
+
+	test("engineForUser works with empty providers array", async () => {
+		const service = new FeedEngineService([])
+
+		const engine = service.engineForUser("user-1")
+		const result = await engine.refresh()
+
+		expect(result.errors).toHaveLength(0)
+		expect(result.items).toHaveLength(0)
+	})
+
+	test("refresh returns feed result", async () => {
+		const locationService = new LocationService()
+		const service = new FeedEngineService([locationService])
+
+		const result = await service.refresh("user-1")
+
+		expect(result).toHaveProperty("context")
+		expect(result).toHaveProperty("items")
+		expect(result).toHaveProperty("errors")
+		expect(result.context.time).toBeInstanceOf(Date)
+	})
+
+	test("refresh uses location from LocationService", async () => {
+		const locationService = new LocationService()
+		const service = new FeedEngineService([locationService])
+		const location = {
+			lat: 51.5074,
+			lng: -0.1278,
+			accuracy: 10,
+			timestamp: new Date(),
+		}
+
+		// Create engine first, then update location
+		service.engineForUser("user-1")
+		locationService.updateUserLocation("user-1", location)
+
+		const result = await service.refresh("user-1")
+
+		expect(result.context.location).toEqual(location)
+	})
+
+	test("subscribe receives updates", async () => {
+		const locationService = new LocationService()
+		const service = new FeedEngineService([locationService])
+		const callback = mock()
+
+		service.subscribe("user-1", callback)
+
+		// Push location to trigger update
+		locationService.updateUserLocation("user-1", {
+			lat: 51.5074,
+			lng: -0.1278,
+			accuracy: 10,
+			timestamp: new Date(),
+		})
+
+		// Wait for async update propagation
+		await new Promise((resolve) => setTimeout(resolve, 10))
+
+		expect(callback).toHaveBeenCalled()
+	})
+
+	test("subscribe returns unsubscribe function", async () => {
+		const locationService = new LocationService()
+		const service = new FeedEngineService([locationService])
+		const callback = mock()
+
+		const unsubscribe = service.subscribe("user-1", callback)
+
+		unsubscribe()
+
+		locationService.updateUserLocation("user-1", {
+			lat: 51.5074,
+			lng: -0.1278,
+			accuracy: 10,
+			timestamp: new Date(),
+		})
+
+		await new Promise((resolve) => setTimeout(resolve, 10))
+
+		expect(callback).not.toHaveBeenCalled()
+	})
+
+	test("removeUser stops engine and removes it", async () => {
+		const locationService = new LocationService()
+		const service = new FeedEngineService([locationService])
+		const callback = mock()
+
+		service.subscribe("user-1", callback)
+
+		service.removeUser("user-1")
+
+		// Push location - should not trigger update since engine is stopped
+		locationService.feedSourceForUser("user-1")
+		locationService.updateUserLocation("user-1", {
+			lat: 51.5074,
+			lng: -0.1278,
+			accuracy: 10,
+			timestamp: new Date(),
+		})
+
+		await new Promise((resolve) => setTimeout(resolve, 10))
+
+		expect(callback).not.toHaveBeenCalled()
+	})
+
+	test("removeUser allows new engine to be created", () => {
+		const locationService = new LocationService()
+		const service = new FeedEngineService([locationService])
+
+		const engine1 = service.engineForUser("user-1")
+		service.removeUser("user-1")
+		const engine2 = service.engineForUser("user-1")
+
+		expect(engine1).not.toBe(engine2)
+	})
+})

apps/aris-backend/src/feed/service.ts

@@ -0,0 +1,75 @@
+import { FeedEngine, type FeedResult, type FeedSource, type FeedSubscriber } from "@aris/core"
+
+/**
+ * Provides a FeedSource instance for a user.
+ */
+export interface FeedSourceProvider {
+	feedSourceForUser(userId: string): FeedSource
+}
+
+/**
+ * Manages FeedEngine instances per user.
+ *
+ * Receives FeedSource instances from injected providers and wires them
+ * into per-user engines. Engines are auto-started on creation.
+ */
+export class FeedEngineService {
+	private engines = new Map<string, FeedEngine>()
+
+	constructor(private readonly providers: FeedSourceProvider[]) {}
+
+	/**
+	 * Get or create a FeedEngine for a user.
+	 * Automatically registers sources and starts the engine.
+	 */
+	engineForUser(userId: string): FeedEngine {
+		let engine = this.engines.get(userId)
+		if (!engine) {
+			engine = this.createEngine(userId)
+			this.engines.set(userId, engine)
+		}
+		return engine
+	}
+
+	/**
+	 * Refresh a user's feed.
+	 */
+	async refresh(userId: string): Promise<FeedResult> {
+		const engine = this.engineForUser(userId)
+		return engine.refresh()
+	}
+
+	/**
+	 * Subscribe to feed updates for a user.
+	 * Returns unsubscribe function.
+	 */
+	subscribe(userId: string, callback: FeedSubscriber): () => void {
+		const engine = this.engineForUser(userId)
+		return engine.subscribe(callback)
+	}
+
+	/**
+	 * Remove a user's FeedEngine.
+	 * Stops the engine and cleans up resources.
+	 */
+	removeUser(userId: string): void {
+		const engine = this.engines.get(userId)
+		if (engine) {
+			engine.stop()
+			this.engines.delete(userId)
+		}
+	}
+
+	private createEngine(userId: string): FeedEngine {
+		const engine = new FeedEngine()
+
+		for (const provider of this.providers) {
+			const source = provider.feedSourceForUser(userId)
+			engine.register(source)
+		}
+
+		engine.start()
+
+		return engine
+	}
+}

apps/aris-backend/src/location/router.ts

@@ -1,7 +1,10 @@
+import { TRPCError } from "@trpc/server"
 import { type } from "arktype"
 
-import type { UserSessionManager } from "../session/index.ts"
 import type { TRPC } from "../trpc/router.ts"
+import type { LocationService } from "./service.ts"
+
+import { UserNotFoundError } from "../lib/error.ts"
 
 const locationInput = type({
 	lat: "number",
@@ -12,17 +15,23 @@ const locationInput = type({
 
 export function createLocationRouter(
 	t: TRPC,
-	{ sessionManager }: { sessionManager: UserSessionManager },
+	{ locationService }: { locationService: LocationService },
 ) {
 	return t.router({
-		update: t.procedure.input(locationInput).mutation(async ({ input, ctx }) => {
-			const session = sessionManager.getOrCreate(ctx.user.id)
-			await session.engine.executeAction("aris.location", "update-location", {
-				lat: input.lat,
-				lng: input.lng,
-				accuracy: input.accuracy,
-				timestamp: input.timestamp,
-			})
+		update: t.procedure.input(locationInput).mutation(({ input, ctx }) => {
+			try {
+				locationService.updateUserLocation(ctx.user.id, {
+					lat: input.lat,
+					lng: input.lng,
+					accuracy: input.accuracy,
+					timestamp: input.timestamp,
+				})
+			} catch (error) {
+				if (error instanceof UserNotFoundError) {
+					throw new TRPCError({ code: "NOT_FOUND", message: error.message })
+				}
+				throw error
+			}
 		}),
 	})
 }

apps/aris-backend/src/location/service.test.ts

@@ -0,0 +1,111 @@
+import { describe, expect, test } from "bun:test"
+
+import { UserNotFoundError } from "../lib/error.ts"
+import { LocationService } from "./service.ts"
+
+describe("LocationService", () => {
+	test("feedSourceForUser creates source on first call", () => {
+		const service = new LocationService()
+		const source = service.feedSourceForUser("user-1")
+
+		expect(source).toBeDefined()
+		expect(source.id).toBe("aris.location")
+	})
+
+	test("feedSourceForUser returns same source for same user", () => {
+		const service = new LocationService()
+		const source1 = service.feedSourceForUser("user-1")
+		const source2 = service.feedSourceForUser("user-1")
+
+		expect(source1).toBe(source2)
+	})
+
+	test("feedSourceForUser returns different sources for different users", () => {
+		const service = new LocationService()
+		const source1 = service.feedSourceForUser("user-1")
+		const source2 = service.feedSourceForUser("user-2")
+
+		expect(source1).not.toBe(source2)
+	})
+
+	test("updateUserLocation updates the source", () => {
+		const service = new LocationService()
+		const source = service.feedSourceForUser("user-1")
+		const location = {
+			lat: 51.5074,
+			lng: -0.1278,
+			accuracy: 10,
+			timestamp: new Date(),
+		}
+
+		service.updateUserLocation("user-1", location)
+
+		expect(source.lastLocation).toEqual(location)
+	})
+
+	test("updateUserLocation throws if source does not exist", () => {
+		const service = new LocationService()
+		const location = {
+			lat: 51.5074,
+			lng: -0.1278,
+			accuracy: 10,
+			timestamp: new Date(),
+		}
+
+		expect(() => service.updateUserLocation("user-1", location)).toThrow(UserNotFoundError)
+	})
+
+	test("lastUserLocation returns null for unknown user", () => {
+		const service = new LocationService()
+
+		expect(service.lastUserLocation("unknown")).toBeNull()
+	})
+
+	test("lastUserLocation returns last location", () => {
+		const service = new LocationService()
+		service.feedSourceForUser("user-1")
+		const location1 = {
+			lat: 51.5074,
+			lng: -0.1278,
+			accuracy: 10,
+			timestamp: new Date(),
+		}
+		const location2 = {
+			lat: 52.0,
+			lng: -0.2,
+			accuracy: 5,
+			timestamp: new Date(),
+		}
+
+		service.updateUserLocation("user-1", location1)
+		service.updateUserLocation("user-1", location2)
+
+		expect(service.lastUserLocation("user-1")).toEqual(location2)
+	})
+
+	test("removeUser removes the source", () => {
+		const service = new LocationService()
+		service.feedSourceForUser("user-1")
+		const location = {
+			lat: 51.5074,
+			lng: -0.1278,
+			accuracy: 10,
+			timestamp: new Date(),
+		}
+
+		service.updateUserLocation("user-1", location)
+		service.removeUser("user-1")
+
+		expect(service.lastUserLocation("user-1")).toBeNull()
+	})
+
+	test("removeUser allows new source to be created", () => {
+		const service = new LocationService()
+		const source1 = service.feedSourceForUser("user-1")
+
+		service.removeUser("user-1")
+		const source2 = service.feedSourceForUser("user-1")
+
+		expect(source1).not.toBe(source2)
+	})
+})

apps/aris-backend/src/location/service.ts

@@ -0,0 +1,57 @@
+import { LocationSource, type Location } from "@aris/source-location"
+
+import type { FeedSourceProvider } from "../feed/service.ts"
+
+import { UserNotFoundError } from "../lib/error.ts"
+
+/**
+ * Manages LocationSource instances per user.
+ */
+export class LocationService implements FeedSourceProvider {
+	private sources = new Map<string, LocationSource>()
+
+	/**
+	 * Get or create a LocationSource for a user.
+	 * @param userId - The user's unique identifier
+	 * @returns The user's LocationSource instance
+	 */
+	feedSourceForUser(userId: string): LocationSource {
+		let source = this.sources.get(userId)
+		if (!source) {
+			source = new LocationSource()
+			this.sources.set(userId, source)
+		}
+		return source
+	}
+
+	/**
+	 * Update location for a user.
+	 * @param userId - The user's unique identifier
+	 * @param location - The new location data
+	 * @throws {UserNotFoundError} If no source exists for the user
+	 */
+	updateUserLocation(userId: string, location: Location): void {
+		const source = this.sources.get(userId)
+		if (!source) {
+			throw new UserNotFoundError(userId)
+		}
+		source.pushLocation(location)
+	}
+
+	/**
+	 * Get last known location for a user.
+	 * @param userId - The user's unique identifier
+	 * @returns The last location, or null if none exists
+	 */
+	lastUserLocation(userId: string): Location | null {
+		return this.sources.get(userId)?.lastLocation ?? null
+	}
+
+	/**
+	 * Remove a user's LocationSource.
+	 * @param userId - The user's unique identifier
+	 */
+	removeUser(userId: string): void {
+		this.sources.delete(userId)
+	}
+}

apps/aris-backend/src/server.ts

@@ -1,27 +1,25 @@
-import { LocationSource } from "@aris/source-location"
 import { trpcServer } from "@hono/trpc-server"
 import { Hono } from "hono"
 
 import { registerAuthHandlers } from "./auth/http.ts"
-import { UserSessionManager } from "./session/index.ts"
-import { WeatherSourceProvider } from "./weather/provider.ts"
+import { LocationService } from "./location/service.ts"
 import { createContext } from "./trpc/context.ts"
 import { createTRPCRouter } from "./trpc/router.ts"
+import { WeatherService } from "./weather/service.ts"
 
 function main() {
-	const sessionManager = new UserSessionManager([
-		() => new LocationSource(),
-		new WeatherSourceProvider({
-			credentials: {
-				privateKey: process.env.WEATHERKIT_PRIVATE_KEY!,
-				keyId: process.env.WEATHERKIT_KEY_ID!,
-				teamId: process.env.WEATHERKIT_TEAM_ID!,
-				serviceId: process.env.WEATHERKIT_SERVICE_ID!,
-			},
-		}),
-	])
+	const locationService = new LocationService()
 
-	const trpcRouter = createTRPCRouter({ sessionManager })
+	const weatherService = new WeatherService({
+		credentials: {
+			privateKey: process.env.WEATHERKIT_PRIVATE_KEY!,
+			keyId: process.env.WEATHERKIT_KEY_ID!,
+			teamId: process.env.WEATHERKIT_TEAM_ID!,
+			serviceId: process.env.WEATHERKIT_SERVICE_ID!,
+		},
+	})
+
+	const trpcRouter = createTRPCRouter({ locationService, weatherService })
 
 	const app = new Hono()
 

apps/aris-backend/src/session/feed-source-provider.ts

@@ -1,9 +0,0 @@
-import type { FeedSource } from "@aris/core"
-
-export interface FeedSourceProvider {
-	feedSourceForUser(userId: string): FeedSource
-}
-
-export type FeedSourceProviderFn = (userId: string) => FeedSource
-
-export type FeedSourceProviderInput = FeedSourceProvider | FeedSourceProviderFn

apps/aris-backend/src/session/index.ts

@@ -1,7 +0,0 @@
-export type {
-	FeedSourceProvider,
-	FeedSourceProviderFn,
-	FeedSourceProviderInput,
-} from "./feed-source-provider.ts"
-export { UserSession } from "./user-session.ts"
-export { UserSessionManager } from "./user-session-manager.ts"

apps/aris-backend/src/session/user-session-manager.test.ts

@@ -1,166 +0,0 @@
-import { LocationSource } from "@aris/source-location"
-import { describe, expect, mock, test } from "bun:test"
-
-import { WeatherSourceProvider } from "../weather/provider.ts"
-import { UserSessionManager } from "./user-session-manager.ts"
-
-import type { WeatherKitClient, WeatherKitResponse } from "@aris/source-weatherkit"
-
-const mockWeatherClient: WeatherKitClient = {
-	fetch: async () => ({}) as WeatherKitResponse,
-}
-
-describe("UserSessionManager", () => {
-	test("getOrCreate creates session on first call", () => {
-		const manager = new UserSessionManager([() => new LocationSource()])
-
-		const session = manager.getOrCreate("user-1")
-
-		expect(session).toBeDefined()
-		expect(session.engine).toBeDefined()
-	})
-
-	test("getOrCreate returns same session for same user", () => {
-		const manager = new UserSessionManager([() => new LocationSource()])
-
-		const session1 = manager.getOrCreate("user-1")
-		const session2 = manager.getOrCreate("user-1")
-
-		expect(session1).toBe(session2)
-	})
-
-	test("getOrCreate returns different sessions for different users", () => {
-		const manager = new UserSessionManager([() => new LocationSource()])
-
-		const session1 = manager.getOrCreate("user-1")
-		const session2 = manager.getOrCreate("user-2")
-
-		expect(session1).not.toBe(session2)
-	})
-
-	test("each user gets independent source instances", () => {
-		const manager = new UserSessionManager([() => new LocationSource()])
-
-		const session1 = manager.getOrCreate("user-1")
-		const session2 = manager.getOrCreate("user-2")
-
-		const source1 = session1.getSource<LocationSource>("aris.location")
-		const source2 = session2.getSource<LocationSource>("aris.location")
-
-		expect(source1).not.toBe(source2)
-	})
-
-	test("remove destroys session and allows re-creation", () => {
-		const manager = new UserSessionManager([() => new LocationSource()])
-
-		const session1 = manager.getOrCreate("user-1")
-		manager.remove("user-1")
-		const session2 = manager.getOrCreate("user-1")
-
-		expect(session1).not.toBe(session2)
-	})
-
-	test("remove is no-op for unknown user", () => {
-		const manager = new UserSessionManager([() => new LocationSource()])
-
-		expect(() => manager.remove("unknown")).not.toThrow()
-	})
-
-	test("accepts function providers", async () => {
-		const manager = new UserSessionManager([() => new LocationSource()])
-
-		const session = manager.getOrCreate("user-1")
-		const result = await session.engine.refresh()
-
-		expect(result.errors).toHaveLength(0)
-	})
-
-	test("accepts object providers", () => {
-		const provider = new WeatherSourceProvider({ client: mockWeatherClient })
-		const manager = new UserSessionManager([() => new LocationSource(), provider])
-
-		const session = manager.getOrCreate("user-1")
-
-		expect(session.getSource("aris.weather")).toBeDefined()
-	})
-
-	test("accepts mixed providers", () => {
-		const provider = new WeatherSourceProvider({ client: mockWeatherClient })
-		const manager = new UserSessionManager([() => new LocationSource(), provider])
-
-		const session = manager.getOrCreate("user-1")
-
-		expect(session.getSource("aris.location")).toBeDefined()
-		expect(session.getSource("aris.weather")).toBeDefined()
-	})
-
-	test("refresh returns feed result through session", async () => {
-		const manager = new UserSessionManager([() => new LocationSource()])
-
-		const session = manager.getOrCreate("user-1")
-		const result = await session.engine.refresh()
-
-		expect(result).toHaveProperty("context")
-		expect(result).toHaveProperty("items")
-		expect(result).toHaveProperty("errors")
-		expect(result.context.time).toBeInstanceOf(Date)
-	})
-
-	test("location update via executeAction works", async () => {
-		const manager = new UserSessionManager([() => new LocationSource()])
-
-		const session = manager.getOrCreate("user-1")
-		await session.engine.executeAction("aris.location", "update-location", {
-			lat: 51.5074,
-			lng: -0.1278,
-			accuracy: 10,
-			timestamp: new Date(),
-		})
-
-		const source = session.getSource<LocationSource>("aris.location")
-		expect(source?.lastLocation?.lat).toBe(51.5074)
-	})
-
-	test("subscribe receives updates after location push", async () => {
-		const manager = new UserSessionManager([() => new LocationSource()])
-		const callback = mock()
-
-		const session = manager.getOrCreate("user-1")
-		session.engine.subscribe(callback)
-
-		await session.engine.executeAction("aris.location", "update-location", {
-			lat: 51.5074,
-			lng: -0.1278,
-			accuracy: 10,
-			timestamp: new Date(),
-		})
-
-		// Wait for async update propagation
-		await new Promise((resolve) => setTimeout(resolve, 10))
-
-		expect(callback).toHaveBeenCalled()
-	})
-
-	test("remove stops reactive updates", async () => {
-		const manager = new UserSessionManager([() => new LocationSource()])
-		const callback = mock()
-
-		const session = manager.getOrCreate("user-1")
-		session.engine.subscribe(callback)
-
-		manager.remove("user-1")
-
-		// Create new session and push location — old callback should not fire
-		const session2 = manager.getOrCreate("user-1")
-		await session2.engine.executeAction("aris.location", "update-location", {
-			lat: 51.5074,
-			lng: -0.1278,
-			accuracy: 10,
-			timestamp: new Date(),
-		})
-
-		await new Promise((resolve) => setTimeout(resolve, 10))
-
-		expect(callback).not.toHaveBeenCalled()
-	})
-})

apps/aris-backend/src/session/user-session-manager.ts

@@ -1,31 +0,0 @@
-import type { FeedSourceProviderInput } from "./feed-source-provider.ts"
-import { UserSession } from "./user-session.ts"
-
-export class UserSessionManager {
-	private sessions = new Map<string, UserSession>()
-	private readonly providers: FeedSourceProviderInput[]
-
-	constructor(providers: FeedSourceProviderInput[]) {
-		this.providers = providers
-	}
-
-	getOrCreate(userId: string): UserSession {
-		let session = this.sessions.get(userId)
-		if (!session) {
-			const sources = this.providers.map((p) =>
-				typeof p === "function" ? p(userId) : p.feedSourceForUser(userId),
-			)
-			session = new UserSession(sources)
-			this.sessions.set(userId, session)
-		}
-		return session
-	}
-
-	remove(userId: string): void {
-		const session = this.sessions.get(userId)
-		if (session) {
-			session.destroy()
-			this.sessions.delete(userId)
-		}
-	}
-}

apps/aris-backend/src/session/user-session.test.ts

@@ -1,72 +0,0 @@
-import type { ActionDefinition, Context, FeedSource } from "@aris/core"
-
-import { LocationSource } from "@aris/source-location"
-import { describe, expect, test } from "bun:test"
-
-import { UserSession } from "./user-session.ts"
-
-function createStubSource(id: string): FeedSource {
-	return {
-		id,
-		async listActions(): Promise<Record<string, ActionDefinition>> {
-			return {}
-		},
-		async executeAction(): Promise<unknown> {
-			return undefined
-		},
-		async fetchContext(): Promise<Partial<Context> | null> {
-			return null
-		},
-		async fetchItems() {
-			return []
-		},
-	}
-}
-
-describe("UserSession", () => {
-	test("registers sources and starts engine", async () => {
-		const session = new UserSession([createStubSource("test-a"), createStubSource("test-b")])
-
-		const result = await session.engine.refresh()
-
-		expect(result.errors).toHaveLength(0)
-	})
-
-	test("getSource returns registered source", () => {
-		const location = new LocationSource()
-		const session = new UserSession([location])
-
-		const result = session.getSource<LocationSource>("aris.location")
-
-		expect(result).toBe(location)
-	})
-
-	test("getSource returns undefined for unknown source", () => {
-		const session = new UserSession([createStubSource("test")])
-
-		expect(session.getSource("unknown")).toBeUndefined()
-	})
-
-	test("destroy stops engine and clears sources", () => {
-		const session = new UserSession([createStubSource("test")])
-
-		session.destroy()
-
-		expect(session.getSource("test")).toBeUndefined()
-	})
-
-	test("engine.executeAction routes to correct source", async () => {
-		const location = new LocationSource()
-		const session = new UserSession([location])
-
-		await session.engine.executeAction("aris.location", "update-location", {
-			lat: 51.5,
-			lng: -0.1,
-			accuracy: 10,
-			timestamp: new Date(),
-		})
-
-		expect(location.lastLocation).toBeDefined()
-		expect(location.lastLocation!.lat).toBe(51.5)
-	})
-})

apps/aris-backend/src/session/user-session.ts

@@ -1,24 +0,0 @@
-import { FeedEngine, type FeedSource } from "@aris/core"
-
-export class UserSession {
-	readonly engine: FeedEngine
-	private sources = new Map<string, FeedSource>()
-
-	constructor(sources: FeedSource[]) {
-		this.engine = new FeedEngine()
-		for (const source of sources) {
-			this.sources.set(source.id, source)
-			this.engine.register(source)
-		}
-		this.engine.start()
-	}
-
-	getSource<T extends FeedSource>(sourceId: string): T | undefined {
-		return this.sources.get(sourceId) as T | undefined
-	}
-
-	destroy(): void {
-		this.engine.stop()
-		this.sources.clear()
-	}
-}

apps/aris-backend/src/tfl/provider.ts

@@ -1,19 +0,0 @@
-import { TflSource, type ITflApi } from "@aris/source-tfl"
-
-import type { FeedSourceProvider } from "../session/feed-source-provider.ts"
-
-export type TflSourceProviderOptions =
-	| { apiKey: string; client?: never }
-	| { apiKey?: never; client: ITflApi }
-
-export class TflSourceProvider implements FeedSourceProvider {
-	private readonly options: TflSourceProviderOptions
-
-	constructor(options: TflSourceProviderOptions) {
-		this.options = options
-	}
-
-	feedSourceForUser(_userId: string): TflSource {
-		return new TflSource(this.options)
-	}
-}

apps/aris-backend/src/tfl/service.test.ts

@@ -0,0 +1,206 @@
+import type { Context } from "@aris/core"
+import type { ITflApi, StationLocation, TflLineId, TflLineStatus } from "@aris/source-tfl"
+
+import { describe, expect, test } from "bun:test"
+
+import { UserNotFoundError } from "../lib/error.ts"
+import { TflService } from "./service.ts"
+
+class StubTflApi implements ITflApi {
+	private statuses: TflLineStatus[]
+
+	constructor(statuses: TflLineStatus[] = []) {
+		this.statuses = statuses
+	}
+
+	async fetchLineStatuses(lines?: TflLineId[]): Promise<TflLineStatus[]> {
+		if (lines) {
+			return this.statuses.filter((s) => lines.includes(s.lineId))
+		}
+		return this.statuses
+	}
+
+	async fetchStations(): Promise<StationLocation[]> {
+		return [
+			{
+				id: "940GZZLUKSX",
+				name: "King's Cross",
+				lat: 51.5308,
+				lng: -0.1238,
+				lines: ["northern", "victoria"],
+			},
+		]
+	}
+}
+
+function createContext(): Context {
+	return { time: new Date("2026-01-15T12:00:00Z") }
+}
+
+const sampleStatuses: TflLineStatus[] = [
+	{
+		lineId: "northern",
+		lineName: "Northern",
+		severity: "minor-delays",
+		description: "Minor delays on the Northern line",
+	},
+	{
+		lineId: "victoria",
+		lineName: "Victoria",
+		severity: "major-delays",
+		description: "Severe delays on the Victoria line",
+	},
+	{
+		lineId: "central",
+		lineName: "Central",
+		severity: "closure",
+		description: "Central line suspended",
+	},
+]
+
+describe("TflService", () => {
+	test("feedSourceForUser creates source on first call", () => {
+		const service = new TflService(new StubTflApi())
+		const source = service.feedSourceForUser("user-1")
+
+		expect(source).toBeDefined()
+		expect(source.id).toBe("aris.tfl")
+	})
+
+	test("feedSourceForUser returns same source for same user", () => {
+		const service = new TflService(new StubTflApi())
+		const source1 = service.feedSourceForUser("user-1")
+		const source2 = service.feedSourceForUser("user-1")
+
+		expect(source1).toBe(source2)
+	})
+
+	test("feedSourceForUser returns different sources for different users", () => {
+		const service = new TflService(new StubTflApi())
+		const source1 = service.feedSourceForUser("user-1")
+		const source2 = service.feedSourceForUser("user-2")
+
+		expect(source1).not.toBe(source2)
+	})
+
+	test("updateLinesOfInterest mutates the existing source in place", () => {
+		const service = new TflService(new StubTflApi())
+		const original = service.feedSourceForUser("user-1")
+
+		service.updateLinesOfInterest("user-1", ["northern", "victoria"])
+		const after = service.feedSourceForUser("user-1")
+
+		expect(after).toBe(original)
+	})
+
+	test("updateLinesOfInterest throws if source does not exist", () => {
+		const service = new TflService(new StubTflApi())
+
+		expect(() => service.updateLinesOfInterest("user-1", ["northern"])).toThrow(UserNotFoundError)
+	})
+
+	test("removeUser removes the source", () => {
+		const service = new TflService(new StubTflApi())
+		const source1 = service.feedSourceForUser("user-1")
+
+		service.removeUser("user-1")
+		const source2 = service.feedSourceForUser("user-1")
+
+		expect(source1).not.toBe(source2)
+	})
+
+	test("removeUser clears line configuration", async () => {
+		const api = new StubTflApi(sampleStatuses)
+		const service = new TflService(api)
+		service.feedSourceForUser("user-1")
+		service.updateLinesOfInterest("user-1", ["northern"])
+
+		service.removeUser("user-1")
+		const items = await service.feedSourceForUser("user-1").fetchItems(createContext())
+
+		expect(items.length).toBe(3)
+	})
+
+	test("shares single api instance across users", () => {
+		const api = new StubTflApi()
+		const service = new TflService(api)
+
+		service.feedSourceForUser("user-1")
+		service.feedSourceForUser("user-2")
+
+		expect(service.feedSourceForUser("user-1").id).toBe("aris.tfl")
+		expect(service.feedSourceForUser("user-2").id).toBe("aris.tfl")
+	})
+
+	describe("returned source fetches items", () => {
+		test("source returns feed items from api", async () => {
+			const api = new StubTflApi(sampleStatuses)
+			const service = new TflService(api)
+			const source = service.feedSourceForUser("user-1")
+
+			const items = await source.fetchItems(createContext())
+
+			expect(items.length).toBe(3)
+			for (const item of items) {
+				expect(item.type).toBe("tfl-alert")
+				expect(item.id).toMatch(/^tfl-alert-/)
+				expect(typeof item.priority).toBe("number")
+				expect(item.timestamp).toBeInstanceOf(Date)
+			}
+		})
+
+		test("source returns items sorted by priority descending", async () => {
+			const api = new StubTflApi(sampleStatuses)
+			const service = new TflService(api)
+			const source = service.feedSourceForUser("user-1")
+
+			const items = await source.fetchItems(createContext())
+
+			for (let i = 1; i < items.length; i++) {
+				expect(items[i - 1]!.priority).toBeGreaterThanOrEqual(items[i]!.priority)
+			}
+		})
+
+		test("source returns empty array when no disruptions", async () => {
+			const api = new StubTflApi([])
+			const service = new TflService(api)
+			const source = service.feedSourceForUser("user-1")
+
+			const items = await source.fetchItems(createContext())
+
+			expect(items).toEqual([])
+		})
+
+		test("updateLinesOfInterest filters items to configured lines", async () => {
+			const api = new StubTflApi(sampleStatuses)
+			const service = new TflService(api)
+
+			const before = await service.feedSourceForUser("user-1").fetchItems(createContext())
+			expect(before.length).toBe(3)
+
+			service.updateLinesOfInterest("user-1", ["northern"])
+			const after = await service.feedSourceForUser("user-1").fetchItems(createContext())
+
+			expect(after.length).toBe(1)
+			expect(after[0]!.data.line).toBe("northern")
+		})
+
+		test("different users get independent line configs", async () => {
+			const api = new StubTflApi(sampleStatuses)
+			const service = new TflService(api)
+			service.feedSourceForUser("user-1")
+			service.feedSourceForUser("user-2")
+
+			service.updateLinesOfInterest("user-1", ["northern"])
+			service.updateLinesOfInterest("user-2", ["central"])
+
+			const items1 = await service.feedSourceForUser("user-1").fetchItems(createContext())
+			const items2 = await service.feedSourceForUser("user-2").fetchItems(createContext())
+
+			expect(items1.length).toBe(1)
+			expect(items1[0]!.data.line).toBe("northern")
+			expect(items2.length).toBe(1)
+			expect(items2[0]!.data.line).toBe("central")
+		})
+	})
+})

apps/aris-backend/src/tfl/service.ts

@@ -0,0 +1,40 @@
+import { TflSource, type ITflApi, type TflLineId } from "@aris/source-tfl"
+
+import type { FeedSourceProvider } from "../feed/service.ts"
+
+import { UserNotFoundError } from "../lib/error.ts"
+
+/**
+ * Manages per-user TflSource instances with individual line configuration.
+ */
+export class TflService implements FeedSourceProvider {
+	private sources = new Map<string, TflSource>()
+
+	constructor(private readonly api: ITflApi) {}
+
+	feedSourceForUser(userId: string): TflSource {
+		let source = this.sources.get(userId)
+		if (!source) {
+			source = new TflSource({ client: this.api })
+			this.sources.set(userId, source)
+		}
+		return source
+	}
+
+	/**
+	 * Update monitored lines for a user. Mutates the existing TflSource
+	 * so that references held by FeedEngine remain valid.
+	 * @throws {UserNotFoundError} If no source exists for the user
+	 */
+	updateLinesOfInterest(userId: string, lines: TflLineId[]): void {
+		const source = this.sources.get(userId)
+		if (!source) {
+			throw new UserNotFoundError(userId)
+		}
+		source.setLinesOfInterest(lines)
+	}
+
+	removeUser(userId: string): void {
+		this.sources.delete(userId)
+	}
+}

apps/aris-backend/src/trpc/router.ts

@@ -1,26 +1,16 @@
 import { initTRPC, TRPCError } from "@trpc/server"
 
-import type { UserSessionManager } from "../session/index.ts"
+import type { LocationService } from "../location/service.ts"
+import type { WeatherService } from "../weather/service.ts"
 import type { Context } from "./context.ts"
 
 import { createLocationRouter } from "../location/router.ts"
 
-export type TRPC = ReturnType<typeof createTRPC>
-
-export interface TRPCRouterDeps {
-	sessionManager: UserSessionManager
+interface AuthedContext {
+	user: NonNullable<Context["user"]>
+	session: NonNullable<Context["session"]>
 }
 
-export function createTRPCRouter({ sessionManager }: TRPCRouterDeps) {
-	const t = createTRPC()
-
-	return t.router({
-		location: createLocationRouter(t, { sessionManager }),
-	})
-}
-
-export type TRPCRouter = ReturnType<typeof createTRPCRouter>
-
 function createTRPC() {
 	const t = initTRPC.context<Context>().create()
 
@@ -42,3 +32,19 @@ function createTRPC() {
 	}
 }
 
+export type TRPC = ReturnType<typeof createTRPC>
+
+export interface TRPCRouterDeps {
+	locationService: LocationService
+	weatherService: WeatherService
+}
+
+export function createTRPCRouter({ locationService }: TRPCRouterDeps) {
+	const t = createTRPC()
+
+	return t.router({
+		location: createLocationRouter(t, { locationService }),
+	})
+}
+
+export type TRPCRouter = ReturnType<typeof createTRPCRouter>

apps/aris-backend/src/weather/provider.ts

@@ -1,15 +0,0 @@
-import { WeatherSource, type WeatherSourceOptions } from "@aris/source-weatherkit"
-
-import type { FeedSourceProvider } from "../session/feed-source-provider.ts"
-
-export class WeatherSourceProvider implements FeedSourceProvider {
-	private readonly options: WeatherSourceOptions
-
-	constructor(options: WeatherSourceOptions) {
-		this.options = options
-	}
-
-	feedSourceForUser(_userId: string): WeatherSource {
-		return new WeatherSource(this.options)
-	}
-}

apps/aris-backend/src/weather/service.test.ts

@@ -0,0 +1,116 @@
+import type { Context } from "@aris/core"
+
+import { LocationKey } from "@aris/source-location"
+import {
+	Units,
+	WeatherFeedItemType,
+	type WeatherKitClient,
+	type WeatherKitResponse,
+} from "@aris/source-weatherkit"
+import { describe, expect, test } from "bun:test"
+
+import fixture from "../../../../packages/aris-source-weatherkit/fixtures/san-francisco.json"
+import { WeatherService } from "./service.ts"
+
+const mockClient = createMockClient(fixture.response as WeatherKitResponse)
+
+function createMockClient(response: WeatherKitResponse): WeatherKitClient {
+	return {
+		fetch: async () => response,
+	}
+}
+
+function createMockContext(location?: { lat: number; lng: number }): Context {
+	const ctx: Context = { time: new Date("2026-01-17T00:00:00Z") }
+	if (location) {
+		ctx[LocationKey] = { ...location, accuracy: 10, timestamp: new Date() }
+	}
+	return ctx
+}
+
+describe("WeatherService", () => {
+	test("feedSourceForUser creates source on first call", () => {
+		const service = new WeatherService({ client: mockClient })
+		const source = service.feedSourceForUser("user-1")
+
+		expect(source).toBeDefined()
+		expect(source.id).toBe("aris.weather")
+	})
+
+	test("feedSourceForUser returns same source for same user", () => {
+		const service = new WeatherService({ client: mockClient })
+		const source1 = service.feedSourceForUser("user-1")
+		const source2 = service.feedSourceForUser("user-1")
+
+		expect(source1).toBe(source2)
+	})
+
+	test("feedSourceForUser returns different sources for different users", () => {
+		const service = new WeatherService({ client: mockClient })
+		const source1 = service.feedSourceForUser("user-1")
+		const source2 = service.feedSourceForUser("user-2")
+
+		expect(source1).not.toBe(source2)
+	})
+
+	test("feedSourceForUser applies hourly and daily limits", async () => {
+		const service = new WeatherService({
+			client: mockClient,
+			hourlyLimit: 3,
+			dailyLimit: 2,
+		})
+		const source = service.feedSourceForUser("user-1")
+		const context = createMockContext({ lat: 37.7749, lng: -122.4194 })
+
+		const items = await source.fetchItems(context)
+
+		const hourly = items.filter((i) => i.type === WeatherFeedItemType.hourly)
+		const daily = items.filter((i) => i.type === WeatherFeedItemType.daily)
+
+		expect(hourly).toHaveLength(3)
+		expect(daily).toHaveLength(2)
+	})
+
+	test("feedSourceForUser applies units", async () => {
+		const service = new WeatherService({
+			client: mockClient,
+			units: Units.imperial,
+		})
+		const source = service.feedSourceForUser("user-1")
+		const context = createMockContext({ lat: 37.7749, lng: -122.4194 })
+
+		const items = await source.fetchItems(context)
+		const current = items.find((i) => i.type === WeatherFeedItemType.current)
+
+		expect(current).toBeDefined()
+		// Fixture has ~15.87°C, imperial should be ~60.6°F
+		expect(current!.data.temperature).toBeGreaterThan(50)
+	})
+
+	test("removeUser removes the source", () => {
+		const service = new WeatherService({ client: mockClient })
+		service.feedSourceForUser("user-1")
+
+		service.removeUser("user-1")
+
+		// After removal, feedSourceForUser should create a new instance
+		const source2 = service.feedSourceForUser("user-1")
+		expect(source2).toBeDefined()
+	})
+
+	test("removeUser allows new source to be created", () => {
+		const service = new WeatherService({ client: mockClient })
+		const source1 = service.feedSourceForUser("user-1")
+
+		service.removeUser("user-1")
+		const source2 = service.feedSourceForUser("user-1")
+
+		expect(source1).not.toBe(source2)
+	})
+
+	test("removeUser is no-op for unknown user", () => {
+		const service = new WeatherService({ client: mockClient })
+
+		expect(() => service.removeUser("unknown")).not.toThrow()
+	})
+})

apps/aris-backend/src/weather/service.ts

@@ -0,0 +1,40 @@
+import { WeatherSource, type WeatherSourceOptions } from "@aris/source-weatherkit"
+
+import type { FeedSourceProvider } from "../feed/service.ts"
+
+/**
+ * Options forwarded to every per-user WeatherSource.
+ * Must include either `credentials` or `client` (same requirement as WeatherSourceOptions).
+ */
+export type WeatherServiceOptions = WeatherSourceOptions
+
+/**
+ * Manages WeatherSource instances per user.
+ */
+export class WeatherService implements FeedSourceProvider {
+	private sources = new Map<string, WeatherSource>()
+	private readonly options: WeatherServiceOptions
+
+	constructor(options: WeatherServiceOptions) {
+		this.options = options
+	}
+
+	/**
+	 * Get or create a WeatherSource for a user.
+	 */
+	feedSourceForUser(userId: string): WeatherSource {
+		let source = this.sources.get(userId)
+		if (!source) {
+			source = new WeatherSource(this.options)
+			this.sources.set(userId, source)
+		}
+		return source
+	}
+
+	/**
+	 * Remove a user's WeatherSource.
+	 */
+	removeUser(userId: string): void {
+		this.sources.delete(userId)
+	}
+}

apps/aris-client/.gitignore

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

apps/aris-client/.vscode/extensions.json

@@ -0,0 +1 @@
+{ "recommendations": ["expo.vscode-expo-tools"] }

apps/aris-client/.vscode/settings.json

@@ -0,0 +1,7 @@
+{
+	"editor.codeActionsOnSave": {
+		"source.fixAll": "explicit",
+		"source.organizeImports": "explicit",
+		"source.sortMembers": "explicit"
+	}
+}

apps/aris-client/README.md

@@ -0,0 +1,50 @@
+# Welcome to your Expo app 👋
+
+This is an [Expo](https://expo.dev) project created with [`create-expo-app`](https://www.npmjs.com/package/create-expo-app).
+
+## Get started
+
+1. Install dependencies
+
+   ```bash
+   npm install
+   ```
+
+2. Start the app
+
+   ```bash
+   npx expo start
+   ```
+
+In the output, you'll find options to open the app in a
+
+- [development build](https://docs.expo.dev/develop/development-builds/introduction/)
+- [Android emulator](https://docs.expo.dev/workflow/android-studio-emulator/)
+- [iOS simulator](https://docs.expo.dev/workflow/ios-simulator/)
+- [Expo Go](https://expo.dev/go), a limited sandbox for trying out app development with Expo
+
+You can start developing by editing the files inside the **app** directory. This project uses [file-based routing](https://docs.expo.dev/router/introduction).
+
+## Get a fresh project
+
+When you're ready, run:
+
+```bash
+npm run reset-project
+```
+
+This command will move the starter code to the **app-example** directory and create a blank **app** directory where you can start developing.
+
+## Learn more
+
+To learn more about developing your project with Expo, look at the following resources:
+
+- [Expo documentation](https://docs.expo.dev/): Learn fundamentals, or go into advanced topics with our [guides](https://docs.expo.dev/guides).
+- [Learn Expo tutorial](https://docs.expo.dev/tutorial/introduction/): Follow a step-by-step tutorial where you'll create a project that runs on Android, iOS, and the web.
+
+## Join the community
+
+Join our community of developers creating universal apps.
+
+- [Expo on GitHub](https://github.com/expo/expo): View our open source platform and contribute.
+- [Discord community](https://chat.expo.dev): Chat with Expo users and ask questions.

apps/aris-client/app.json

@@ -0,0 +1,62 @@
+{
+	"expo": {
+		"name": "Aris",
+		"slug": "aris-client",
+		"version": "1.0.0",
+		"orientation": "portrait",
+		"icon": "./assets/images/icon.png",
+		"scheme": "aris",
+		"userInterfaceStyle": "automatic",
+		"newArchEnabled": true,
+		"ios": {
+			"infoPlist": {
+				"NSAppTransportSecurity": {
+					"NSAllowsArbitraryLoads": true
+				},
+				"ITSAppUsesNonExemptEncryption": false
+			},
+			"bundleIdentifier": "sh.nym.aris"
+		},
+		"android": {
+			"adaptiveIcon": {
+				"backgroundColor": "#E6F4FE",
+				"foregroundImage": "./assets/images/android-icon-foreground.png",
+				"backgroundImage": "./assets/images/android-icon-background.png",
+				"monochromeImage": "./assets/images/android-icon-monochrome.png"
+			},
+			"edgeToEdgeEnabled": true,
+			"predictiveBackGestureEnabled": false,
+			"package": "sh.nym.aris"
+		},
+		"web": {
+			"output": "static",
+			"favicon": "./assets/images/favicon.png"
+		},
+		"plugins": [
+			"expo-router",
+			[
+				"expo-splash-screen",
+				{
+					"image": "./assets/images/splash-icon.png",
+					"imageWidth": 200,
+					"resizeMode": "contain",
+					"backgroundColor": "#ffffff",
+					"dark": {
+						"backgroundColor": "#000000"
+					}
+				}
+			],
+			"expo-font"
+		],
+		"experiments": {
+			"typedRoutes": true,
+			"reactCompiler": true
+		},
+		"extra": {
+			"router": {},
+			"eas": {
+				"projectId": "61092d23-36aa-418e-929d-ea40dc912e8f"
+			}
+		}
+	}
+}

apps/aris-client/eas.json

@@ -0,0 +1,21 @@
+{
+	"cli": {
+		"version": ">= 18.0.1",
+		"appVersionSource": "remote"
+	},
+	"build": {
+		"development": {
+			"developmentClient": true,
+			"distribution": "internal"
+		},
+		"preview": {
+			"distribution": "internal"
+		},
+		"production": {
+			"autoIncrement": true
+		}
+	},
+	"submit": {
+		"production": {}
+	}
+}

apps/aris-client/eslint.config.js

@@ -0,0 +1,10 @@
+// https://docs.expo.dev/guides/using-eslint/
+const { defineConfig } = require("eslint/config")
+const expoConfig = require("eslint-config-expo/flat")
+
+module.exports = defineConfig([
+	expoConfig,
+	{
+		ignores: ["dist/*"],
+	},
+])

apps/aris-client/package.json

@@ -0,0 +1,53 @@
+{
+	"name": "aris-client",
+	"version": "1.0.0",
+	"private": true,
+	"main": "expo-router/entry",
+	"scripts": {
+		"start": "./scripts/run-dev-server.sh",
+		"reset-project": "node ./scripts/reset-project.js",
+		"android": "expo start --android",
+		"ios": "expo start --ios",
+		"web": "expo start --web",
+		"lint": "expo lint",
+		"build:ios": "eas build --profile development --platform ios --non-interactive",
+		"debugger": "bun run scripts/open-debugger.ts"
+	},
+	"dependencies": {
+		"@expo-google-fonts/inter": "^0.4.2",
+		"@expo/vector-icons": "^15.0.3",
+		"@react-navigation/bottom-tabs": "^7.4.0",
+		"@react-navigation/elements": "^2.6.3",
+		"@react-navigation/native": "^7.1.8",
+		"expo": "~54.0.33",
+		"expo-constants": "~18.0.13",
+		"expo-dev-client": "~6.0.20",
+		"expo-font": "~14.0.11",
+		"expo-haptics": "~15.0.8",
+		"expo-image": "~3.0.11",
+		"expo-linking": "~8.0.11",
+		"expo-location": "~19.0.8",
+		"expo-router": "~6.0.23",
+		"expo-splash-screen": "~31.0.13",
+		"expo-status-bar": "~3.0.9",
+		"expo-symbols": "~1.0.8",
+		"expo-system-ui": "~6.0.9",
+		"expo-web-browser": "~15.0.10",
+		"react": "19.1.0",
+		"react-dom": "19.1.0",
+		"react-native": "0.81.5",
+		"react-native-gesture-handler": "~2.28.0",
+		"react-native-reanimated": "~4.1.1",
+		"react-native-safe-area-context": "~5.6.0",
+		"react-native-screens": "~4.16.0",
+		"react-native-web": "~0.21.0",
+		"react-native-worklets": "0.5.1"
+	},
+	"devDependencies": {
+		"@types/react": "~19.1.0",
+		"eas-cli": "^18.0.1",
+		"eslint": "^9.25.0",
+		"eslint-config-expo": "~10.0.0",
+		"typescript": "~5.9.2"
+	}
+}

apps/aris-client/scripts/dev-proxy.ts

@@ -0,0 +1,127 @@
+// Reverse proxy that sits in front of Metro so that all requests
+// (including those arriving via Tailscale or Ona port-forwarding) reach
+// Metro as loopback connections. This satisfies the isLocalSocket check
+// in Expo's debug middleware, making /debugger-frontend, /json, and
+// /open-debugger accessible from a remote browser.
+
+import type { ServerWebSocket } from "bun"
+
+const PROXY_PORT = parseInt(process.env.PROXY_PORT || "8080", 10)
+const METRO_PORT = parseInt(process.env.METRO_PORT || "8081", 10)
+const METRO_BASE = `http://127.0.0.1:${METRO_PORT}`
+
+function forwardHeaders(headers: Headers): Headers {
+	const result = new Headers(headers)
+	result.delete("origin")
+	result.delete("referer")
+	result.set("host", `127.0.0.1:${METRO_PORT}`)
+	return result
+}
+
+interface WsData {
+	upstream: WebSocket
+	isDevice: boolean
+}
+
+Bun.serve<WsData>({
+	port: PROXY_PORT,
+
+	async fetch(req, server) {
+		const url = new URL(req.url)
+
+		// WebSocket upgrade — bridge to Metro's ws endpoint
+		if (req.headers.get("upgrade")?.toLowerCase() === "websocket") {
+			const wsUrl = `ws://127.0.0.1:${METRO_PORT}${url.pathname}${url.search}`
+			const upstream = new WebSocket(wsUrl)
+
+			// Wait for upstream to connect before upgrading the client
+			try {
+				await new Promise<void>((resolve, reject) => {
+					upstream.addEventListener("open", () => resolve())
+					upstream.addEventListener("error", () => reject(new Error("upstream ws failed")))
+				})
+			} catch {
+				return new Response("Upstream WebSocket unavailable", { status: 502 })
+			}
+
+			const isDevice = url.pathname.startsWith("/inspector/device")
+			const ok = server.upgrade(req, { data: { upstream, isDevice } })
+			if (!ok) {
+				upstream.close()
+				return new Response("WebSocket upgrade failed", { status: 500 })
+			}
+			return undefined
+		}
+
+		// HTTP proxy
+		const upstream = `${METRO_BASE}${url.pathname}${url.search}`
+		const res = await fetch(upstream, {
+			method: req.method,
+			headers: forwardHeaders(req.headers),
+			body: req.body,
+			redirect: "manual",
+		})
+
+		return new Response(res.body, {
+			status: res.status,
+			statusText: res.statusText,
+			headers: res.headers,
+		})
+	},
+
+	websocket: {
+		message(ws: ServerWebSocket<WsData>, msg) {
+			ws.data.upstream.send(msg)
+		},
+		open(ws: ServerWebSocket<WsData>) {
+			const { upstream } = ws.data
+			upstream.addEventListener("message", (ev) => {
+				if (typeof ev.data === "string") {
+					ws.send(ev.data)
+				} else if (ev.data instanceof ArrayBuffer) {
+					ws.sendBinary(new Uint8Array(ev.data))
+				}
+			})
+			upstream.addEventListener("close", () => ws.close())
+			upstream.addEventListener("error", () => ws.close())
+
+			// Print debugger URL shortly after a device connects,
+			// giving Metro time to register the target.
+			if (ws.data.isDevice) {
+				setTimeout(() => printDebuggerUrl(), 1000)
+			}
+		},
+		close(ws: ServerWebSocket<WsData>) {
+			ws.data.upstream.close()
+		},
+	},
+})
+
+const tsIp = await Bun.$`tailscale ip -4`.text().then((s) => s.trim())
+
+async function printDebuggerUrl() {
+	const base = `http://${tsIp}:${PROXY_PORT}`
+	const res = await fetch(`${METRO_BASE}/json`)
+	if (!res.ok) return
+
+	interface DebugTarget {
+		webSocketDebuggerUrl: string
+		reactNative?: {
+			capabilities?: { prefersFuseboxFrontend?: boolean }
+		}
+	}
+
+	const targets: DebugTarget[] = await res.json()
+	const target = targets.find((t) => t.reactNative?.capabilities?.prefersFuseboxFrontend)
+	if (!target) return
+
+	const wsPath = target.webSocketDebuggerUrl
+		.replace(/^ws:\/\//, "")
+		.replace(`127.0.0.1:${METRO_PORT}`, `${tsIp}:${PROXY_PORT}`)
+
+	console.log(
+		`\n  React Native DevTools:\n  ${base}/debugger-frontend/rn_fusebox.html?ws=${encodeURIComponent(wsPath)}&sources.hide_add_folder=true&unstable_enableNetworkPanel=true\n`,
+	)
+}
+
+console.log(`[proxy] listening on :${PROXY_PORT}, forwarding to 127.0.0.1:${METRO_PORT}`)

apps/aris-client/scripts/open-debugger.ts

@@ -0,0 +1,52 @@
+// Opens React Native DevTools in Chrome, connected to the first
+// available Hermes debug target. Requires Metro + proxy to be running.
+
+import { $ } from "bun"
+
+const PROXY_PORT = process.env.PROXY_PORT || "8080"
+const METRO_PORT = process.env.METRO_PORT || "8081"
+const tsIp = (await $`tailscale ip -4`.text()).trim()
+const base = `http://${tsIp}:${PROXY_PORT}`
+
+interface DebugTarget {
+	devtoolsFrontendUrl: string
+	webSocketDebuggerUrl: string
+	reactNative?: {
+		capabilities?: {
+			prefersFuseboxFrontend?: boolean
+		}
+	}
+}
+
+const res = await fetch(`${base}/json`)
+if (!res.ok) {
+	console.error("Failed to fetch /json — is Metro running?")
+	process.exit(1)
+}
+
+const targets: DebugTarget[] = await res.json()
+const target = targets.find((t) => t.reactNative?.capabilities?.prefersFuseboxFrontend)
+
+if (!target) {
+	console.error("No debug target found. Is the app connected?")
+	process.exit(1)
+}
+
+const wsUrl = target.webSocketDebuggerUrl
+	.replace(/^ws:\/\//, "")
+	.replace(`127.0.0.1:${METRO_PORT}`, `${tsIp}:${PROXY_PORT}`)
+
+const url = `${base}/debugger-frontend/rn_fusebox.html?ws=${encodeURIComponent(wsUrl)}&sources.hide_add_folder=true&unstable_enableNetworkPanel=true`
+
+console.log(url)
+
+// Open in Chrome app mode if on macOS
+try {
+	await $`open -a "Google Chrome" --args --app=${url}`.quiet()
+} catch {
+	try {
+		await $`xdg-open ${url}`.quiet()
+	} catch {
+		console.log("Open the URL above in Chrome.")
+	}
+}

apps/aris-client/scripts/reset-project.js

@@ -0,0 +1,112 @@
+#!/usr/bin/env node
+
+/**
+ * This script is used to reset the project to a blank state.
+ * It deletes or moves the /app, /components, /hooks, /scripts, and /constants directories to /app-example based on user input and creates a new /app directory with an index.tsx and _layout.tsx file.
+ * You can remove the `reset-project` script from package.json and safely delete this file after running it.
+ */
+
+const fs = require("fs")
+const path = require("path")
+const readline = require("readline")
+
+const root = process.cwd()
+const oldDirs = ["app", "components", "hooks", "constants", "scripts"]
+const exampleDir = "app-example"
+const newAppDir = "app"
+const exampleDirPath = path.join(root, exampleDir)
+
+const indexContent = `import { Text, View } from "react-native";
+
+export default function Index() {
+  return (
+    <View
+      style={{
+        flex: 1,
+        justifyContent: "center",
+        alignItems: "center",
+      }}
+    >
+      <Text>Edit app/index.tsx to edit this screen.</Text>
+    </View>
+  );
+}
+`
+
+const layoutContent = `import { Stack } from "expo-router";
+
+export default function RootLayout() {
+  return <Stack />;
+}
+`
+
+const rl = readline.createInterface({
+	input: process.stdin,
+	output: process.stdout,
+})
+
+const moveDirectories = async (userInput) => {
+	try {
+		if (userInput === "y") {
+			// Create the app-example directory
+			await fs.promises.mkdir(exampleDirPath, { recursive: true })
+			console.log(`📁 /${exampleDir} directory created.`)
+		}
+
+		// Move old directories to new app-example directory or delete them
+		for (const dir of oldDirs) {
+			const oldDirPath = path.join(root, dir)
+			if (fs.existsSync(oldDirPath)) {
+				if (userInput === "y") {
+					const newDirPath = path.join(root, exampleDir, dir)
+					await fs.promises.rename(oldDirPath, newDirPath)
+					console.log(`➡️ /${dir} moved to /${exampleDir}/${dir}.`)
+				} else {
+					await fs.promises.rm(oldDirPath, { recursive: true, force: true })
+					console.log(`❌ /${dir} deleted.`)
+				}
+			} else {
+				console.log(`➡️ /${dir} does not exist, skipping.`)
+			}
+		}
+
+		// Create new /app directory
+		const newAppDirPath = path.join(root, newAppDir)
+		await fs.promises.mkdir(newAppDirPath, { recursive: true })
+		console.log("\n📁 New /app directory created.")
+
+		// Create index.tsx
+		const indexPath = path.join(newAppDirPath, "index.tsx")
+		await fs.promises.writeFile(indexPath, indexContent)
+		console.log("📄 app/index.tsx created.")
+
+		// Create _layout.tsx
+		const layoutPath = path.join(newAppDirPath, "_layout.tsx")
+		await fs.promises.writeFile(layoutPath, layoutContent)
+		console.log("📄 app/_layout.tsx created.")
+
+		console.log("\n✅ Project reset complete. Next steps:")
+		console.log(
+			`1. Run \`npx expo start\` to start a development server.\n2. Edit app/index.tsx to edit the main screen.${
+				userInput === "y"
+					? `\n3. Delete the /${exampleDir} directory when you're done referencing it.`
+					: ""
+			}`,
+		)
+	} catch (error) {
+		console.error(`❌ Error during script execution: ${error.message}`)
+	}
+}
+
+rl.question(
+	"Do you want to move existing files to /app-example instead of deleting them? (Y/n): ",
+	(answer) => {
+		const userInput = answer.trim().toLowerCase() || "y"
+		if (userInput === "y" || userInput === "n") {
+			moveDirectories(userInput).finally(() => rl.close())
+		} else {
+			console.log("❌ Invalid input. Please enter 'Y' or 'N'.")
+			rl.close()
+		}
+	},
+)

apps/aris-client/scripts/run-dev-server.sh

@@ -0,0 +1,15 @@
+#!/usr/bin/env bash
+set -euo pipefail
+
+PROXY_PORT=8080
+METRO_PORT=8081
+
+# Start a reverse proxy so Metro sees all requests as loopback.
+# This makes debugger endpoints (/debugger-frontend, /json, /open-debugger)
+# accessible through the Tailscale IP.
+PROXY_PORT=$PROXY_PORT METRO_PORT=$METRO_PORT bun run scripts/dev-proxy.ts &
+PROXY_PID=$!
+trap "kill $PROXY_PID 2>/dev/null" EXIT
+
+EXPO_PACKAGER_PROXY_URL=http://$(tailscale ip -4):$PROXY_PORT bunx expo start --localhost -p $METRO_PORT
+

apps/aris-client/src/app/(tabs)/_layout.tsx

@@ -0,0 +1,36 @@
+import { Tabs } from "expo-router"
+import React from "react"
+
+import { HapticTab } from "@/components/haptic-tab"
+import { IconSymbol } from "@/components/ui/icon-symbol"
+import { Colors } from "@/constants/theme"
+import { useColorScheme } from "@/hooks/use-color-scheme"
+
+export default function TabLayout() {
+	const colorScheme = useColorScheme()
+
+	return (
+		<Tabs
+			screenOptions={{
+				tabBarActiveTintColor: Colors[colorScheme ?? "light"].tint,
+				headerShown: false,
+				tabBarButton: HapticTab,
+			}}
+		>
+			<Tabs.Screen
+				name="index"
+				options={{
+					title: "Home",
+					tabBarIcon: ({ color }) => <IconSymbol size={28} name="house.fill" color={color} />,
+				}}
+			/>
+			<Tabs.Screen
+				name="explore"
+				options={{
+					title: "Explore",
+					tabBarIcon: ({ color }) => <IconSymbol size={28} name="paperplane.fill" color={color} />,
+				}}
+			/>
+		</Tabs>
+	)
+}

apps/aris-client/src/app/(tabs)/explore.tsx

@@ -0,0 +1,114 @@
+import { Image } from "expo-image"
+import { Platform, StyleSheet } from "react-native"
+
+import { ExternalLink } from "@/components/external-link"
+import ParallaxScrollView from "@/components/parallax-scroll-view"
+import { ThemedText } from "@/components/themed-text"
+import { ThemedView } from "@/components/themed-view"
+import { Collapsible } from "@/components/ui/collapsible"
+import { IconSymbol } from "@/components/ui/icon-symbol"
+import { Fonts } from "@/constants/theme"
+
+export default function TabTwoScreen() {
+	return (
+		<ParallaxScrollView
+			headerBackgroundColor={{ light: "#D0D0D0", dark: "#353636" }}
+			headerImage={
+				<IconSymbol
+					size={310}
+					color="#808080"
+					name="chevron.left.forwardslash.chevron.right"
+					style={styles.headerImage}
+				/>
+			}
+		>
+			<ThemedView style={styles.titleContainer}>
+				<ThemedText
+					type="title"
+					style={{
+						fontFamily: Fonts.rounded,
+					}}
+				>
+					Explore
+				</ThemedText>
+			</ThemedView>
+			<ThemedText>This app includes example code to help you get started.</ThemedText>
+			<Collapsible title="File-based routing">
+				<ThemedText>
+					This app has two screens:{" "}
+					<ThemedText type="defaultSemiBold">app/(tabs)/index.tsx</ThemedText> and{" "}
+					<ThemedText type="defaultSemiBold">app/(tabs)/explore.tsx</ThemedText>
+				</ThemedText>
+				<ThemedText>
+					The layout file in <ThemedText type="defaultSemiBold">app/(tabs)/_layout.tsx</ThemedText>{" "}
+					sets up the tab navigator.
+				</ThemedText>
+				<ExternalLink href="https://docs.expo.dev/router/introduction">
+					<ThemedText type="link">Learn more</ThemedText>
+				</ExternalLink>
+			</Collapsible>
+			<Collapsible title="Android, iOS, and web support">
+				<ThemedText>
+					You can open this project on Android, iOS, and the web. To open the web version, press{" "}
+					<ThemedText type="defaultSemiBold">w</ThemedText> in the terminal running this project.
+				</ThemedText>
+			</Collapsible>
+			<Collapsible title="Images">
+				<ThemedText>
+					For static images, you can use the <ThemedText type="defaultSemiBold">@2x</ThemedText> and{" "}
+					<ThemedText type="defaultSemiBold">@3x</ThemedText> suffixes to provide files for
+					different screen densities
+				</ThemedText>
+				<Image
+					source={require("@assets/images/react-logo.png")}
+					style={{ width: 100, height: 100, alignSelf: "center" }}
+				/>
+				<ExternalLink href="https://reactnative.dev/docs/images">
+					<ThemedText type="link">Learn more</ThemedText>
+				</ExternalLink>
+			</Collapsible>
+			<Collapsible title="Light and dark mode components">
+				<ThemedText>
+					This template has light and dark mode support. The{" "}
+					<ThemedText type="defaultSemiBold">useColorScheme()</ThemedText> hook lets you inspect
+					what the user&apos;s current color scheme is, and so you can adjust UI colors accordingly.
+				</ThemedText>
+				<ExternalLink href="https://docs.expo.dev/develop/user-interface/color-themes/">
+					<ThemedText type="link">Learn more</ThemedText>
+				</ExternalLink>
+			</Collapsible>
+			<Collapsible title="Animations">
+				<ThemedText>
+					This template includes an example of an animated component. The{" "}
+					<ThemedText type="defaultSemiBold">components/HelloWave.tsx</ThemedText> component uses
+					the powerful{" "}
+					<ThemedText type="defaultSemiBold" style={{ fontFamily: Fonts.mono }}>
+						react-native-reanimated
+					</ThemedText>{" "}
+					library to create a waving hand animation.
+				</ThemedText>
+				{Platform.select({
+					ios: (
+						<ThemedText>
+							The <ThemedText type="defaultSemiBold">components/ParallaxScrollView.tsx</ThemedText>{" "}
+							component provides a parallax effect for the header image.
+						</ThemedText>
+					),
+				})}
+			</Collapsible>
+		</ParallaxScrollView>
+	)
+}
+
+const styles = StyleSheet.create({
+	headerImage: {
+		color: "#808080",
+		bottom: -90,
+		left: -35,
+		position: "absolute",
+	},
+	titleContainer: {
+		flexDirection: "row",
+		gap: 8,
+	},
+})

apps/aris-client/src/app/(tabs)/index.tsx

@@ -0,0 +1,96 @@
+import { Image } from "expo-image"
+import { Link } from "expo-router"
+import { Platform, StyleSheet } from "react-native"
+
+import { HelloWave } from "@/components/hello-wave"
+import ParallaxScrollView from "@/components/parallax-scroll-view"
+import { ThemedText } from "@/components/themed-text"
+import { ThemedView } from "@/components/themed-view"
+
+export default function HomeScreen() {
+	return (
+		<ParallaxScrollView
+			headerBackgroundColor={{ light: "#A1CEDC", dark: "#1D3D47" }}
+			headerImage={
+				<Image source={require("@assets/images/partial-react-logo.png")} style={styles.reactLogo} />
+			}
+		>
+			<ThemedView style={styles.titleContainer}>
+				<ThemedText type="title">Welcome!</ThemedText>
+				<HelloWave />
+			</ThemedView>
+			<ThemedView style={styles.stepContainer}>
+				<ThemedText type="subtitle">Step 1: Try it</ThemedText>
+				<ThemedText>
+					Edit <ThemedText type="defaultSemiBold">app/(tabs)/index.tsx</ThemedText> to see changes.
+					Press{" "}
+					<ThemedText type="defaultSemiBold">
+						{Platform.select({
+							ios: "cmd + d",
+							android: "cmd + m",
+							web: "F12",
+						})}
+					</ThemedText>{" "}
+					to open developer tools.
+				</ThemedText>
+			</ThemedView>
+			<ThemedView style={styles.stepContainer}>
+				<Link href="/modal">
+					<Link.Trigger>
+						<ThemedText type="subtitle">Step 2: Explore</ThemedText>
+					</Link.Trigger>
+					<Link.Preview />
+					<Link.Menu>
+						<Link.MenuAction title="Action" icon="cube" onPress={() => alert("Action pressed")} />
+						<Link.MenuAction
+							title="Share"
+							icon="square.and.arrow.up"
+							onPress={() => alert("Share pressed")}
+						/>
+						<Link.Menu title="More" icon="ellipsis">
+							<Link.MenuAction
+								title="Delete"
+								icon="trash"
+								destructive
+								onPress={() => alert("Delete pressed")}
+							/>
+						</Link.Menu>
+					</Link.Menu>
+				</Link>
+
+				<ThemedText>
+					{`Tap the Explore tab to learn more about what's included in this starter app.`}
+				</ThemedText>
+			</ThemedView>
+			<ThemedView style={styles.stepContainer}>
+				<ThemedText type="subtitle">Step 3: Get a fresh start</ThemedText>
+				<ThemedText>
+					{`When you're ready, run `}
+					<ThemedText type="defaultSemiBold">npm run reset-project</ThemedText> to get a fresh{" "}
+					<ThemedText type="defaultSemiBold">app</ThemedText> directory. This will move the current{" "}
+					<ThemedText type="defaultSemiBold">app</ThemedText> to{" "}
+					<ThemedText type="defaultSemiBold">app-example</ThemedText>.
+				</ThemedText>
+			</ThemedView>
+		</ParallaxScrollView>
+	)
+}
+
+const styles = StyleSheet.create({
+	titleContainer: {
+		flexDirection: "row",
+		alignItems: "center",
+		gap: 8,
+	},
+	stepContainer: {
+		gap: 8,
+		marginBottom: 8,
+	},
+	reactLogo: {
+		height: 178,
+		width: 290,
+		bottom: 0,
+		left: 0,
+		position: "absolute",
+	},
+})

apps/aris-client/src/app/_layout.tsx

@@ -0,0 +1,23 @@
+import { DarkTheme, DefaultTheme, ThemeProvider } from "@react-navigation/native"
+import { Stack } from "expo-router"
+import { StatusBar } from "expo-status-bar"
+import "react-native-reanimated"
+import { useColorScheme } from "@/hooks/use-color-scheme"
+
+export const unstable_settings = {
+	anchor: "(tabs)",
+}
+
+export default function RootLayout() {
+	const colorScheme = useColorScheme()
+
+	return (
+		<ThemeProvider value={colorScheme === "dark" ? DarkTheme : DefaultTheme}>
+			<Stack>
+				<Stack.Screen name="(tabs)" options={{ headerShown: false }} />
+				<Stack.Screen name="modal" options={{ presentation: "modal", title: "Modal" }} />
+			</Stack>
+			<StatusBar style="auto" />
+		</ThemeProvider>
+	)
+}

apps/aris-client/src/app/modal.tsx

@@ -0,0 +1,29 @@
+import { Link } from "expo-router"
+import { StyleSheet } from "react-native"
+
+import { ThemedText } from "@/components/themed-text"
+import { ThemedView } from "@/components/themed-view"
+
+export default function ModalScreen() {
+	return (
+		<ThemedView style={styles.container}>
+			<ThemedText type="title">This is a modal</ThemedText>
+			<Link href="/" dismissTo style={styles.link}>
+				<ThemedText type="link">Go to home screen</ThemedText>
+			</Link>
+		</ThemedView>
+	)
+}
+
+const styles = StyleSheet.create({
+	container: {
+		flex: 1,
+		alignItems: "center",
+		justifyContent: "center",
+		padding: 20,
+	},
+	link: {
+		marginTop: 15,
+		paddingVertical: 15,
+	},
+})

apps/aris-client/src/components/external-link.tsx

@@ -0,0 +1,25 @@
+import { Href, Link } from "expo-router"
+import { openBrowserAsync, WebBrowserPresentationStyle } from "expo-web-browser"
+import { type ComponentProps } from "react"
+
+type Props = Omit<ComponentProps<typeof Link>, "href"> & { href: Href & string }
+
+export function ExternalLink({ href, ...rest }: Props) {
+	return (
+		<Link
+			target="_blank"
+			{...rest}
+			href={href}
+			onPress={async (event) => {
+				if (process.env.EXPO_OS !== "web") {
+					// Prevent the default behavior of linking to the default browser on native.
+					event.preventDefault()
+					// Open the link in an in-app browser.
+					await openBrowserAsync(href, {
+						presentationStyle: WebBrowserPresentationStyle.AUTOMATIC,
+					})
+				}
+			}}
+		/>
+	)
+}

apps/aris-client/src/components/haptic-tab.tsx

@@ -0,0 +1,18 @@
+import { BottomTabBarButtonProps } from "@react-navigation/bottom-tabs"
+import { PlatformPressable } from "@react-navigation/elements"
+import * as Haptics from "expo-haptics"
+
+export function HapticTab(props: BottomTabBarButtonProps) {
+	return (
+		<PlatformPressable
+			{...props}
+			onPressIn={(ev) => {
+				if (process.env.EXPO_OS === "ios") {
+					// Add a soft haptic feedback when pressing down on the tabs.
+					Haptics.impactAsync(Haptics.ImpactFeedbackStyle.Light)
+				}
+				props.onPressIn?.(ev)
+			}}
+		/>
+	)
+}

apps/aris-client/src/components/hello-wave.tsx

@@ -0,0 +1,20 @@
+import Animated from "react-native-reanimated"
+
+export function HelloWave() {
+	return (
+		<Animated.Text
+			style={{
+				fontSize: 28,
+				lineHeight: 32,
+				marginTop: -6,
+				animationName: {
+					"50%": { transform: [{ rotate: "25deg" }] },
+				},
+				animationIterationCount: 4,
+				animationDuration: "300ms",
+			}}
+		>
+			👋
+		</Animated.Text>
+	)
+}

apps/aris-client/src/components/parallax-scroll-view.tsx

@@ -0,0 +1,82 @@
+import type { PropsWithChildren, ReactElement } from "react"
+
+import { StyleSheet } from "react-native"
+import Animated, {
+	interpolate,
+	useAnimatedRef,
+	useAnimatedStyle,
+	useScrollOffset,
+} from "react-native-reanimated"
+
+import { ThemedView } from "@/components/themed-view"
+import { useColorScheme } from "@/hooks/use-color-scheme"
+import { useThemeColor } from "@/hooks/use-theme-color"
+
+const HEADER_HEIGHT = 250
+
+type Props = PropsWithChildren<{
+	headerImage: ReactElement
+	headerBackgroundColor: { dark: string; light: string }
+}>
+
+export default function ParallaxScrollView({
+	children,
+	headerImage,
+	headerBackgroundColor,
+}: Props) {
+	const backgroundColor = useThemeColor({}, "background")
+	const colorScheme = useColorScheme() ?? "light"
+	const scrollRef = useAnimatedRef<Animated.ScrollView>()
+	const scrollOffset = useScrollOffset(scrollRef)
+	const headerAnimatedStyle = useAnimatedStyle(() => {
+		return {
+			transform: [
+				{
+					translateY: interpolate(
+						scrollOffset.value,
+						[-HEADER_HEIGHT, 0, HEADER_HEIGHT],
+						[-HEADER_HEIGHT / 2, 0, HEADER_HEIGHT * 0.75],
+					),
+				},
+				{
+					scale: interpolate(scrollOffset.value, [-HEADER_HEIGHT, 0, HEADER_HEIGHT], [2, 1, 1]),
+				},
+			],
+		}
+	})
+
+	return (
+		<Animated.ScrollView
+			ref={scrollRef}
+			style={{ backgroundColor, flex: 1 }}
+			scrollEventThrottle={16}
+		>
+			<Animated.View
+				style={[
+					styles.header,
+					{ backgroundColor: headerBackgroundColor[colorScheme] },
+					headerAnimatedStyle,
+				]}
+			>
+				{headerImage}
+			</Animated.View>
+			<ThemedView style={styles.content}>{children}</ThemedView>
+		</Animated.ScrollView>
+	)
+}
+
+const styles = StyleSheet.create({
+	container: {
+		flex: 1,
+	},
+	header: {
+		height: HEADER_HEIGHT,
+		overflow: "hidden",
+	},
+	content: {
+		flex: 1,
+		padding: 32,
+		gap: 16,
+		overflow: "hidden",
+	},
+})

apps/aris-client/src/components/themed-text.tsx

@@ -0,0 +1,60 @@
+import { StyleSheet, Text, type TextProps } from "react-native"
+
+import { useThemeColor } from "@/hooks/use-theme-color"
+
+export type ThemedTextProps = TextProps & {
+	lightColor?: string
+	darkColor?: string
+	type?: "default" | "title" | "defaultSemiBold" | "subtitle" | "link"
+}
+
+export function ThemedText({
+	style,
+	lightColor,
+	darkColor,
+	type = "default",
+	...rest
+}: ThemedTextProps) {
+	const color = useThemeColor({ light: lightColor, dark: darkColor }, "text")
+
+	return (
+		<Text
+			style={[
+				{ color },
+				type === "default" ? styles.default : undefined,
+				type === "title" ? styles.title : undefined,
+				type === "defaultSemiBold" ? styles.defaultSemiBold : undefined,
+				type === "subtitle" ? styles.subtitle : undefined,
+				type === "link" ? styles.link : undefined,
+				style,
+			]}
+			{...rest}
+		/>
+	)
+}
+
+const styles = StyleSheet.create({
+	default: {
+		fontSize: 16,
+		lineHeight: 24,
+	},
+	defaultSemiBold: {
+		fontSize: 16,
+		lineHeight: 24,
+		fontWeight: "600",
+	},
+	title: {
+		fontSize: 32,
+		fontWeight: "bold",
+		lineHeight: 32,
+	},
+	subtitle: {
+		fontSize: 20,
+		fontWeight: "bold",
+	},
+	link: {
+		lineHeight: 30,
+		fontSize: 16,
+		color: "#0a7ea4",
+	},
+})

apps/aris-client/src/components/themed-view.tsx

@@ -0,0 +1,14 @@
+import { View, type ViewProps } from "react-native"
+
+import { useThemeColor } from "@/hooks/use-theme-color"
+
+export type ThemedViewProps = ViewProps & {
+	lightColor?: string
+	darkColor?: string
+}
+
+export function ThemedView({ style, lightColor, darkColor, ...otherProps }: ThemedViewProps) {
+	const backgroundColor = useThemeColor({ light: lightColor, dark: darkColor }, "background")
+
+	return <View style={[{ backgroundColor }, style]} {...otherProps} />
+}

apps/aris-client/src/components/ui/collapsible.tsx

@@ -0,0 +1,46 @@
+import { PropsWithChildren, useState } from "react"
+import { StyleSheet, TouchableOpacity } from "react-native"
+
+import { ThemedText } from "@/components/themed-text"
+import { ThemedView } from "@/components/themed-view"
+import { IconSymbol } from "@/components/ui/icon-symbol"
+import { Colors } from "@/constants/theme"
+import { useColorScheme } from "@/hooks/use-color-scheme"
+
+export function Collapsible({ children, title }: PropsWithChildren & { title: string }) {
+	const [isOpen, setIsOpen] = useState(false)
+	const theme = useColorScheme() ?? "light"
+
+	return (
+		<ThemedView>
+			<TouchableOpacity
+				style={styles.heading}
+				onPress={() => setIsOpen((value) => !value)}
+				activeOpacity={0.8}
+			>
+				<IconSymbol
+					name="chevron.right"
+					size={18}
+					weight="medium"
+					color={theme === "light" ? Colors.light.icon : Colors.dark.icon}
+					style={{ transform: [{ rotate: isOpen ? "90deg" : "0deg" }] }}
+				/>
+
+				<ThemedText type="defaultSemiBold">{title}</ThemedText>
+			</TouchableOpacity>
+			{isOpen && <ThemedView style={styles.content}>{children}</ThemedView>}
+		</ThemedView>
+	)
+}
+
+const styles = StyleSheet.create({
+	heading: {
+		flexDirection: "row",
+		alignItems: "center",
+		gap: 6,
+	},
+	content: {
+		marginTop: 6,
+		marginLeft: 24,
+	},
+})

apps/aris-client/src/components/ui/icon-symbol.ios.tsx

@@ -0,0 +1,32 @@
+import { SymbolView, SymbolViewProps, SymbolWeight } from "expo-symbols"
+import { StyleProp, ViewStyle } from "react-native"
+
+export function IconSymbol({
+	name,
+	size = 24,
+	color,
+	style,
+	weight = "regular",
+}: {
+	name: SymbolViewProps["name"]
+	size?: number
+	color: string
+	style?: StyleProp<ViewStyle>
+	weight?: SymbolWeight
+}) {
+	return (
+		<SymbolView
+			weight={weight}
+			tintColor={color}
+			resizeMode="scaleAspectFit"
+			name={name}
+			style={[
+				{
+					width: size,
+					height: size,
+				},
+				style,
+			]}
+		/>
+	)
+}

apps/aris-client/src/components/ui/icon-symbol.tsx

@@ -0,0 +1,41 @@
+// Fallback for using MaterialIcons on Android and web.
+
+import MaterialIcons from "@expo/vector-icons/MaterialIcons"
+import { SymbolWeight, SymbolViewProps } from "expo-symbols"
+import { ComponentProps } from "react"
+import { OpaqueColorValue, type StyleProp, type TextStyle } from "react-native"
+
+type IconMapping = Record<SymbolViewProps["name"], ComponentProps<typeof MaterialIcons>["name"]>
+type IconSymbolName = keyof typeof MAPPING
+
+/**
+ * Add your SF Symbols to Material Icons mappings here.
+ * - see Material Icons in the [Icons Directory](https://icons.expo.fyi).
+ * - see SF Symbols in the [SF Symbols](https://developer.apple.com/sf-symbols/) app.
+ */
+const MAPPING = {
+	"house.fill": "home",
+	"paperplane.fill": "send",
+	"chevron.left.forwardslash.chevron.right": "code",
+	"chevron.right": "chevron-right",
+} as IconMapping
+
+/**
+ * An icon component that uses native SF Symbols on iOS, and Material Icons on Android and web.
+ * This ensures a consistent look across platforms, and optimal resource usage.
+ * Icon `name`s are based on SF Symbols and require manual mapping to Material Icons.
+ */
+export function IconSymbol({
+	name,
+	size = 24,
+	color,
+	style,
+}: {
+	name: IconSymbolName
+	size?: number
+	color: string | OpaqueColorValue
+	style?: StyleProp<TextStyle>
+	weight?: SymbolWeight
+}) {
+	return <MaterialIcons color={color} size={size} name={MAPPING[name]} style={style} />
+}

apps/aris-client/src/constants/theme.ts

@@ -0,0 +1,53 @@
+/**
+ * Below are the colors that are used in the app. The colors are defined in the light and dark mode.
+ * There are many other ways to style your app. For example, [Nativewind](https://www.nativewind.dev/), [Tamagui](https://tamagui.dev/), [unistyles](https://reactnativeunistyles.vercel.app), etc.
+ */
+
+import { Platform } from "react-native"
+
+const tintColorLight = "#0a7ea4"
+const tintColorDark = "#fff"
+
+export const Colors = {
+	light: {
+		text: "#11181C",
+		background: "#fff",
+		tint: tintColorLight,
+		icon: "#687076",
+		tabIconDefault: "#687076",
+		tabIconSelected: tintColorLight,
+	},
+	dark: {
+		text: "#ECEDEE",
+		background: "#151718",
+		tint: tintColorDark,
+		icon: "#9BA1A6",
+		tabIconDefault: "#9BA1A6",
+		tabIconSelected: tintColorDark,
+	},
+}
+
+export const Fonts = Platform.select({
+	ios: {
+		/** iOS `UIFontDescriptorSystemDesignDefault` */
+		sans: "system-ui",
+		/** iOS `UIFontDescriptorSystemDesignSerif` */
+		serif: "ui-serif",
+		/** iOS `UIFontDescriptorSystemDesignRounded` */
+		rounded: "ui-rounded",
+		/** iOS `UIFontDescriptorSystemDesignMonospaced` */
+		mono: "ui-monospace",
+	},
+	default: {
+		sans: "normal",
+		serif: "serif",
+		rounded: "normal",
+		mono: "monospace",
+	},
+	web: {
+		sans: "system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif",
+		serif: "Georgia, 'Times New Roman', serif",
+		rounded: "'SF Pro Rounded', 'Hiragino Maru Gothic ProN', Meiryo, 'MS PGothic', sans-serif",
+		mono: "SFMono-Regular, Menlo, Monaco, Consolas, 'Liberation Mono', 'Courier New', monospace",
+	},
+})

apps/aris-client/src/hooks/use-color-scheme.ts

@@ -0,0 +1 @@
+export { useColorScheme } from "react-native"

apps/aris-client/src/hooks/use-color-scheme.web.ts

@@ -0,0 +1,21 @@
+import { useEffect, useState } from "react"
+import { useColorScheme as useRNColorScheme } from "react-native"
+
+/**
+ * To support static rendering, this value needs to be re-calculated on the client side for web
+ */
+export function useColorScheme() {
+	const [hasHydrated, setHasHydrated] = useState(false)
+
+	useEffect(() => {
+		setHasHydrated(true)
+	}, [])
+
+	const colorScheme = useRNColorScheme()
+
+	if (hasHydrated) {
+		return colorScheme
+	}
+
+	return "light"
+}

apps/aris-client/src/hooks/use-theme-color.ts

@@ -0,0 +1,21 @@
+/**
+ * Learn more about light and dark modes:
+ * https://docs.expo.dev/guides/color-schemes/
+ */
+
+import { Colors } from "@/constants/theme"
+import { useColorScheme } from "@/hooks/use-color-scheme"
+
+export function useThemeColor(
+	props: { light?: string; dark?: string },
+	colorName: keyof typeof Colors.light & keyof typeof Colors.dark,
+) {
+	const theme = useColorScheme() ?? "light"
+	const colorFromProps = props[theme]
+
+	if (colorFromProps) {
+		return colorFromProps
+	} else {
+		return Colors[theme][colorName]
+	}
+}

apps/aris-client/tsconfig.json

@@ -0,0 +1,11 @@
+{
+	"extends": "expo/tsconfig.base",
+	"compilerOptions": {
+		"strict": true,
+		"paths": {
+			"@/*": ["./src/*"],
+			"@assets/*": ["./assets/*"]
+		}
+	},
+	"include": ["**/*.ts", "**/*.tsx", ".expo/types/**/*.ts", "expo-env.d.ts"]
+}