Skip to content
RZ.

System 02

Mobile Platform

React Native · XState · Monorepo · Observability

Platform architecture for a consumer fintech React Native app — the shared foundation behind onboarding, savings, payments, investments, rewards, and commerce surfaces.

Components

React Native Infra
Collapsed the Yarn workspace into a single monorepo and migrated all org packages to GitHub Packages.
Native Modules
Native Android modules powering the SMS OTP pipeline and device binding checks.
SDUI
Server-driven UI patterns for payment and banking screens.
Design System
Shared design system components used across the app.
Observability
Coralogix RUM, Amplitude Session Replay, and SKAdNetwork attribution via AppsFlyer wired into one production trace correlation stack.

Problem

The app grew into a large-scale React Native monorepo serving a wide surface area — onboarding, savings, payments, investments, rewards, commerce, and help centre — with 16+ state machines on an ageing XState v4 API, fragmented package management, and no end-to-end way to trace a production session across observability tools.

Constraints

  • 16+ state machine files depending on XState v4 behavior across active feature teams — no room for a feature freeze.
  • The Yarn workspace had drifted into a structure that made cross-package dependency management error-prone.
  • Production issues needed to be traced across multiple observability tools (Coralogix, Amplitude, AppsFlyer) with no shared session identity.

Architecture

Led an app-wide migration of 16+ state machine files from XState v4 to v5's actor model. Authored team migration playbooks and removed dead machine chains, letting feature teams adopt v5 in parallel without a feature freeze.

Collapsed the Yarn workspace into a single monorepo and migrated all org packages to GitHub Packages, simplifying dependency resolution across the codebase.

Built an end-to-end session observability stack: Coralogix RUM with a custom source map upload CLI for readable stack traces, Amplitude Session Replay for onboarding flows, and SKAdNetwork attribution via AppsFlyer for install attribution — with Amplitude and Coralogix session IDs cross-linked so a production issue can be traced across both tools.

Decisions

Migrate without a feature freeze

With 16+ machines in active use, a stop-the-world migration wasn't viable. Wrote migration playbooks so teams could move machines to XState v5 incrementally and in parallel, and used the migration as a forcing function to remove dead machine chains.

Source maps as a CLI, not a manual step

Coralogix RUM stack traces are only useful with source maps uploaded correctly on every build. Built a source map upload CLI so this happens automatically instead of depending on someone remembering.

Cross-link session IDs across tools

Amplitude Session Replay and Coralogix RUM each had their own session identity. Cross-linked the two IDs so an on-call engineer can jump from a replay to the matching RUM trace for the same session.

Impact

  • Migrated 16+ state machines from XState v4 to v5 with zero feature freeze.
  • Collapsed the Yarn workspace into a monorepo and moved all org packages to GitHub Packages.
  • Cross-linked Amplitude and Coralogix session IDs for end-to-end production trace correlation.