The Challenge
Fabrilamp’s sales representatives visit retail stores across Spain, often in areas with limited or no mobile connectivity. They needed a tool that could showcase the full product catalog with high-quality images, manage customer relationships, and process B2B orders — all without depending on an internet connection. The existing workflow relied on paper catalogs and phone calls, leading to errors, delays, and a poor customer experience.
The Solution
A fully offline-capable iPad app built with Expo and React Native. The entire product database (5,000+ products, 11,000+ images) is stored locally on the device — SQLite for data, filesystem for images. Sales reps can browse the catalog, create orders, and manage customers anywhere, with everything syncing to the server when back online.
Scroll to view more →
Category & Product Browsing
The category grid loads instantly from the local database with pre-resolved image URIs. Product lists use FlashList with tuned draw distances to handle thousands of items without frame drops. Filtering by category, finish, specs, and stock status makes it fast to find exactly the right product during a client visit.
B2B Cart & Orders
The cart handles complex B2B workflows: custom pricing per customer, shipping addresses, payment terms, and free-shipping thresholds. Sales reps can create provisional clients on the spot and immediately place orders, with the data syncing for validation when back online.
Data Sync
A dedicated sync screen shows granular progress — database records, images downloaded (11,091/11,118 in the screenshot), and processing status. The app enforces mandatory sync after 24 hours to keep pricing and stock data current.
Architecture
Frontend — Expo with React Native, file-based routing via Expo Router, styled with NativeWind for consistency with the web platform. Zustand handles client state, React Query manages caching and background sync.
Data layer — SQLite via Drizzle ORM stores all product data, customers, and orders locally. First product image loads from the device filesystem for instant display; remaining carousel images load lazily. CDN URLs serve only as fallbacks.
Backend communication — tRPC provides type-safe API calls when connectivity is available. Parallel batched queries with pre-resolved image URIs minimize sync time.
Monitoring — Sentry tracks errors and performance in production with custom breadcrumbs for sync operations and offline state transitions.