ubkerp.transport.module

Reusable React Native Transport Module for UBKERP (UBK INFOTECH PVT LTD). This package keeps authentication external and makes API + UI reusable.

Setup (library)

cd transport-module
npm i
npm run build

Install (consumer app)

npm i ubkerp.transport.module

Usage

A) Direct token

<TransportProvider apiBaseUrl="https://domain.com/api" authToken={token}>
  <StudentRouteDetailsScreen />
</TransportProvider>

B) Async token callback (recommended)

<TransportProvider
  apiBaseUrl="https://domain.com/api"
  getAuthToken={async () => {
    return await AsyncStorage.getItem('token');
  }}>
  <StudentRouteDetailsScreen />
</TransportProvider>

C) Custom headers (optional)

<TransportProvider
  apiBaseUrl="https://domain.com/api"
  headers={{
    Authorization: token,
  }}>
  <StudentRouteDetailsScreen />
</TransportProvider>

API Configuration

TransportProvider configures a dedicated Axios instance:

• Dynamic apiBaseUrl
• Dynamic headers (static headers + token injection)
• Axios interceptors
• Token refresh support (optional refreshAuthToken)
• Retry mechanism (configurable via retry)
• Global API error handling (optional onApiError)

Exports

export {
  TransportProvider,
  useTransport,
  TransportDashboard,
  StudentRouteDetailsScreen,
} from '@ubkerp/transport-module';

Example

Use the screen exports in your consumer app navigation.

Migration Strategy (incremental)

This library is designed to migrate your existing Transport module without rewriting the business logic.

Current Source Files (in ERP app)

• src/screens/TransportRoute/TransportRoute.jsx → dashboard/hub UI
• src/screens/TransportRoute/RouteTransport.jsx → student route details UI + API call
• src/screens/TransportRoute/TransportFee.jsx → transport fee UI + receipts (large; migrate after RouteDetails)
• src/api/fee_show_data.js → fee_show_data2() transport fee API
• src/api/apiService.js → generic GET/POST wrappers
• src/styles/TransportRoute/TransportRoute.styles.jsx → styles
• src/routes/StackNavigator.js → navigation registration (must stay in consumer app)

Move Order (recommended)

1. Services first (no UI)

• Move API calls into transport-module/src/services/**
• Keep endpoints unchanged; only remove hardcoded API_BASE_URL usage

2. Types

• Introduce strong TypeScript models in transport-module/src/types/**

3. Provider

• Add TransportProvider to replace internal AuthContext dependency

4. Screens

• Move screens into transport-module/src/screens/**
• Remove useNavigation() from screens; expose callbacks/props instead

5. Shared UI components

• Extract cards, loading/empty/error states into src/components/**

Refactoring Needed (safe + minimal)

• Replace API_BASE_URL imports with TransportProvider (apiBaseUrl)
• Replace AuthContext with external token injection (authToken / getAuthToken / headers)
• Keep request paths identical (example: /student/studentAPP/TransportDetails/studentRoutedetails)

Dependency Mapping (Transport module)

• Must be provided by consumer (peer deps): react, react-native
• Included by library: axios
• Optional consumer-level dependencies depending on migrated screens:
  • If you keep native-base, react-native-fast-image, @fortawesome/*, they should be added as peerDependencies later when those screens are migrated

Breaking Changes Prevention

• Preserve endpoint paths and payload shapes
• Avoid changing response parsing; wrap only for reusability
• Keep UI props backward compatible by adding optional props instead of changing required ones

Next Modules (planned)

• Transport Fee (fee_show_data2 + TransportFee screen)
• Vehicle / Driver / Route management (if present in ERP app)
• Pickup point + allocation screens
• GPS tracking + bus attendance + reports