@fleetbase/fleetops-engine 0.6.48 → 0.6.50

package/addon/components/modals/update-order-activity.js

@@ -1,16 +1,21 @@
 import Component from '@glimmer/component';
 import { tracked } from '@glimmer/tracking';
 import { inject as service } from '@ember/service';
+import { action, get } from '@ember/object';
 import { task } from 'ember-concurrency';
+import config from 'ember-get-config';
+import { buildServiceStopsFromPayload } from '../../utils/route-visualization';
 
 export default class ModalsUpdateOrderActivityComponent extends Component {
     @service fetch;
+    @service intl;
     @service notifications;
     @service modalsManager;
     @tracked activityOptions = [];
     @tracked order;
     @tracked selectedActivity;
-    @tracked customActivity;
+    @tracked customActivity = {};
+    @tracked proofFiles = [];
 
     constructor(owner, { options = {} }) {
         super(...arguments);
@@ -18,9 +23,95 @@ export default class ModalsUpdateOrderActivityComponent extends Component {
         this.loadActivity.perform();
     }
 
+    get waypoints() {
+        const waypoints = this.order?.payload?.waypoints;
+        if (typeof waypoints?.toArray === 'function') {
+            return waypoints.toArray();
+        }
+
+        return Array.isArray(waypoints) ? waypoints : Array.from(waypoints ?? []);
+    }
+
+    get serviceStops() {
+        return buildServiceStopsFromPayload(this.order?.payload);
+    }
+
+    get activeStopId() {
+        const activeStop = this.order?.tracker_data?.active_stop;
+
+        return activeStop?.uuid ?? activeStop?.public_id ?? this.order?.payload?.current_waypoint_uuid ?? this.order?.payload?.current_waypoint;
+    }
+
+    get isMultipleWaypointOrder() {
+        return this.waypoints.length > 0;
+    }
+
+    get orderHasStarted() {
+        const status = this.order?.status;
+
+        return Boolean(this.order?.started || this.order?.started_at || (status && !['created', 'dispatched'].includes(status)));
+    }
+
+    get shouldUseWaypointActivity() {
+        return this.isMultipleWaypointOrder && this.orderHasStarted;
+    }
+
+    get currentWaypoint() {
+        if (!this.shouldUseWaypointActivity) {
+            return null;
+        }
+
+        const currentWaypointId = this.activeStopId;
+
+        if (currentWaypointId) {
+            const stop = this.serviceStops.find(({ place }) => {
+                return [place?.id, place?.uuid, place?.public_id, place?.waypoint_public_id].includes(currentWaypointId);
+            });
+
+            if (stop?.place) {
+                return stop.place;
+            }
+        }
+
+        return this.serviceStops.find(({ place }) => !place?.complete)?.place ?? this.serviceStops[0]?.place;
+    }
+
+    get currentWaypointId() {
+        const waypoint = this.currentWaypoint;
+
+        return waypoint?.id ?? waypoint?.public_id ?? waypoint?.uuid;
+    }
+
+    get currentWaypointProofSubjectId() {
+        const waypoint = this.currentWaypoint;
+
+        return waypoint?.waypoint_public_id ?? waypoint?.id ?? waypoint?.public_id ?? waypoint?.uuid;
+    }
+
+    get selectedActivityRecord() {
+        if (this.selectedActivity === 'custom') {
+            return this.customActivity;
+        }
+
+        return this.activityOptions[this.selectedActivity];
+    }
+
+    get selectedActivityRequiresPod() {
+        return Boolean(this.selectedActivityRecord?.require_pod);
+    }
+
+    get acceptedProofFileTypes() {
+        return ['image/jpeg', 'image/png', 'image/gif', 'image/webp'];
+    }
+
     @task *loadActivity() {
+        if (!this.order?.id) {
+            return [];
+        }
+
         try {
-            const activityOptions = yield this.fetch.get(`orders/next-activity/${this.order.id}`);
+            const params = this.shouldUseWaypointActivity && this.currentWaypointId ? { waypoint: this.currentWaypointId } : {};
+            const activityOptions = yield this.fetch.get(`orders/next-activity/${this.order.id}`, params);
             this.activityOptions = activityOptions;
             return activityOptions;
         } catch (err) {
@@ -31,21 +122,68 @@ export default class ModalsUpdateOrderActivityComponent extends Component {
     @task *submitActivity(modal) {
         modal.startLoading();
 
-        const activity = this.selectedActivity === 'custom' ? this.customActivity : this.activityOptions[this.selectedActivity];
+        const activity = this.selectedActivityRecord;
         if (this.selectedActivity === 'custom' && !activity.status && !activity.details && !activity.code) {
             modal.stopLoading();
             return this.notifications.warning(this.intl.t('fleet-ops.operations.orders.index.view.invalid-warning'));
         }
 
+        if (this.selectedActivityRequiresPod && this.proofFiles.length === 0) {
+            modal.stopLoading();
+            return this.notifications.warning('Photo proof of delivery is required for this activity.');
+        }
+
         try {
-            yield this.fetch.patch(`orders/update-activity/${this.order.id}`, { activity });
+            const proof = this.selectedActivityRequiresPod ? yield this.capturePhotoProof.perform() : null;
+            yield this.fetch.patch(`orders/update-activity/${this.order.id}`, { activity, proof: proof?.id ?? proof?.public_id });
+
+            if (typeof this.order?.reload === 'function') {
+                yield this.order.reload();
+            }
+
+            if (typeof this.order?.loadTrackerData === 'function') {
+                if (typeof this.order.set === 'function') {
+                    this.order.set('tracker_data', null);
+                }
+
+                yield this.order.loadTrackerData();
+            }
+
             this.modalsManager.setOption('activityCreated', activity);
             this.notifications.success(`Order activity has been updated to ${activity.status}`);
+            modal.done();
         } catch (error) {
             this.notifications.serverError(error);
         } finally {
             modal.stopLoading();
-            modal.done();
         }
     }
+
+    @task *capturePhotoProof() {
+        const [proofFile] = this.proofFiles;
+        const headers = this.fetch.getHeaders();
+        delete headers['Content-Type'];
+
+        const subjectId = this.currentWaypointProofSubjectId;
+        const subjectPath = subjectId ? `/${subjectId}` : '';
+        const url = [get(config, 'API.host'), get(config, 'API.namespace'), `orders/${this.order.id}/capture-photo${subjectPath}`].filter(Boolean).join('/');
+
+        const response = yield proofFile.upload(url, {
+            data: {
+                remarks: 'Verified by Photo',
+            },
+            headers,
+            withCredentials: true,
+        });
+
+        return response.json();
+    }
+
+    @action setProofFile(file) {
+        if (!file) {
+            return;
+        }
+
+        this.proofFiles = [file];
+    }
 }

package/addon/components/orchestrator/phase-builder.hbs

@@ -130,6 +130,27 @@
                         </InputGroup>
                     {{/if}}
 
+                    {{#if this.shouldShowVehiclePacking}}
+                        <InputGroup @name={{t "orchestrator.vehicle-packing"}}>
+                            <div class="grid grid-cols-2 gap-1">
+                                {{#each this.vehiclePackingOptions as |opt|}}
+                                    <button
+                                        type="button"
+                                        class="flex items-center justify-center gap-1.5 px-2 py-1.5 rounded border text-xs transition-colors
+                                            {{if
+                                                (eq this.draftPhase.vehiclePacking opt.value)
+                                                'bg-indigo-50 dark:bg-indigo-900/30 border-indigo-400 dark:border-indigo-600 text-indigo-700 dark:text-indigo-300'
+                                                'border-gray-200 dark:border-gray-600 text-gray-600 dark:text-gray-400 hover:border-gray-300 dark:hover:border-gray-500'
+                                            }}"
+                                        {{on "click" (fn this.setDraftOption "vehiclePacking" opt.value)}}
+                                    >
+                                        {{opt.label}}
+                                    </button>
+                                {{/each}}
+                            </div>
+                        </InputGroup>
+                    {{/if}}
+
                     {{! Constraint toggles }}
                     <InputGroup @name={{t "orchestrator.constraints"}}>
                         <div class="space-y-1.5">

package/addon/components/orchestrator/phase-builder.js

@@ -51,6 +51,7 @@ export default class OrchestratorPhaseBuilderComponent extends Component {
             label: this.intl.t(`orchestrator.mode-${mode.replace(/_/g, '-')}`),
             engine: 'greedy',
             allocationStrategy: 'route_aware',
+            vehiclePacking: 'minimize_vehicles',
             orderStatuses: ['created'],
             balanceWorkload: false,
             respectSkills: true,
@@ -130,6 +131,7 @@ export default class OrchestratorPhaseBuilderComponent extends Component {
             ...this.draftPhase,
             engine,
             allocationStrategy: engine === 'capacity' ? 'capacity_only' : (this.draftPhase.allocationStrategy ?? 'route_aware'),
+            vehiclePacking: this.draftPhase.vehiclePacking ?? 'minimize_vehicles',
         };
     }
 
@@ -158,10 +160,21 @@ export default class OrchestratorPhaseBuilderComponent extends Component {
         ];
     }
 
+    get vehiclePackingOptions() {
+        return [
+            { value: 'minimize_vehicles', label: this.intl.t('orchestrator.vehicle-packing-minimize-vehicles') },
+            { value: 'balanced', label: this.intl.t('orchestrator.vehicle-packing-balanced') },
+        ];
+    }
+
     get shouldShowAllocationStrategy() {
         return this.draftPhase?.mode === 'assign_vehicles' && this.draftPhase?.engine === 'vroom';
     }
 
+    get shouldShowVehiclePacking() {
+        return this.shouldShowAllocationStrategy && this.draftPhase?.allocationStrategy === 'capacity_only';
+    }
+
     get shouldShowRouteOptions() {
         return this.draftPhase?.engine !== 'capacity' && this.draftPhase?.allocationStrategy !== 'capacity_only';
     }

package/addon/components/orchestrator/resource-panel.hbs

@@ -69,16 +69,6 @@
                         }}"
                     {{on "click" (fn this.setVehicleFilter "all")}}
                 >{{t "orchestrator.filter-all"}}</button>
-                <button
-                    type="button"
-                    class="px-2 py-0.5 rounded text-xs transition-colors
-                        {{if
-                            (eq this.vehicleFilter 'active')
-                            'bg-indigo-500 text-white'
-                            'bg-gray-100 dark:bg-gray-700 text-gray-600 dark:text-gray-300 hover:bg-gray-200 dark:hover:bg-gray-600'
-                        }}"
-                    {{on "click" (fn this.setVehicleFilter "active")}}
-                >{{t "orchestrator.filter-active"}}</button>
                 <button
                     type="button"
                     class="px-2 py-0.5 rounded text-xs transition-colors

package/addon/components/orchestrator/resource-panel.js

@@ -59,12 +59,10 @@ export default class OrchestratorResourcePanelComponent extends Component {
             );
         }
 
-        if (this.vehicleFilter === 'active') {
-            vehicles = vehicles.filter((v) => v.status === 'active');
-        } else if (this.vehicleFilter === 'no-driver') {
+        if (this.vehicleFilter === 'no-driver') {
             vehicles = vehicles.filter((v) => !v.driver?.id);
         } else if (this.vehicleFilter === 'available') {
-            vehicles = vehicles.filter((v) => v.status === 'active' && !v.driver?.current_job);
+            vehicles = vehicles.filter((v) => v.status === 'available' && !v.driver?.current_job);
         }
 
         return vehicles;

package/addon/components/orchestrator-workbench.js

@@ -271,6 +271,7 @@ export default class OrchestratorWorkbenchComponent extends Component {
                 options: {
                     engine: phase.engine ?? 'greedy',
                     allocation_strategy: phase.allocationStrategy ?? 'route_aware',
+                    vehicle_packing: phase.vehiclePacking ?? 'minimize_vehicles',
                     balance_workload: phase.balanceWorkload ?? false,
                     respect_skills: phase.respectSkills ?? true,
                     respect_capacity: phase.respectCapacity ?? true,

package/addon/components/order/activity-list.hbs

@@ -1,5 +1,5 @@
 <div class="order-activity-list space-y-2">
-    {{#each @resource.tracking_statuses as |trackingStatus|}}
+    {{#each (or @activity @resource.tracking_statuses) as |trackingStatus|}}
         <div class="order-activity-list-item flex flex-row justify-between">
             <div class="flex flex-row">
                 <div class="w-8 pt-1">
@@ -31,4 +31,4 @@
             </div>
         </div>
     {{/each}}
-</div>
+</div>

package/addon/components/order/activity-timeline.hbs

@@ -1,33 +1,35 @@
-{{#if @resource.tracking_statuses}}
-    <Timeline @activity={{@resource.tracking_statuses}} @arrowClass="bg-gray-600 border border-gray-900 shadow-md" as |TimelineItem|>
-        <TimelineItem @activeStatus={{@resource.status}} as |trackingStatus|>
-            <div class="flex flex-col px-3 py-2 rounded text-sm leading-4 space-y-2 bg-gray-100 dark:bg-gray-900 dark:text-white">
-                <div class="flex flex-col space-y-1">
-                    <div class="text-xs font-semibold truncate">{{trackingStatus.status}}</div>
-                    <div class="text-xs truncate">{{n-a trackingStatus.details}}</div>
-                    <div class="text-xs">{{format-date-fns trackingStatus.created_at "d MMM HH:mm"}}</div>
+{{#let (or @activity @resource.tracking_statuses) as |activity|}}
+    {{#if activity.length}}
+        <Timeline @activity={{activity}} @arrowClass="bg-gray-600 border border-gray-900 shadow-md" as |TimelineItem|>
+            <TimelineItem @activeStatus={{@resource.status}} as |trackingStatus|>
+                <div class="flex flex-col px-3 py-2 rounded text-sm leading-4 space-y-2 bg-gray-100 dark:bg-gray-900 dark:text-white">
+                    <div class="flex flex-col space-y-1">
+                        <div class="text-xs font-semibold truncate">{{trackingStatus.status}}</div>
+                        <div class="text-xs truncate">{{n-a trackingStatus.details}}</div>
+                        <div class="text-xs">{{format-date-fns trackingStatus.created_at "d MMM HH:mm"}}</div>
+                    </div>
+                    <Attach::Tooltip @class="clean" @animation="scale" @placement="top">
+                        <InputInfo>
+                            <div class="text-xs">{{or trackingStatus.details trackingStatus.status}}</div>
+                            <div class="text-xs">{{format-date-fns trackingStatus.created_at "d MMM yyyy HH:mm"}}</div>
+                        </InputInfo>
+                    </Attach::Tooltip>
                 </div>
-                <Attach::Tooltip @class="clean" @animation="scale" @placement="top">
-                    <InputInfo>
-                        <div class="text-xs">{{or trackingStatus.details trackingStatus.status}}</div>
-                        <div class="text-xs">{{format-date-fns trackingStatus.created_at "d MMM yyyy HH:mm"}}</div>
-                    </InputInfo>
-                </Attach::Tooltip>
-            </div>
-        </TimelineItem>
-    </Timeline>
-{{else}}
-    <div class="min-h-24 p-4">
-        <div class="flex items-center justify-center border border-dashed border-gray-300 dark:border-gray-600 p-6 rounded-xl bg-gray-50 dark:bg-gray-800">
-            <div class="text-center">
-                <FaIcon @icon="layer-group" @size="2x" class="text-gray-400 mb-2" />
-                <div class="text-sm text-gray-600 dark:text-gray-400 font-medium">
-                    No order activity
-                </div>
-                <div class="text-xs text-gray-500 dark:text-gray-500 mt-1">
-                    Dispatch or update the order to create activity
+            </TimelineItem>
+        </Timeline>
+    {{else}}
+        <div class="min-h-24 p-4">
+            <div class="flex items-center justify-center border border-dashed border-gray-300 dark:border-gray-600 p-6 rounded-xl bg-gray-50 dark:bg-gray-800">
+                <div class="text-center">
+                    <FaIcon @icon="layer-group" @size="2x" class="text-gray-400 mb-2" />
+                    <div class="text-sm text-gray-600 dark:text-gray-400 font-medium">
+                        No order activity
+                    </div>
+                    <div class="text-xs text-gray-500 dark:text-gray-500 mt-1">
+                        Dispatch or update the order to create activity
+                    </div>
                 </div>
             </div>
         </div>
-    </div>
-{{/if}}
+    {{/if}}
+{{/let}}

package/addon/components/order/details/activity.hbs

@@ -6,8 +6,8 @@
     @wrapperClass="bordered-top"
 >
     {{#if (eq this.layout "timeline")}}
-        <Order::ActivityTimeline @resource={{@resource}} />
+        <Order::ActivityTimeline @resource={{@resource}} @activity={{this.parentOrderActivity}} />
     {{else}}
-        <Order::ActivityList @resource={{@resource}} />
+        <Order::ActivityList @resource={{@resource}} @activity={{this.parentOrderActivity}} />
     {{/if}}
-</ContentPanel>
+</ContentPanel>

package/addon/components/order/details/activity.js

@@ -9,6 +9,17 @@ export default class OrderDetailsActivityComponent extends Component {
     @service intl;
     @tracked layout = this.appCache.get('fleetops:order:activity:layout', 'timeline');
 
+    get parentOrderActivity() {
+        const orderTrackingNumberUuid = this.args.resource?.tracking_number_uuid;
+        const activity = this.args.resource?.tracking_statuses ?? [];
+
+        if (!orderTrackingNumberUuid) {
+            return activity;
+        }
+
+        return activity.filter((trackingStatus) => trackingStatus.tracking_number_uuid === orderTrackingNumberUuid);
+    }
+
     /* eslint-disable ember/no-side-effects */
     get actionButtons() {
         return [

package/addon/components/order/details/documents.js

@@ -39,6 +39,8 @@ export default class OrderDetailsDocumentsComponent extends Component {
                 file,
                 {
                     path: 'uploads/fleet-ops/order-files',
+                    subject_uuid: this.args.resource.id,
+                    subject_type: 'fleet-ops:order',
                     type: 'order_file',
                 },
                 (uploadedFile) => {

package/addon/components/order/details/purchase-rate.hbs

@@ -12,7 +12,7 @@
                     {{#each @resource.purchase_rate.service_quote.items as |item|}}
                         <tr class="border-b border-gray-100 dark:border-gray-800 last:border-0">
                             <td class="py-1 pr-2 text-gray-700 dark:text-gray-300">
-                                {{smart-humanize item.details}}
+                                {{item.details}}
                             </td>
                             <td class="py-1 pl-2 text-right font-medium text-gray-700 dark:text-gray-300 whitespace-nowrap">
                                 {{format-currency item.amount @resource.purchase_rate.service_quote.currency}}
@@ -33,4 +33,4 @@
             </table>
         </div>
     </ContentPanel>
-{{/if}}
+{{/if}}

package/addon/components/order/details/route.hbs

@@ -26,17 +26,25 @@
 
     {{#if @resource.hasIntermediateWaypoints}}
         <div>
-            <RouteList @order={{@resource}} @eta={{@resource.eta}} @waypointActions={{hash viewWaypointLabel=(hash label=(t "order.fields.get-label") fn=this.viewWaypointLabel)}} />
+            <RouteList
+                @order={{@resource}}
+                @eta={{if this.showRouteEtaData @resource.eta}}
+                @showEta={{this.showRouteEtaData}}
+                @waypointActions={{hash
+                    viewStopActivity=(hash label="View activity" fn=this.viewStopActivity)
+                    viewWaypointLabel=(hash label=(t "order.fields.get-label") fn=this.viewWaypointLabel)
+                }}
+            />
         </div>
     {{else}}
         <div class="grid grid-cols-1 lg:grid-cols-2 gap-4 lg:gap-2">
             <div class="field-info-container">
                 <label class="field-name">{{t "order.fields.pickup"}}</label>
-                <DisplayPlace @place={{@resource.payload.pickup}} @eta={{get @resource.eta @resource.payload.pickup.id}} />
+                <DisplayPlace @place={{@resource.payload.pickup}} @eta={{if this.showRouteEtaData (get @resource.eta @resource.payload.pickup.id)}} />
             </div>
             <div class="field-info-container">
                 <label class="field-name">{{t "order.fields.dropoff"}}</label>
-                <DisplayPlace @place={{@resource.payload.dropoff}} @eta={{get @resource.eta @resource.payload.dropoff.id}} />
+                <DisplayPlace @place={{@resource.payload.dropoff}} @eta={{if this.showRouteEtaData (get @resource.eta @resource.payload.dropoff.id)}} />
             </div>
             <div class="field-info-container">
                 <label class="field-name">{{t "order.fields.return"}}</label>

package/addon/components/order/details/route.js

@@ -41,23 +41,44 @@ export default class OrderDetailsRouteComponent extends Component {
                       isLoading: this.optimizeRoute.isRunning,
                   },
             {
-                type: 'default',
-                text: 'Edit',
-                icon: 'pencil',
-                iconPrefix: 'fas',
-                permission: 'fleet-ops update-route-for order',
-                disabled: this.args.resource.status === 'canceled',
-                onClick: () => {
-                    this.orderActions.editRoute(this.args.resource);
-                },
+                icon: 'ellipsis-h',
+                prefix: 'fas',
+                triggerClass: 'fleetops-btn-xxs',
+                items: [
+                    {
+                        text: 'Edit route',
+                        icon: 'pencil',
+                        disabled: !this.args.resource.hasActiveStatus,
+                        onClick: () => {
+                            this.orderActions.editRoute(this.args.resource);
+                        },
+                    },
+                    this.isMultipleWaypointOrder
+                        ? {
+                              text: 'Change destination',
+                              icon: 'location-dot',
+                              disabled: !this.args.resource.hasActiveStatus,
+                              onClick: () => {
+                                  this.changeDestination();
+                              },
+                          }
+                        : null,
+                ].filter(Boolean),
             },
-        ];
+        ].filter(Boolean);
     }
 
     get canOptimizeRoute() {
         return canOptimizeIntermediateWaypoints(this.args.resource?.payload);
     }
 
+    get isMultipleWaypointOrder() {
+        const waypoints = this.args.resource?.payload?.waypoints;
+        const waypointCount = typeof waypoints?.toArray === 'function' ? waypoints.toArray().length : Array.isArray(waypoints) ? waypoints.length : (waypoints?.length ?? 0);
+
+        return Boolean(this.args.resource?.hasIntermediateWaypoints || waypointCount > 0);
+    }
+
     get showOptimizationSelect() {
         return this.routeOptimization.availableEngines.length > 1;
     }
@@ -66,6 +87,17 @@ export default class OrderDetailsRouteComponent extends Component {
         return this.args.resource?.tracker_data;
     }
 
+    get showRouteEtaData() {
+        if (this.trackerData?.lifecycle?.show_live_eta !== undefined) {
+            return Boolean(this.trackerData.lifecycle.show_live_eta);
+        }
+
+        const status = String(this.args.resource?.status ?? 'created').toLowerCase();
+        const hasStarted = Boolean(this.args.resource?.started ?? this.args.resource?.started_at ?? status === 'started');
+
+        return hasStarted && !['completed', 'canceled'].includes(status);
+    }
+
     get hasTrackingRouteSummary() {
         return Boolean(this.trackerData?.route || this.trackerData?.eta);
     }
@@ -75,7 +107,7 @@ export default class OrderDetailsRouteComponent extends Component {
     }
 
     get hasCompletionEta() {
-        return Boolean(this.trackerData?.eta?.completion_at);
+        return this.showRouteEtaData && Boolean(this.trackerData?.eta?.completion_at);
     }
 
     get routeStopsCount() {
@@ -83,10 +115,14 @@ export default class OrderDetailsRouteComponent extends Component {
     }
 
     get hasTrackingDuration() {
-        return this.trackerData?.route?.duration_in_traffic_s !== null && this.trackerData?.route?.duration_in_traffic_s !== undefined;
+        return this.showRouteEtaData && this.trackerData?.route?.duration_in_traffic_s !== null && this.trackerData?.route?.duration_in_traffic_s !== undefined;
     }
 
     get trackingDurationSeconds() {
+        if (!this.showRouteEtaData) {
+            return null;
+        }
+
         return this.trackerData?.route?.duration_in_traffic_s ?? this.trackerData?.route?.duration_s;
     }
 
@@ -150,7 +186,48 @@ export default class OrderDetailsRouteComponent extends Component {
         yield this.hostRouter.refresh();
     }
 
-    @action async viewWaypointLabel(waypoint) {
+    @action changeDestination() {
+        this.modalsManager.show('modals/order-change-destination', {
+            title: 'Change destination',
+            order: this.args.resource,
+            acceptButtonText: 'Change destination',
+            declineButtonText: 'Close',
+            onChange: async () => {
+                if (typeof this.args.resource?.reload === 'function') {
+                    await this.args.resource.reload();
+                }
+
+                if (typeof this.args.resource?.set === 'function') {
+                    this.args.resource.set('tracker_data', null);
+                }
+
+                if (typeof this.args.resource?.loadTrackerData === 'function') {
+                    await this.args.resource.loadTrackerData();
+                }
+
+                await this.hostRouter.refresh();
+            },
+        });
+    }
+
+    @action viewStopActivity(stop) {
+        this.modalsManager.show('modals/stop-activity', {
+            title: 'Stop activity',
+            stop,
+            order: this.args.resource,
+            hideAcceptButton: true,
+            declineButtonText: 'Close',
+        });
+    }
+
+    @action async viewWaypointLabel(stop) {
+        const waypoint = stop?.place ?? stop;
+        const waypointId = waypoint?.waypoint_public_id ?? stop?.waypoint_public_id;
+        if (!waypointId) {
+            this.notifications.warning('Labels are only available for waypoint stops.');
+            return;
+        }
+
         this.modalsManager.show(`modals/order-label`, {
             title: 'Waypoint Label',
             modalClass: 'modal-xl',
@@ -161,7 +238,7 @@ export default class OrderDetailsRouteComponent extends Component {
         try {
             // eslint-disable-next-line no-undef
             const fileReader = new FileReader();
-            const { data: pdfStream } = await this.fetch.get(`orders/label/${waypoint.waypoint_public_id}?format=base64`);
+            const { data: pdfStream } = await this.fetch.get(`orders/label/${waypointId}?format=base64`);
             // eslint-disable-next-line no-undef
             const base64 = await fetch(`data:application/pdf;base64,${pdfStream}`);
             const blob = await base64.blob();