@fleetbase/fleetops-engine 0.6.68 → 0.6.70

package/addon/components/map/marker-card/vehicle.hbs

@@ -0,0 +1,78 @@
+{{!
+    The vehicle card the fleet-ops live map shows in a marker's popup and hover tooltip.
+    Shared with the dashboard's Live Fleet widget so both look the same. @vehicle is a vehicle
+    model or its index resource payload (the same attributes, plain JSON).
+    @variant: "popup" (default, a dark panel) or "tooltip" (inherits the tooltip's panel).
+}}
+<div class="w-[280px] max-w-[calc(100vw-2rem)] {{unless (eq @variant 'tooltip') 'rounded-lg bg-gray-900 shadow-lg p-1.5 text-white'}}" ...attributes>
+    <div class="flex items-center gap-1.5 text-xs font-semibold mb-1.5">
+        <span class="inline-block w-2 h-2 rounded-full {{if @vehicle.online 'bg-green-400' 'bg-red-500'}}"></span>
+        <span>{{or @vehicle.displayName @vehicle.display_name @vehicle.name}}</span>
+        <div
+            class="status-badge
+                {{if @vehicle.status (dasherize @vehicle.status) 'default'}}-status-badge status-badge-{{if @vehicle.status (dasherize @vehicle.status) 'default'}}
+                shadow-none ml-auto"
+        >
+            <span class="rounded-full text-[9px] px-1.5 py-0.5">{{n-a @vehicle.meta.status_label}}</span>
+        </div>
+    </div>
+    <div class="grid grid-cols-2 gap-1">
+        <div class="rounded bg-gray-900 shadow-md px-1.5 py-1 min-w-0">
+            <div class="text-[9px] font-semibold uppercase text-gray-400 leading-none">Vehicle #</div>
+            <div class="text-[11px] text-white leading-tight whitespace-normal break-words">{{n-a
+                    @vehicle.internal_id
+                    @vehicle.public_id
+                    @vehicle.plate_number
+                    @vehicle.serial_number
+                    @vehicle.vin
+                }}</div>
+        </div>
+        <div class="rounded bg-gray-900 shadow-md px-1.5 py-1 min-w-0">
+            <div class="text-[9px] font-semibold uppercase text-gray-400 leading-none">Driver</div>
+            <div class="text-[11px] text-white leading-tight whitespace-normal break-words">{{n-a @vehicle.driver_name}}</div>
+        </div>
+        <div class="rounded bg-gray-900 shadow-md px-1.5 py-1 min-w-0">
+            <div class="text-[9px] font-semibold uppercase text-gray-400 leading-none">{{t "resource.trailers"}}</div>
+            <div class="text-[11px] text-white leading-tight whitespace-normal break-words">
+                {{#each @vehicle.trailers as |trailer|}}
+                    <div class="flex items-center gap-1 min-w-0">
+                        <span class="inline-block w-1.5 h-1.5 rounded-full shrink-0 {{if trailer.online 'bg-green-400' 'bg-gray-500'}}"></span>
+                        <span class="truncate">{{or trailer.displayName trailer.display_name trailer.name trailer.public_id}}</span>
+                    </div>
+                {{else}}
+                    -
+                {{/each}}
+            </div>
+        </div>
+        <div class="rounded bg-gray-900 shadow-md px-1.5 py-1 min-w-0">
+            <div class="text-[9px] font-semibold uppercase text-gray-400 leading-none">{{t "resource.devices"}}</div>
+            <div class="text-[11px] text-white leading-tight whitespace-normal break-words">
+                {{#each @vehicle.devices as |device|}}
+                    <div class="flex items-center gap-1 min-w-0">
+                        <span class="inline-block w-1.5 h-1.5 rounded-full shrink-0 {{if device.online 'bg-green-400' 'bg-gray-500'}}"></span>
+                        <span class="truncate">{{or device.displayName device.display_name device.name device.device_id device.public_id}}</span>
+                    </div>
+                {{else}}
+                    -
+                {{/each}}
+            </div>
+        </div>
+        <div class="rounded bg-gray-900 shadow-md px-1.5 py-1 min-w-0">
+            <div class="text-[9px] font-semibold uppercase text-gray-400 leading-none">Order</div>
+            <div class="text-[11px] text-white leading-tight whitespace-normal break-words">{{n-a @vehicle.meta.current_order_reference}}</div>
+        </div>
+        <div class="rounded bg-gray-900 shadow-md px-1.5 py-1 min-w-0">
+            <div class="text-[9px] font-semibold uppercase text-gray-400 leading-none">Speed</div>
+            <div class="text-[11px] text-white leading-tight whitespace-normal break-words">{{n-a @vehicle.meta.speed_label}}</div>
+        </div>
+        <div class="rounded bg-gray-900 shadow-md px-1.5 py-1 min-w-0">
+            <div class="text-[9px] font-semibold uppercase text-gray-400 leading-none">Heading</div>
+            <div class="text-[11px] text-white leading-tight whitespace-normal break-words">{{n-a @vehicle.meta.heading_label}}</div>
+        </div>
+        <div class="rounded bg-gray-900 shadow-md px-1.5 py-1 min-w-0">
+            <div class="text-[9px] font-semibold uppercase text-gray-400 leading-none">Location</div>
+            <div class="text-[11px] text-white leading-tight whitespace-normal break-words">{{n-a @vehicle.meta.location_coordinates}}</div>
+        </div>
+    </div>
+</div>
+

package/addon/components/map/marker-card/vehicle.js

@@ -0,0 +1,3 @@
+import templateOnly from '@ember/component/template-only';
+
+export default templateOnly();

package/addon/components/modals/driver-form.hbs

@@ -41,14 +41,14 @@
                         <label>
                             {{t "common.email"}}
                         </label>
-                        <Input @value={{@options.driver.email}} @type="text" class="w-full form-input" placeholder={{t "common.email"}} />
+                        <Input @value={{@options.driver.email}} @type="text" class="w-full form-input" placeholder={{t "common.email"}} disabled={{@options.driver.is_staff_linked}} />
                     </div>
 
                     <div class="input-group">
                         <label>
                             {{t "common.phone"}}
                         </label>
-                        <PhoneInput @value={{@options.driver.phone}} @onInput={{fn (mut @options.driver.phone)}} class="form-input w-full" />
+                        <PhoneInput @value={{@options.driver.phone}} @onInput={{fn (mut @options.driver.phone)}} class="form-input w-full" disabled={{@options.driver.is_staff_linked}} />
                     </div>
 
                     <div class="input-group">

package/addon/components/modals/reset-profile-credentials.hbs

@@ -0,0 +1,23 @@
+<Modal::Default @modalIsOpened={{@modalIsOpened}} @options={{@options}} @confirm={{@onConfirm}} @decline={{@onDecline}}>
+    <div class="px-4 text-gray-900 dark:text-gray-50">
+        <div class="mb-1 text-base font-semibold">
+            {{t "profile-account.prompts.reset-password-heading" name=this.profile.name}}
+        </div>
+        <div class="text-sm mb-4">{{t "profile-account.prompts.reset-password-body"}}</div>
+        <InputGroup>
+            <div class="grid grid-cols-1 lg:grid-cols-2 gap-4">
+                <InputGroup @name={{t "profile-account.prompts.new-password"}} @type="password" @value={{this.password}} @wrapperClass="mb-0i" />
+                <InputGroup @name={{t "profile-account.prompts.confirm-new-password"}} @type="password" @value={{this.confirmPassword}} @wrapperClass="mb-0i" />
+            </div>
+        </InputGroup>
+        <InputGroup>
+            <Checkbox
+                @value={{this.sendCredentials}}
+                @label={{t "profile-account.prompts.send-new-credentials"}}
+                @onToggle={{fn (mut this.sendCredentials)}}
+                @alignItems="center"
+                @labelClass="mb-0i"
+            />
+        </InputGroup>
+    </div>
+</Modal::Default>

package/addon/components/modals/reset-profile-credentials.js

@@ -0,0 +1,70 @@
+import Component from '@glimmer/component';
+import { tracked } from '@glimmer/tracking';
+import { inject as service } from '@ember/service';
+import { INTERNAL_NAMESPACE, updateProfileFromResponse } from '../../utils/profile-login-actions';
+
+/**
+ * Resets the login password of a driver, contact or customer profile.
+ *
+ * Options:
+ * - `profile`: the driver or contact record
+ * - `endpoint`: the reset credentials endpoint (internal namespace)
+ * - `payload`: extra body params, or a function returning them
+ * - `onPasswordResetComplete(response)`: optional callback
+ */
+export default class ModalsResetProfileCredentialsComponent extends Component {
+    @service fetch;
+    @service intl;
+    @service notifications;
+    @tracked options = {};
+    @tracked password;
+    @tracked confirmPassword;
+    @tracked sendCredentials = true;
+    @tracked profile;
+
+    constructor(owner, { options }) {
+        super(...arguments);
+        this.profile = options.profile;
+        this.options = options;
+        this.setupOptions();
+    }
+
+    get extraPayload() {
+        const { payload } = this.options;
+        return (typeof payload === 'function' ? payload(this.profile) : payload) ?? {};
+    }
+
+    setupOptions() {
+        this.options.title = this.options.title ?? this.intl.t('profile-account.prompts.reset-password-title');
+        this.options.acceptButtonText = this.options.acceptButtonText ?? this.intl.t('profile-account.prompts.reset-password-accept');
+        this.options.declineButtonHidden = true;
+        this.options.confirm = async (modal) => {
+            modal.startLoading();
+
+            try {
+                const response = await this.fetch.post(
+                    this.options.endpoint,
+                    {
+                        ...this.extraPayload,
+                        password: this.password,
+                        password_confirmation: this.confirmPassword,
+                        send_credentials: this.sendCredentials,
+                    },
+                    { namespace: INTERNAL_NAMESPACE }
+                );
+
+                updateProfileFromResponse(this.profile, response);
+                this.notifications.success(this.intl.t('profile-account.prompts.reset-password-success'));
+
+                if (typeof this.options.onPasswordResetComplete === 'function') {
+                    this.options.onPasswordResetComplete(response);
+                }
+
+                modal.done();
+            } catch (error) {
+                this.notifications.serverError(error);
+                modal.stopLoading();
+            }
+        };
+    }
+}

package/addon/components/profile-identity-hint.hbs

@@ -0,0 +1,13 @@
+<div class="profile-identity-hint text-xs" {{did-insert this.lookupIdentity}} {{did-update this.lookupIdentity @email @phone}} ...attributes>
+    {{#if this.conflict}}
+        <div class="flex items-center space-x-1 text-yellow-600 dark:text-yellow-400" data-test-profile-identity-conflict>
+            <FaIcon @icon="triangle-exclamation" @size="xs" />
+            <span>{{this.conflict}}</span>
+        </div>
+    {{else if this.staff}}
+        <div class="flex items-center space-x-1 text-blue-600 dark:text-blue-400" data-test-profile-identity-staff>
+            <FaIcon @icon="circle-info" @size="xs" />
+            <span>{{t "profile-account.will-link-to-staff" name=(or this.staff.name this.staff.email this.staff.phone)}}</span>
+        </div>
+    {{/if}}
+</div>

package/addon/components/profile-identity-hint.js

@@ -0,0 +1,49 @@
+import Component from '@glimmer/component';
+import { tracked } from '@glimmer/tracking';
+import { inject as service } from '@ember/service';
+import { action } from '@ember/object';
+import { task, timeout } from 'ember-concurrency';
+
+/**
+ * Inline hint shown while creating a driver, contact or customer profile:
+ * tells the user when the entered email/phone belongs to an existing team
+ * member (the profile will be linked to that account) or cannot be used.
+ *
+ * Args: `@email`, `@phone`, `@type` ('driver' | 'customer' | 'contact'),
+ * `@ignore` (optional profile id).
+ */
+export default class ProfileIdentityHintComponent extends Component {
+    @service fetch;
+    @tracked staff = null;
+    @tracked conflict = null;
+
+    @action lookupIdentity() {
+        this.lookup.perform();
+    }
+
+    @task({ restartable: true }) *lookup() {
+        const { email, phone, type, ignore } = this.args;
+
+        if (!email && !phone) {
+            this.staff = null;
+            this.conflict = null;
+            return;
+        }
+
+        yield timeout(400);
+
+        const query = { type };
+        if (email) query.email = email;
+        if (phone) query.phone = phone;
+        if (ignore) query.ignore = ignore;
+
+        try {
+            const response = yield this.fetch.get('fleet-ops/lookup/profile-identity', query, { namespace: 'int/v1' });
+            this.staff = response?.staff ?? null;
+            this.conflict = response?.conflict ?? null;
+        } catch {
+            this.staff = null;
+            this.conflict = null;
+        }
+    }
+}

package/addon/components/telematic/hub.hbs

@@ -15,7 +15,7 @@
                 </div>
                 <div class="flex flex-shrink-0 items-center gap-2 whitespace-nowrap">
                     <Button @icon="refresh" @size="sm" @helpText={{t "common.reload"}} @onClick={{this.refresh}} />
-                    <Button @icon="plus" @text="Connect Provider" @type="primary" @size="sm" @onClick={{this.telematicActions.transition.create}} />
+                    <Button @icon="plus" @text="Connect Provider" @type="primary" @size="sm" @permission="fleet-ops create telematic" @onClick={{this.telematicActions.transition.create}} />
                 </div>
             </div>
         </section>

package/addon/components/widget/live-fleet.hbs

@@ -28,7 +28,8 @@
 
                 {{#if this.load.isIdle}}
                     {{! Drivers — fleetops' rotating tracking-marker matches the operational
-                         live-map's look and animates on heading changes. }}
+                         live-map's look and animates on heading changes. The popup and tooltip
+                         are the live map's own cards, fed from each marker's index-resource card. }}
                     {{#each this.drivers as |driver|}}
                         <layers.tracking-marker
                             @id={{driver.uuid}}
@@ -39,28 +40,11 @@
                             @draggable={{false}}
                             as |marker|
                         >
-                            <marker.popup @maxWidth="240" @minWidth="180">
-                                <div class="flex flex-row gap-2">
-                                    <div class="w-9 h-9 flex-shrink-0">
-                                        <img src={{or driver.avatar_url driver.vehicle_avatar}} alt={{driver.name}} class="rounded-md w-9 h-9 object-cover shadow-sm" />
-                                    </div>
-                                    <div class="flex-1 min-w-0">
-                                        <div class="text-xs font-semibold truncate">{{or driver.name "Driver"}}</div>
-                                        <div class="text-[11px]">
-                                            {{#if driver.current_order_uuid}}
-                                                <span class="text-blue-500"><FaIcon @icon="bolt" class="mr-1" />On order</span>
-                                            {{else if driver.online}}
-                                                <span class="text-green-500"><FaIcon @icon="circle" @size="2xs" class="mr-1" />Online</span>
-                                            {{else}}
-                                                <span class="text-gray-400"><FaIcon @icon="circle" @size="2xs" class="mr-1" />Offline</span>
-                                            {{/if}}
-                                        </div>
-                                        <div class="text-[10px] text-gray-400 mt-0.5 truncate">{{driver.lat}}, {{driver.lng}}</div>
-                                    </div>
-                                </div>
+                            <marker.popup @maxWidth="500" @minWidth="225">
+                                <Map::MarkerCard::Driver @driver={{or driver.card driver}} />
                             </marker.popup>
                             <marker.tooltip @permanent={{false}} @sticky={{true}} @direction="top">
-                                <div class="text-[11px] font-semibold">{{or driver.name "Driver"}}</div>
+                                <Map::MarkerCard::Driver @driver={{or driver.card driver}} @variant="tooltip" />
                             </marker.tooltip>
                         </layers.tracking-marker>
                     {{/each}}
@@ -77,27 +61,11 @@
                             @draggable={{false}}
                             as |marker|
                         >
-                            <marker.popup @maxWidth="240" @minWidth="180">
-                                <div class="flex flex-row gap-2">
-                                    <div class="w-9 h-9 flex-shrink-0">
-                                        <img src={{or vehicle.photo_url vehicle.avatar_url}} alt={{vehicle.name}} class="rounded-md w-9 h-9 object-cover shadow-sm" />
-                                    </div>
-                                    <div class="flex-1 min-w-0">
-                                        <div class="text-xs font-semibold truncate">{{or vehicle.name "Vehicle"}}</div>
-                                        {{#if vehicle.plate_number}}
-                                            <div class="text-[10px] text-gray-500 truncate">{{vehicle.plate_number}}</div>
-                                        {{/if}}
-                                        {{#if vehicle.driver_name}}
-                                            <div class="text-[11px] text-gray-600 dark:text-gray-300 truncate">
-                                                <FaIcon @icon="id-card" class="mr-1 text-gray-400" />{{vehicle.driver_name}}
-                                            </div>
-                                        {{/if}}
-                                        <div class="text-[10px] text-gray-400 mt-0.5 truncate">{{vehicle.lat}}, {{vehicle.lng}}</div>
-                                    </div>
-                                </div>
+                            <marker.popup @maxWidth="500" @minWidth="225">
+                                <Map::MarkerCard::Vehicle @vehicle={{or vehicle.card vehicle}} />
                             </marker.popup>
                             <marker.tooltip @permanent={{false}} @sticky={{true}} @direction="top">
-                                <div class="text-[11px] font-semibold">{{or vehicle.name "Vehicle"}}</div>
+                                <Map::MarkerCard::Vehicle @vehicle={{or vehicle.card vehicle}} @variant="tooltip" />
                             </marker.tooltip>
                         </layers.tracking-marker>
                     {{/each}}

package/addon/controllers/analytics/reports/index.js

@@ -29,6 +29,7 @@ export default class AnalyticsReportsIndexController extends Controller {
                 type: 'primary',
                 icon: 'plus',
                 onClick: this.reportActions.transition.create,
+                permission: 'iam create report',
             },
         ];
     }
@@ -39,6 +40,7 @@ export default class AnalyticsReportsIndexController extends Controller {
                 label: 'Delete selected...',
                 class: 'text-red-500',
                 fn: this.reportActions.bulkDelete,
+                permission: 'iam delete report',
             },
         ];
     }
@@ -81,10 +83,12 @@ export default class AnalyticsReportsIndexController extends Controller {
                     {
                         label: 'View report...',
                         fn: this.reportActions.transition.view,
+                        permission: 'iam view report',
                     },
                     {
                         label: 'Edit report...',
                         fn: this.reportActions.transition.edit,
+                        permission: 'iam update report',
                     },
                     {
                         separator: true,
@@ -92,6 +96,7 @@ export default class AnalyticsReportsIndexController extends Controller {
                     {
                         label: 'Delete report...',
                         fn: this.reportActions.delete,
+                        permission: 'iam delete report',
                     },
                 ],
                 sortable: false,

package/addon/controllers/connectivity/devices/index.js

@@ -65,12 +65,14 @@ export default class ConnectivityDevicesIndexController extends Controller {
             type: 'primary',
             icon: 'plus',
             onClick: this.deviceActions.transition.create,
+            permission: 'fleet-ops create device',
         },
         {
             text: this.intl.t('common.import'),
             type: 'magic',
             icon: 'upload',
             onClick: this.deviceActions.import,
+            permission: 'fleet-ops import device',
         },
         {
             text: this.intl.t('common.export'),
@@ -78,6 +80,7 @@ export default class ConnectivityDevicesIndexController extends Controller {
             iconClass: 'rotate-icon-45',
             wrapperClass: 'hidden md:flex',
             onClick: this.deviceActions.export,
+            permission: 'fleet-ops export device',
         },
     ];
 
@@ -87,6 +90,7 @@ export default class ConnectivityDevicesIndexController extends Controller {
             label: 'Delete selected...',
             class: 'text-red-500',
             fn: this.deviceActions.bulkDelete,
+            permission: 'fleet-ops delete device',
         },
     ];
 

package/addon/controllers/connectivity/fuel-providers/index.js

@@ -40,6 +40,7 @@ export default class ConnectivityFuelProvidersIndexController extends Controller
                 text: 'Connect Integration',
                 type: 'primary',
                 onClick: () => this.fuelIntegrationActions.transition.create(),
+                permission: 'fleet-ops create fuel-provider-connection',
             },
         ];
     }
@@ -51,6 +52,7 @@ export default class ConnectivityFuelProvidersIndexController extends Controller
             {
                 label: `Sync ${selected.length} selected`,
                 fn: () => selected.forEach((connection) => this.syncConnection(connection)),
+                permission: 'fleet-ops sync fuel-provider-connection',
             },
         ];
     }
@@ -125,11 +127,11 @@ export default class ConnectivityFuelProvidersIndexController extends Controller
                 sticky: 'right',
                 width: 60,
                 actions: [
-                    { label: 'Open Integration', fn: this.openConnection },
-                    { label: 'Edit Settings', fn: this.editConnection },
+                    { label: 'Open Integration', fn: this.openConnection, permission: 'fleet-ops view fuel-provider-connection' },
+                    { label: 'Edit Settings', fn: this.editConnection, permission: 'fleet-ops update fuel-provider-connection' },
                     { separator: true },
-                    { label: 'Test Connection', fn: this.testConnection },
-                    { label: 'Sync Transactions', fn: this.syncConnection },
+                    { label: 'Test Connection', fn: this.testConnection, permission: 'fleet-ops update fuel-provider-connection' },
+                    { label: 'Sync Transactions', fn: this.syncConnection, permission: 'fleet-ops sync fuel-provider-connection' },
                 ],
                 sortable: false,
                 filterable: false,

package/addon/controllers/connectivity/sensors/index.js

@@ -92,12 +92,14 @@ export default class ConnectivitySensorsIndexController extends Controller {
             type: 'primary',
             icon: 'plus',
             onClick: this.sensorActions.transition.create,
+            permission: 'fleet-ops create sensor',
         },
         {
             text: this.intl.t('common.import'),
             type: 'magic',
             icon: 'upload',
             onClick: this.sensorActions.import,
+            permission: 'fleet-ops import sensor',
         },
         {
             text: this.intl.t('common.export'),
@@ -105,6 +107,7 @@ export default class ConnectivitySensorsIndexController extends Controller {
             iconClass: 'rotate-icon-45',
             wrapperClass: 'hidden md:flex',
             onClick: this.sensorActions.export,
+            permission: 'fleet-ops export sensor',
         },
     ];
 
@@ -114,6 +117,7 @@ export default class ConnectivitySensorsIndexController extends Controller {
             label: 'Delete selected...',
             class: 'text-red-500',
             fn: this.sensorActions.bulkDelete,
+            permission: 'fleet-ops delete sensor',
         },
     ];
 

package/addon/controllers/connectivity/telematics/index.js

@@ -38,12 +38,14 @@ export default class ConnectivityTelematicsIndexController extends Controller {
             type: 'primary',
             icon: 'plus',
             onClick: this.telematicActions.transition.create,
+            permission: 'fleet-ops create telematic',
         },
         {
             text: this.intl.t('common.import'),
             type: 'magic',
             icon: 'upload',
             onClick: this.telematicActions.import,
+            permission: 'fleet-ops import telematic',
         },
         {
             text: this.intl.t('common.export'),
@@ -51,6 +53,7 @@ export default class ConnectivityTelematicsIndexController extends Controller {
             iconClass: 'rotate-icon-45',
             wrapperClass: 'hidden md:flex',
             onClick: this.telematicActions.export,
+            permission: 'fleet-ops export telematic',
         },
     ];
 
@@ -60,6 +63,7 @@ export default class ConnectivityTelematicsIndexController extends Controller {
             label: 'Delete selected...',
             class: 'text-red-500',
             fn: this.telematicActions.bulkDelete,
+            permission: 'fleet-ops delete telematic',
         },
     ];
 

package/addon/controllers/maintenance/equipment/index.js

@@ -46,14 +46,21 @@ export default class MaintenanceEquipmentIndexController extends Controller {
                 helpText: 'Change the layout',
             },
             { icon: 'refresh', onClick: this.equipmentActions.refresh, helpText: this.intl.t('common.refresh') },
-            { text: this.intl.t('common.new'), type: 'primary', icon: 'plus', onClick: this.equipmentActions.transition.create },
-            { text: this.intl.t('common.import'), type: 'magic', icon: 'upload', onClick: this.equipmentActions.import },
-            { text: this.intl.t('common.export'), icon: 'long-arrow-up', iconClass: 'rotate-icon-45', wrapperClass: 'hidden md:flex', onClick: this.equipmentActions.export },
+            { text: this.intl.t('common.new'), type: 'primary', icon: 'plus', onClick: this.equipmentActions.transition.create, permission: 'fleet-ops create equipment' },
+            { text: this.intl.t('common.import'), type: 'magic', icon: 'upload', onClick: this.equipmentActions.import, permission: 'fleet-ops import equipment' },
+            {
+                text: this.intl.t('common.export'),
+                icon: 'long-arrow-up',
+                iconClass: 'rotate-icon-45',
+                wrapperClass: 'hidden md:flex',
+                onClick: this.equipmentActions.export,
+                permission: 'fleet-ops export equipment',
+            },
         ];
     }
 
     get bulkActions() {
-        return [{ label: 'Delete selected...', class: 'text-red-500', fn: this.equipmentActions.bulkDelete }];
+        return [{ label: 'Delete selected...', class: 'text-red-500', fn: this.equipmentActions.bulkDelete, permission: 'fleet-ops delete equipment' }];
     }
 
     get columns() {

package/addon/controllers/maintenance/inspection-forms/index.js

@@ -17,12 +17,12 @@ export default class MaintenanceInspectionFormsIndexController extends Controlle
     get actionButtons() {
         return [
             { icon: 'refresh', onClick: this.inspectionFormActions.refresh, helpText: this.intl.t('common.refresh') },
-            { text: this.intl.t('common.new'), type: 'primary', icon: 'plus', onClick: this.inspectionFormActions.transition.create },
+            { text: this.intl.t('common.new'), type: 'primary', icon: 'plus', onClick: this.inspectionFormActions.transition.create, permission: 'fleet-ops create inspection-form' },
         ];
     }
 
     get bulkActions() {
-        return [{ label: 'Delete selected...', class: 'text-red-500', fn: this.inspectionFormActions.bulkDelete }];
+        return [{ label: 'Delete selected...', class: 'text-red-500', fn: this.inspectionFormActions.bulkDelete, permission: 'fleet-ops delete inspection-form' }];
     }
 
     get columns() {

package/addon/controllers/maintenance/inspection-submissions/index.js

@@ -23,12 +23,18 @@ export default class MaintenanceInspectionSubmissionsIndexController extends Con
     get actionButtons() {
         return [
             { icon: 'refresh', onClick: this.inspectionSubmissionActions.refresh, helpText: this.intl.t('common.refresh') },
-            { text: this.intl.t('common.new'), type: 'primary', icon: 'plus', onClick: this.inspectionSubmissionActions.transition.create },
+            {
+                text: this.intl.t('common.new'),
+                type: 'primary',
+                icon: 'plus',
+                onClick: this.inspectionSubmissionActions.transition.create,
+                permission: 'fleet-ops create inspection-submission',
+            },
         ];
     }
 
     get bulkActions() {
-        return [{ label: 'Delete selected...', class: 'text-red-500', fn: this.inspectionSubmissionActions.bulkDelete }];
+        return [{ label: 'Delete selected...', class: 'text-red-500', fn: this.inspectionSubmissionActions.bulkDelete, permission: 'fleet-ops delete inspection-submission' }];
     }
 
     get columns() {

package/addon/controllers/maintenance/maintenances/index.js

@@ -31,12 +31,14 @@ export default class MaintenanceMaintenancesIndexController extends Controller {
                 type: 'primary',
                 icon: 'plus',
                 onClick: this.maintenanceActions.transition.create,
+                permission: 'fleet-ops create maintenance',
             },
             {
                 text: this.intl.t('common.import'),
                 type: 'magic',
                 icon: 'upload',
                 onClick: this.maintenanceActions.import,
+                permission: 'fleet-ops import maintenance',
             },
             {
                 text: this.intl.t('common.export'),
@@ -44,6 +46,7 @@ export default class MaintenanceMaintenancesIndexController extends Controller {
                 iconClass: 'rotate-icon-45',
                 wrapperClass: 'hidden md:flex',
                 onClick: this.maintenanceActions.export,
+                permission: 'fleet-ops export maintenance',
             },
         ];
     }
@@ -55,6 +58,7 @@ export default class MaintenanceMaintenancesIndexController extends Controller {
                 label: 'Delete selected...',
                 class: 'text-red-500',
                 fn: this.maintenanceActions.bulkDelete,
+                permission: 'fleet-ops delete maintenance',
             },
         ];
     }

package/addon/controllers/maintenance/parts/index.js

@@ -46,14 +46,21 @@ export default class MaintenancePartsIndexController extends Controller {
                 helpText: 'Change the layout',
             },
             { icon: 'refresh', onClick: this.partActions.refresh, helpText: this.intl.t('common.refresh') },
-            { text: this.intl.t('common.new'), type: 'primary', icon: 'plus', onClick: this.partActions.transition.create },
-            { text: this.intl.t('common.import'), type: 'magic', icon: 'upload', onClick: this.partActions.import },
-            { text: this.intl.t('common.export'), icon: 'long-arrow-up', iconClass: 'rotate-icon-45', wrapperClass: 'hidden md:flex', onClick: this.partActions.export },
+            { text: this.intl.t('common.new'), type: 'primary', icon: 'plus', onClick: this.partActions.transition.create, permission: 'fleet-ops create part' },
+            { text: this.intl.t('common.import'), type: 'magic', icon: 'upload', onClick: this.partActions.import, permission: 'fleet-ops import part' },
+            {
+                text: this.intl.t('common.export'),
+                icon: 'long-arrow-up',
+                iconClass: 'rotate-icon-45',
+                wrapperClass: 'hidden md:flex',
+                onClick: this.partActions.export,
+                permission: 'fleet-ops export part',
+            },
         ];
     }
 
     get bulkActions() {
-        return [{ label: 'Delete selected...', class: 'text-red-500', fn: this.partActions.bulkDelete }];
+        return [{ label: 'Delete selected...', class: 'text-red-500', fn: this.partActions.bulkDelete, permission: 'fleet-ops delete part' }];
     }
 
     get columns() {