Merge pull request #79 from fleetbase/dev-v0.2.38

patch disabled button/dropdown-button patch coordinates input component

Author: roncodes

addon/components/button.hbs

@@ -1,5 +1,5 @@
 {{#if this.visible}}
-    <span class="btn-wrapper {{@wrapperClass}} inline-flex rounded-md {{if this.isNotSecondary 'shadow-sm'}} {{if @isLoading 'is-loading'}}" {{did-insert this.setupComponent}}>
+    <span class="btn-wrapper {{@wrapperClass}} inline-flex rounded-md {{if this.isNotSecondary 'shadow-sm'}} {{if @isLoading 'is-loading'}}" {{did-insert this.setupComponent}} {{did-update this.onArgsChanged @disabled @visible @permission}}> 
         <button
             class="btn {{if @isLoading 'btn-is-loading'}} {{if @outline 'btn-outline'}} btn-{{or @type 'default'}} btn-{{or @size 'sm'}}"
             disabled={{this.isDisabled}}

addon/components/button.js

@@ -69,6 +69,13 @@ export default class ButtonComponent extends Component {
      */
     @tracked visible = true;
 
+    /**
+     * Determines if the button is disabled
+     *
+     * @memberof ButtonComponent
+     */
+    @tracked disabled = false;
+
     /**
      * Creates an instance of ButtonComponent.
      * @param {*} owner
@@ -79,7 +86,7 @@ export default class ButtonComponent extends Component {
         super(...arguments);
         this.permissionRequired = permission;
         this.visible = visible;
-        if (!disabled) {
+        if (!disabled && permission) {
             this.disabledByPermission = permission && this.abilities.cannot(permission);
         }
     }
@@ -114,4 +121,12 @@ export default class ButtonComponent extends Component {
             onClick(...arguments);
         }
     }
+
+    @action onArgsChanged(el, [disabled = false, visible = true, permission = null]) {
+        this.permissionRequired = permission;
+        this.visible = visible;
+        if (!disabled && permission) {
+            this.disabledByPermission = permission && this.abilities.cannot(permission);
+        }
+    }
 }

addon/components/chat-window.js

@@ -214,16 +214,20 @@ export default class ChatWindowComponent extends Component {
     }
 
     @task *loadAvailableUsers(params = {}) {
-        const users = yield this.store.query('user', params);
-        const availableUsers = users.filter((user) => {
-            const isNotSender = user.id !== this.sender.user_uuid;
-            const isNotParticipant = !this.getParticipantByUserId(user.id);
+        try {
+            const users = yield this.store.query('user', params);
+            const availableUsers = users.filter((user) => {
+                const isNotSender = user.id !== this.sender.user_uuid;
+                const isNotParticipant = !this.getParticipantByUserId(user.id);
 
-            return isNotSender && isNotParticipant;
-        });
+                return isNotSender && isNotParticipant;
+            });
 
-        this.availableUsers = availableUsers;
-        return availableUsers;
+            this.availableUsers = availableUsers;
+            return availableUsers;
+        } catch (err) {
+            console.warn('Error loading available users:', err);
+        }
     }
 
     handleChatFeedScroll() {

addon/components/coordinates-input.hbs

@@ -43,7 +43,7 @@
             <div class="flex flex-col">
                 <div class="flex flex-row items-center pb-4">
                     <Input @type="text" class="form-input mr-2" @value={{this.lookupQuery}} aria-label="Address Search" disabled={{or this.disabled this.reverseLookup.isRunning}} placeholder="Enter address" />
-                    <Button @wrapperClass="mr-2" @icon="search-location" @type="primary" @size="sm" @text="Lookup" @onClick={{perofrm this.reverseLookup}} @isLoading={{this.reverseLookup.isRunning}} />
+                    <Button @wrapperClass="mr-2" @icon="search-location" @type="primary" @size="sm" @text="Lookup" @onClick={{perform this.reverseLookup}} @isLoading={{this.reverseLookup.isRunning}} />
                     <Button @type="default" @iconPrefix="fas" @icon="times" @size="sm" @text="Done" @onClick={{dd.actions.close}} />
                 </div>
             </div>

addon/components/dropdown-button.hbs

@@ -15,7 +15,7 @@
         {{did-insert this.onInsert}}
         as |dd|
     >
-        <dd.Trigger class={{@triggerClass}} {{did-insert this.onTriggerInsert}}>
+        <dd.Trigger class={{@triggerClass}} {{did-insert this.onTriggerInsert}} {{did-update this.onArgsChanged @disabled @visible @permission}}>
             {{#if @buttonComponent}}
                 {{component
                     @buttonComponent
@@ -44,7 +44,7 @@
                     @active={{@active}}
                     @size={{this.buttonSize}}
                     @isLoading={{@isLoading}}
-                    disabled={{this.disabled}}
+                    @disabled={{this.disabled}}
                     {{did-insert this.onButtonInsert}}
                     ...attributes
                 >

addon/components/dropdown-button.js

@@ -32,7 +32,7 @@ export default class DropdownButtonComponent extends Component {
         this.disabled = disabled;
         this.visible = visible;
         // If no permissions disable
-        if (!disabled) {
+        if (!disabled && permission) {
             this.disabled = this.doesntHavePermissions = permission && this.abilities.cannot(permission);
         }
     }
@@ -71,4 +71,12 @@ export default class DropdownButtonComponent extends Component {
 
         this._onInsertFired = true;
     }
+
+    @action onArgsChanged(el, [disabled = false, visible = true, permission = null]) {
+        this.visible = visible;
+        this.disabled = disabled;
+        if (!disabled && permission) {
+            this.disabled = this.doesntHavePermissions = permission && this.abilities.cannot(permission);
+        }
+    }
 }

addon/utils/smart-humanize.js

@@ -32,6 +32,9 @@ export default function smartHumanize(string) {
         'ddp',
         'fob',
         'gsm',
+        'etd',
+        'eta',
+        'ect',
     ];
 
     return humanize([decamelize(string)])

package.json

@@ -1,6 +1,6 @@
 {
     "name": "@fleetbase/ember-ui",
-    "version": "0.2.37",
+    "version": "0.2.38",
     "description": "Fleetbase UI provides all the interface components, helpers, services and utilities for building a Fleetbase extension into the Console.",
     "keywords": [
         "fleetbase-ui",