@fleetbase/fleetops-engine 0.6.18 → 0.6.19

package/addon/components/order-config/activity-flow-editor.hbs

@@ -1,149 +0,0 @@
-<div class="order-config-activity-flow-editor" {{did-insert this.setupComponent}} ...attributes>
-    <div class="content-panel mb-20">
-        <div class="content-panel-header items-center">
-            <h3 class="text-lg font-semibold dark:text-gray-100">
-                {{t "fleet-ops.component.order-config.activity-flow-editor.title"}}
-            </h3>
-
-            <Button @icon="plus" @iconPrefix="fas" @text="New Status" @size="sm" @onClick={{this.newStatus}} />
-        </div>
-        <div class="content-panel-body no-padding">
-            <div class="my-6 px-5">
-                <p>{{t "fleet-ops.component.order-config.activity-flow-editor.message"}}</p>
-            </div>
-
-            <div class="ui-tabs mb-4">
-                <nav>
-                    <a href="javascript:;" class="ui-tab {{if (eq this.activeTab 'order') 'active'}}" {{on "click" (fn (mut this.activeTab) "order")}}>
-                        {{t "fleet-ops.component.order-config.activity-flow-editor.order-flow"}}
-                    </a>
-                    <a href="javascript:;" class="ui-tab {{if (eq this.activeTab 'waypoint') 'active'}}" {{on "click" (fn (mut this.activeTab) "waypoint")}}>
-                        {{t "fleet-ops.component.order-config.activity-flow-editor.waypoint-flow"}}
-                    </a>
-                </nav>
-            </div>
-
-            {{#if @orderConfig.meta.flow}}
-                <div class="px-5">
-                    {{#if this.flow}}
-                        <Dragula @onDrop={{this.moveStatus}} @onReady={{this.setDragulaInstance}} as |Container|>
-                            <Container class="activity-flow-connector">
-                                {{#each-in this.activeFlow as |status activity|}}
-                                    <div data-status={{status}} class="activity-flow-sub-connector {{dasherize (flow-raw-status status)}}-flow pb-6">
-                                        <div class="activity-status relative cursor-move flex items-center justify-center mb-6">
-                                            <div
-                                                class="relative px-3 py-2 status-element
-                                                    {{dasherize (flow-raw-status status)}}-status-element rounded-md flex flex-col items-center justify-center"
-                                            >
-                                                <Badge @status={{flow-raw-status status}} class="status-badge-lg shadow-none" />
-                                                <Button
-                                                    @text={{t "fleet-ops.component.order-config.activity-flow-editor.new-activity"}}
-                                                    @icon="plus"
-                                                    @iconPrefix="fas"
-                                                    @wrapperClass="my-2"
-                                                    @onClick={{fn this.addNewActivity status}}
-                                                />
-                                                {{#if (not (includes status (w "created dispatched completed")))}}
-                                                    <div class="absolute top-0 right-0">
-                                                        <button
-                                                            type="button"
-                                                            class="flex items-center justify-center rounded-full w-6 h-6 bg-gray-900 font-semibold text-white -mt-3 -mr-3 shadow-sm"
-                                                            {{on "click" (fn this.removeStatus status)}}
-                                                        >
-                                                            <FaIcon @prefix="fas" @icon="times" class="text-white" />
-                                                        </button>
-                                                    </div>
-                                                {{/if}}
-                                            </div>
-                                        </div>
-                                        <div class="activity-events-list">
-                                            {{#each activity.events as |event|}}
-                                                <div class="shadow-sm border-2 status-element-border {{dasherize (flow-raw-status status)}}-status-element dark:bg-gray-800 bg-gray-100">
-                                                    <div class="p-3 border-b border-gray-300 dark:border-gray-900">
-                                                        <div class="mb-4 flex items-center justify-between">
-                                                            <div>
-                                                                <FaIcon @icon="sitemap" class="mr-2 dark:text-sky-300" />
-                                                                <span class="dark:text-gray-100 text-sm">{{t "fleet-ops.component.order-config.activity-flow-editor.activity-details"}}</span>
-                                                            </div>
-                                                            <a href="javascript:;" class="btn btn-danger btn-sm" {{on "click" (fn this.removeActivity status event)}}>
-                                                                <FaIcon @icon="trash" />
-                                                            </a>
-                                                        </div>
-                                                        <div class="grid grid-cols-3 gap-2">
-                                                            <InputGroup @name={{t "fleet-ops.common.status"}} @value={{event.status}} />
-                                                            <InputGroup @name={{t "fleet-ops.common.code"}} @value={{event.code}} />
-                                                            <InputGroup @name={{t "fleet-ops.common.details"}} @value={{event.details}} />
-                                                        </div>
-                                                    </div>
-                                                    <div class="p-3">
-                                                        <div class="mb-4 flex items-center justify-between">
-                                                            <div>
-                                                                <FaIcon @icon="project-diagram" class="mr-2 dark:text-sky-300" />
-                                                                <span class="dark:text-gray-100 text-sm">{{t "fleet-ops.component.order-config.activity-flow-editor.logic-stack"}}</span>
-                                                            </div>
-                                                            <Button
-                                                                @text={{t "fleet-ops.component.order-config.activity-flow-editor.add-logic"}}
-                                                                @icon="plus"
-                                                                @iconPrefix="fas"
-                                                                @onClick={{fn this.addLogicCondition status event}}
-                                                            />
-                                                        </div>
-                                                        <div class="space-y-3 mb-3">
-                                                            {{#each event.if as |logic conditionIndex|}}
-                                                                <div class="grid grid-cols-5 gap-2">
-                                                                    <div class="flex items-center col-span-2">
-                                                                        <div
-                                                                            class="py-2 px-3 rounded flex items-center justify-center text-center text-sm font-bold text-mono mr-3 dark:text-gray-50 border border-gray-50 dark:border-gray-900"
-                                                                        >
-                                                                            if
-                                                                        </div>
-                                                                        <Select
-                                                                            @options={{this.configFields}}
-                                                                            @value={{get logic 0}}
-                                                                            @placeholder="Select field"
-                                                                            class="flex-1 w-full"
-                                                                            @onSelect={{fn this.updateActivityLogic status event conditionIndex 0}}
-                                                                        />
-                                                                    </div>
-                                                                    <Select
-                                                                        @options={{this.logicOperators}}
-                                                                        @value={{get logic 1}}
-                                                                        @optionLabel="label"
-                                                                        @optionValue="value"
-                                                                        @onSelect={{fn this.updateActivityLogic status event conditionIndex 1}}
-                                                                        @placeholder={{t "fleet-ops.component.order-config.activity-flow-editor.select-operator"}}
-                                                                    />
-                                                                    <div class="flex items-center col-span-2">
-                                                                        <Input
-                                                                            @type="text"
-                                                                            @value={{get logic 2}}
-                                                                            {{on "keyup" (fn this.updateActivityLogic status event conditionIndex 2)}}
-                                                                            placeholder={{t "fleet-ops.component.order-config.activity-flow-editor.enter-value"}}
-                                                                            class="form-input w-full flex-1 mr-3"
-                                                                        />
-                                                                        <Button @size="sm" @icon="trash" @onClick={{fn this.removeLogicCondition event logic}} />
-                                                                    </div>
-                                                                </div>
-                                                            {{else}}
-                                                                <div class="flex items-center justify-center">
-                                                                    <div
-                                                                        class="rounded bg-gray-300 dark:bg-gray-700 shadow-sm text-sm text-center px-6 py-3 dark:text-gray-100 border border-dashed border-gray-500 dark:border-gray-900"
-                                                                    >{{t "fleet-ops.component.order-config.activity-flow-editor.no-logic"}}</div>
-                                                                </div>
-                                                            {{/each}}
-                                                        </div>
-                                                    </div>
-
-                                                </div>
-                                            {{/each}}
-                                        </div>
-                                    </div>
-                                {{/each-in}}
-                            </Container>
-                        </Dragula>
-                    {{/if}}
-                </div>
-            {{/if}}
-        </div>
-    </div>
-</div>

package/addon/components/order-config/activity-flow-editor.js

@@ -1,374 +0,0 @@
-import Component from '@glimmer/component';
-import { tracked } from '@glimmer/tracking';
-import { inject as service } from '@ember/service';
-import { action, computed, set, setProperties } from '@ember/object';
-import { isArray } from '@ember/array';
-import { equal } from '@ember/object/computed';
-import { underscore } from '@ember/string';
-import generateUuid from '@fleetbase/ember-core/utils/generate-uuid';
-
-export default class OrderConfigActivityFlowEditorComponent extends Component {
-    constructor() {
-        super(...arguments);
-        const { orderConfig } = this.args;
-
-        this.orderConfig = orderConfig;
-
-        if (orderConfig.meta.flow) {
-            this.flow = this.fixOrderFlow(orderConfig.meta.flow);
-        }
-    }
-
-    @service modalsManager;
-    @service notifications;
-    @service fetch;
-    @service intl;
-    @tracked drake;
-    @tracked orderConfig = {};
-    @tracked flow = {};
-    @tracked dynamicMetaFields = [];
-    @tracked notify = 0;
-    @tracked activeTab = 'order';
-
-    @tracked logicOperators = [
-        { label: 'equals', value: '=' },
-        { label: 'not equals', value: '!=' },
-        { label: 'contains', value: '$' },
-        { label: 'greater than', value: '>' },
-        { label: 'less than', value: '<' },
-    ];
-
-    @equal('activeTab', 'order') isOrderTab;
-    @equal('activeTab', 'waypoint') isWaypointTab;
-    @equal('activeTab', 'entity') isEntityTab;
-
-    @computed('activeTab', 'flow', 'orderConfig.id') get activeFlow() {
-        const activeTab = this.activeTab;
-
-        return this[`${activeTab}Flow`];
-    }
-
-    @computed('flow', 'orderConfig.id') get waypointFlow() {
-        const { flow } = this;
-        const keys = Object.keys(flow);
-        const waypointFlow = {};
-
-        for (let i = 0; i < keys.length; i++) {
-            const key = keys.objectAt(i);
-
-            if (key.startsWith('waypoint|')) {
-                waypointFlow[key] = flow[key];
-            }
-        }
-
-        return waypointFlow;
-    }
-
-    @computed('flow', 'orderConfig.id') get entityFlow() {
-        const { flow } = this;
-        const keys = Object.keys(flow);
-        const entityFlow = {};
-
-        for (let i = 0; i < keys.length; i++) {
-            const key = keys.objectAt(i);
-
-            if (key.startsWith('waypoint|')) {
-                entityFlow[key] = flow[key];
-            }
-        }
-
-        return entityFlow;
-    }
-
-    @computed('flow', 'orderConfig.id') get orderFlow() {
-        const { flow } = this;
-        const keys = Object.keys(flow);
-        const orderFlow = {};
-
-        for (let i = 0; i < keys.length; i++) {
-            const key = keys.objectAt(i);
-
-            if (!key.startsWith('waypoint|') && !key.startsWith('entity|')) {
-                orderFlow[key] = flow[key];
-            }
-        }
-
-        return orderFlow;
-    }
-
-    @computed('orderConfig', 'flow', 'orderConfig.meta.fields.[]', 'dynamicMetaFields.[]')
-    get configFields() {
-        const { flow, dynamicMetaFields } = this;
-        const defaultLogicFields = ['status', 'type', 'internal_id', 'id', 'adhoc', 'pod_method', 'pod_required', 'scheduled_at'];
-        const metaFields = Array.from(this.orderConfig.meta.fields ?? []).map((metaField) => `meta.${metaField.key}`);
-        const inheritedFields = [];
-
-        // loop through and add preset meta fields
-        for (let key in flow) {
-            const activity = flow[key];
-
-            if (isArray(activity.events)) {
-                for (let i = 0; i < activity.events.length; i++) {
-                    const event = activity.events.objectAt(i);
-
-                    if (isArray(event.if)) {
-                        for (let j = 0; j < event.if.length; j++) {
-                            const logic = event.if.objectAt(j);
-
-                            if (typeof logic[0] === 'string') {
-                                inheritedFields.pushObject(logic[0]);
-                            }
-                        }
-                    }
-                }
-            }
-        }
-
-        return [...defaultLogicFields, ...metaFields, ...inheritedFields, ...dynamicMetaFields];
-    }
-
-    @action setupComponent() {
-        this.fetchDynamicMetaFields();
-    }
-
-    @action fetchDynamicMetaFields() {
-        this.fetch
-            .get('fleet-ops/order-configs/dynamic-meta-fields', {
-                type: this.orderConfig.key,
-            })
-            .then((dynamicMetaFields) => {
-                this.dynamicMetaFields = dynamicMetaFields ?? [];
-            });
-    }
-
-    @action setDragulaInstance(drake) {
-        this.drake = drake;
-    }
-
-    @action newStatus() {
-        const { flow } = this;
-
-        this.modalsManager.show('modals/order-config-new-status', {
-            title: this.intl.t('fleet-ops.component.order-config.activity-flow-editor.add-status'),
-            statusName: null,
-            confirm: async (modal) => {
-                const statusName = modal.getOption('statusName');
-
-                if (!statusName) {
-                    return this.notifications.warning(this.intl.t('fleet-ops.component.order-config.activity-flow-editor.no-status'));
-                }
-
-                const format = (status) => underscore(status.toLowerCase());
-                const status = this.activeTab === 'order' ? format(statusName) : `${this.activeTab}|${format(statusName)}`;
-
-                if (flow[status]) {
-                    await modal.done();
-                    // prompt to confirm overwrite
-                    return this.modalsManager.confirm({
-                        title: this.intl.t('fleet-ops.component.order-config.activity-flow-editor.overwrite'),
-                        body: this.intl.t('fleet-ops.component.order-config.activity-flow-editor.overwrite-text', { statusName: statusName }),
-                        acceptButtonText: this.intl.t('fleet-ops.component.order-config.activity-flow-editor.overwrite-button'),
-                        confirm: (modal) => {
-                            this.insertNewStatus(status);
-                            modal.done();
-                        },
-                    });
-                }
-
-                this.insertNewStatus(status);
-                modal.done();
-            },
-        });
-    }
-
-    insertNewStatus(statusName) {
-        const { flow } = this;
-        const status = underscore(statusName.toLowerCase());
-
-        // insert status
-        set(flow, status, {
-            id: generateUuid(),
-            sequence: Object.keys(flow).length + 1,
-            events: [],
-        });
-        this.flow = flow;
-
-        // add initial activity
-        this.addNewActivity(status);
-
-        if (typeof this.args.onFlowChanged === 'function') {
-            this.args.onFlowChanged(this.flow);
-        }
-    }
-
-    @action removeStatus(status) {
-        const { flow } = this;
-        this.modalsManager.confirm({
-            title: this.intl.t('fleet-ops.component.order-config.activity-flow-editor.remove'),
-            body: this.intl.t('fleet-ops.component.order-config.activity-flow-editor.remove-text'),
-            acceptButtonText: this.intl.t('fleet-ops.component.order-config.activity-flow-editor.delete-button'),
-            confirm: (modal) => {
-                delete flow[status];
-                set(this, 'flow', flow);
-
-                if (typeof this.args.onFlowChanged === 'function') {
-                    this.args.onFlowChanged(this.flow);
-                }
-                modal.done();
-            },
-        });
-    }
-
-    @action moveStatus(el, container) {
-        const { flow } = this;
-        const { status } = el.dataset;
-
-        if (!status) {
-            return;
-        }
-
-        const format = (s) => s.replace(`${this.activeTab}|`, '');
-
-        // if status is created or dispatched prevent from dragging
-        if (['created', 'dispatched', 'completed'].includes(format(status))) {
-            this.notifications.warning(this.intl.t('fleet-ops.component.order-config.activity-flow-editor.unable-warning', { status: format(status) }));
-            this.drake.cancel(true);
-            return;
-        }
-
-        const sequence = Array.prototype.indexOf.call(container.children, el);
-        const activity = flow[status];
-
-        // if is not created but attempt to move to sequence 0
-        if (format(status) !== 'created' && sequence === 0) {
-            this.notifications.warning(this.intl.t('fleet-ops.component.order-config.activity-flow-editor.order-warning'));
-            this.drake.cancel(true);
-            return;
-        }
-
-        if (!activity) {
-            return;
-        }
-
-        setProperties(activity, { sequence });
-
-        this.flow[status] = activity;
-
-        if (typeof this.args.onFlowChanged === 'function') {
-            this.args.onFlowChanged(this.flow);
-        }
-    }
-
-    @action addNewActivity(status) {
-        if (!this.flow[status]) {
-            return;
-        }
-
-        const event = {
-            id: generateUuid(),
-            stauts: null,
-            code: null,
-            details: null,
-            if: [],
-        };
-
-        this.flow[status]['events'].pushObject(event);
-
-        if (typeof this.args.onFlowChanged === 'function') {
-            this.args.onFlowChanged(this.flow);
-        }
-    }
-
-    @action removeActivity(status, event) {
-        if (!this.flow[status]) {
-            return;
-        }
-
-        if (this.flow[status]['events'].length === 1) {
-            return;
-        }
-
-        this.flow[status]['events'].removeObject(event);
-
-        if (typeof this.args.onFlowChanged === 'function') {
-            this.args.onFlowChanged(this.flow);
-        }
-    }
-
-    @action updateActivityLogic(status, event, conditionIndex, index, value) {
-        if (!this.flow[status]) {
-            return;
-        }
-
-        const eventIndex = this.flow[status]['events'].findIndex((e) => e.code === event.code);
-
-        if (eventIndex === -1) {
-            return;
-        }
-
-        set(this.flow, `${status}.events.${eventIndex}.if.${conditionIndex}.${index}`, value);
-
-        if (typeof this.args.onFlowChanged === 'function') {
-            this.args.onFlowChanged(this.flow);
-        }
-    }
-
-    @action addLogicCondition(status, event) {
-        if (!this.flow[status]) {
-            return;
-        }
-
-        const condition = ['if', '=', ''];
-        const index = this.flow[status]['events'].findIndex((e) => e.code === event.code);
-
-        if (index === -1) {
-            return;
-        }
-
-        if (!isArray(event.if)) {
-            event.if = [];
-        }
-
-        event.if.pushObject(condition);
-
-        this.flow[status]['events'][index] = event;
-
-        if (typeof this.args.onFlowChanged === 'function') {
-            this.args.onFlowChanged(this.flow);
-        }
-    }
-
-    @action removeLogicCondition(event, condition) {
-        event.if.removeObject(condition);
-
-        if (typeof this.args.onFlowChanged === 'function') {
-            this.args.onFlowChanged(this.flow);
-        }
-    }
-
-    fixOrderFlow(flow) {
-        const patched = {};
-
-        for (const status in flow) {
-            const activity = flow[status];
-
-            patched[status] = activity;
-
-            for (let i = 0; i < activity.events.length; i++) {
-                const event = activity.events.objectAt(i);
-
-                if (!event.if) {
-                    event.if = [];
-                }
-
-                if (!event.post_actions) {
-                    event.post_actions = [];
-                }
-
-                patched[status]['events'][i] = event;
-            }
-        }
-
-        return patched;
-    }
-}

package/addon/components/order-config/details-editor.hbs

@@ -1,69 +0,0 @@
-<div class="order-config-details-editor" ...attributes>
-    <div class="content-panel mb-6">
-        <div class="content-panel-header items-center">
-            <h3 class="text-lg font-semibold dark:text-gray-100">
-                {{@orderConfig.name}}
-            </h3>
-            <div>
-                {{#if @orderConfig.installed}}
-                    <Badge @hideStatusDot={{false}} @disableHumanize={{true}} @status="success">Installed</Badge>
-                {{/if}}
-            </div>
-        </div>
-        <div class="content-panel-body">
-
-            <InputGroup @name={{t "fleet-ops.common.name"}} @value={{@orderConfig.name}} />
-            <InputGroup @name={{t "fleet-ops.common.description"}} @value={{@orderConfig.description}} />
-            <InputGroup
-                @name={{t "fleet-ops.common.key"}}
-                @value={{@orderConfig.key}}
-                @disabled={{true}}
-                readonly={{true}}
-                @helpText={{t "fleet-ops.component.order-config.details-editor.key-text"}}
-            />
-            <InputGroup
-                @name={{t "fleet-ops.common.namespace"}}
-                @value={{@orderConfig.namespace}}
-                @disabled={{true}}
-                readonly={{true}}
-                @helpText={{t "fleet-ops.component.order-config.details-editor.namespace-text"}}
-            />
-            <InputGroup
-                @name={{t "fleet-ops.component.order-config.details-editor.id"}}
-                @value={{@orderConfig.extension_id}}
-                @disabled={{true}}
-                readonly={{true}}
-                @helpText={{t "fleet-ops.component.order-config.details-editor.id-text"}}
-            />
-            <InputGroup
-                @name={{t "fleet-ops.component.order-config.details-editor.version"}}
-                @value={{@orderConfig.version}}
-                @disabled={{true}}
-                readonly={{true}}
-                @helpText={{t "fleet-ops.component.order-config.details-editor.version-text"}}
-            />
-        </div>
-    </div>
-    <div class="flex items-center justify-end">
-        <Button
-            @type="default"
-            @icon="clone"
-            @text={{t "fleet-ops.component.order-config.details-editor.clone"}}
-            @size="sm"
-            @wrapperClass="mr-2"
-            @onClick={{fn this.sendAction "clone" @orderConfig}}
-        />
-        {{#if @orderConfig.installed}}
-            <Button
-                @type="danger"
-                @icon="trash"
-                @text={{t "fleet-ops.component.order-config.details-editor.uninstall"}}
-                @size="sm"
-                @onClick={{fn this.sendAction "uninstall" @orderConfig}}
-            />
-        {{else}}
-            <Button @type="danger" @icon="trash" @text={{t "fleet-ops.component.order-config.details-editor.delete"}} @size="sm" @onClick={{fn this.sendAction "delete" @orderConfig}} />
-        {{/if}}
-    </div>
-    {{yield}}
-</div>

package/addon/components/order-config/details-editor.js

@@ -1,16 +0,0 @@
-import Component from '@glimmer/component';
-import { action } from '@ember/object';
-import { classify } from '@ember/string';
-
-export default class OrderConfigDetailsEditorComponent extends Component {
-    @action sendAction(action) {
-        const actionName = `on${classify(action)}`;
-        const params = [...arguments];
-
-        params.shift();
-
-        if (typeof this.args[actionName] === 'function') {
-            this.args[actionName](...params);
-        }
-    }
-}