@fleetbase/fleetops-engine 0.3.8 → 0.3.9

package/addon/components/live-map.hbs

@@ -1,10 +1,33 @@
 <div class="live-map-component {{@wrapperClass}}" {{did-insert this.setupComponent}}>
-    <LeafletMap id={{this.mapId}} class={{@mapClass}} @lat={{this.latitude}} @lng={{this.longitude}} @zoom={{this.zoom}} @zoomControl={{@zoomControl}} @contextmenu={{true}} @contextmenuWidth={{140}} @contextmenuItems={{this.contextMenuItems}} @onLoad={{this.setupMap}} {{will-destroy this.closeChannels}} ...attributes as |layers|>
+    <LeafletMap
+        id={{this.mapId}}
+        class={{@mapClass}}
+        @lat={{this.latitude}}
+        @lng={{this.longitude}}
+        @zoom={{this.zoom}}
+        @zoomControl={{@zoomControl}}
+        @contextmenu={{true}}
+        @contextmenuWidth={{140}}
+        @contextmenuItems={{this.contextMenuItems}}
+        @onLoad={{this.setupMap}}
+        {{will-destroy this.closeChannels}}
+        ...attributes
+        as |layers|
+    >
         <layers.tile @url={{this.tileSourceUrl}} />
-
         {{#if this.visibilityControls.drivers}}
             {{#each this.drivers as |driver|}}
-                <layers.drift-marker @id={{driver.id}} @rotationAngle={{driver.heading}} @duration={{300}} @icon={{icon iconUrl=driver.vehicle_avatar iconSize=(array 24 24)}} @location={{point-to-coordinates driver.location}} @publicId={{driver.public_id}} @onAdd={{fn this.triggerAction "onDriverAdded" driver}} @onClick={{fn this.triggerAction "onDriverClicked" driver}} as |marker|>
+                <layers.drift-marker
+                    @id={{driver.id}}
+                    @rotationAngle={{driver.heading}}
+                    @duration={{300}}
+                    @icon={{icon iconUrl=(or driver.vehicle_avatar (config "defaultValues.vehicleAvatar")) iconSize=(array 24 24)}}
+                    @location={{point-to-coordinates driver.location}}
+                    @publicId={{driver.public_id}}
+                    @onAdd={{fn this.triggerAction "onDriverAdded" driver}}
+                    @onClick={{fn this.triggerAction "onDriverClicked" driver}}
+                    as |marker|
+                >
                     <marker.popup @maxWidth="500" @minWidth="225">
                         <DriverCard @driver={{driver}} @showCoordinates={{true}} @textClass="text-gray-900 dark:text-gray-100" />
                     </marker.popup>
@@ -15,7 +38,17 @@
 
         {{#if this.visibilityControls.vehicles}}
             {{#each this.vehicles as |vehicle|}}
-                <layers.drift-marker @id={{vehicle.id}} @rotationAngle={{vehicle.heading}} @duration={{300}} @icon={{icon iconUrl=vehicle.avatar_url iconSize=(array 24 24)}} @location={{point-to-coordinates vehicle.location}} @publicId={{vehicle.public_id}} @onAdd={{fn this.triggerAction "onVehicleAdded" vehicle}} @onClick={{fn this.triggerAction "onVehicleClicked" vehicle}} as |marker|>
+                <layers.drift-marker
+                    @id={{vehicle.id}}
+                    @rotationAngle={{vehicle.heading}}
+                    @duration={{300}}
+                    @icon={{icon iconUrl=(or vehicle.avatar_url (config "defaultValues.vehicleAvatar")) iconSize=(array 24 24)}}
+                    @location={{point-to-coordinates vehicle.location}}
+                    @publicId={{vehicle.public_id}}
+                    @onAdd={{fn this.triggerAction "onVehicleAdded" vehicle}}
+                    @onClick={{fn this.triggerAction "onVehicleClicked" vehicle}}
+                    as |marker|
+                >
                     <marker.tooltip @permanent={{false}} @sticky={{true}}>
                         <div>{{vehicle.displayName}}</div>
                         <div>{{if vehicle.online "Online" "Offline"}}</div>
@@ -26,7 +59,17 @@
 
         {{#if this.visibilityControls.places}}
             {{#each this.places as |place|}}
-                <layers.marker @id={{place.id}} @icon={{icon iconUrl="/engines-dist/images/building-marker.png" iconSize=(array 16 16)}} @location={{point-to-coordinates place.location}} @riseOnHover={{true}} @title={{place.address}} @alt={{place.address}} @onAdd={{fn this.triggerAction "onPlaceAdded" place}} @onClick={{fn this.triggerAction "onPlaceClicked" place}} as |marker|>
+                <layers.marker
+                    @id={{place.id}}
+                    @icon={{icon iconUrl="/engines-dist/images/building-marker.png" iconSize=(array 16 16)}}
+                    @location={{point-to-coordinates place.location}}
+                    @riseOnHover={{true}}
+                    @title={{place.address}}
+                    @alt={{place.address}}
+                    @onAdd={{fn this.triggerAction "onPlaceAdded" place}}
+                    @onClick={{fn this.triggerAction "onPlaceClicked" place}}
+                    as |marker|
+                >
                     <marker.popup>
                         <div>{{place.address}}</div>
                         <div>{{format-point place.location}}</div>
@@ -68,15 +111,41 @@
             {{/each}}
         {{/if}} --}}
 
-        <layers.draw-control @position="topright" @draw={{hash marker=false circlemarker=false circle=false polyline=false}} @onDrawDrawstop={{fn this.triggerAction "onDrawDrawstop"}} @onDrawDeleted={{fn this.triggerAction "onDrawDeleted"}} @onDrawEdited={{fn this.triggerAction "onDrawEdited"}} @onDrawDeletestart={{fn this.triggerAction "onDrawDeletestart"}} @onDrawEditstop={{fn this.triggerAction "onDrawEditstop"}} @onDrawControlCreated={{fn this.triggerAction "onDrawControlCreated"}} @onDrawFeatureGroupCreated={{fn this.triggerAction "onDrawFeatureGroupCreated"}} />
+        <layers.draw-control
+            @position="topright"
+            @draw={{hash marker=false circlemarker=false circle=false polyline=false}}
+            @onDrawDrawstop={{fn this.triggerAction "onDrawDrawstop"}}
+            @onDrawDeleted={{fn this.triggerAction "onDrawDeleted"}}
+            @onDrawEdited={{fn this.triggerAction "onDrawEdited"}}
+            @onDrawDeletestart={{fn this.triggerAction "onDrawDeletestart"}}
+            @onDrawEditstop={{fn this.triggerAction "onDrawEditstop"}}
+            @onDrawControlCreated={{fn this.triggerAction "onDrawControlCreated"}}
+            @onDrawFeatureGroupCreated={{fn this.triggerAction "onDrawFeatureGroupCreated"}}
+        />
 
         {{#each this.activeServiceAreas as |serviceArea|}}
-            <layers.polygon @id={{serviceArea.id}} @record={{serviceArea}} @locations={{serviceArea.bounds}} @fillColor={{serviceArea.color}} @color={{serviceArea.stroke_color}} @onAdd={{fn this.triggerAction "onServiceAreaLayerAdded" serviceArea}} as |polygon|>
+            <layers.polygon
+                @id={{serviceArea.id}}
+                @record={{serviceArea}}
+                @locations={{serviceArea.bounds}}
+                @fillColor={{serviceArea.color}}
+                @color={{serviceArea.stroke_color}}
+                @onAdd={{fn this.triggerAction "onServiceAreaLayerAdded" serviceArea}}
+                as |polygon|
+            >
                 <polygon.tooltip @permanent={{true}} @sticky={{true}}>{{serviceArea.name}} Service Area</polygon.tooltip>
             </layers.polygon>
 
             {{#each serviceArea.zones as |zone|}}
-                <layers.polygon @id={{zone.id}} @record={{zone}} @locations={{zone.locations}} @fillColor={{zone.color}} @color={{zone.stroke_color}} @onAdd={{fn this.triggerAction "onZoneLayerAdd" zone}} as |polygon|>
+                <layers.polygon
+                    @id={{zone.id}}
+                    @record={{zone}}
+                    @locations={{zone.locations}}
+                    @fillColor={{zone.color}}
+                    @color={{zone.stroke_color}}
+                    @onAdd={{fn this.triggerAction "onZoneLayerAdd" zone}}
+                    as |polygon|
+                >
                     <polygon.tooltip @permanent={{true}} @sticky={{true}}>{{zone.name}} Zone</polygon.tooltip>
                 </layers.polygon>
             {{/each}}
@@ -87,5 +156,17 @@
 </div>
 
 {{#if this.isDataLoaded}}
-    <LiveMapDrawer @tab={{@drawerTab}} @onTabChanged={{@onDrawerTabChanged}} @onResizeEnd={{@onDrawerResizeEnd}} @onResizeStart={{@onDrawerResizeStart}} @isMinimized={{@isDrawerMinimized}} @isOpen={{@isDrawerOpen}} @vehicles={{this.vehicles}} @drivers={{this.drivers}} @places={{this.places}} @liveMap={{this}} @onDrawerReady={{this.setDrawerContext}} />
+    <LiveMapDrawer
+        @tab={{@drawerTab}}
+        @onTabChanged={{@onDrawerTabChanged}}
+        @onResizeEnd={{@onDrawerResizeEnd}}
+        @onResizeStart={{@onDrawerResizeStart}}
+        @isMinimized={{@isDrawerMinimized}}
+        @isOpen={{@isDrawerOpen}}
+        @vehicles={{this.vehicles}}
+        @drivers={{this.drivers}}
+        @places={{this.places}}
+        @liveMap={{this}}
+        @onDrawerReady={{this.setDrawerContext}}
+    />
 {{/if}}

package/addon/components/live-map.js

@@ -297,7 +297,7 @@ export default class LiveMapComponent extends Component {
      */
     @action setupComponent() {
         // trigger that initial coordinates have been set
-        this.universe.trigger('fleetops.livemap.loaded', this);
+        this.universe.trigger('fleet-ops.live-map.loaded', this);
 
         // set initial coordinates
         this.setInitialCoordinates();
@@ -363,7 +363,7 @@ export default class LiveMapComponent extends Component {
 
     /**
      * Marks the LiveMapComponent as ready by setting the "isReady" property and triggering
-     * the "onReady" action and a "fleetops.livemap.ready" event.
+     * the "onReady" action and a "fleetops.live-map.ready" event.
      *
      * @memberof LiveMapComponent
      * @function
@@ -371,7 +371,7 @@ export default class LiveMapComponent extends Component {
     ready() {
         this.isReady = true;
         this.triggerAction('onReady');
-        this.universe.trigger('fleetops.livemap.ready', this);
+        this.universe.trigger('fleet-ops.live-map.ready', this);
     }
 
     /**
@@ -396,7 +396,7 @@ export default class LiveMapComponent extends Component {
                 this.isReady = true;
 
                 // trigger that initial coordinates is set to livemap component
-                this.universe.trigger('fleetops.livemap.has_coordinates', { latitude: this.latitude, longitude: this.longitude });
+                this.universe.trigger('fleet-ops.live-map.has_coordinates', { latitude: this.latitude, longitude: this.longitude });
 
                 return [this.latitude, this.longitude];
             }
@@ -413,7 +413,7 @@ export default class LiveMapComponent extends Component {
             this.isReady = true;
 
             // trigger that initial coordinates is set to livemap component
-            this.universe.trigger('fleetops.livemap.has_coordinates', { latitude: this.latitude, longitude: this.longitude });
+            this.universe.trigger('fleet-ops.live-map.has_coordinates', { latitude: this.latitude, longitude: this.longitude });
 
             return [this.latitude, this.longitude];
         }
@@ -425,7 +425,7 @@ export default class LiveMapComponent extends Component {
      * Sets up the LiveMap component and the Leaflet map instance.
      *
      * This function initializes the LiveMap component, associates it with the Leaflet map instance,
-     * triggers the "fleetops.livemap.leaflet_ready" event, and performs additional setup tasks like
+     * triggers the "fleetops.live-map.leaflet_ready" event, and performs additional setup tasks like
      * configuring context menus, hiding draw controls, and associating the map with the "serviceAreas"
      * service. It also triggers the "onLoad" action with the provided event and target.
      *
@@ -443,13 +443,13 @@ export default class LiveMapComponent extends Component {
         this.leafletMap = target;
 
         // trigger liveMap ready through universe
-        this.universe.trigger('fleetops.livemap.leaflet_ready', event, target);
+        this.universe.trigger('fleet-ops.live-map.leaflet_ready', event, target);
 
         // make fleetops map globally available on the window
         window.FleetOpsLeafletMap = target;
 
         // store this component to universe
-        this.universe.set('FleetOpsLiveMap', this);
+        this.universe.set('component:fleet-ops:live-map', this);
 
         // setup context menu
         this.createMapContextMenu(target);
@@ -1065,7 +1065,16 @@ export default class LiveMapComponent extends Component {
      */
     @action onDriverClicked(driver) {
         this.contextPanel.clear();
-        this.contextPanel.focus(driver);
+        this.contextPanel.focus(driver, 'viewing', {
+            args: {
+                width: '450px',
+                onOpen: () => {
+                    this.leafletMap.once('moveend', () => {
+                        this.leafletMap.panBy([200, 0]);
+                    });
+                },
+            },
+        });
     }
 
     /**
@@ -1113,7 +1122,16 @@ export default class LiveMapComponent extends Component {
      */
     @action onVehicleClicked(vehicle) {
         this.contextPanel.clear();
-        this.contextPanel.focus(vehicle);
+        this.contextPanel.focus(vehicle, 'viewing', {
+            args: {
+                width: '450px',
+                onOpen: () => {
+                    this.leafletMap.once('moveend', () => {
+                        this.leafletMap.panBy([200, 0]);
+                    });
+                },
+            },
+        });
     }
 
     /**
@@ -1910,7 +1928,6 @@ export default class LiveMapComponent extends Component {
                     }
 
                     // from the `get-active-order-coordinates` the responded coordinates will always be [longitude, latitude]
-                    // const [latitude, longitude] = extractCoordinates(coordinates.firstObject.coordinates);
                     const validCoordinates = coordinates.filter((point) => point.cordinates[0] !== 0);
                     const [longitude, latitude] = getWithDefault(validCoordinates, '0.coordiantes', [0, 0]);
 

package/addon/components/map-container/toolbar/zones-panel.js

@@ -2,8 +2,10 @@ import Component from '@glimmer/component';
 import { tracked } from '@glimmer/tracking';
 import { inject as service } from '@ember/service';
 import { action } from '@ember/object';
+import { later } from '@ember/runloop';
 import { classify } from '@ember/string';
 import { calculateInPlacePosition } from 'ember-basic-dropdown/utils/calculate-position';
+import { task } from 'ember-concurrency-decorators';
 
 /**
  * @class MapContainerToolbarZonesPanelComponent
@@ -66,10 +68,18 @@ export default class MapContainerToolbarZonesPanelComponent extends Component {
      */
     constructor() {
         super(...arguments);
+
         this.map = this.args.map;
         this.liveMap = this.args.liveMap;
-        this.fetchServiceAreas();
         this.serviceAreas.setMapInstance(this.args.map);
+
+        later(
+            this,
+            () => {
+                this.fetchServiceAreas.perform();
+            },
+            100
+        );
     }
 
     /**
@@ -115,21 +125,14 @@ export default class MapContainerToolbarZonesPanelComponent extends Component {
      * Fetch service areas and update state.
      * @memberof MapContainerToolbarZonesPanelComponent
      */
-    fetchServiceAreas() {
-        this.isLoading = true;
-
+    @task *fetchServiceAreas() {
         if (this.appCache.has('serviceAreas')) {
             this.serviceAreaRecords = this.appCache.getEmberData('serviceAreas', 'service-area');
         }
 
-        return this.store
-            .query('service-area', { with: ['zones'] })
-            .then((serviceAreaRecords) => {
-                this.serviceAreaRecords = serviceAreaRecords;
-                this.appCache.setEmberData('serviceAreas', serviceAreaRecords);
-            })
-            .finally(() => {
-                this.isLoading = false;
-            });
+        const serviceAreas = yield this.store.query('service-area', { with: ['zones'] });
+
+        this.serviceAreaRecords = serviceAreas;
+        this.appCache.setEmberData('serviceAreas', serviceAreas);
     }
 }

package/addon/components/place-form-panel.hbs

@@ -1,10 +1,13 @@
 <Overlay
     @onLoad={{this.setOverlayContext}}
+    @onOpen={{this.onOpen}}
+    @onClose={{this.onClose}}
+    @onToggle={{this.onToggle}}
     @position="right"
     @noBackdrop={{true}}
     @fullHeight={{true}}
     @isResizeble={{or this.isResizable @isResizable}}
-    @width={{or this.width @width "600px"}}
+    @width={{or this.width @width "570px"}}
 >
     <Overlay::Header
         @title={{if this.place.public_id this.place.name "New Place"}}

package/addon/components/place-panel.hbs

@@ -1,10 +1,13 @@
 <Overlay
     @onLoad={{this.setOverlayContext}}
+    @onOpen={{this.onOpen}}
+    @onClose={{this.onClose}}
+    @onToggle={{this.onToggle}}
     @position="right"
     @noBackdrop={{true}}
     @fullHeight={{true}}
     @isResizable={{or this.isResizable @isResizable}}
-    @width={{or this.width @width "600px"}}
+    @width={{or this.width @width "570px"}}
 >
     <Overlay::Header @title={{this.place.name}} @status={{this.place.public_id}} @hideStatusDot={{true}} @createdAt={{this.place.createdAt}}>
         <Button @type="default" @icon="pen" @helpText="Edit place" @onClick={{this.onEdit}} @wrapperClass="mr-2" />

package/addon/components/settings-window.hbs

@@ -1,4 +1,4 @@
-<Overlay @onLoad={{this.onLoad}} @isOpen={{@isOpen}} @position="right" @noBackdrop={{true}} @fullHeight={{true}} @isResizable={{true}} @isMaximizable={{true}} @isMinimizable={{true}} @width="600px" as |overlay|>
+<Overlay @onLoad={{this.onLoad}} @isOpen={{@isOpen}} @position="right" @noBackdrop={{true}} @fullHeight={{true}} @isResizable={{true}} @isMaximizable={{true}} @isMinimizable={{true}} @width="570px" as |overlay|>
     <Overlay::Header @overlay={{overlay}} @title="FleetOps Settings" @onPressCancel={{@onPressCancel}}>
         <Button @icon="save" @type="primary" @text={{if (media 'isMobile') "" "Save Changes"}} @onClick={{this.saveSettings}} @isLoading={{this.isSaving}} @disabled={{or this.isLoading this.isSaving}} />
     </Overlay::Header>

package/addon/components/vehicle-form-panel.hbs

@@ -1,10 +1,13 @@
 <Overlay
     @onLoad={{this.setOverlayContext}}
+    @onOpen={{this.onOpen}}
+    @onClose={{this.onClose}}
+    @onToggle={{this.onToggle}}
     @position="right"
     @noBackdrop={{true}}
     @fullHeight={{true}}
     @isResizeble={{or this.isResizable @isResizable}}
-    @width={{or this.width @width "600px"}}
+    @width={{or this.width @width "570px"}}
 >
     <Overlay::Header @hideLeftSection={{true}} @actionsWrapperClass="flex-1 flex-col py-3" class="h-auto-i min-h-[127px]">
         <div class="flex flex-row items-center justify-between w-full mb-4">

package/addon/components/vehicle-panel.hbs

@@ -1,10 +1,13 @@
 <Overlay
     @onLoad={{this.setOverlayContext}}
+    @onOpen={{this.onOpen}}
+    @onClose={{this.onClose}}
+    @onToggle={{this.onToggle}}
     @position="right"
     @noBackdrop={{true}}
     @fullHeight={{true}}
     @isResizable={{or this.isResizable @isResizable}}
-    @width={{or this.width @width "600px"}}
+    @width={{or this.width @width "570px"}}
 >
     <Overlay::Header @hideLeftSection={{true}} @actionsWrapperClass="flex-1 flex-col py-3" class="h-auto-i min-h-[127px]">
         <div class="flex flex-row items-center justify-between w-full mb-4">

package/addon/components/vendor-form-panel.hbs

@@ -1,10 +1,13 @@
 <Overlay
     @onLoad={{this.setOverlayContext}}
+    @onOpen={{this.onOpen}}
+    @onClose={{this.onClose}}
+    @onToggle={{this.onToggle}}
     @position="right"
     @noBackdrop={{true}}
     @fullHeight={{true}}
     @isResizeble={{or this.isResizable @isResizable}}
-    @width={{or this.width @width "600px"}}
+    @width={{or this.width @width "570px"}}
 >
     <Overlay::Header @hideLeftSection={{true}} @actionsWrapperClass="flex-1 flex-col py-3" class="h-auto-i">
         <div class="flex flex-row items-center justify-between w-full mb-4">

package/addon/components/vendor-panel.hbs

@@ -1,10 +1,13 @@
 <Overlay
     @onLoad={{this.setOverlayContext}}
+    @onOpen={{this.onOpen}}
+    @onClose={{this.onClose}}
+    @onToggle={{this.onToggle}}
     @position="right"
     @noBackdrop={{true}}
     @fullHeight={{true}}
     @isResizable={{or this.isResizable @isResizable}}
-    @width={{or this.width @width "600px"}}
+    @width={{or this.width @width "570px"}}
 >
     <Overlay::Header @hideLeftSection={{true}} @actionsWrapperClass="flex-1 flex-col py-3" class="h-auto-i">
         <div class="flex flex-row items-center justify-between w-full mb-4">

package/addon/controllers/management/drivers/index.js

@@ -6,8 +6,6 @@ import { isBlank } from '@ember/utils';
 import { equal } from '@ember/object/computed';
 import { timeout } from 'ember-concurrency';
 import { task } from 'ember-concurrency-decorators';
-import extractCoordinates from '@fleetbase/ember-core/utils/extract-coordinates';
-import leafletIcon from '@fleetbase/ember-core/utils/leaflet-icon';
 
 export default class ManagementDriversIndexController extends BaseController {
     /**
@@ -18,18 +16,18 @@ export default class ManagementDriversIndexController extends BaseController {
     @service notifications;
 
     /**
-     * Inject the `modals-manager` service
+     * Inject the `crud` service
      *
      * @var {Service}
      */
-    @service modalsManager;
+    @service crud;
 
     /**
-     * Inject the `crud` service
+     * Inject the `driverActions` service
      *
      * @var {Service}
      */
-    @service crud;
+    @service driverActions;
 
     /**
      * Inject the `store` service
@@ -412,7 +410,7 @@ export default class ManagementDriversIndexController extends BaseController {
                 },
                 {
                     label: 'Locate driver on map...',
-                    fn: this.viewOnMap,
+                    fn: this.locateDriver,
                 },
                 {
                     separator: true,
@@ -539,7 +537,7 @@ export default class ManagementDriversIndexController extends BaseController {
      * @void
      */
     @action deleteDriver(driver, options = {}) {
-        this.crud.delete(driver, {
+        this.driverActions.delete(driver, {
             onSuccess: () => {
                 return this.hostRouter.refresh();
             },
@@ -555,44 +553,7 @@ export default class ManagementDriversIndexController extends BaseController {
      * @void
      */
     @action assignOrder(driver, options = {}) {
-        this.modalsManager.show('modals/driver-assign-order', {
-            title: `Assign Order to this Driver`,
-            acceptButtonText: 'Assign Order',
-            acceptButtonIcon: 'check',
-            acceptButtonIconPrefix: 'fas',
-            acceptButtonDisabled: true,
-            hideDeclineButton: true,
-            selectedOrder: null,
-            selectOrder: (order) => {
-                this.modalsManager.setOption('selectedOrder', order);
-                this.modalsManager.setOption('acceptButtonDisabled', false);
-            },
-            driver,
-            confirm: (modal) => {
-                const selectedOrder = modal.getOption('selectedOrder');
-
-                if (!selectedOrder) {
-                    this.notifications.warning('No order selected!');
-                    return;
-                }
-
-                modal.startLoading();
-
-                driver.set('current_job_uuid', selectedOrder.id);
-
-                return driver
-                    .save()
-                    .then(() => {
-                        this.notifications.success(`${driver.name} assigned to order.`);
-                    })
-                    .catch((error) => {
-                        driver.rollbackAttributes();
-                        modal.stopLoading();
-                        this.notifications.serverError(error);
-                    });
-            },
-            ...options,
-        });
+        this.driverActions.assignOrder(driver, options);
     }
 
     /**
@@ -603,29 +564,7 @@ export default class ManagementDriversIndexController extends BaseController {
      * @void
      */
     @action assignVehicle(driver, options = {}) {
-        this.modalsManager.show('modals/driver-assign-vehicle', {
-            title: `Assign Vehicle to this Driver`,
-            acceptButtonText: 'Confirm & Create',
-            acceptButtonIcon: 'check',
-            acceptButtonIconPrefix: 'fas',
-            hideDeclineButton: true,
-            driver,
-            confirm: (modal) => {
-                modal.startLoading();
-
-                return driver
-                    .save()
-                    .then((driver) => {
-                        this.notifications.success(`${driver.name} assigned to vehicle.`);
-                    })
-                    .catch((error) => {
-                        driver.rollbackAttributes();
-                        modal.stopLoading();
-                        this.notifications.serverError(error);
-                    });
-            },
-            ...options,
-        });
+        this.driverActions.assignVehicle(driver, options);
     }
 
     /**
@@ -634,26 +573,7 @@ export default class ManagementDriversIndexController extends BaseController {
      * @param {DriverModel} driver
      * @void
      */
-    @action viewOnMap(driver, options = {}) {
-        const { location } = driver;
-        const [latitude, longitude] = extractCoordinates(location.coordinates);
-
-        this.modalsManager.show('modals/point-map', {
-            title: `Location of ${driver.name}`,
-            acceptButtonText: 'Done',
-            acceptButtonIcon: 'check',
-            acceptButtonIconPrefix: 'fas',
-            modalClass: 'modal-lg',
-            hideDeclineButton: true,
-            latitude,
-            longitude,
-            location,
-            popupText: `${driver.name} (${driver.public_id})`,
-            icon: leafletIcon({
-                iconUrl: driver?.vehicle_avatar,
-                iconSize: [40, 40],
-            }),
-            ...options,
-        });
+    @action locateDriver(driver, options = {}) {
+        this.driverActions.locate(driver, options);
     }
 }

package/addon/controllers/management/vehicles/index.js

@@ -22,11 +22,11 @@ export default class ManagementVehiclesIndexController extends BaseController {
     @service notifications;
 
     /**
-     * Inject the `modals-manager` service
+     * Inject the `vehicleActions` service
      *
      * @var {Service}
      */
-    @service modalsManager;
+    @service vehicleActions;
 
     /**
      * Inject the `store` service
@@ -386,13 +386,13 @@ export default class ManagementVehiclesIndexController extends BaseController {
                     label: 'Edit vehicle...',
                     fn: this.editVehicle,
                 },
+                {
+                    label: 'Locate vehicle...',
+                    fn: this.locateVehicle,
+                },
                 {
                     separator: true,
                 },
-                // {
-                //     label: 'Assign driver to vehicle...',
-                //     fn: this.assignDriver,
-                // },
                 {
                     label: 'Delete vehicle...',
                     fn: this.deleteVehicle,
@@ -503,7 +503,7 @@ export default class ManagementVehiclesIndexController extends BaseController {
      * @void
      */
     @action deleteVehicle(vehicle, options = {}) {
-        this.crud.delete(vehicle, {
+        this.vehicleActions.delete(vehicle, {
             onSuccess: () => {
                 return this.hostRouter.refresh();
             },
@@ -522,23 +522,13 @@ export default class ManagementVehiclesIndexController extends BaseController {
     @action assignDriver() {}
 
     /**
-     * View a place location on map
+     * View a vehicle location on map
      *
-     * @param {PlaceModel} place
+     * @param {VehicleModel} vehicle
      * @param {Object} options
      * @void
      */
-    @action viewOnMap(place, options = {}) {
-        const { latitude, longitude } = place;
-
-        this.modalsManager.show('modals/point-map', {
-            title: `Location of ${place.name}`,
-            acceptButtonText: 'Done',
-            hideDeclineButton: true,
-            latitude,
-            longitude,
-            location: [latitude, longitude],
-            ...options,
-        });
+    @action locateVehicle(vehicle, options = {}) {
+        this.vehicleActions.locate(vehicle, options);
     }
 }