Selfie+

Overview

React Native mobile app for the Selfie Time loyalty program, shipped across iOS + Android. Covers 20 feature domains: auth, profile, vouchers, points/badges, transactions, gallery, sharing, news feeds, surveys, queue, scan, promo games, app updates, and FAQ/legal. Recently led the upgrade to React Native 0.79.6 New Architecture (bridgeless) + React 19, with full OpenTelemetry instrumentation (custom AxiosOTelInterceptor + MobileOTelService) and Firebase Crashlytics.

Architected around a feature-folder structure (src/features/<domain>/) with co-located screens, hooks, and data slices. State is split: Redux Toolkit + Redux Persist (AsyncStorage) for session/user, TanStack Query v5 for server state with query-key cache invalidation. Deep links via selfietime.id://.

Key Features

Auth & Onboarding

• Google, Apple, Facebook social login + email registration with verification
• Forgot password, name alphabet validation, profile-completion prompt
• Registration with location + outlet selection

Profile

• My Profile redesign with QR code user ID
• User info edit (name/email/phone/DOB/city/province)
• Delete account flow (iOS gated), About us screen

Notifications

• FCM integration with token sync to DB; Notifee migration (replaced legacy push-notification)
• Local + scheduled notifications, per-notification read/unread, realtime badge
• Voucher expiry reminders at 9 AM, background message handling

Vouchers & Loyalty

• My Voucher: valid/invalid, sold-out state, grayscale expired, valid-from dates
• Buy Voucher + BuyVoucherDetail with query invalidation + birthday voucher logic
• Birthday gift: 7-day claim window, next-voucher chain, claims tracking
• Request refund form (WhatsApp deep-link)

Points, Badges & Rewards

• PointSaya + PointTransactionHistory (auto-refresh, pull-to-refresh)
• PointsDetail with badge icons, locking logic, carousel
• Redeem history hook; point expiry info + movement history (in flight)

Transactions & Gallery

• Transaction history with status filter, pin, membership flag
• TransactionDetail: locked/unlocked photos, gallery open, voucher calc, video support
• Image + video download (URL validate, MIME, CameraRoll save, armeabi-v7a fallback)
• Gallery lightbox w/ video; VideoThumbnail + thumbnail caching
• Transaction feedback/survey modal (good/bad, employee attribution)
• Bundle transactions (cross-sell child image queries)

Sharing / Instagram Stories

• Native iOS Instagram Stories sharing module
• StoryComposition: Simple (cross-platform) + ViewShot (Skia background capture)
• Background image + watermark share utils, FileProvider on Android

News Feeds & Content

• NewsFeed (all / video / gallery / articles)
• BlogDetail + YouTube viewer with autoplay + shorts-like overlay
• Instagram feed list + open-in-instagram
• TiptapHtmlRenderer for rich content

Queue / Antrian

• Queue page + QueueDetail UI + QueueMonitor
• MyQueue animated status badge, focus-aware polling, haptic feedback

Scan / QR

• ScanQR screen + bottom tab for transaction validation

Camera & Photo Tools

• Image cropper, camera (Android foreground/focus gate)
• Color matrix grayscale for expired images

Promo Games

• THR Catcher: full game engine (GameCanvas/GameItem), level auto-advance, balance/HUD, claim-reward API, debug logger
• Ocean Catcher: assets + integration (merged)
• Claw Game 17an: in flight (unmerged)

App Update Policy

• Version checking + block updater if newer
• Soft update prompt + blocking gate with version headers (in flight)

FAQ / Legal / Terms

• FAQ screen with dropdown, Privacy Policy + Terms of Usage, refund timeframes

Telemetry & Observability

• OpenTelemetry: AxiosOTelInterceptor + MobileOTelService + CriticalOperations
• Dev-only logger utility (replaces console.*)
• ErrorBoundary + Crashlytics + global error handler

Tech Stack

• React Native 0.79.6 (New Architecture / bridgeless) + React 19 + TypeScript
• Redux Toolkit + Redux Persist (AsyncStorage); TanStack Query v5 for server state
• React Navigation v7 (native-stack + bottom-tabs + material-top-tabs)
• NativeWind v4 (Tailwind CSS), React Hook Form + Zod
• Skia for image processing; react-native-image-crop-picker, view-shot, video, share
• Notifee + Firebase (FCM, Crashlytics, Analytics, Messaging)
• AppsFlyer attribution; react-native-maps + Geolocation
• OpenTelemetry end-to-end (custom interceptor + service)
• Jest tests, patch-package, ProGuard, 16KB Android page-size support

Role

Fullstack Developer at PT Intinya Technology. Own upgrades, performance work, and feature implementation end-to-end across 20 feature domains. Coordinate with UI/UX team on design implementation and with backend on the Laravel/Go services that power the app.