Social MediaSoftware & Coding
background-shape

Partner Mobile App

The Android and iOS app channel partners use to file cases, upload documents, track loan status and see what they have earned — bare React Native, no managed wrapper.

Client

Fintech (India)

Service

Mobile Engineering

Date

June 1, 2025

Challenge

The users are field agents on mid-range Android devices and unreliable mobile data, filing cases from wherever the customer is. An app that assumes a good network or a fast phone is an app they stop using.

Solution

A consistent architecture per screen — server state through a query cache, client state in a store, one logic hook per screen holding the wiring — plus a versioned in-house component set so screens look and behave the same without each one re-inventing its own patterns.

case-details

Who uses it

Channel partners: independent agents who bring loan cases to the marketplace. They work from a customer’s living room, not a desk. The phone is mid-range Android more often than not, the network is whatever is available, and the task is often photographing and uploading a stack of documents.

That user profile decides the engineering. Every screen has to be usable while a request is still in flight, every list has to stay smooth on a device with limited memory, and an upload that fails halfway has to be resumable rather than restartable.

Architecture

The thing that keeps a React Native codebase maintainable across many screens is refusing to let each screen invent its own approach to state. Two separate concerns, two separate tools:

  • Server state lives in a query cache — fetching, caching, invalidation and retry are the library’s job, not the component’s. Screens get data plus a loading and error state they can render honestly.
  • Client state lives in a store: session, filters, draft form values, anything the server does not own.

Each screen has a single logic hook holding that wiring. The component below it is presentational and readable — you can see what a screen renders without reading how it fetches. GraphQL sits underneath for the data the backend exposes that way.

The UI comes from a versioned in-house component set, so a design change lands in one place rather than in forty screens, and long lists use virtualisation as a default rather than as a fix applied after someone complains about scrolling.

Stack

Bare React Native, React Navigation, Redux Toolkit, TanStack Query, Apollo Client, StyleSheet with a versioned design-system layer.