Albagli: Luxury Furniture & Home Décor E-Commerce

Albagli is a mobile app for buying designer furniture and home accessories in Middle Eastern and global markets. It pairs complex product configuration with a fully bilingual interface, so Arabic-speaking customers get a properly mirrored, native-feeling experience. Built with React Native, Expo and TypeScript.

Furniture is hard to buy on a phone: each piece comes in many finish, fabric and size combinations that change price and stock, customers need to inspect wood grain and joinery up close, and bulky deliveries need accurate addresses. The app also had to work equally well in English and Arabic.

• Variant matrix

  an interdependent selection engine where choosing a primary finish, such as walnut or oak, recalculates compatible fabrics, dimension limits, price differences and SKU stock.

• Media viewer

  a gesture-driven gallery with pinch-to-zoom, pan and swipe for inspecting joinery, fabrics and textures.

• Fit and clearance sheets

  clear height, width and depth specs plus carton sizes so customers can check doorway clearances before buying.

• Checkout and fulfilment

  delivery time windows, split shipments and optional room-of-choice assembly, with map-assisted pin-drop addressing for accurate freight routing.

• Bilingual UI

  English and Arabic with in-app language switching and mirrored layouts, icons and carousels.

• A single typed Axios service layer centralises JWT token refresh, error normalisation and request cancellation for fast screen changes, keeping screens independent of API endpoints and easier to test.
• Redux Toolkit with normalised slices limits re-renders across deeply nested product variant data. redux-persist with secure local storage keeps the cart, recently viewed items, wishlist and chosen language across network drops and app restarts.
• Localisation uses i18next and expo-localization connected to Redux, while layout direction is handled through React Native's I18nManager and logical style properties (marginStart, marginEnd, paddingStart, paddingEnd).
• Images use expo-image with memory and disk caching and blurhash placeholders.

• 1

  Catalogue memory use

  ultra-high-resolution furniture photos were putting pressure on memory, so images are downsampled and thumbnails are cached.

• 2

  Variant explosion

  items with hundreds of finish and fabric combinations made recalculation slow. Memoised lookups over a normalised index keep selection responsive.

• 3

  Layout shift

  blurhash previews and fixed aspect-ratio containers stop content jumping while full-size images load.

• 4

  RTL glitches

  inconsistencies in horizontal carousels and icons were fixed by moving direction-sensitive styles into reusable logical style utilities and directional wrappers for chevrons, swipe gestures and badges.

A single codebase delivers a configurable furniture shopping experience in English and Arabic, with responsive variant selection, smooth image inspection, a cart and wishlist that survive restarts, and mirrored layouts that follow native Arabic conventions.