@fleetbase/fleetops-engine 0.6.38 → 0.6.40

package/addon/components/modals/order-config-new-status.hbs

@@ -1,9 +1,5 @@
 <Modal::Default @modalIsOpened={{@modalIsOpened}} @options={{@options}} @confirm={{@onConfirm}} @decline={{@onDecline}}>
     <div class="modal-body-container">
-        <InputGroup
-            @name={{t "modals.order-config-new-status.new-status"}}
-            @value={{@options.statusName}}
-            @helpText={{t "modals.order-config-new-status.status-text"}}
-        />
+        <InputGroup @name={{t "modals.order-config-new-status.new-status"}} @value={{@options.statusName}} @helpText={{t "modals.order-config-new-status.status-text"}} />
     </div>
 </Modal::Default>

package/addon/components/modals/scheduling-conflict.hbs

@@ -0,0 +1,47 @@
+<Modal::Default @modalIsOpened={{@modalIsOpened}} @options={{@options}} @confirm={{@onConfirm}} @decline={{@onDecline}}>
+    <div class="modal-body-container">
+        <div class="grid grid-cols-1 gap-4 text-xs dark:text-gray-100">
+
+            {{! ── Warning banner ─────────────────────────────────────────────── }}
+            <div class="flex items-start gap-3 rounded-lg bg-yellow-50 dark:bg-yellow-900/20 border border-yellow-300 dark:border-yellow-700 px-3 py-3">
+                <FaIcon @icon="triangle-exclamation" class="text-yellow-500 mt-0.5 flex-shrink-0" />
+                <p class="text-yellow-800 dark:text-yellow-200 leading-relaxed">
+                    {{t "scheduler.conflict-description" driverName=@options.driver.name orderTracking=@options.order.tracking}}
+                </p>
+            </div>
+
+            {{! ── Conflicting events list ─────────────────────────────────────── }}
+            <div class="rounded-md border border-yellow-200 dark:border-yellow-700 overflow-hidden">
+                <div class="bg-yellow-50 dark:bg-yellow-900/20 px-3 py-2 font-semibold text-yellow-800 dark:text-yellow-300 uppercase tracking-wide">
+                    {{t "scheduler.conflicting-orders"}}
+                </div>
+                <div class="divide-y divide-gray-200 dark:divide-gray-700">
+                    {{#each @options.conflicts as |conflict|}}
+                        <div class="flex items-center justify-between px-3 py-2">
+                            <div class="flex items-center gap-2">
+                                <FaIcon @icon="box" class="text-gray-400" />
+                                <span class="font-medium">{{conflict.tracking}}</span>
+                            </div>
+                            <span class="text-gray-500 dark:text-gray-400">
+                                {{conflict.scheduledAtTime}}
+                            </span>
+                        </div>
+                    {{/each}}
+                </div>
+            </div>
+
+            {{! ── Resolution prompt ───────────────────────────────────────────── }}
+            <p class="text-gray-600 dark:text-gray-400">
+                {{t "scheduler.conflict-resolution-prompt"}}
+            </p>
+
+            {{! ── Resolution buttons ──────────────────────────────────────────── }}
+            <div class="flex items-center gap-2 justify-end">
+                <Button @type="default" @text={{t "common.cancel"}} @icon="times" @size="sm" @onClick={{@onDecline}} />
+                <Button @type="default" @text={{t "scheduler.auto-adjust"}} @icon="wand-magic-sparkles" @size="sm" @isLoading={{@options.isLoading}} @onClick={{this.autoAdjust}} />
+                <Button @type="danger" @text={{t "scheduler.assign-anyway"}} @icon="triangle-exclamation" @size="sm" @isLoading={{@options.isLoading}} @onClick={{this.assignAnyway}} />
+            </div>
+
+        </div>
+    </div>
+</Modal::Default>

package/addon/components/modals/scheduling-conflict.js

@@ -0,0 +1,53 @@
+import Component from '@glimmer/component';
+import { action } from '@ember/object';
+import { inject as service } from '@ember/service';
+
+/**
+ * Modals::SchedulingConflict
+ *
+ * Surfaces a scheduling conflict when an order is dragged onto a driver row
+ * that already has an overlapping event. Provides three resolution paths:
+ *
+ *   1. Cancel         — close the modal, leave the order unscheduled
+ *   2. Auto-Adjust    — call @options.autoAdjust to find the next available slot
+ *   3. Assign Anyway  — call @options.assignAnyway to force the assignment
+ *
+ * Options accepted (set via modalsManager.show):
+ *   - order        {Order}    The order being scheduled
+ *   - driver       {Driver}   The target driver
+ *   - conflicts    {Array}    Existing events that overlap the requested slot
+ *   - scheduledAt  {Date}     The originally requested start time
+ *   - autoAdjust   {Function} (modalsManager, done) => Promise
+ *   - assignAnyway {Function} (modalsManager, done) => Promise
+ */
+export default class ModalsSchedulingConflictComponent extends Component {
+    @service modalsManager;
+
+    /**
+     * Trigger the auto-adjust resolution path.
+     * Calls @options.autoAdjust(modalsManager, done) so the controller can
+     * start loading, find the best-fit slot, assign, and close the modal.
+     */
+    @action
+    autoAdjust() {
+        const { autoAdjust } = this.args.options;
+        if (typeof autoAdjust === 'function') {
+            const done = () => this.modalsManager.done();
+            autoAdjust(this.modalsManager, done);
+        }
+    }
+
+    /**
+     * Trigger the assign-anyway resolution path.
+     * Calls @options.assignAnyway(modalsManager, done) so the controller can
+     * skip the conflict check and force the assignment.
+     */
+    @action
+    assignAnyway() {
+        const { assignAnyway } = this.args.options;
+        if (typeof assignAnyway === 'function') {
+            const done = () => this.modalsManager.done();
+            assignAnyway(this.modalsManager, done);
+        }
+    }
+}

package/addon/components/modals/send-work-order.hbs

@@ -0,0 +1,91 @@
+<Modal::Default @modalIsOpened={{@modalIsOpened}} @options={{@options}} @confirm={{@onConfirm}} @decline={{@onDecline}}>
+    <div class="modal-body-container">
+        <div class="text-sm text-gray-600 dark:text-gray-400 mb-4">
+            Review the details below before sending. The work order will be emailed to the assigned vendor.
+        </div>
+
+        {{! ── Work Order details ── }}
+        <div class="rounded-lg border border-gray-200 dark:border-gray-700 overflow-hidden mb-4">
+            <div class="bg-gray-50 dark:bg-gray-800 px-3 py-2 border-b border-gray-200 dark:border-gray-700">
+                <span class="text-xs font-semibold uppercase tracking-wide text-gray-500 dark:text-gray-400">Work Order</span>
+            </div>
+            <div class="px-3 py-3 space-y-2">
+                <div class="flex items-start justify-between gap-4">
+                    <span class="text-xs text-gray-500 dark:text-gray-400 shrink-0 w-20">Subject</span>
+                    <span class="text-xs font-medium text-gray-800 dark:text-gray-100 text-right">
+                        {{n-a (or @options.workOrder.subject @options.workOrder.target_name)}}
+                    </span>
+                </div>
+                <div class="flex items-start justify-between gap-4">
+                    <span class="text-xs text-gray-500 dark:text-gray-400 shrink-0 w-20">ID</span>
+                    <span class="text-xs font-mono text-gray-600 dark:text-gray-300 text-right">
+                        {{n-a @options.workOrder.public_id}}
+                    </span>
+                </div>
+                <div class="flex items-start justify-between gap-4">
+                    <span class="text-xs text-gray-500 dark:text-gray-400 shrink-0 w-20">Status</span>
+                    <span class="text-xs text-right">
+                        <Badge @status={{@options.workOrder.status}}>{{smart-humanize @options.workOrder.status}}</Badge>
+                    </span>
+                </div>
+                {{#if @options.workOrder.due_at}}
+                    <div class="flex items-start justify-between gap-4">
+                        <span class="text-xs text-gray-500 dark:text-gray-400 shrink-0 w-20">Due</span>
+                        <span class="text-xs text-gray-600 dark:text-gray-300 text-right">
+                            {{format-date-fns @options.workOrder.due_at}}
+                        </span>
+                    </div>
+                {{/if}}
+            </div>
+        </div>
+
+        {{! ── Recipient (vendor) details ── }}
+        <div class="rounded-lg border border-gray-200 dark:border-gray-700 overflow-hidden">
+            <div class="bg-gray-50 dark:bg-gray-800 px-3 py-2 border-b border-gray-200 dark:border-gray-700">
+                <span class="text-xs font-semibold uppercase tracking-wide text-gray-500 dark:text-gray-400">Recipient</span>
+            </div>
+            {{#if @options.vendorName}}
+                <div class="px-3 py-3 space-y-2">
+                    <div class="flex items-center gap-3">
+                        <div class="flex-shrink-0 w-8 h-8 rounded-full bg-blue-100 dark:bg-blue-900 flex items-center justify-center">
+                            <FaIcon @icon="building" class="text-blue-500 dark:text-blue-300 text-xs" />
+                        </div>
+                        <div class="flex-1 min-w-0">
+                            <div class="text-sm font-medium text-gray-800 dark:text-gray-100 truncate">
+                                {{@options.vendorName}}
+                            </div>
+                            {{#if @options.vendorEmail}}
+                                <div class="text-xs text-gray-500 dark:text-gray-400 truncate flex items-center gap-1 mt-0.5">
+                                    <FaIcon @icon="envelope" class="text-gray-400 text-[10px]" />
+                                    {{@options.vendorEmail}}
+                                </div>
+                            {{/if}}
+                            {{#if @options.vendorPhone}}
+                                <div class="text-xs text-gray-500 dark:text-gray-400 truncate flex items-center gap-1 mt-0.5">
+                                    <FaIcon @icon="phone" class="text-gray-400 text-[10px]" />
+                                    {{@options.vendorPhone}}
+                                </div>
+                            {{/if}}
+                        </div>
+                    </div>
+                </div>
+            {{else}}
+                <div class="px-3 py-3">
+                    <div class="flex items-center gap-2 text-amber-600 dark:text-amber-400">
+                        <FaIcon @icon="triangle-exclamation" class="text-sm" />
+                        <span class="text-xs">No vendor assigned to this work order.</span>
+                    </div>
+                </div>
+            {{/if}}
+        </div>
+
+        {{#unless @options.vendorEmail}}
+            <div class="mt-3 flex items-start gap-2 p-3 rounded-lg bg-red-50 dark:bg-red-900/20 border border-red-200 dark:border-red-800">
+                <FaIcon @icon="circle-exclamation" class="text-red-500 dark:text-red-400 text-sm mt-0.5 shrink-0" />
+                <span class="text-xs text-red-700 dark:text-red-300">
+                    The assigned vendor does not have an email address on file. Please update the vendor record before sending.
+                </span>
+            </div>
+        {{/unless}}
+    </div>
+</Modal::Default>

package/addon/components/modals/send-work-order.js

@@ -0,0 +1,3 @@
+import Component from '@glimmer/component';
+
+export default class ModalsSendWorkOrderComponent extends Component {}

package/addon/components/modals/service-area-form.hbs

@@ -1,11 +1,6 @@
 <Modal::Default @modalIsOpened={{@modalIsOpened}} @options={{@options}} @confirm={{@onConfirm}} @decline={{@onDecline}}>
     <div class="modal-body-container">
-        <InputGroup
-            @value={{@options.serviceArea.name}}
-            @name={{t "modals.service-area-form.name"}}
-            @helpText={{t "modals.service-area-form.name-text"}}
-            @required={{true}}
-        />
+        <InputGroup @value={{@options.serviceArea.name}} @name={{t "modals.service-area-form.name"}} @helpText={{t "modals.service-area-form.name-text"}} @required={{true}} />
         <InputGroup @name={{t "modals.service-area-form.type"}} @helpText={{t "modals.service-area-form.type-text"}}>
             <Select
                 @options={{@options.serviceAreaTypes}}

package/addon/components/modals/set-driver-availability.hbs

@@ -0,0 +1,50 @@
+<Modal::Default @modalIsOpened={{@modalIsOpened}} @options={{@options}} @confirm={{@onConfirm}} @decline={{@onDecline}}>
+    <div class="modal-body-container">
+        <div class="grid grid-cols-1 gap-4 text-xs dark:text-gray-100">
+
+            {{! Availability type selection }}
+            <div class="input-group">
+                <label>{{t "scheduler.availability-type"}}</label>
+                <div class="flex gap-3 mt-1">
+                    <button type="button" class="availability-type-btn {{if this.isAvailable 'is-selected-available' 'is-unselected'}}" {{on "click" (fn this.toggleAvailability true)}}>
+                        <FaIcon @icon="circle-check" />
+                        {{t "scheduler.available"}}
+                    </button>
+                    <button
+                        type="button"
+                        class="availability-type-btn {{unless this.isAvailable 'is-selected-unavailable' 'is-unselected'}}"
+                        {{on "click" (fn this.toggleAvailability false)}}
+                    >
+                        <FaIcon @icon="circle-xmark" />
+                        {{t "scheduler.unavailable-time-off"}}
+                    </button>
+                </div>
+            </div>
+
+            {{! Date range }}
+            <div class="grid grid-cols-2 gap-4">
+                <div class="input-group">
+                    <label>{{t "scheduler.start-date"}}</label>
+                    <DateTimeInput @value={{@options.startAt}} @onChange={{this.updateStartAt}} placeholder={{t "scheduler.select-start-date"}} class="w-full form-input" />
+                </div>
+                <div class="input-group">
+                    <label>{{t "scheduler.end-date"}}</label>
+                    <DateTimeInput @value={{@options.endAt}} @onChange={{this.updateEndAt}} placeholder={{t "scheduler.select-end-date"}} class="w-full form-input" />
+                </div>
+            </div>
+
+            {{! Reason }}
+            <div class="input-group">
+                <label>{{t "scheduler.reason"}} <span class="text-gray-400">({{t "common.optional"}})</span></label>
+                <Input @value={{@options.reason}} @type="text" placeholder={{t "scheduler.reason-placeholder"}} class="w-full form-input" />
+            </div>
+
+            {{! Notes }}
+            <div class="input-group">
+                <label>{{t "common.notes"}}</label>
+                <Textarea @value={{@options.notes}} placeholder={{t "scheduler.notes-placeholder"}} class="w-full form-input" rows="3" />
+            </div>
+
+        </div>
+    </div>
+</Modal::Default>

package/addon/components/modals/set-driver-availability.js

@@ -0,0 +1,57 @@
+import Component from '@glimmer/component';
+import { tracked } from '@glimmer/tracking';
+import { action } from '@ember/object';
+
+/**
+ * Modals::SetDriverAvailability
+ *
+ * Shared modal for both "Set Availability" (is_available=true) and
+ * "Request Time Off" (is_available=false) flows. The caller controls
+ * the initial value of `isAvailable` via modal options.
+ *
+ * Plain text/textarea inputs bind @value directly to @options — Ember's
+ * two-way binding keeps them in sync without manual update actions.
+ * DateTimeInput still uses @onChange because it emits a processed value.
+ *
+ * @example (from driver/schedule.js)
+ *   this.modalsManager.show('modals/set-driver-availability', {
+ *       isAvailable: false,
+ *       confirm: async (modal) => { ... }
+ *   });
+ */
+export default class ModalsSetDriverAvailabilityComponent extends Component {
+    // isAvailable drives the button selection UI — must stay tracked
+    @tracked isAvailable = true;
+
+    constructor() {
+        super(...arguments);
+        const opts = this.args.options;
+
+        // Seed all fields onto @options so the template can bind @value directly
+        // and the confirm callback reads them back without any sync actions.
+        opts.startAt = opts.startAt ?? null;
+        opts.endAt = opts.endAt ?? null;
+        opts.reason = opts.reason ?? '';
+        opts.notes = opts.notes ?? '';
+
+        this.isAvailable = opts.isAvailable ?? true;
+        opts.isAvailable = this.isAvailable;
+    }
+
+    // DateTimeInput emits a processed value — needs @onChange
+    @action
+    updateStartAt(value) {
+        this.args.options.startAt = value;
+    }
+
+    @action
+    updateEndAt(value) {
+        this.args.options.endAt = value;
+    }
+
+    @action
+    toggleAvailability(value) {
+        this.isAvailable = value;
+        this.args.options.isAvailable = value;
+    }
+}

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

@@ -42,13 +42,7 @@
                                 {{activity.details}}
 
                                 {{#if (eq activity.code "dispatched")}}
-                                    <InfoBlock
-                                        @type="warning"
-                                        @size="xs"
-                                        @icon="exclamation-triangle"
-                                        @text={{t "modals.order-new-activity.dispatch"}}
-                                        class="mt-1"
-                                    />
+                                    <InfoBlock @type="warning" @size="xs" @icon="exclamation-triangle" @text={{t "modals.order-new-activity.dispatch"}} class="mt-1" />
                                 {{/if}}
                             </span>
                         </label>
@@ -72,10 +66,20 @@
                     <label for="activity_custom" class="ml-3 flex flex-col cursor-pointer w-full pr-5">
                         <div class="font-semibold text-sm mb-1">Add custom activity</div>
                         <span class="block text-sm font-medium">
-                            <Input @type="text" @value={{this.customActivity.status}} class="form-input form-input-sm w-full rounded-b-none" placeholder={{t "modals.order-new-activity.status"}} />
+                            <Input
+                                @type="text"
+                                @value={{this.customActivity.status}}
+                                class="form-input form-input-sm w-full rounded-b-none"
+                                placeholder={{t "modals.order-new-activity.status"}}
+                            />
                         </span>
                         <span class="block text-sm">
-                            <Input @type="text" @value={{this.customActivity.details}} class="form-input form-input-sm w-full rounded-t-none" placeholder={{t "modals.order-new-activity.details"}} />
+                            <Input
+                                @type="text"
+                                @value={{this.customActivity.details}}
+                                class="form-input form-input-sm w-full rounded-t-none"
+                                placeholder={{t "modals.order-new-activity.details"}}
+                            />
                         </span>
                     </label>
                     <div>

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

@@ -46,11 +46,7 @@
                         <label>
                             {{t "common.country"}}
                         </label>
-                        <CountrySelect
-                            class="w-full form-input form-select form-datalist"
-                            @value={{@options.user.country}}
-                            @onChange={{fn (mut @options.user.country)}}
-                        />
+                        <CountrySelect class="w-full form-input form-select form-datalist" @value={{@options.user.country}} @onChange={{fn (mut @options.user.country)}} />
                     </div>
                 </div>
             </div>

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

@@ -105,12 +105,7 @@
                             <label>
                                 {{t "modals.vehicle-details.acceleration"}}
                             </label>
-                            <Input
-                                @value={{@options.vehicle.model_0_to_100_kph}}
-                                @type="text"
-                                class="w-full form-input"
-                                placeholder={{t "modals.vehicle-details.acceleration"}}
-                            />
+                            <Input @value={{@options.vehicle.model_0_to_100_kph}} @type="text" class="w-full form-input" placeholder={{t "modals.vehicle-details.acceleration"}} />
                         </div>
 
                         <div class="input-group mb-2">
@@ -152,24 +147,14 @@
                             <label>
                                 {{t "modals.vehicle-details.top-speed"}}
                             </label>
-                            <Input
-                                @value={{@options.vehicle.model_top_speed_kph}}
-                                @type="text"
-                                class="w-full form-input"
-                                placeholder={{t "modals.vehicle-form.top-speed"}}
-                            />
+                            <Input @value={{@options.vehicle.model_top_speed_kph}} @type="text" class="w-full form-input" placeholder={{t "modals.vehicle-form.top-speed"}} />
                         </div>
 
                         <div class="input-group mb-2">
                             <label>
                                 {{t "modals.vehicle-details.transmission"}}
                             </label>
-                            <Input
-                                @value={{@options.vehicle.model_transmission_type}}
-                                @type="text"
-                                class="w-full form-input"
-                                placeholder={{t "modals.vehicle-form.transmission"}}
-                            />
+                            <Input @value={{@options.vehicle.model_transmission_type}} @type="text" class="w-full form-input" placeholder={{t "modals.vehicle-form.transmission"}} />
                         </div>
 
                         <div class="input-group mb-2">
@@ -183,12 +168,7 @@
                             <label>
                                 {{t "modals.vehicle-details.wheelbase"}}
                             </label>
-                            <Input
-                                @value={{@options.vehicle.model_wheelbase_mm}}
-                                @type="text"
-                                class="w-full form-input"
-                                placeholder={{t "modals.vehicle-form.wheelbase"}}
-                            />
+                            <Input @value={{@options.vehicle.model_wheelbase_mm}} @type="text" class="w-full form-input" placeholder={{t "modals.vehicle-form.wheelbase"}} />
                         </div>
 
                         <div class="input-group mb-2">
@@ -206,12 +186,7 @@
                             <label>
                                 {{t "modals.vehicle-details.engine-bore"}}
                             </label>
-                            <Input
-                                @value={{@options.vehicle.model_engine_bore_mm}}
-                                @type="text"
-                                class="w-full form-input"
-                                placeholder={{t "modals.vehicle-form.engine-bore"}}
-                            />
+                            <Input @value={{@options.vehicle.model_engine_bore_mm}} @type="text" class="w-full form-input" placeholder={{t "modals.vehicle-form.engine-bore"}} />
                         </div>
 
                         <div class="input-group mb-2">
@@ -225,12 +200,7 @@
                             <label>
                                 {{t "modals.vehicle-details.compression"}}
                             </label>
-                            <Input
-                                @value={{@options.vehicle.model_engine_compression}}
-                                @type="text"
-                                class="w-full form-input"
-                                placeholder={{t "modals.vehicle-form.compression"}}
-                            />
+                            <Input @value={{@options.vehicle.model_engine_compression}} @type="text" class="w-full form-input" placeholder={{t "modals.vehicle-form.compression"}} />
                         </div>
 
                         <div class="input-group mb-2">
@@ -244,84 +214,49 @@
                             <label>
                                 {{t "modals.vehicle-details.position"}}
                             </label>
-                            <Input
-                                @value={{@options.vehicle.model_engine_position}}
-                                @type="text"
-                                class="w-full form-input"
-                                placeholder={{t "modals.vehicle-form.position"}}
-                            />
+                            <Input @value={{@options.vehicle.model_engine_position}} @type="text" class="w-full form-input" placeholder={{t "modals.vehicle-form.position"}} />
                         </div>
 
                         <div class="input-group mb-2">
                             <label>
                                 {{t "modals.vehicle-details.power-ps"}}
                             </label>
-                            <Input
-                                @value={{@options.vehicle.model_engine_power_ps}}
-                                @type="text"
-                                class="w-full form-input"
-                                placeholder={{t "modals.vehicle-form.power-ps"}}
-                            />
+                            <Input @value={{@options.vehicle.model_engine_power_ps}} @type="text" class="w-full form-input" placeholder={{t "modals.vehicle-form.power-ps"}} />
                         </div>
 
                         <div class="input-group mb-2">
                             <label>
                                 {{t "modals.vehicle-details.power-rpm"}}
                             </label>
-                            <Input
-                                @value={{@options.vehicle.model_engine_power_rpm}}
-                                @type="text"
-                                class="w-full form-input"
-                                placeholder={{t "modals.vehicle-form.power-rpm"}}
-                            />
+                            <Input @value={{@options.vehicle.model_engine_power_rpm}} @type="text" class="w-full form-input" placeholder={{t "modals.vehicle-form.power-rpm"}} />
                         </div>
 
                         <div class="input-group mb-2">
                             <label>
                                 {{t "modals.vehicle-details.stroke"}}
                             </label>
-                            <Input
-                                @value={{@options.vehicle.model_engine_stroke_mm}}
-                                @type="text"
-                                class="w-full form-input"
-                                placeholder={{t "modals.vehicle-form.stroke"}}
-                            />
+                            <Input @value={{@options.vehicle.model_engine_stroke_mm}} @type="text" class="w-full form-input" placeholder={{t "modals.vehicle-form.stroke"}} />
                         </div>
 
                         <div class="input-group mb-2">
                             <label>
                                 {{t "modals.vehicle-details.torque-nm"}}
                             </label>
-                            <Input
-                                @value={{@options.vehicle.model_engine_torque_nm}}
-                                @type="text"
-                                class="w-full form-input"
-                                placeholder={{t "modals.vehicle-form.torque-nm"}}
-                            />
+                            <Input @value={{@options.vehicle.model_engine_torque_nm}} @type="text" class="w-full form-input" placeholder={{t "modals.vehicle-form.torque-nm"}} />
                         </div>
 
                         <div class="input-group mb-2">
                             <label>
                                 {{t "modals.vehicle-details.torque-rpm"}}
                             </label>
-                            <Input
-                                @value={{@options.vehicle.model_engine_torque_rpm}}
-                                @type="text"
-                                class="w-full form-input"
-                                placeholder={{t "modals.vehicle-form.torque-rpm"}}
-                            />
+                            <Input @value={{@options.vehicle.model_engine_torque_rpm}} @type="text" class="w-full form-input" placeholder={{t "modals.vehicle-form.torque-rpm"}} />
                         </div>
 
                         <div class="input-group mb-2">
                             <label>
                                 {{t "modals.vehicle-details.valves"}}
                             </label>
-                            <Input
-                                @value={{@options.vehicle.model_engine_valves_per_cyl}}
-                                @type="text"
-                                class="w-full form-input"
-                                placeholder={{t "modals.vehicle-details.valves"}}
-                            />
+                            <Input @value={{@options.vehicle.model_engine_valves_per_cyl}} @type="text" class="w-full form-input" placeholder={{t "modals.vehicle-details.valves"}} />
                         </div>
                     </div>
                 </ContentPanel>
@@ -332,12 +267,7 @@
                             <label>
                                 {{t "modals.vehicle-details.fuel"}}
                             </label>
-                            <Input
-                                @value={{@options.vehicle.model_engine_fuel}}
-                                @type="text"
-                                class="w-full form-input"
-                                placeholder={{t "modals.vehicle-form.fuel-type"}}
-                            />
+                            <Input @value={{@options.vehicle.model_engine_fuel}} @type="text" class="w-full form-input" placeholder={{t "modals.vehicle-form.fuel-type"}} />
                         </div>
 
                         <div class="input-group mb-2">
@@ -351,36 +281,21 @@
                             <label>
                                 {{t "modals.vehicle-details.liters-city"}}
                             </label>
-                            <Input
-                                @value={{@options.vehicle.model_lkm_city}}
-                                @type="text"
-                                class="w-full form-input"
-                                placeholder={{t "modals.vehicle-details.liters-city"}}
-                            />
+                            <Input @value={{@options.vehicle.model_lkm_city}} @type="text" class="w-full form-input" placeholder={{t "modals.vehicle-details.liters-city"}} />
                         </div>
 
                         <div class="input-group mb-2">
                             <label>
                                 {{t "modals.vehicle-details.liters-highway"}}
                             </label>
-                            <Input
-                                @value={{@options.vehicle.model_lkm_hwy}}
-                                @type="text"
-                                class="w-full form-input"
-                                placeholder={{t "modals.vehicle-details.liters-highway"}}
-                            />
+                            <Input @value={{@options.vehicle.model_lkm_hwy}} @type="text" class="w-full form-input" placeholder={{t "modals.vehicle-details.liters-highway"}} />
                         </div>
 
                         <div class="input-group mb-2">
                             <label>
                                 {{t "modals.vehicle-details.liters-mixed"}}
                             </label>
-                            <Input
-                                @value={{@options.vehicle.model_lkm_mixed}}
-                                @type="text"
-                                class="w-full form-input"
-                                placeholder={{t "modals.vehicle-details.liters-mixed"}}
-                            />
+                            <Input @value={{@options.vehicle.model_lkm_mixed}} @type="text" class="w-full form-input" placeholder={{t "modals.vehicle-details.liters-mixed"}} />
                         </div>
                     </div>
                 </ContentPanel>