Merge pull request #34 from fleetbase/dev-v0.2.10

v0.2.10 ~ upgraded dependencies

Author: roncodes

.github/workflows/create-release.yml

@@ -0,0 +1,21 @@
+name: Create Release
+on:
+  push:
+    tags:
+      - 'v*'
+
+jobs:
+  create:
+    runs-on: ubuntu-latest
+    steps:
+        - uses: actions/checkout@v4
+        - name: Publish GitHub Release
+          uses: softprops/action-gh-release@v2
+          with:
+            tag_name: ${{ github.ref_name }}
+            name: ${{ github.ref_name }}
+            generate_release_notes: true 
+            draft: false
+            prerelease: false
+          env:
+            GITHUB_TOKEN: ${{ secrets.GITHUB_TOKEN }}

addon/components/webhook/attempts.hbs

@@ -44,7 +44,7 @@
                 </div>
             </div>
         </div>
-        <div class="flex-1">
+        <div>
             {{#if this.webhookRequestLogs.meta}}
                 <Pagination
                     @meta={{this.webhookRequestLogs.meta}}

addon/components/webhook/details.hbs

@@ -1,4 +1,4 @@
-<div class="content-panel" ...attributes>
+<div class="content-panel border-b border-gray-200 dark:border-gray-700" ...attributes>
     <div class="content-panel-header">
         <div class="flex items-center">
             <h3 class="mr-4 text-xl font-bold dark:text-gray-100">
@@ -10,7 +10,7 @@
             <Button @icon="pencil" @text={{t "developers.component.webhook.details.update-details"}} @onClick={{this.onClickUpdateWebhook}} @permission={{@permission}} />
         </div>
     </div>
-    <div class="text-sm content-panel-body">
+    <div class="text-sm content-panel-body pt-0i">
         <table class="border-none table-fixed dark:text-gray-100 table-spaced-y-2 table-cells-valign-top">
             <tbody>
                 <tr>

addon/components/webhook/metrics.hbs

@@ -1,19 +1,19 @@
-<div class="content-panel" ...attributes>
+<div class="content-panel bg-gray-300 dark:bg-gray-800 border-b border-gray-200 dark:border-gray-700" ...attributes>
     <div class="content-panel-body no-y-padding">
         <div class="flex items-center text-sm dark:text-gray-100">
-            <div class="px-6 py-3 pl-0 mr-3 border-r border-gray-100 dark:border-gray-900">
+            <div class="px-6 py-3 pl-0 mr-3">
                 <div class="mb-1">
                     {{t "developers.common.status"}}
                 </div>
                 <Badge @status={{@webhook.status}} />
             </div>
-            <div class="px-6 py-3 mr-3 border-r border-gray-100 dark:border-gray-900">
+            <div class="px-6 py-3 mr-3">
                 <div class="mb-1">
                     {{t "developers.common.mode"}}
                 </div>
                 <Badge @status={{@webhook.mode}} />
             </div>
-            <div class="px-6 py-3 mr-3 border-r border-gray-100 dark:border-gray-900">
+            <div class="px-6 py-3 mr-3">
                 <div class="mb-1">
                     {{t "developers.common.version"}}
                 </div>

addon/templates/sockets/view.hbs

@@ -1,18 +1,19 @@
-<Layout::Section::Header @title={{@model.name}}>
+<Layout::Section::Header @title={{@model.name}} @leftSubheaderClass="flex-1">
     <Button @icon="long-arrow-left" @iconPrefix="fas" @text={{t "developers.common.back"}} @onClick={{this.goBack}} />
 </Layout::Section::Header>
 
 <Layout::Section::Body>
     <div class="h-screen overflow-y-scroll pb-40">
-        <div class="space-y-6 py-6 max-w-6xl mx-auto">
+        <div class="py-6 max-w-4xl mx-auto">
             <ContentPanel
                 @titleStatusRight="Channel"
                 @titleStatusRightClass="info-status-badge"
                 @hideStatusDot={{true}}
                 @title={{@model.name}}
                 @open={{true}}
                 @pad={{false}}
-                @panelBodyClass="bg-black"
+                @panelBodyClass="bg-black p-0i"
+                @wrapperClass="bordered-classic"
             >
                 <div id="output" class="font-mono rounded-b-md max-h-full p-6 overflow-y-scroll bg-black shadow-inner dark:shadow-none">
                     <div class="flex items-center justify-between mb-4">

addon/templates/webhooks/view.hbs

@@ -12,11 +12,12 @@
 </Layout::Section::Header>
 
 <Layout::Section::Body>
-    <div class="h-screen overflow-y-scroll pb-40">
-        <div class="space-y-6 py-6 max-w-6xl mx-auto">
+    <div class="h-screen overflow-y-scroll">
+        <div class="space-y-2 mx-auto">
             <Webhook::Metrics @webhook={{@model}} />
             <Webhook::Details @webhook={{@model}} @onClickUpdateWebhook={{this.updateWebhookDetails}} @permission="developers update webhook" />
             <Webhook::Attempts @webhook={{@model}} />
         </div>
+        <Spacer @height="200px" />
     </div>
 </Layout::Section::Body>

index.js

@@ -3,9 +3,48 @@ const { buildEngine } = require('ember-engines/lib/engine-addon');
 const { name } = require('./package');
 const Funnel = require('broccoli-funnel');
 
+function isDevServe() {
+    // env checks
+    const env = process.env.EMBER_ENV || process.env.NODE_ENV || 'development';
+    const isProd = env === 'production' || process.env.CI === 'true';
+
+    // command-line checks (serve/watch only)
+    const argv = process.argv.join(' ');
+    const isServeCmd = /\b(ember|node).* (serve|server)\b/.test(argv) || process.argv.includes('serve') || process.argv.includes('server');
+    const isWatch = process.argv.includes('--watch') || process.env.BROCCOLI_WATCHER;
+
+    return !isProd && (isServeCmd || isWatch);
+}
+
 module.exports = buildEngine({
     name,
 
+    init() {
+        if (this._super.init) this._super.init.apply(this, arguments);
+
+        if (isDevServe()) {
+            for (let addon of this.addons || []) {
+                if (['@fleetbase/ember-core', '@fleetbase/ember-ui'].includes(addon.name)) {
+                    let origTreeFor = addon.treeFor?.bind(addon);
+                    addon.treeFor = function (type) {
+                        if (type === 'styles') {
+                            return undefined;
+                        }
+                        return origTreeFor ? origTreeFor(type) : undefined;
+                    };
+                }
+            }
+
+            const origNonDup = this.nonDuplicatedAddonInvoke?.bind(this);
+            this.nonDuplicatedAddonInvoke = (hook, args = []) => {
+                if (hook === 'treeFor' && args[0] === 'styles') {
+                    return []; // prevents dependency style relocation funnel (dev-only)
+                }
+                return origNonDup ? origNonDup(hook, args) : [];
+            };
+        }
+    },
+
     postprocessTree(type, tree) {
         if (type === 'css') {
             tree = new Funnel(tree, {

package.json

@@ -1,6 +1,6 @@
 {
     "name": "@fleetbase/dev-engine",
-    "version": "0.2.9",
+    "version": "0.2.10",
     "description": "Fleetbase Developers extension provides a module for managing developer resources such as API keys, webhooks, sockets, events and logs.",
     "fleetbase": {
         "route": "developers"