@fleetbase/ember-core 0.2.8 → 0.2.10

package/addon/services/app-cache.js

@@ -38,8 +38,12 @@ export default class AppCacheService extends Service {
         return this;
     }
 
-    @action get(key) {
-        return this.localCache.get(`${this.cachePrefix}${dasherize(key)}`);
+    @action get(key, defaultValue = null) {
+        const value = this.localCache.get(`${this.cachePrefix}${dasherize(key)}`);
+        if (value === undefined) {
+            return defaultValue;
+        }
+        return value;
     }
 
     @action has(key) {

package/addon/services/chat.js

@@ -0,0 +1,263 @@
+import Service, { inject as service } from '@ember/service';
+import Evented from '@ember/object/evented';
+import { tracked } from '@glimmer/tracking';
+import { isArray } from '@ember/array';
+import { task } from 'ember-concurrency';
+import { all } from 'rsvp';
+
+export default class ChatService extends Service.extend(Evented) {
+    @service store;
+    @service currentUser;
+    @service appCache;
+    @tracked channels = [];
+    @tracked openChannels = [];
+
+    openChannel(chatChannelRecord) {
+        if (this.openChannels.includes(chatChannelRecord)) {
+            return;
+        }
+        this.openChannels.pushObject(chatChannelRecord);
+        this.rememberOpenedChannel(chatChannelRecord);
+        this.trigger('chat.opened', chatChannelRecord);
+    }
+
+    closeChannel(chatChannelRecord) {
+        const index = this.openChannels.findIndex((_) => _.id === chatChannelRecord.id);
+        if (index >= 0) {
+            this.openChannels.removeAt(index);
+            this.trigger('chat.closed', chatChannelRecord);
+        }
+        this.forgetOpenedChannel(chatChannelRecord);
+    }
+
+    rememberOpenedChannel(chatChannelRecord) {
+        let openedChats = this.appCache.get('open-chats', []);
+        if (isArray(openedChats) && !openedChats.includes(chatChannelRecord.id)) {
+            openedChats.pushObject(chatChannelRecord.id);
+        } else {
+            openedChats = [chatChannelRecord.id];
+        }
+        this.appCache.set('open-chats', openedChats);
+    }
+
+    forgetOpenedChannel(chatChannelRecord) {
+        let openedChats = this.appCache.get('open-chats', []);
+        if (isArray(openedChats)) {
+            openedChats.removeObject(chatChannelRecord.id);
+        } else {
+            openedChats = [];
+        }
+        this.appCache.set('open-chats', openedChats);
+    }
+
+    restoreOpenedChats() {
+        const openedChats = this.appCache.get('open-chats', []);
+        if (isArray(openedChats)) {
+            const findAll = openedChats.map((id) => this.store.findRecord('chat-channel', id));
+            return all(findAll).then((openedChatRecords) => {
+                if (isArray(openedChatRecords)) {
+                    for (let i = 0; i < openedChatRecords.length; i++) {
+                        const chatChannelRecord = openedChatRecords[i];
+                        this.openChannel(chatChannelRecord);
+                    }
+                }
+                return openedChatRecords;
+            });
+        }
+
+        return [];
+    }
+
+    getOpenChannels() {
+        return this.openChannels;
+    }
+
+    createChatChannel(name) {
+        const chatChannelRecord = this.store.createRecord('chat-channel', { name });
+        return chatChannelRecord.save().finally(() => {
+            this.trigger('chat.created', chatChannelRecord);
+        });
+    }
+
+    deleteChatChannel(chatChannelRecord) {
+        return chatChannelRecord.destroyRecord().finally(() => {
+            this.trigger('chat.deleted', chatChannelRecord);
+        });
+    }
+
+    updateChatChannel(chatChannelRecord, props = {}) {
+        chatChannelRecord.setProperties(props);
+        return chatChannelRecord.save().finally(() => {
+            this.trigger('chat.updated', chatChannelRecord);
+        });
+    }
+
+    addParticipant(chatChannelRecord, userRecord) {
+        const chatParticipant = this.store.createRecord('chat-participant', {
+            chat_channel_uuid: chatChannelRecord.id,
+            user_uuid: userRecord.id,
+        });
+        return chatParticipant.save().finally(() => {
+            this.trigger('chat.added_participant', chatParticipant, chatChannelRecord);
+        });
+    }
+
+    removeParticipant(chatChannelRecord, chatParticipant) {
+        return chatParticipant.destroyRecord().finally(() => {
+            this.trigger('chat.removed_participant', chatParticipant, chatChannelRecord);
+        });
+    }
+
+    async sendMessage(chatChannelRecord, senderRecord, messageContent = '', attachments = []) {
+        const chatMessage = this.store.createRecord('chat-message', {
+            chat_channel_uuid: chatChannelRecord.id,
+            sender_uuid: senderRecord.id,
+            content: messageContent,
+            attachment_files: attachments,
+        });
+
+        return chatMessage
+            .save()
+            .then((chatMessageRecord) => {
+                if (chatChannelRecord.doesntExistsInFeed('message', chatMessageRecord)) {
+                    chatChannelRecord.feed.pushObject({
+                        type: 'message',
+                        created_at: chatMessageRecord.created_at,
+                        data: chatMessageRecord.serialize(),
+                        record: chatMessageRecord,
+                    });
+                }
+                return chatMessageRecord;
+            })
+            .finally(() => {
+                this.trigger('chat.feed_updated', chatMessage, chatChannelRecord);
+                this.trigger('chat.message_created', chatMessage, chatChannelRecord);
+            });
+    }
+
+    deleteMessage(chatMessageRecord) {
+        return chatMessageRecord.destroyRecord().finally(() => {
+            this.trigger('chat.feed_updated', chatMessageRecord);
+            this.trigger('chat.message_deleted', chatMessageRecord);
+        });
+    }
+
+    insertChatMessageFromSocket(chatChannelRecord, data) {
+        // normalize and create record
+        const normalized = this.store.normalize('chat-message', data);
+        const record = this.store.push(normalized);
+
+        // make sure it doesn't exist in feed already
+        if (chatChannelRecord.existsInFeed('message', record)) {
+            return;
+        }
+
+        // create feed item
+        const item = {
+            type: 'message',
+            created_at: record.created_at,
+            data,
+            record,
+        };
+
+        // add item to feed
+        chatChannelRecord.feed.pushObject(item);
+
+        // trigger event
+        this.trigger('chat.feed_updated', record, chatChannelRecord);
+        this.trigger('chat.message_created', record, chatChannelRecord);
+    }
+
+    insertChatLogFromSocket(chatChannelRecord, data) {
+        // normalize and create record
+        const normalized = this.store.normalize('chat-log', data);
+        const record = this.store.push(normalized);
+
+        // make sure it doesn't exist in feed already
+        if (chatChannelRecord.existsInFeed('log', record)) {
+            return;
+        }
+
+        // create feed item
+        const item = {
+            type: 'log',
+            created_at: record.created_at,
+            data,
+            record,
+        };
+
+        // add item to feed
+        chatChannelRecord.feed.pushObject(item);
+
+        // trigger event
+        this.trigger('chat.feed_updated', record, chatChannelRecord);
+        this.trigger('chat.log_created', record, chatChannelRecord);
+    }
+
+    insertChatAttachmentFromSocket(chatChannelRecord, data) {
+        // normalize and create record
+        const normalized = this.store.normalize('chat-attachment', data);
+        const record = this.store.push(normalized);
+
+        // Find the chat message the record belongs to in the feed
+        const chatMessage = chatChannelRecord.feed.find((item) => {
+            return item.type === 'message' && item.record.id === record.chat_message_uuid;
+        });
+
+        // If we have the chat message then we can insert it to attachments
+        // This should work because chat message will always be created before the chat attachment
+        if (chatMessage) {
+            // Make sure the attachment isn't already attached to the message
+            const isNotAttached = chatMessage.record.attachments.find((attachment) => attachment.id === record.id) === undefined;
+            if (isNotAttached) {
+                chatMessage.record.attachments.pushObject(record);
+                // trigger event
+                this.trigger('chat.feed_updated', record, chatChannelRecord);
+                this.trigger('chat.attachment_created', record, chatChannelRecord);
+            }
+        }
+    }
+
+    insertChatReceiptFromSocket(chatChannelRecord, data) {
+        // normalize and create record
+        const normalized = this.store.normalize('chat-receipt', data);
+        const record = this.store.push(normalized);
+
+        // Find the chat message the record belongs to in the feed
+        const chatMessage = chatChannelRecord.feed.find((item) => {
+            return item.type === 'message' && item.record.id === record.chat_message_uuid;
+        });
+
+        // If we have the chat message then we can insert it to receipts
+        // This should work because chat message will always be created before the chat receipt
+        if (chatMessage) {
+            // Make sure the receipt isn't already attached to the message
+            const isNotAttached = chatMessage.record.receipts.find((receipt) => receipt.id === record.id) === undefined;
+            if (isNotAttached) {
+                chatMessage.record.receipts.pushObject(record);
+                // trigger event
+                this.trigger('chat.receipt_created', record, chatChannelRecord);
+            }
+        }
+    }
+
+    @task *loadMessages(chatChannelRecord) {
+        const messages = yield this.store.query('chat-message', { chat_channel_uuid: chatChannelRecord.id });
+        chatChannelRecord.set('messages', messages);
+        return messages;
+    }
+
+    @task *loadChannels(options = {}) {
+        const params = options.params || {};
+        const channels = yield this.store.query('chat-channel', params);
+        if (isArray(channels)) {
+            this.channels = channels;
+        }
+
+        if (typeof options.withChannels === 'function') {
+            options.withChannels(channels);
+        }
+
+        return channels;
+    }
+}

package/addon/services/crud.js

@@ -198,25 +198,29 @@ export default class CrudService extends Service {
 
         // set the model uri endpoint
         const modelEndpoint = dasherize(pluralize(modelName));
+        const exportParams = options.params ?? {};
 
         this.modalsManager.show('modals/export-form', {
             title: `Export ${pluralize(modelName)}`,
             acceptButtonText: 'Download',
             modalClass: 'modal-sm',
+            format: 'xlsx',
             formatOptions: ['csv', 'xlsx', 'xls', 'html', 'pdf'],
             setFormat: ({ target }) => {
                 this.modalsManager.setOption('format', target.value || null);
             },
             confirm: (modal, done) => {
-                const format = modal.getOption('format') || 'xlsx';
+                const format = modal.getOption('format') ?? 'xlsx';
                 modal.startLoading();
                 return this.fetch
                     .download(
                         `${modelEndpoint}/export`,
                         {
                             format,
+                            ...exportParams,
                         },
                         {
+                            method: 'POST',
                             fileName: `${modelEndpoint}-${formatDate(new Date(), 'yyyy-MM-dd-HH:mm')}.${format}`,
                         }
                     )

package/addon/services/fetch.js

@@ -15,6 +15,7 @@ import corslite from '../utils/corslite';
 import getMimeType from '../utils/get-mime-type';
 import download from '../utils/download';
 import getUserOptions from '../utils/get-user-options';
+import isEmptyObject from '../utils/is-empty-object';
 import fetch from 'fetch';
 
 if (isBlank(config.API.host)) {
@@ -339,7 +340,7 @@ export default class FetchService extends Service {
             return this.cachedGet(...arguments);
         }
 
-        const urlParams = !isBlank(query) ? new URLSearchParams(query).toString() : '';
+        const urlParams = !isEmptyObject(query) ? new URLSearchParams(query).toString() : '';
 
         return this.request(`${path}${urlParams ? '?' + urlParams : ''}`, 'GET', {}, options);
     }
@@ -506,7 +507,7 @@ export default class FetchService extends Service {
         let version = options?.version ?? 'v1';
         let host = options?.host ?? `https://${options?.subdomain ?? 'routing'}.fleetbase.io`;
         let route = coordinates.map((coords) => coords.join(',')).join(';');
-        let params = !isBlank(query) ? new URLSearchParams(query).toString() : '';
+        let params = !isEmptyObject(query) ? new URLSearchParams(query).toString() : '';
         let path = `${host}/${service}/${version}/${profile}/${route}`;
         let url = `${path}${params ? '?' + params : ''}`;
 
@@ -598,13 +599,25 @@ export default class FetchService extends Service {
      */
     download(path, query = {}, options = {}) {
         const headers = Object.assign(this.getHeaders(), options.headers ?? {});
+        const method = options.method ?? 'GET';
+        const credentials = options.credentials ?? this.credentials;
+        const baseUrl = `${options.host || this.host}/${options.namespace || this.namespace}`;
+        const isReadOnlyRequest = ['GET', 'HEAD'].includes(method.toUpperCase());
+        const params = isReadOnlyRequest && !isEmptyObject(query) ? `?${new URLSearchParams(query).toString()}` : '';
+        const body = !isReadOnlyRequest ? JSON.stringify(query) : {};
+        const fetchOptions = {
+            method,
+            credentials,
+            headers,
+        };
+
+        // Only supply body to fetch if not GET or HEAD request
+        if (!isReadOnlyRequest) {
+            fetchOptions.body = body;
+        }
 
         return new Promise((resolve, reject) => {
-            return fetch(`${options.host || this.host}/${options.namespace || this.namespace}/${path}?${!isBlank(query) ? new URLSearchParams(query).toString() : ''}`, {
-                method: 'GET',
-                credentials: options.credentials || this.credentials,
-                headers,
-            })
+            return fetch(`${baseUrl}/${path}${params}`, fetchOptions)
                 .then((response) => {
                     options.fileName = this.getFilenameFromResponse(response, options.fileName);
                     options.mimeType = this.getMimeTypeFromResponse(response, options.mimeType);

package/addon/services/loader.js

@@ -75,9 +75,10 @@ export default class LoaderService extends Service {
         }
 
         const loadingMessage = typeof options.loadingMessage === 'string' ? options.loadingMessage : 'Loading...';
-        const opacity = typeof options.opacity === 'number' ? options.opacity : 0.1;
+        const opacity = typeof options.opacity === 'number' ? options.opacity : 0;
         const isDarkMode = document.body.dataset.theme ? document.body.dataset.theme === 'dark' : true;
         const preserveTargetPosition = options.preserveTargetPosition === true;
+        const loaderContainerClass = options.loaderContainerClass ?? '';
 
         if (!preserveTargetPosition) {
             target.style.position = 'relative';
@@ -86,7 +87,7 @@ export default class LoaderService extends Service {
         let loader = document.createElement('div');
         loader.classList.add('overloader');
         loader.style.backgroundColor = isDarkMode ? `rgba(128, 128, 128, ${opacity})` : `rgba(249, 250, 251, ${opacity})`;
-        loader.innerHTML = `<div class="flex items-center justify-center text-center">
+        loader.innerHTML = `<div class="loader-container flex items-center justify-center text-center ${loaderContainerClass}">
             <div>
                 <svg viewBox="0 0 512 512" xmlns="http://www.w3.org/2000/svg" role="img" focusable="false" aria-hidden="true" data-icon="spinner-third" data-prefix="fad" id="ember240" class="svg-inline--fa fa-spinner-third fa-w-16 fa-spin ember-view text-sky-500 fa-spin-800ms mr-3"><g class="fa-group"><path class="fa-secondary" fill="currentColor" d="M478.71 364.58zm-22 6.11l-27.83-15.9a15.92 15.92 0 0 1-6.94-19.2A184 184 0 1 1 256 72c5.89 0 11.71.29 17.46.83-.74-.07-1.48-.15-2.23-.21-8.49-.69-15.23-7.31-15.23-15.83v-32a16 16 0 0 1 15.34-16C266.24 8.46 261.18 8 256 8 119 8 8 119 8 256s111 248 248 248c98 0 182.42-56.95 222.71-139.42-4.13 7.86-14.23 10.55-22 6.11z"></path><path class="fa-primary" fill="currentColor" d="M271.23 72.62c-8.49-.69-15.23-7.31-15.23-15.83V24.73c0-9.11 7.67-16.78 16.77-16.17C401.92 17.18 504 124.67 504 256a246 246 0 0 1-25 108.24c-4 8.17-14.37 11-22.26 6.45l-27.84-15.9c-7.41-4.23-9.83-13.35-6.2-21.07A182.53 182.53 0 0 0 440 256c0-96.49-74.27-175.63-168.77-183.38z"></path></g>
                 </svg>

package/addon/services/socket.js

@@ -1,6 +1,7 @@
 import Service from '@ember/service';
 import { tracked } from '@glimmer/tracking';
 import { isBlank } from '@ember/utils';
+import { later } from '@ember/runloop';
 import toBoolean from '../utils/to-boolean';
 import config from 'ember-get-config';
 
@@ -29,22 +30,28 @@ export default class SocketService extends Service {
     }
 
     async listen(channelId, callback) {
-        const channel = this.socket.subscribe(channelId);
-
-        // Track channel
-        this.channels.pushObject(channel);
-
-        // Listen to channel for events
-        await channel.listener('subscribe').once();
-
-        // Listen for channel subscription
-        (async () => {
-            for await (let output of channel) {
-                if (typeof callback === 'function') {
-                    callback(output);
-                }
-            }
-        })();
+        later(
+            this,
+            async () => {
+                const channel = this.socket.subscribe(channelId);
+
+                // Track channel
+                this.channels.pushObject(channel);
+
+                // Listen to channel for events
+                await channel.listener('subscribe').once();
+
+                // Listen for channel subscription
+                (async () => {
+                    for await (let output of channel) {
+                        if (typeof callback === 'function') {
+                            callback(output);
+                        }
+                    }
+                })();
+            },
+            300
+        );
     }
 
     closeChannels() {

package/addon/services/universe.js

@@ -993,7 +993,10 @@ export default class UniverseService extends Service.extend(Evented) {
         const index = this._getOption(options, 'index', 0);
         const onClick = this._getOption(options, 'onClick', null);
         const section = this._getOption(options, 'section', null);
+        const iconComponent = this._getOption(options, 'iconComponent', null);
+        const iconComponentOptions = this._getOption(options, 'iconComponentOptions', {});
         const iconSize = this._getOption(options, 'iconSize', null);
+        const iconPrefix = this._getOption(options, 'iconPrefix', null);
         const iconClass = this._getOption(options, 'iconClass', null);
         const itemClass = this._getOption(options, 'class', null);
         const inlineClass = this._getOption(options, 'inlineClass', null);
@@ -1024,7 +1027,10 @@ export default class UniverseService extends Service.extend(Evented) {
             index,
             section,
             onClick,
+            iconComponent,
+            iconComponentOptions,
             iconSize,
+            iconPrefix,
             iconClass,
             class: itemClass,
             inlineClass,

package/addon/utils/download.js

@@ -91,10 +91,11 @@ export default function download(data, strFileName, strMimeType) {
             anchor.className = 'download-js-link';
             anchor.innerHTML = 'downloading...';
             anchor.style.display = 'none';
-            anchor.addEventListener('click', function (e) {
+            function handleClick(e) {
                 e.stopPropagation();
-                this.removeEventListener('click', arguments.callee);
-            });
+                anchor.removeEventListener('click', handleClick);
+            }
+            anchor.addEventListener('click', handleClick);
             document.body.appendChild(anchor);
             later(
                 this,

package/addon/utils/is-empty-object.js

@@ -0,0 +1,3 @@
+export default function isEmptyObject(obj) {
+    return Object.keys(obj).length === 0 && obj.constructor === Object;
+}

package/app/services/chat.js

@@ -0,0 +1 @@
+export { default } from '@fleetbase/ember-core/services/chat';

package/app/utils/is-empty-object.js

@@ -0,0 +1 @@
+export { default } from '@fleetbase/ember-core/utils/is-empty-object';

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@fleetbase/ember-core",
-  "version": "0.2.8",
+  "version": "0.2.10",
   "description": "Provides all the core services, decorators and utilities for building a Fleetbase extension for the Console.",
   "keywords": [
     "fleetbase-core",