Dealz Dash

Dealz Dash is an Expo React Native application for e‑commerce operations. It delivers a professional QR/barcode scanning experience and mobile workflows for order picking/packing, inventory adjustments, and operational analytics.

Built with Expo Router, tRPC, React Query, NativeWind, MMKV, Better Auth, and MongoDB (Prisma). Uses Bun as the package manager.

Features

• Professional QR/Barcode Scanner
  • Full‑screen camera with guides, animations, flash control, and haptics
  • Auto detection for products, invoices, orders, and backend data
  • Scan history with MMKV storage and verify flow
• E‑commerce Workflows
  • Order picking/packing screens and inventory actions
  • Product and product model edit routes
• App Architecture & UX
  • Expo Router with tab navigation (Home, Profile)
  • Light/Dark theme with NativeWind tokens
  • Shadcn‑style RN primitives (buttons, cards, inputs, dialogs, etc.)
• Auth & Data
  • Google OAuth via Better Auth for Expo
  • tRPC v11 with React Query, SuperJSON, split HTTP/WS ready

Tech Stack

• App: Expo SDK 53, React Native 0.79, React 19, TypeScript 5.9
• Navigation: Expo Router v5, @react-navigation/bottom-tabs
• Styling: NativeWind v4 (Tailwind CSS 3), Tailwind Animate, Reanimated
• UI: @rn-primitives (shadcn/ui for RN), Lucide React Native icons
• State & Data: React Query v5, MMKV, Context API
• Auth: Better Auth + @better-auth/expo
• API: tRPC v11, SuperJSON
• Storage/DB: MongoDB Atlas + Prisma (via backend)
• Camera & Device: expo-camera, expo-blur, expo-linear-gradient, more
• Tooling: Bun, EAS Build, ESLint/Prettier

Repository Structure

app/                    # Expo Router routes (including (tabs), domain routes, scanner)
components/             # UI primitives and reusable form components
hooks/                  # App hooks (auth, updates, scan history, TRPC helpers)
lib/                    # Clients, parsers, query utilities, icons
navigation/             # Imperative navigator wiring when needed
screens/                # Screen components (Home, Profile, Scanner, Auth, Sales Order)
storage/                # MMKV storage wrappers
styles/                 # Theme and global styles
utils/                  # Helpers, error handling, responsive utilities
.agent-os/              # Product docs (mission, decisions, roadmap)
.windsurf/rules/        # Internal rules and tech decisions

Getting Started

Prerequisites

• Bun (recommended): https://bun.sh
• Node 22 LTS (for tooling compatibility)
• Xcode (iOS) and/or Android Studio (Android) for device simulators

Install

bun install

Environment

• Copy .env.preview to .env and fill values.
• .env is git‑ignored by default.

Run (Development)

# Start Expo (choose platform in prompt)
bunx expo start

# Direct to device/simulator
bunx expo start --ios
bunx expo start --android
bunx expo start --web

Build

# Requires EAS project configured
bunx eas build -p ios
bunx eas build -p android

Key Workflows

• Scanner
  • Route: app/scan.tsx and screens/QRScannerScreen.tsx
  • Utilities: lib/qr-parser.ts, lib/scan-actions.ts, storage/scan-history-storage.ts
• Auth
  • Hook: hooks/useAuth.tsx with lib/auth-client.ts
  • Screen: screens/auth/login.tsx (Google OAuth)
• Navigation
  • Tabs: app/(tabs)/_layout.tsx, app/(tabs)/home.tsx, app/(tabs)/profile.tsx
  • Root layout: app/_layout.tsx

Conventions & Notes

• Styling Rule: Use style on View instead of className.
  • Replace <View className="..."> with <View style={...}> across overlays, top bars, containers, and wrappers.
• tRPC Usage: Prefer singleton utilities with queryOptions/mutationOptions and React Query’s useQuery/useMutation. Invalidate via queryClient.invalidateQueries(queryOptions); avoid trpc.useQuery directly.
• Package Manager: Bun
  • Install deps: bun install
  • Run scripts: bun run <script> or bunx <cmd> for package executables

Scripts

Common commands (via Bun):

# Development
bunx expo start

# Lint/format (if configured)
bun run lint
bun run format

# Typecheck
bun run typecheck

Environment Variables

• EXPO_PUBLIC_API_URL – Backend base URL for tRPC
• Auth and platform secrets as per .env.preview

Troubleshooting

• iOS/Android simulator issues: reset Metro cache and clear build folders.

bunx expo start -c

• Camera permissions: ensure grant in OS settings if denied.
• Network: scanners and tRPC depend on reachable backend URL.

License

This repository is part of the Dealz Dash project.