@fleetbase/ember-core 0.0.1

package/addon/services/theme.js

@@ -0,0 +1,200 @@
+import Service from '@ember/service';
+import { tracked } from '@glimmer/tracking';
+import { inject as service } from '@ember/service';
+import { dasherize } from '@ember/string';
+import { isArray } from '@ember/array';
+import { getOwner } from '@ember/application';
+import closeSidebar from '@fleetbase/ember-ui/utils/close-sidebar';
+
+export default class ThemeService extends Service {
+    /**
+     * Lookup the correct router for the engine and or console.
+     *
+     * @readonly
+     * @memberof ThemeService
+     */
+    get router() {
+        const owner = getOwner(this);
+        const router = owner.lookup('service:router');
+
+        return router;
+    }
+
+    /**
+     * Inject the current user service
+     *
+     * @var {Service}
+     */
+    @service currentUser;
+
+    /**
+     * The current active theme, uses the system preffered mode to set default
+     * refers to the theme in headData service
+     *
+     * @var {String}
+     */
+    get activeTheme() {
+        const userSetTheme = this.currentUser.getOption(`theme`);
+
+        if (userSetTheme) {
+            return userSetTheme;
+        }
+
+        if (window.matchMedia && window.matchMedia('(prefers-color-scheme: dark)').matches) {
+            return 'dark';
+        }
+
+        // default to dark theme
+        return 'dark';
+    }
+
+    /**
+     * Set the activeTheme in the headData service
+     */
+    set activeTheme(theme) {
+        document.body.dataset.theme = theme;
+        this.currentTheme = theme;
+    }
+
+    /**
+     * Current theme, defaults to light, active theme represents the theme set by user OS
+     *
+     * @var {String}
+     */
+    @tracked currentTheme = 'dark';
+
+    /**
+     * The current route name as style class
+     *
+     * @var {String}
+     */
+    get routeClassName() {
+        return dasherize(typeof this.router.currentRouteName === 'string' ? this.router.currentRouteName.replace(/\./g, ' ') : 'fleetbase-console');
+    }
+
+    /**
+     * The current route
+     *
+     * @var {Route}
+     */
+    get currentRoute() {
+        return getOwner(this).lookup(`route:${this.router.currentRouteName}`);
+    }
+
+    /**
+     * The current route
+     *
+     * @var {Route}
+     */
+    get currentRouteBodyClasses() {
+        if (this.currentRoute && this.currentRoute.bodyClassNames && isArray(this.currentRoute.bodyClassNames)) {
+            return this.currentRoute.bodyClassNames;
+        }
+        return [];
+    }
+
+    /**
+     * Hook for handling when route does change
+     *
+     * @void
+     */
+    routeDidChange() {
+        this.setRoutebodyClassNames(this.currentRouteBodyClasses);
+    }
+
+    /**
+     * Hook for handling when route does change
+     *
+     * @void
+     */
+    routeWillChange() {
+        closeSidebar();
+        this.removeRoutebodyClassNames(this.currentRouteBodyClasses);
+    }
+
+    /**
+     * Initialize theme configurations
+     *
+     * @void
+     */
+    initialize(options = {}) {
+        this.setTheme(this.activeTheme);
+        this.setEnvironment();
+        this.resetScroll();
+        this.setRoutebodyClassNames(options.bodyClassNames && isArray(options.bodyClassNames) ? options.bodyClassNames : []);
+        // on every subsequent transition set the body class
+        this.router.on('routeDidChange', this.routeDidChange.bind(this));
+        // remove route class as exiting
+        this.router.on('routeWillChange', this.routeWillChange.bind(this));
+        // remove console-loader
+        const consoleLoader = document.getElementById(`console-loader`);
+        if (consoleLoader) {
+            consoleLoader.remove();
+        }
+    }
+
+    /**
+     * Resets window scroll
+     *
+     * @void
+     */
+    resetScroll() {
+        window.scrollTo(0, 0);
+    }
+
+    /**
+     * Appends the current route name to body
+     *
+     * @void
+     */
+    setRoutebodyClassNames(classes = []) {
+        document.body.classList.add(...[this.routeClassName, `${this.currentTheme}-theme`, ...classes]);
+    }
+
+    /**
+     * Remove thes current route name from body
+     *
+     * @void
+     */
+    removeRoutebodyClassNames(classes = []) {
+        document.body.classList.remove(...[this.routeClassName, `${this.currentTheme}-theme`, ...classes]);
+    }
+
+    /**
+     * Toggle the activeTheme between light and dark, and returns the toggled them
+     *
+     * @return string
+     */
+    toggleTheme() {
+        const nextTheme = this.currentTheme === 'light' ? 'dark' : 'light';
+        this.setTheme(nextTheme);
+        return nextTheme;
+    }
+
+    /**
+     * Set the theme to the headData
+     *
+     * @void
+     */
+    setTheme(theme = 'light') {
+        document.body.classList.remove(`${this.currentTheme}-theme`);
+        document.body.classList.add(`${theme}-theme`);
+        this.currentUser.setOption(`theme`, theme);
+        this.activeTheme = theme;
+    }
+
+    /**
+     * Set the theme to the headData
+     *
+     * @void
+     */
+    setEnvironment() {
+        const isSandbox = this.currentUser.getOption('sandbox') || false;
+
+        if (isSandbox) {
+            document.body.classList.add('sandbox-console');
+        } else {
+            document.body.classList.remove('sandbox-console');
+        }
+    }
+}

package/addon/services/url-search-params.js

@@ -0,0 +1,92 @@
+import Service from '@ember/service';
+import { tracked } from '@glimmer/tracking';
+import hasJsonStructure from '../utils/has-json-structure';
+
+export default class UrlSearchParamsService extends Service {
+    /**
+     * The active URL params
+     *
+     * @var {Array}
+     */
+    @tracked urlParams;
+
+    /**
+     * Update the URL params
+     *
+     * @void
+     */
+    setSearchParams() {
+        this.urlParams = new URLSearchParams(window.location.search);
+
+        return this;
+    }
+
+    /**
+     * Get a param
+     *
+     * @param {String} key the url param
+     * @return mixed
+     */
+    getParam(key) {
+        this.setSearchParams();
+
+        let value = this.urlParams.get(key);
+
+        if (hasJsonStructure(value)) {
+            value = JSON.parse(value);
+        }
+
+        return value;
+    }
+
+    /**
+     * Get a param
+     *
+     * @param {String} key the url param
+     * @return mixed
+     */
+    get(key) {
+        return this.getParam(key);
+    }
+
+    /**
+     * Determines if a queryParam exists
+     *
+     * @param {String} key the url param
+     * @var {Boolean}
+     */
+    exists(key) {
+        this.setSearchParams();
+
+        return this.urlParams.has(key);
+    }
+
+    /**
+     * Remove a queryparam
+     *
+     * @param {String} key the url param
+     * @void
+     */
+    remove(key) {
+        this.setSearchParams();
+
+        return this.urlParams.delete(key);
+    }
+
+    /**
+     * Returns object of all params
+     *
+     * @return {Array}
+     */
+    all() {
+        this.setSearchParams();
+
+        const all = {};
+
+        for (let key of this.urlParams.keys()) {
+            all[key] = this.getParam(key);
+        }
+
+        return all;
+    }
+}

package/addon/transforms/array.js

@@ -0,0 +1,29 @@
+import Transform from '@ember-data/serializer/transform';
+import isIterable from '../utils/is-iterable';
+import { isArray } from '@ember/array';
+
+export default class ArrayTransform extends Transform {
+    deserialize(serialized) {
+        if (isArray(serialized)) {
+            return serialized;
+        }
+
+        if (!isIterable(serialized)) {
+            return [];
+        }
+
+        return Array.from(serialized);
+    }
+
+    serialize(deserialized) {
+        if (isArray(deserialized)) {
+            return deserialized;
+        }
+
+        if (!isIterable(deserialized)) {
+            return [];
+        }
+
+        return Array.from(deserialized);
+    }
+}

package/addon/transforms/object.js

@@ -0,0 +1,11 @@
+import Transform from '@ember-data/serializer/transform';
+
+export default class ObjectTransform extends Transform {
+    deserialize(serialized) {
+        return Object.assign({}, serialized);
+    }
+
+    serialize(deserialized) {
+        return Object.assign({}, deserialized);
+    }
+}

package/addon/transforms/raw.js

@@ -0,0 +1,11 @@
+import Transform from '@ember-data/serializer/transform';
+
+export default class RawTransform extends Transform {
+    deserialize(serialized) {
+        return serialized;
+    }
+
+    serialize(deserialized) {
+        return deserialized;
+    }
+}

package/addon/utils/api-url.js

@@ -0,0 +1,11 @@
+import consoleUrl from './console-url';
+import config from '@fleetbase/console/config/environment';
+import { get } from '@ember/object';
+
+export default function apiUrl(path, queryParams = {}, subdomain = null, host = null) {
+    if (host === null) {
+        host = `${get(config, 'API.host')}/${get(config, 'API.namespace')}`;
+    }
+
+    return consoleUrl(path, queryParams, subdomain, host);
+}

package/addon/utils/apply-column-filters.js

@@ -0,0 +1,3 @@
+export default function applyColumnFilters() {
+    return true;
+}

package/addon/utils/auto-serialize.js

@@ -0,0 +1,100 @@
+import Model from '@ember-data/model';
+import { isArray } from '@ember/array';
+import { get } from '@ember/object';
+import { isEmpty, tryInvoke } from '@ember/utils';
+
+const _isEmpty = (value) => {
+    let empty = isEmpty(value);
+
+    if (empty) {
+        return empty;
+    }
+
+    // edge case for empty object {}
+    if (typeof value === 'object' && Object.values(value).length === 0) {
+        return true;
+    }
+
+    return empty;
+};
+
+const invoke = (context, method, ...params) => {
+    if (typeof context.method === 'function') {
+        return context.method(...params);
+    }
+
+    return null;
+};
+
+const serialize = (model) => {
+    let serializerMethods = ['toJSON', 'toJson', 'serialize'];
+
+    for (let i = 0; i < serializerMethods.length; i++) {
+        const serializer = serializerMethods.objectAt(i);
+        const serialized = invoke(model, serializer);
+
+        if (!_isEmpty(serialized)) {
+            return serialized;
+        }
+    }
+
+    return autoSerialize(model);
+};
+
+export default function autoSerialize(model, except = []) {
+    if (isArray(model)) {
+        return model.map((record) => autoSerialize(record, except));
+    }
+
+    if (!(model instanceof Model)) {
+        return {};
+    }
+
+    // hacky patch
+    const modelName = get(model, '_internalModel.modelName');
+
+    if (modelName === 'fleet') {
+        except.push('drivers');
+    }
+
+    if (modelName === 'zone') {
+        except.push('service_area');
+    }
+
+    const serialized = {};
+
+    // set uuid from id
+    serialized.id = model.id;
+    serialized.uuid = model.id;
+
+    // serialize attributes
+    model.eachAttribute((attr) => {
+        if (except.includes(attr)) {
+            return;
+        }
+
+        serialized[attr] = model[attr];
+    });
+
+    // serialize relationships
+    model.eachRelationship((attr, descriptor) => {
+        const { kind } = descriptor;
+
+        if (except.includes(attr)) {
+            return;
+        }
+
+        if (_isEmpty(model.get(attr))) {
+            serialized[attr] = null;
+            return;
+        }
+
+        if (kind === 'hasMany') {
+            serialized[attr] = model[attr].toArray().map((instance) => serialize(instance));
+        } else {
+            serialized[attr] = serialize(model[attr]);
+        }
+    });
+
+    return serialized;
+}

package/addon/utils/calculate-percentage.js

@@ -0,0 +1,3 @@
+export default function calculatePercentage(percentage, number) {
+    return (percentage / 100) * number;
+}

package/addon/utils/close-sidebar.js

@@ -0,0 +1,7 @@
+export default function closeSidebar() {
+    const sidebarNode = window?.document?.querySelector('nav.next-sidebar');
+
+    if (sidebarNode?.classList?.contains('is-open')) {
+        sidebarNode?.classList?.remove('is-open');
+    }
+}

package/addon/utils/console-url.js

@@ -0,0 +1,56 @@
+import config from '@fleetbase/console/config/environment';
+import { isBlank } from '@ember/utils';
+
+const isDevelopment = ['local', 'development'].includes(config.environment);
+const isProduction = ['production'].includes(config.environment);
+
+function queryString(params) {
+    return Object.keys(params)
+        .map((key) => `${key}=${params[key]}`)
+        .join('&');
+}
+
+function extractHostAndPort(url) {
+    try {
+        const parsedUrl = new URL(url);
+        const host = parsedUrl.hostname;
+        const port = parsedUrl.port;
+
+        return {
+            host: host,
+            port: port || null,
+        };
+    } catch (error) {
+        console.error('Invalid URL:', error);
+        return null;
+    }
+}
+
+export default function consoleUrl(path = '', queryParams = {}, subdomain = 'console', host = 'fleetbase.io') {
+    let parsedHost = extractHostAndPort(host);
+    let url = isDevelopment ? 'http://' : 'https://';
+
+    if (subdomain) {
+        url += subdomain + '.';
+    }
+
+    let urlParams = !isBlank(queryParams) ? queryString(queryParams) : '';
+
+    if (!isProduction && !isDevelopment) {
+        url += `${config.environment}.`;
+    }
+
+    url += parsedHost.host;
+
+    if (parsedHost.port) {
+        url += `:${parsedHost.port}`;
+    }
+
+    url += `/${path}`;
+
+    if (urlParams) {
+        url += `?${urlParams}`;
+    }
+
+    return url;
+}

package/addon/utils/copy-to-clipboard.js

@@ -0,0 +1,35 @@
+export default function copyToClipboard(value) {
+    const fallbackCopyToClipboard = (value) => {
+        return new Promise((resolve, reject) => {
+            const textArea = document.createElement('textarea');
+            textArea.value = value;
+
+            // Avoid scrolling to bottom
+            textArea.style.top = '0';
+            textArea.style.left = '0';
+            textArea.style.position = 'fixed';
+
+            document.body.appendChild(textArea);
+            textArea.focus();
+            textArea.select();
+
+            try {
+                document.execCommand('copy');
+                resolve(value);
+            } catch (error) {
+                reject(new Error(error));
+            }
+
+            document.body.removeChild(textArea);
+        });
+    };
+
+    const _copyToClipboard = (value) => {
+        if (!navigator.clipboard) {
+            return fallbackCopyToClipboard(value);
+        }
+        return navigator.clipboard.writeText(value);
+    };
+
+    return _copyToClipboard(value);
+}

package/addon/utils/corslite.js

@@ -0,0 +1,95 @@
+function corslite(url, callback, cors) {
+    var sent = false;
+
+    if (typeof window.XMLHttpRequest === 'undefined') {
+        return callback(Error('Browser not supported'));
+    }
+
+    if (typeof cors === 'undefined') {
+        var m = url.match(/^\s*https?:\/\/[^\/]*/);
+        cors = m && m[0] !== location.protocol + '//' + location.hostname + (location.port ? ':' + location.port : '');
+    }
+
+    var x = new window.XMLHttpRequest();
+
+    function isSuccessful(status) {
+        return (status >= 200 && status < 300) || status === 304;
+    }
+
+    if (cors && !('withCredentials' in x)) {
+        // IE8-9
+        x = new window.XDomainRequest();
+
+        // Ensure callback is never called synchronously, i.e., before
+        // x.send() returns (this has been observed in the wild).
+        // See https://github.com/mapbox/mapbox.js/issues/472
+        var original = callback;
+        callback = function () {
+            if (sent) {
+                original.apply(this, arguments);
+            } else {
+                var that = this,
+                    args = arguments;
+                setTimeout(function () {
+                    original.apply(that, args);
+                }, 0);
+            }
+        };
+    }
+
+    function loaded() {
+        if (
+            // XDomainRequest
+            x.status === undefined ||
+            // modern browsers
+            isSuccessful(x.status)
+        )
+            callback.call(x, null, x);
+        else callback.call(x, x, null);
+    }
+
+    // Both `onreadystatechange` and `onload` can fire. `onreadystatechange`
+    // has [been supported for longer](http://stackoverflow.com/a/9181508/229001).
+    if ('onload' in x) {
+        x.onload = loaded;
+    } else {
+        x.onreadystatechange = function readystate() {
+            if (x.readyState === 4) {
+                loaded();
+            }
+        };
+    }
+
+    // Call the callback with the XMLHttpRequest object as an error and prevent
+    // it from ever being called again by reassigning it to `noop`
+    x.onerror = function error(evt) {
+        // XDomainRequest provides no evt parameter
+        callback.call(this, evt || true, null);
+        callback = function () {};
+    };
+
+    // IE9 must have onprogress be set to a unique function.
+    x.onprogress = function () {};
+
+    x.ontimeout = function (evt) {
+        callback.call(this, evt, null);
+        callback = function () {};
+    };
+
+    x.onabort = function (evt) {
+        callback.call(this, evt, null);
+        callback = function () {};
+    };
+
+    // GET is the only supported HTTP Verb by XDomainRequest and is the
+    // only one supported here.
+    x.open('GET', url, true);
+
+    // Send the request. Sending data is not supported.
+    x.send(null);
+    sent = true;
+
+    return x;
+}
+
+export default corslite;