@burdenoff/microfe-movethewheels 2026.510.105

package/src/movethewheels/hooks/useTracking.ts

@@ -0,0 +1,505 @@
+import { useCallback, useEffect, useMemo, useState } from 'react';
+import { useMoveTheWheels } from '../providers/MoveTheWheelsProvider';
+import type { Location, Tracking, TrackingAlert } from '../types';
+import { executeGraphQL } from '../utils/graphqlClient';
+import { useDriver, useDrivers, useVehicle, useVehicles } from './useFleet';
+import { useOrder, useOrders } from './useOrders';
+
+interface UseTrackingOptions {
+  entityId?: string;
+  entityType?: 'order' | 'vehicle' | 'driver';
+  realtime?: boolean;
+}
+
+interface UseTrackingResult {
+  tracking: Tracking[];
+  isLoading: boolean;
+  error: Error | null;
+  refetch: () => void;
+}
+
+interface ApiTrackingEvent {
+  id: string;
+  shipmentId: string;
+  eventType: string;
+  location?: Record<string, unknown> | null;
+  details?: string | null;
+  timestamp: string;
+}
+
+interface ApiShipment {
+  id: string;
+  shipmentNumber: string;
+  orderId: string;
+  status: string;
+  estimatedDelivery?: string | null;
+  trackingEvents?: ApiTrackingEvent[];
+}
+
+const SHIPMENTS_QUERY = `
+  query ListShipments($filter: ShipmentFilterInput, $pagination: PaginationInput) {
+    shipments(filter: $filter, pagination: $pagination) {
+      id
+      shipmentNumber
+      orderId
+      status
+      estimatedDelivery
+    }
+  }
+`;
+
+const SHIPMENT_QUERY = `
+  query GetShipment($id: ID!) {
+    shipment(id: $id) {
+      id
+      shipmentNumber
+      orderId
+      status
+      estimatedDelivery
+      trackingEvents {
+        id
+        shipmentId
+        eventType
+        location
+        details
+        timestamp
+      }
+    }
+  }
+`;
+
+const ORDER_TRACKING_QUERY = `
+  query GetOrderTracking($orderId: ID!) {
+    orderTracking(orderId: $orderId) {
+      id
+      shipmentId
+      eventType
+      location
+      details
+      timestamp
+    }
+  }
+`;
+
+const ACTIVE_DELIVERIES_QUERY = `
+  query GetActiveDeliveries {
+    activeDeliveries {
+      id
+      shipmentNumber
+      orderId
+      status
+      estimatedDelivery
+    }
+  }
+`;
+
+const TRACKING_ALERTS_QUERY = `
+  query GetTrackingAlerts {
+    trackingAlerts {
+      shipmentId
+      shipmentNumber
+      alertType
+      message
+    }
+  }
+`;
+
+function mapTrackingEventToTracking(event: ApiTrackingEvent, entityId: string): Tracking {
+  const location = {
+    latitude: Number((event.location?.latitude as number | undefined) ?? 0),
+    longitude: Number((event.location?.longitude as number | undefined) ?? 0),
+    address: (event.location?.address as string | undefined) ?? undefined,
+    timestamp: new Date(event.timestamp),
+  };
+
+  return {
+    id: event.id,
+    entityId,
+    entityType: 'order',
+    currentLocation: location,
+    locationHistory: [location],
+    status: event.eventType.toLowerCase(),
+    estimatedArrival: undefined,
+    nextCheckpoint: event.details ?? undefined,
+    alerts: [],
+    lastUpdated: new Date(event.timestamp),
+  };
+}
+
+function useGraphqlOptions() {
+  const { apiGatewayUrl, authToken, workspaceToken, workspaceId, tenantId, currentUser } =
+    useMoveTheWheels();
+  return useMemo(
+    () => ({
+      apiGatewayUrl,
+      authToken,
+      workspaceToken,
+      workspaceId,
+      tenantId,
+      actorId: currentUser?.id,
+    }),
+    [apiGatewayUrl, authToken, workspaceToken, workspaceId, tenantId, currentUser?.id]
+  );
+}
+
+export function useTracking(options: UseTrackingOptions = {}): UseTrackingResult {
+  const { entityId, entityType } = options;
+  const graphQLOptions = useGraphqlOptions();
+  const [tracking, setTracking] = useState<Tracking[]>([]);
+  const [isLoading, setIsLoading] = useState(false);
+  const [error, setError] = useState<Error | null>(null);
+
+  const load = useCallback(async () => {
+    setIsLoading(true);
+    setError(null);
+    try {
+      const data = await executeGraphQL<{ shipments: ApiShipment[] }>(
+        graphQLOptions,
+        SHIPMENTS_QUERY,
+        {
+          pagination: { limit: 200, offset: 0 },
+        }
+      );
+
+      const mapped = data.shipments.map((shipment) => ({
+        id: shipment.id,
+        entityId: shipment.orderId,
+        entityType: 'order' as const,
+        currentLocation: {
+          latitude: 0,
+          longitude: 0,
+          timestamp: new Date(),
+        },
+        locationHistory: [],
+        status: shipment.status.toLowerCase(),
+        estimatedArrival: shipment.estimatedDelivery
+          ? new Date(shipment.estimatedDelivery)
+          : undefined,
+        nextCheckpoint: shipment.shipmentNumber,
+        alerts: [],
+        lastUpdated: new Date(),
+      }));
+
+      const filtered = mapped.filter((item) => {
+        if (entityId && item.entityId !== entityId) return false;
+        if (entityType && item.entityType !== entityType) return false;
+        return true;
+      });
+
+      setTracking(filtered);
+    } catch (fetchError) {
+      setError(
+        fetchError instanceof Error ? fetchError : new Error('Failed to load tracking data')
+      );
+    } finally {
+      setIsLoading(false);
+    }
+  }, [entityId, entityType, graphQLOptions]);
+
+  useEffect(() => {
+    void load();
+  }, [load]);
+
+  return {
+    tracking,
+    isLoading,
+    error,
+    refetch: () => void load(),
+  };
+}
+
+export function useOrderTracking(orderId: string | undefined) {
+  const graphQLOptions = useGraphqlOptions();
+  const { order } = useOrder(orderId);
+  const [tracking, setTracking] = useState<Tracking | null>(null);
+  const [isLoading, setIsLoading] = useState(false);
+  const [error, setError] = useState<Error | null>(null);
+
+  const load = useCallback(async () => {
+    if (!orderId) {
+      setTracking(null);
+      return;
+    }
+
+    setIsLoading(true);
+    setError(null);
+    try {
+      const data = await executeGraphQL<{ orderTracking: ApiTrackingEvent[] }>(
+        graphQLOptions,
+        ORDER_TRACKING_QUERY,
+        {
+          orderId,
+        }
+      );
+      const latest = data.orderTracking[data.orderTracking.length - 1];
+      setTracking(latest ? mapTrackingEventToTracking(latest, orderId) : null);
+    } catch (fetchError) {
+      setError(
+        fetchError instanceof Error ? fetchError : new Error('Failed to load order tracking')
+      );
+    } finally {
+      setIsLoading(false);
+    }
+  }, [graphQLOptions, orderId]);
+
+  useEffect(() => {
+    void load();
+  }, [load]);
+
+  return { tracking, order, isLoading, error, refetch: () => void load() };
+}
+
+export function useVehicleTracking(vehicleId: string | undefined) {
+  const { vehicle, isLoading, error, refetch } = useVehicle(vehicleId);
+
+  const tracking = useMemo((): Tracking | null => {
+    if (!vehicle || !vehicle.currentLocation) return null;
+    return {
+      id: `vehicle-track-${vehicle.id}`,
+      entityId: vehicle.id,
+      entityType: 'vehicle',
+      currentLocation: vehicle.currentLocation,
+      locationHistory: [vehicle.currentLocation],
+      status: vehicle.status,
+      lastUpdated: vehicle.currentLocation.timestamp ?? new Date(),
+      alerts: [],
+    };
+  }, [vehicle]);
+
+  return { tracking, vehicle, isLoading, error, refetch };
+}
+
+export function useDriverTracking(driverId: string | undefined) {
+  const { driver, isLoading, error, refetch } = useDriver(driverId);
+
+  const tracking = useMemo((): Tracking | null => {
+    if (!driver || !driver.currentLocation) return null;
+    return {
+      id: `driver-track-${driver.id}`,
+      entityId: driver.id,
+      entityType: 'driver',
+      currentLocation: driver.currentLocation,
+      locationHistory: [driver.currentLocation],
+      status: driver.status,
+      lastUpdated: driver.currentLocation.timestamp ?? new Date(),
+      alerts: [],
+    };
+  }, [driver]);
+
+  return { tracking, driver, isLoading, error, refetch };
+}
+
+export function useLiveTracking() {
+  const graphQLOptions = useGraphqlOptions();
+  const { orders } = useOrders();
+  const { vehicles } = useVehicles();
+  const { drivers } = useDrivers();
+  const [activeDeliveries, setActiveDeliveries] = useState<
+    Array<{
+      order: (typeof orders)[number];
+      driver: (typeof drivers)[number] | null;
+      vehicle: (typeof vehicles)[number] | null;
+      tracking: Tracking | null;
+      estimatedArrival: Date | undefined;
+    }>
+  >([]);
+  const [isLoading, setIsLoading] = useState(false);
+  const [error, setError] = useState<Error | null>(null);
+
+  const load = useCallback(async () => {
+    setIsLoading(true);
+    setError(null);
+    try {
+      const data = await executeGraphQL<{ activeDeliveries: ApiShipment[] }>(
+        graphQLOptions,
+        ACTIVE_DELIVERIES_QUERY
+      );
+
+      const list = await Promise.all(
+        data.activeDeliveries.map(async (shipment) => {
+          const shipmentData = await executeGraphQL<{ shipment: ApiShipment | null }>(
+            graphQLOptions,
+            SHIPMENT_QUERY,
+            {
+              id: shipment.id,
+            }
+          );
+
+          const shipmentEvents = shipmentData.shipment?.trackingEvents ?? [];
+          const latestEvent = shipmentEvents[shipmentEvents.length - 1];
+          const order = orders.find((item) => item.id === shipment.orderId);
+          if (!order) {
+            return null;
+          }
+
+          const driver = order.driverId
+            ? (drivers.find(
+                (item) => item.id === order.driverId || item.userId === order.driverId
+              ) ?? null)
+            : null;
+          const vehicle = order.vehicleId
+            ? (vehicles.find((item) => item.id === order.vehicleId) ?? null)
+            : null;
+
+          return {
+            order,
+            driver,
+            vehicle,
+            tracking: latestEvent
+              ? mapTrackingEventToTracking(latestEvent, shipment.orderId)
+              : null,
+            estimatedArrival: shipment.estimatedDelivery
+              ? new Date(shipment.estimatedDelivery)
+              : undefined,
+          };
+        })
+      );
+
+      setActiveDeliveries(
+        list.filter(
+          (
+            item
+          ): item is {
+            order: (typeof orders)[number];
+            driver: (typeof drivers)[number] | null;
+            vehicle: (typeof vehicles)[number] | null;
+            tracking: Tracking | null;
+            estimatedArrival: Date | undefined;
+          } => item !== null
+        )
+      );
+    } catch (fetchError) {
+      setError(
+        fetchError instanceof Error ? fetchError : new Error('Failed to load live tracking')
+      );
+    } finally {
+      setIsLoading(false);
+    }
+  }, [drivers, graphQLOptions, orders, vehicles]);
+
+  useEffect(() => {
+    void load();
+  }, [load]);
+
+  return { activeDeliveries, isLoading, error, refetch: () => void load() };
+}
+
+export function useTrackingAlerts() {
+  const graphQLOptions = useGraphqlOptions();
+  const [alerts, setAlerts] = useState<TrackingAlert[]>([]);
+  const [isLoading, setIsLoading] = useState(false);
+  const [error, setError] = useState<Error | null>(null);
+
+  const load = useCallback(async () => {
+    setIsLoading(true);
+    setError(null);
+    try {
+      const data = await executeGraphQL<{
+        trackingAlerts: Array<{
+          shipmentId: string;
+          shipmentNumber: string;
+          alertType: string;
+          message: string;
+        }>;
+      }>(graphQLOptions, TRACKING_ALERTS_QUERY);
+
+      setAlerts(
+        data.trackingAlerts.map((alert) => ({
+          id: `${alert.shipmentId}-${alert.alertType}`,
+          type: 'delay',
+          severity: 'medium',
+          message: `${alert.shipmentNumber}: ${alert.message}`,
+          timestamp: new Date(),
+          acknowledged: false,
+        }))
+      );
+    } catch (fetchError) {
+      setError(
+        fetchError instanceof Error ? fetchError : new Error('Failed to load tracking alerts')
+      );
+    } finally {
+      setIsLoading(false);
+    }
+  }, [graphQLOptions]);
+
+  useEffect(() => {
+    void load();
+  }, [load]);
+
+  const unacknowledgedAlerts = useMemo(() => alerts.filter((item) => !item.acknowledged), [alerts]);
+
+  const acknowledgeAlert = useCallback(async (alertId: string): Promise<void> => {
+    setAlerts((previous) =>
+      previous.map((item) => (item.id === alertId ? { ...item, acknowledged: true } : item))
+    );
+  }, []);
+
+  return {
+    alerts,
+    unacknowledgedAlerts,
+    acknowledgeAlert,
+    isLoading,
+    error,
+    refetch: () => void load(),
+  };
+}
+
+export function useGeofence(center: Location, radiusKm: number) {
+  const { vehicles } = useVehicles();
+  const { drivers } = useDrivers();
+
+  const entitiesInRange = useMemo(() => {
+    const inRange: Array<{
+      type: 'vehicle' | 'driver';
+      entity: VehicleOrDriver;
+      distance: number;
+    }> = [];
+
+    vehicles.forEach((vehicle) => {
+      if (!vehicle.currentLocation) return;
+      const distance = calculateDistance(
+        center.latitude,
+        center.longitude,
+        vehicle.currentLocation.latitude,
+        vehicle.currentLocation.longitude
+      );
+      if (distance <= radiusKm) {
+        inRange.push({ type: 'vehicle', entity: vehicle, distance });
+      }
+    });
+
+    drivers.forEach((driver) => {
+      if (!driver.currentLocation) return;
+      const distance = calculateDistance(
+        center.latitude,
+        center.longitude,
+        driver.currentLocation.latitude,
+        driver.currentLocation.longitude
+      );
+      if (distance <= radiusKm) {
+        inRange.push({ type: 'driver', entity: driver, distance });
+      }
+    });
+
+    return inRange.sort((first, second) => first.distance - second.distance);
+  }, [center.latitude, center.longitude, drivers, radiusKm, vehicles]);
+
+  return { entitiesInRange, isLoading: false, error: null };
+}
+
+type VehicleOrDriver = { id: string; currentLocation?: Location };
+
+function calculateDistance(lat1: number, lon1: number, lat2: number, lon2: number): number {
+  const earthRadiusKm = 6371;
+  const dLat = toRadians(lat2 - lat1);
+  const dLon = toRadians(lon2 - lon1);
+  const a =
+    Math.sin(dLat / 2) * Math.sin(dLat / 2) +
+    Math.cos(toRadians(lat1)) * Math.cos(toRadians(lat2)) * Math.sin(dLon / 2) * Math.sin(dLon / 2);
+  const c = 2 * Math.atan2(Math.sqrt(a), Math.sqrt(1 - a));
+  return earthRadiusKm * c;
+}
+
+function toRadians(degrees: number): number {
+  return degrees * (Math.PI / 180);
+}

package/src/movethewheels/index.ts

@@ -0,0 +1,68 @@
+/**
+ * MoveTheWheels Microfrontend
+ *
+ * Provides a comprehensive logistics and supply chain management interface
+ * for orders, fleet, inventory, customers, and analytics.
+ *
+ * @example
+ * ```tsx
+ * import { MoveTheWheelsRoot, type MoveTheWheelsRootProps } from '@burdenoff/microfe-movethewheels';
+ *
+ * function App() {
+ *   const props: MoveTheWheelsRootProps = {
+ *     basePath: '/movethewheels',
+ *     navigate: (path) => router.push(path),
+ *     currentUser: { id: '1', email: 'user@example.com' },
+ *     workspaceId: 'ws-123',
+ *     apiGatewayUrl: 'https://api.example.com',
+ *     authToken: 'token',
+ *   };
+ *
+ *   return <MoveTheWheelsRoot {...props} />;
+ * }
+ * ```
+ */
+
+export { MoveTheWheelsRoot } from './MoveTheWheelsRoot';
+export type {
+  MoveTheWheelsRootProps,
+  MoveTheWheelsContextValue,
+  // Entity types
+  Order,
+  OrderItem,
+  OrderStatus,
+  OrderFilter,
+  Customer,
+  CustomerFilter,
+  Vehicle,
+  VehicleType,
+  VehicleStatus,
+  Driver,
+  DriverStatus,
+  Warehouse,
+  Inventory,
+  InventoryFilter,
+  Product,
+  Route,
+  Tracking,
+  Analytics,
+  ServiceProvider,
+  ServiceOffering,
+  Notification,
+  // Common types
+  Address,
+  Location,
+  Dimensions,
+  NavItem,
+  FooterItem,
+  User,
+  UserRole,
+} from './types';
+export { useMoveTheWheels, useMoveTheWheelsNavigate } from './providers/MoveTheWheelsProvider';
+export { useMoveTheWheelsStore } from './store/movethewheelsStore';
+
+// Re-export hooks
+export * from './hooks';
+
+// Re-export components
+export * from './components';