@fleetbase/fleetops-engine 0.3.4 → 0.3.6

package/addon/routes/management/places/index.js

@@ -1,14 +1,11 @@
 import Route from '@ember/routing/route';
 import { inject as service } from '@ember/service';
+import { action, set } from '@ember/object';
+import isNestedRouteTransition from '@fleetbase/ember-core/utils/is-nested-route-transition';
 
 export default class ManagementPlacesIndexRoute extends Route {
     @service store;
 
-    /**
-     * Queryable parameters
-     *
-     * @var {Object}
-     */
     queryParams = {
         page: { refreshModel: true },
         limit: { refreshModel: true },
@@ -27,6 +24,13 @@ export default class ManagementPlacesIndexRoute extends Route {
         updatedAt: { refreshModel: true },
     };
 
+    @action willTransition(transition) {
+        if (isNestedRouteTransition(transition)) {
+            set(this.queryParams, 'page.refreshModel', false);
+            set(this.queryParams, 'sort.refreshModel', false);
+        }
+    }
+
     model(params) {
         return this.store.query('place', { ...params });
     }

package/addon/routes/management/vehicles/index/details.js

@@ -8,8 +8,8 @@ export default class ManagementVehiclesIndexDetailsRoute extends Route {
         view: { refreshModel: false },
     };
 
-    model({ public_id }) {
-        return this.store.findRecord('vehicle', public_id);
+    model(params) {
+        return this.store.findRecord('vehicle', params.public_id);
     }
 
     afterModel(model) {

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

@@ -1,5 +1,7 @@
 import Route from '@ember/routing/route';
 import { inject as service } from '@ember/service';
+import { action, set } from '@ember/object';
+import isNestedRouteTransition from '@fleetbase/ember-core/utils/is-nested-route-transition';
 
 export default class ManagementVehiclesIndexRoute extends Route {
     @service store;
@@ -14,10 +16,10 @@ export default class ManagementVehiclesIndexRoute extends Route {
         public_id: { refreshModel: true },
         vin: { refreshModel: true },
         plate_number: { refreshModel: true },
-        model: { refreshModel: true },
+        vehicle_make: { refreshModel: true },
+        vehicle_model: { refreshModel: true },
         year: { refreshModel: true },
         country: { refreshModel: true },
-        make: { refreshModel: true },
         fleet: { refreshModel: true },
         vendor: { refreshModel: true },
         driver: { refreshModel: true },
@@ -29,6 +31,13 @@ export default class ManagementVehiclesIndexRoute extends Route {
         'within[where]': { refreshModel: true, replace: true },
     };
 
+    @action willTransition(transition) {
+        if (isNestedRouteTransition(transition)) {
+            set(this.queryParams, 'page.refreshModel', false);
+            set(this.queryParams, 'sort.refreshModel', false);
+        }
+    }
+
     model(params) {
         return this.store.query('vehicle', { ...params });
     }

package/addon/routes/management/vendors/index.js

@@ -1,14 +1,11 @@
 import Route from '@ember/routing/route';
 import { inject as service } from '@ember/service';
+import { action, set } from '@ember/object';
+import isNestedRouteTransition from '@fleetbase/ember-core/utils/is-nested-route-transition';
 
 export default class ManagementVendorsIndexRoute extends Route {
     @service store;
 
-    /**
-     * Queryable parameters
-     *
-     * @var {Object}
-     */
     queryParams = {
         page: { refreshModel: true },
         limit: { refreshModel: true },
@@ -26,12 +23,18 @@ export default class ManagementVendorsIndexRoute extends Route {
         website_url: { refreshModel: true },
     };
 
+    @action willTransition(transition) {
+        if (isNestedRouteTransition(transition)) {
+            set(this.queryParams, 'page.refreshModel', false);
+            set(this.queryParams, 'sort.refreshModel', false);
+        }
+    }
+
     model(params) {
         return this.store.query('vendor', { ...params });
     }
 
     async setupController(controller, model) {
-        console.log('setupController action called');
         super.setupController(...arguments);
 
         // load integrated vendors

package/addon/routes/operations/orders/index/view.js

@@ -11,8 +11,12 @@ export default class OperationsOrdersIndexViewRoute extends Route {
     @action willTransition(transition) {
         const shouldReset = typeof transition.to.name === 'string' && !transition.to.name.includes('operations.orders');
 
-        if (this.controller && shouldReset) {
-            this.controller.resetView();
+        if (this.controller) {
+            this.controller.removeRoutingControlPreview();
+
+            if (shouldReset) {
+                this.controller.resetView();
+            }
         }
     }
 

package/addon/routes/operations/orders/index.js

@@ -1,7 +1,8 @@
 import Route from '@ember/routing/route';
 import { tracked } from '@glimmer/tracking';
 import { inject as service } from '@ember/service';
-import { action } from '@ember/object';
+import { action, set } from '@ember/object';
+import isNestedRouteTransition from '@fleetbase/ember-core/utils/is-nested-route-transition';
 
 export default class OperationsOrdersIndexRoute extends Route {
     @service store;
@@ -33,6 +34,11 @@ export default class OperationsOrdersIndexRoute extends Route {
         if (this.controller && shouldReset) {
             this.controller.resetView(transition);
         }
+
+        if (isNestedRouteTransition(transition)) {
+            set(this.queryParams, 'page.refreshModel', false);
+            set(this.queryParams, 'sort.refreshModel', false);
+        }
     }
 
     @action model(params) {

package/addon/routes/operations/orders.js

@@ -1,4 +1,3 @@
 import Route from '@ember/routing/route';
-// import '@fleetbase/leaflet-routing-machine';
 
 export default class OperationsOrdersRoute extends Route {}

package/addon/routes/operations/service-rates/index.js

@@ -1,36 +1,11 @@
 import Route from '@ember/routing/route';
 import { inject as service } from '@ember/service';
-import { action } from '@ember/object';
+import { action, set } from '@ember/object';
+import isNestedRouteTransition from '@fleetbase/ember-core/utils/is-nested-route-transition';
 
 export default class OperationsServiceRatesIndexRoute extends Route {
-    /**
-     * Inject the `store` service.
-     *
-     * @var {Store}
-     */
     @service store;
 
-    /**
-     * Inject the `loader` service.
-     *
-     * @var {Service}
-     */
-    @service loader;
-
-    /**
-     * Loading event handler for route.
-     *
-     * @param {Transition} transition
-     */
-    @action loading(transition) {
-        this.loader.showOnInitialTransition(transition, 'section.next-view-section', { loadingMessage: 'Loading service rates...' });
-    }
-
-    /**
-     * Queryable parameters
-     *
-     * @var {Object}
-     */
     queryParams = {
         page: { refreshModel: true },
         limit: { refreshModel: true },
@@ -40,6 +15,13 @@ export default class OperationsServiceRatesIndexRoute extends Route {
         zone: { refreshModel: true },
     };
 
+    @action willTransition(transition) {
+        if (isNestedRouteTransition(transition)) {
+            set(this.queryParams, 'page.refreshModel', false);
+            set(this.queryParams, 'sort.refreshModel', false);
+        }
+    }
+
     model(params) {
         return this.store.query('service-rate', {
             ...params,

package/addon/routes/operations/service-rates.js

@@ -1,10 +1,3 @@
 import Route from '@ember/routing/route';
-import { inject as service } from '@ember/service';
 
-export default class OperationsServiceRatesRoute extends Route {
-    @service store;
-
-    model() {
-        return this.store.findAll('service-rate');
-    }
-}
+export default class OperationsServiceRatesRoute extends Route {}

package/addon/styles/fleetops-engine.css

@@ -1,18 +1,19 @@
 .scheduler-left-sidebar {
-    border-right: 1px rgba(229, 231, 235, 1) solid;
+    border-right: 1px rgb(229 231 235 / 100%) solid;
     height: 100vh;
     overflow-y: scroll;
 }
 
-body[data-theme="dark"] .scheduler-left-sidebar {
-    border-right: 1px rgba(55, 65, 81, 1) solid;
+body[data-theme='dark'] .scheduler-left-sidebar {
+    border-right: 1px rgb(55 65 81 / 100%) solid;
 }
 
-.scheduler-left-sidebar > .next-content-panel-wrapper  > .next-content-panel-container  > .next-content-panel > .next-content-panel-header.next-content-panel-is-closed {
+.scheduler-left-sidebar > .next-content-panel-wrapper > .next-content-panel-container > .next-content-panel > .next-content-panel-header.next-content-panel-is-closed {
     border-bottom-left-radius: 0;
     border-bottom-right-radius: 0;
 }
-.scheduler-left-sidebar > .next-content-panel-wrapper  > .next-content-panel-container  > .next-content-panel > .next-content-panel-header {
+
+.scheduler-left-sidebar > .next-content-panel-wrapper > .next-content-panel-container > .next-content-panel > .next-content-panel-header {
     border-top-left-radius: 0;
     border-top-right-radius: 0;
     border-top: 0;
@@ -20,9 +21,15 @@ body[data-theme="dark"] .scheduler-left-sidebar {
     border-right: 0;
 }
 
-.scheduler-left-sidebar > .next-content-panel-wrapper  > .next-content-panel-container  > .next-content-panel > .next-content-panel-body {
+.scheduler-left-sidebar > .next-content-panel-wrapper > .next-content-panel-container > .next-content-panel > .next-content-panel-body {
     border-left: 0;
     border-right: 0;
     border-bottom-left-radius: 0;
     border-bottom-right-radius: 0;
-}
+}
+
+.fleetbase-console.console-fleet-ops-operations-orders-index-new,
+.fleetbase-console.console-fleet-ops-operations-orders-index-view,
+.fleetbase-console .dragSortList {
+    overflow: visible !important;
+}

package/addon/templates/management/contacts/index.hbs

@@ -1,4 +1,5 @@
 <Layout::Section::Header @title="Contacts" @searchQuery={{this.query}} @onSearch={{perform this.search}}>
+    <Button @icon="refresh" @onClick={{this.reload}} @helpText="Reload data" class="mr-2" />
     <FiltersPicker
         @columns={{this.columns}}
         @onApply={{fn this.filters.apply this}}

package/addon/templates/management/drivers/index.hbs

@@ -4,7 +4,8 @@
     @searchQuery={{this.query}}
     @onSearch={{perform this.search}}
 >
-    <Button @icon="grip-horizontal" @prefix="fas" @onClick={{fn this.changeLayout "grid"}} @disabled={{this.isGridLayout}} class="mr-2" />
+    <Button @icon="refresh" @onClick={{this.reload}} @helpText="Reload data" class="mr-2" />
+    <Button @icon="grip-horizontal" @prefix="fas" @onClick={{this.reload}} @disabled={{this.isGridLayout}} class="mr-2" />
     <Button @icon="table" @prefix="fas" @onClick={{fn this.changeLayout "table"}} @disabled={{this.isTableLayout}} class="mr-2" />
     <FiltersPicker
         @columns={{this.columns}}

package/addon/templates/management/fleets/index.hbs

@@ -1,7 +1,15 @@
 <Layout::Section::Header @title="Fleets" @searchQuery={{this.query}} @onSearch={{perform this.search}}>
-    <FiltersPicker @columns={{this.columns}} @onApply={{fn this.filters.apply this}} @onClear={{fn this.filters.reset this}} @onFilterClear={{this.filters.clear}} @onChange={{this.filters.set}} @buttonWrapperClass="mr-2" />
+    <Button @icon="refresh" @onClick={{this.reload}} @helpText="Reload data" class="mr-2" />
+    <FiltersPicker
+        @columns={{this.columns}}
+        @onApply={{fn this.filters.apply this}}
+        @onClear={{fn this.filters.reset this}}
+        @onFilterClear={{this.filters.clear}}
+        @onChange={{this.filters.set}}
+        @buttonWrapperClass="mr-2"
+    />
     <VisibleColumnPicker @columns={{this.columns}} @onChange={{fn (mut this.columns)}} class="mr-2" />
-   {{#if (safe-has this.table "selectedRows")}}
+    {{#if (safe-has this.table "selectedRows")}}
         <DropdownButton @icon="layer-group" @text="Bulk Action" @type="magic" @size="sm" @buttonWrapperClass="mr-2" @contentClass="dropdown-menu" as |dd|>
             <div class="next-dd-menu mt-2 mx-0">
                 <div class="px-1">
@@ -17,6 +25,18 @@
 </Layout::Section::Header>
 
 <Layout::Section::Body>
-    <Table @rows={{@model}} @columns={{this.columns}} @selectable={{true}} @canSelectAll={{true}} @onSetup={{fn (mut this.table)}} @pagination={{true}} @paginationMeta={{@model.meta}} @page={{this.page}} @onPageChange={{fn (mut this.page)}} @tfootVerticalOffset="53" @tfootVerticalOffsetElements=".next-view-section-subheader" />
+    <Table
+        @rows={{@model}}
+        @columns={{this.columns}}
+        @selectable={{true}}
+        @canSelectAll={{true}}
+        @onSetup={{fn (mut this.table)}}
+        @pagination={{true}}
+        @paginationMeta={{@model.meta}}
+        @page={{this.page}}
+        @onPageChange={{fn (mut this.page)}}
+        @tfootVerticalOffset="53"
+        @tfootVerticalOffsetElements=".next-view-section-subheader"
+    />
 </Layout::Section::Body>
 {{outlet}}

package/addon/templates/management/fuel-reports/index.hbs

@@ -1,4 +1,5 @@
 <Layout::Section::Header @title="Fuel Reports" @searchQuery={{this.query}} @onSearch={{perform this.search}}>
+    <Button @icon="refresh" @onClick={{this.reload}} @helpText="Reload data" class="mr-2" />
     <FiltersPicker
         @columns={{this.columns}}
         @onApply={{fn this.filters.apply this}}

package/addon/templates/management/issues/index.hbs

@@ -1,5 +1,13 @@
 <Layout::Section::Header @title="Issues" @searchQuery={{this.query}} @onSearch={{perform this.search}}>
-    <FiltersPicker @columns={{this.columns}} @onApply={{fn this.filters.apply this}} @onClear={{fn this.filters.reset this}} @onFilterClear={{this.filters.clear}} @onChange={{this.filters.set}} @buttonWrapperClass="mr-2" />
+    <Button @icon="refresh" @onClick={{this.reload}} @helpText="Reload data" class="mr-2" />
+    <FiltersPicker
+        @columns={{this.columns}}
+        @onApply={{fn this.filters.apply this}}
+        @onClear={{fn this.filters.reset this}}
+        @onFilterClear={{this.filters.clear}}
+        @onChange={{this.filters.set}}
+        @buttonWrapperClass="mr-2"
+    />
     <VisibleColumnPicker @columns={{this.columns}} @onChange={{fn (mut this.columns)}} class="mr-2" />
     {{#if (safe-has this.table "selectedRows")}}
         <DropdownButton @icon="layer-group" @text="Bulk Action" @type="magic" @size="sm" @buttonWrapperClass="mr-2" @contentClass="dropdown-menu" as |dd|>
@@ -17,7 +25,19 @@
 </Layout::Section::Header>
 
 <Layout::Section::Body>
-    <Table @rows={{@model}} @columns={{this.columns}} @selectable={{true}} @canSelectAll={{true}} @onSetup={{fn (mut this.table)}} @pagination={{true}} @paginationMeta={{@model.meta}} @page={{this.page}} @onPageChange={{fn (mut this.page)}} @tfootVerticalOffset="53" @tfootVerticalOffsetElements=".next-view-section-subheader" />
+    <Table
+        @rows={{@model}}
+        @columns={{this.columns}}
+        @selectable={{true}}
+        @canSelectAll={{true}}
+        @onSetup={{fn (mut this.table)}}
+        @pagination={{true}}
+        @paginationMeta={{@model.meta}}
+        @page={{this.page}}
+        @onPageChange={{fn (mut this.page)}}
+        @tfootVerticalOffset="53"
+        @tfootVerticalOffsetElements=".next-view-section-subheader"
+    />
 </Layout::Section::Body>
 
 {{outlet}}

package/addon/templates/management/places/index.hbs

@@ -1,5 +1,13 @@
 <Layout::Section::Header @title="Places" @searchQuery={{this.query}} @onSearch={{perform this.search}}>
-    <FiltersPicker @columns={{this.columns}} @onApply={{fn this.filters.apply this}} @onClear={{fn this.filters.reset this}} @onFilterClear={{this.filters.clear}} @onChange={{this.filters.set}} @buttonWrapperClass="mr-2" />
+    <Button @icon="refresh" @onClick={{this.reload}} @helpText="Reload data" class="mr-2" />
+    <FiltersPicker
+        @columns={{this.columns}}
+        @onApply={{fn this.filters.apply this}}
+        @onClear={{fn this.filters.reset this}}
+        @onFilterClear={{this.filters.clear}}
+        @onChange={{this.filters.set}}
+        @buttonWrapperClass="mr-2"
+    />
     <VisibleColumnPicker @columns={{this.columns}} @onChange={{fn (mut this.columns)}} class="mr-2" />
     {{#if (safe-has this.table "selectedRows")}}
         <DropdownButton @icon="layer-group" @text="Bulk Action" @type="magic" @size="sm" @buttonWrapperClass="mr-2" @contentClass="dropdown-menu" as |dd|>

package/addon/templates/management/vehicles/index.hbs

@@ -1,5 +1,13 @@
 <Layout::Section::Header @title="Vehicles" @searchQuery={{this.query}} @onSearch={{perform this.search}}>
-    <FiltersPicker @columns={{this.columns}} @onApply={{fn this.filters.apply this}} @onClear={{fn this.filters.reset this}} @onFilterClear={{this.filters.clear}} @onChange={{this.filters.set}} @buttonWrapperClass="mr-2" />
+    <Button @icon="refresh" @onClick={{this.reload}} @helpText="Reload data" class="mr-2" />
+    <FiltersPicker
+        @columns={{this.columns}}
+        @onApply={{fn this.filters.apply this}}
+        @onClear={{fn this.filters.reset this}}
+        @onFilterClear={{this.filters.clear}}
+        @onChange={{this.filters.set}}
+        @buttonWrapperClass="mr-2"
+    />
     <VisibleColumnPicker @columns={{this.columns}} @onChange={{fn (mut this.columns)}} class="mr-2" />
     {{#if (safe-has this.table "selectedRows")}}
         <DropdownButton @icon="layer-group" @text="Bulk Action" @type="magic" @size="sm" @buttonWrapperClass="mr-2" @contentClass="dropdown-menu" as |dd|>
@@ -17,6 +25,18 @@
 </Layout::Section::Header>
 
 <Layout::Section::Body>
-    <Table @rows={{@model}} @columns={{this.columns}} @selectable={{true}} @canSelectAll={{true}} @onSetup={{fn (mut this.table)}} @pagination={{true}} @paginationMeta={{@model.meta}} @page={{this.page}} @onPageChange={{fn (mut this.page)}} @tfootVerticalOffset="53" @tfootVerticalOffsetElements=".next-view-section-subheader" />
+    <Table
+        @rows={{@model}}
+        @columns={{this.columns}}
+        @selectable={{true}}
+        @canSelectAll={{true}}
+        @onSetup={{fn (mut this.table)}}
+        @pagination={{true}}
+        @paginationMeta={{@model.meta}}
+        @page={{this.page}}
+        @onPageChange={{fn (mut this.page)}}
+        @tfootVerticalOffset="53"
+        @tfootVerticalOffsetElements=".next-view-section-subheader"
+    />
 </Layout::Section::Body>
 {{outlet}}

package/addon/templates/management/vendors/index.hbs

@@ -1,5 +1,13 @@
 <Layout::Section::Header @title="Vendors" @searchQuery={{this.query}} @onSearch={{perform this.search}}>
-    <FiltersPicker @columns={{this.columns}} @onApply={{fn this.filters.apply this}} @onClear={{fn this.filters.reset this}} @onFilterClear={{this.filters.clear}} @onChange={{this.filters.set}} @buttonWrapperClass="mr-2" />
+    <Button @icon="refresh" @onClick={{this.reload}} @helpText="Reload data" class="mr-2" />
+    <FiltersPicker
+        @columns={{this.columns}}
+        @onApply={{fn this.filters.apply this}}
+        @onClear={{fn this.filters.reset this}}
+        @onFilterClear={{this.filters.clear}}
+        @onChange={{this.filters.set}}
+        @buttonWrapperClass="mr-2"
+    />
     <VisibleColumnPicker @columns={{this.columns}} @onChange={{fn (mut this.columns)}} class="mr-2" />
     {{#if (safe-has this.table "selectedRows")}}
         <DropdownButton @icon="layer-group" @text="Bulk Action" @type="magic" @size="sm" @buttonWrapperClass="mr-2" @contentClass="dropdown-menu" as |dd|>
@@ -17,6 +25,18 @@
 </Layout::Section::Header>
 
 <Layout::Section::Body>
-    <Table @rows={{this.rows}} @columns={{this.columns}} @selectable={{true}} @canSelectAll={{true}} @onSetup={{fn (mut this.table)}} @pagination={{true}} @paginationMeta={{@model.meta}} @page={{this.page}} @onPageChange={{fn (mut this.page)}} @tfootVerticalOffset="53" @tfootVerticalOffsetElements=".next-view-section-subheader" />
+    <Table
+        @rows={{this.rows}}
+        @columns={{this.columns}}
+        @selectable={{true}}
+        @canSelectAll={{true}}
+        @onSetup={{fn (mut this.table)}}
+        @pagination={{true}}
+        @paginationMeta={{@model.meta}}
+        @page={{this.page}}
+        @onPageChange={{fn (mut this.page)}}
+        @tfootVerticalOffset="53"
+        @tfootVerticalOffsetElements=".next-view-section-subheader"
+    />
 </Layout::Section::Body>
 {{outlet}}

package/addon/templates/operations/orders/index/new.hbs

@@ -1,7 +1,7 @@
-<Overlay @position="right" @noBackdrop={{true}} @isResizable={{true}} @isMaximizable={{true}} @isMinimizable={{true}} @width="700px" @fullHeight={{true}} @onLoad={{this.setupInterface}} as |overlay|>
+<Overlay @position="right" @noBackdrop={{true}} @isResizable={{true}} @width="570px" @fullHeight={{true}} @onLoad={{this.setupInterface}} as |overlay|>
     <Overlay::Header @overlay={{overlay}} @title="New Order" @onPressCancel={{this.transitionBack}}>
         <DropdownButton @icon="ellipsis-h" @size="sm" @iconPrefix="fas" @triggerClass="mr-2 hidden md:flex" as |dd|>
-            <div class="next-dd-menu mt-1 mx-0" aria-orientation="vertical" aria-labelledby="user-menu">
+            <div class="next-dd-menu mt-1 mx-0" aria-labelledby="user-menu">
                 <div class="p-1">
                     <a href="javascript:;" class="next-dd-item" {{on "click" (dropdown-fn dd this.newCustomer)}}>
                         <div class="w-6">
@@ -15,7 +15,7 @@
                         </div>
                         <span>Create new facilitator</span>
                     </a>
-                    <a href="javascript:;" class="next-dd-item" {{on "click" (dropdown-fn dd this.newPlace)}}>
+                    <a href="javascript:;" class="next-dd-item" {{on "click" (dropdown-fn dd this.createPlace)}}>
                         <div class="w-6">
                             <FaIcon @icon="map-pin" />
                         </div>
@@ -162,7 +162,7 @@
                         {{#each group.items as |metaField|}}
                             <div class="input-group {{if (eq metaField.type "boolean") "col-span-2 items-center" ""}}">
                                 <div class="flex items-center justify-between">
-                                    {{#if (not (eq metaField.type "boolean"))}}
+                                    {{#if (not-eq metaField.type "boolean")}}
                                         <InputLabel @labelText={{metaField.label}} @required={{metaField.required}} />
                                     {{/if}}
 
@@ -223,8 +223,8 @@
                                 </label>
                             </div>
 
-                            <div class="flex-1 px-4">
-                                <ModelSelect @modelName="place" @selectedModel={{waypoint.place}} @placeholder={{concat "Select Waypoint " (add index 1)}} @triggerClass="form-select form-input truncate" @wrapperClass="w-96" @infiniteScroll={{false}} @customSearchEndpoint="places/search" @query={{hash geo=true latitude=this.userLatitude longitude=this.userLongitude}} @renderInPlace={{true}} @onChange={{fn this.setWaypointPlace index}} as |model|>
+                            <div class="flex-1 px-3">
+                                <ModelSelect @modelName="place" @selectedModel={{waypoint.place}} @placeholder={{concat "Select Waypoint " (add index 1)}} @triggerClass="form-select form-input truncate max-w-300px" @infiniteScroll={{false}} @customSearchEndpoint="places/search" @query={{hash geo=true latitude=this.userLatitude longitude=this.userLongitude}} @renderInPlace={{true}} @onChange={{fn this.setWaypointPlace index}} as |model|>
                                     {{model.address}}
                                 </ModelSelect>
 
@@ -241,7 +241,7 @@
 
                             <div class="flex items-center">
                                 {{#if waypoint.place}}
-                                    <Button class="mr-2" @icon="edit" @size="sm" @onClick={{fn this.placesController.editPlace waypoint.place}} />
+                                    <Button class="mr-2" @icon="edit" @size="sm" @onClick={{fn this.editPlace waypoint.place}} />
                                 {{/if}}
                                 <Button @type="danger" @icon="trash" @size="sm" @onClick={{fn this.removeWaypoint waypoint}} />
                             </div>

package/addon/templates/operations/orders/index/view.hbs

@@ -1,10 +1,10 @@
-<Overlay @position="right" @noBackdrop={{true}} @width="700px" @fullHeight={{true}} @isResizable={{true}} @isMaximizable={{true}} @isMinimizable={{true}} @onLoad={{this.setupInterface}} as |overlay|>
+<Overlay @position="right" @noBackdrop={{true}} @width="570px" @fullHeight={{true}} @isResizable={{true}} @onLoad={{this.setupInterface}} as |overlay|>
     <Overlay::Header @overlay={{overlay}} @title={{@model.public_id}} @status={{@model.status}} @dispatched={{@model.dispatched}} @createdAt={{@model.createdAt}} @onPressCancel={{this.transitionBack}}>
         {{#if @model.canBeDispatched}}
             <Button @type="primary" @icon="paper-plane" @text="Dispatch" class="mr-2" @onClick={{fn this.dispatchOrder @model}} />
         {{/if}}
         <DropdownButton @icon="ellipsis-h" @size="sm" @iconPrefix="fas" as |dd|>
-            <div class="next-dd-menu mt-1 mx-0" aria-orientation="vertical" aria-labelledby="user-menu">
+            <div class="next-dd-menu mt-1 mx-0" aria-labelledby="user-menu">
                 <div class="px-1">
                     <div class="text-sm flex flex-row items-center px-3 py-1 rounded-md my-1 text-gray-800 dark:text-gray-300">
                         Order Actions
@@ -83,20 +83,21 @@
     <Overlay::Body @wrapperClass="new-order-overlay-body" @increaseInnerBodyHeightBy={{1000}}>
         <ContentPanel @title="Activity" @open={{true}} @pad={{false}} @isLoading={{this.isLoadingAdditionalData}} @panelBodyWrapperClass="px-0 py-4" @panelBodyClass="bg-white dark:bg-gray-800">
             {{#if @model.tracking_statuses}}
-                <Timeline @activity={{@model.tracking_statuses}} @wrapperClass="space-x-4 px-2" @arrowClass="bg-gray-600 border border-gray-900 shadow-md" as |TimelineItem|>
-                    <TimelineItem class="flex flex-col w-40 px-3 py-2 rounded text-sm leading-4 truncate space-y-2 bg-gray-100 dark:bg-gray-900 dark:text-white" as |trackingStatus|>
-                        <div class="font-semibold truncate">
-                            {{trackingStatus.status}}
-                        </div>
-                        <div class="truncate">
-                            {{trackingStatus.details}}
-                        </div>
-                        <div class="truncate">
-                            {{trackingStatus.createdAt}}
+                <Timeline @activity={{@model.tracking_statuses}} @arrowClass="bg-gray-600 border border-gray-900 shadow-md" as |TimelineItem|>
+                    <TimelineItem @activeStatus={{@model.status}} as |trackingStatus|>
+                        <div class="flex flex-col px-3 py-2 rounded text-sm leading-4 space-y-2 bg-gray-100 dark:bg-gray-900 dark:text-white">
+                            <div class="flex flex-col space-y-1">
+                                <div class="text-xs font-semibold truncate">{{trackingStatus.status}}</div>
+                                <div class="text-xs truncate">{{n-a trackingStatus.details}}</div>
+                                <div class="text-xs">{{trackingStatus.createdAtShortWithTime}}</div>
+                            </div>
+                            <Attach::Tooltip @class="clean" @animation="scale" @placement="top">
+                                <InputInfo>
+                                    <div class="text-xs">{{or trackingStatus.details trackingStatus.status}}</div>
+                                    <div class="text-xs">{{trackingStatus.createdAtShortWithTime}}</div>
+                                </InputInfo>
+                            </Attach::Tooltip>
                         </div>
-                        <Attach::Tooltip @class="clean" @animation="scale" @placement="top">
-                            <InputInfo @text={{trackingStatus.details}} />
-                        </Attach::Tooltip>
                     </TimelineItem>
                 </Timeline>
             {{else}}
@@ -351,7 +352,7 @@
                                     </div>
                                     <div class="flex items-start">
                                         <DropdownButton @triggerClass="mr-2" @iconClass="icon-text-height" @buttonSize="sm" @icon="ellipsis-h" @iconPrefix="fas" @contentClass="dropdown-menu" as |dd|>
-                                            <div class="next-dd-menu mt-1 mx-0" aria-orientation="vertical" aria-labelledby="user-menu">
+                                            <div class="next-dd-menu mt-1 mx-0" aria-labelledby="user-menu">
                                                 <div class="px-1">
                                                     <div class="text-sm flex flex-row items-center px-3 py-1 rounded-md my-1 text-gray-300">
                                                         Waypoint Actions

package/addon/templates/operations/service-rates/index.hbs

@@ -1,7 +1,15 @@
 <Layout::Section::Header @title="Service Rates" @searchQuery={{this.query}} @onSearch={{perform this.search}}>
-    <FiltersPicker @columns={{this.columns}} @onApply={{fn this.filters.apply this}} @onClear={{fn this.filters.reset this}} @onFilterClear={{this.filters.clear}} @onChange={{this.filters.set}} @buttonWrapperClass="mr-2" />
+    <Button @icon="refresh" @onClick={{this.reload}} @helpText="Reload data" class="mr-2" />
+    <FiltersPicker
+        @columns={{this.columns}}
+        @onApply={{fn this.filters.apply this}}
+        @onClear={{fn this.filters.reset this}}
+        @onFilterClear={{this.filters.clear}}
+        @onChange={{this.filters.set}}
+        @buttonWrapperClass="mr-2"
+    />
     <VisibleColumnPicker @columns={{this.columns}} @onChange={{fn (mut this.columns)}} class="mr-2" />
-   {{#if (safe-has this.table "selectedRows")}}
+    {{#if (safe-has this.table "selectedRows")}}
         <DropdownButton @icon="layer-group" @text="Bulk Action" @type="magic" @size="sm" @buttonWrapperClass="mr-2" @contentClass="dropdown-menu" as |dd|>
             <div class="next-dd-menu mt-2 mx-0">
                 <div class="px-1">
@@ -12,7 +20,7 @@
             </div>
         </DropdownButton>
     {{/if}}
-    <Button @icon="plus" @iconPrefix="fas" @type="primary" @text="New" class="mr-2" @onClick={{transition-to 'operations.service-rates.index.new'}} />
+    <Button @icon="plus" @iconPrefix="fas" @type="primary" @text="New" class="mr-2" @onClick={{transition-to "operations.service-rates.index.new"}} />
     <Button @icon="long-arrow-up" @iconClass="rotate-icon-45" @text="Export" />
 </Layout::Section::Header>
 

package/addon/utils/waypoint-label.js

@@ -0,0 +1,3 @@
+export default function waypointLabel(index) {
+    return (parseInt(index) + 9).toString(36).toUpperCase();
+}

package/app/components/layout/fleet-ops-sidebar/fleet-listing.js

@@ -0,0 +1 @@
+export { default } from '@fleetbase/fleetops-engine/components/layout/fleet-ops-sidebar/fleet-listing';

package/app/controllers/{operations/zones/index.js → base-controller.js}

@@ -1 +1 @@
-export { default } from '@fleetbase/fleetops-engine/controllers/operations/zones/index';
+export { default } from '@fleetbase/fleetops-engine/controllers/base-controller';

package/app/utils/waypoint-label.js

@@ -0,0 +1 @@
+export { default } from '@fleetbase/fleetops-engine/utils/waypoint-label';

package/composer.json

@@ -1,6 +1,6 @@
 {
     "name": "fleetbase/fleetops-api",
-    "version": "0.3.4",
+    "version": "0.3.6",
     "description": "Fleet & Transport Management Extension for Fleetbase",
     "keywords": [
         "fleetbase-extension",