Mobile Overview

Microtec ERP has three mobile applications, all built with Flutter and managed with Melos monorepo tooling. Each app targets Android and iOS.

---

Apps at a Glance

App	Directory	Platform	Primary Users
BoMobileApp	BoMobileApp/	Android, iOS	Business Owners — tenant admins
ERPMobileApps	ERPMobileApps/	Android, iOS	ERP users — accountants, managers
VanSalesMobileApp	VanSalesMobileApp/	Android, iOS	Field sales agents — offline-capable

---

Shared Submodule Packages

All three apps share a set of Git submodule packages:

Package	Path	Purpose
MobileDesignSystem	MobileDesignSystem/	Shared UI component library — typography, colours, widgets
MobileAPIClients	MobileAPIClients/	Auto-generated API clients (OpenAPI codegen)
MobileSharedComp	MobileSharedComp/	Shared utilities — helpers, constants, base classes

---

Melos Tooling

Each app uses Melos to manage the monorepo of Flutter packages within it. Melos provides consistent commands across all apps.

Install Melos

dart pub global activate melos

Common Melos Commands

# First-time setup — bootstraps all packages and submodules
melos run init

# Install / update dependencies across all packages
melos run get

# Run the app (debug mode)
melos run run

# Build Android APK
melos run build-apk

# Run all tests
melos run test

These commands are the same in every app (BoMobileApp/, ERPMobileApps/, VanSalesMobileApp/).

---

Architecture

Each mobile app follows a layered architecture:

<AppName>/
├── lib/
│   ├── core/               # App config, constants, DI setup
│   ├── data/               # Data sources (API clients, local DB)
│   ├── domain/             # Business logic, entities, use cases
│   ├── presentation/       # Screens, widgets, state management
│   └── main.dart
├── android/                # Android-specific configs
├── ios/                    # iOS-specific configs
└── melos.yaml              # Melos workspace config

---

Authentication

All mobile apps authenticate via Keycloak OIDC using the PKCE flow (no client secret stored on device). Tokens are stored in secure storage and refreshed automatically.

• BoMobileApp: businessowner realm
• ERPMobileApps: microtec realm
• VanSalesMobileApp: microtec realm

---

API Connectivity

Mobile apps communicate with the backend through the same Gateway.API used by the web frontend. The MobileAPIClients package contains auto-generated Dart clients for each backend service.

Backend Service	Used By
BusinessOwners.Apis	BoMobileApp
AppsPortal.Apis	ERPMobileApps
Inventory.Apis	ERPMobileApps, VanSalesMobileApp
Attachment.Apis	All apps (file upload)
Notification.Apis	All apps (push notifications)

---

Environment Configuration

Each app has environment config files for dev, stage, and production:

// lib/core/config/environment.dart
class Environment {
  static const apiBaseUrl = String.fromEnvironment('API_BASE_URL');
  static const keycloakUrl = String.fromEnvironment('KEYCLOAK_URL');
}

Pass environment variables at build time:

flutter build apk --dart-define=API_BASE_URL=https://gateway.onlinemicrotec.com.sa

---

Related Documentation

• BoMobileApp — Business Owner app deep-dive