Pallet Working Release

.github/workflows/ember.yml

@@ -8,21 +8,19 @@ on:
   pull_request:
     branches: [ main ]
 
+env:
+  NODE_VERSION: 22.x
+
 jobs:
   build:
     runs-on: ubuntu-latest
-
-    strategy:
-      matrix:
-        node-version: [18.x]  # Build on Node.js 18
-
     steps:
     - uses: actions/checkout@v2
 
-    - name: Setup Node.js ${{ matrix.node-version }}
+    - name: Setup Node.js ${{ env.NODE_VERSION }}
       uses: actions/setup-node@v2
       with:
-        node-version: ${{ matrix.node-version }}
+        node-version: ${{ env.NODE_VERSION }}
 
     - name: Setup pnpm
       uses: pnpm/action-setup@v2.0.1
@@ -42,10 +40,10 @@ jobs:
     steps:
     - uses: actions/checkout@v2
 
-    - name: Setup Node.js 18.x
+    - name: Setup Node.js ${{ env.NODE_VERSION }}
       uses: actions/setup-node@v2
       with:
-        node-version: 18.x
+        node-version: ${{ env.NODE_VERSION }}
 
     - name: Setup pnpm
       uses: pnpm/action-setup@v2.0.1
@@ -71,10 +69,10 @@ jobs:
     steps:
       - uses: actions/checkout@v2
 
-      - name: Setup Node.js 18.x
+      - name: Setup Node.js ${{ env.NODE_VERSION }}
         uses: actions/setup-node@v2
         with:
-          node-version: 18.x
+          node-version: ${{ env.NODE_VERSION }}
 
       - name: Setup pnpm
         uses: pnpm/action-setup@v2.0.1

addon/adapters/pallet-product-variant.js

@@ -0,0 +1,7 @@
+import PalletAdapter from './pallet';
+
+export default class PalletProductVariantAdapter extends PalletAdapter {
+    pathForType() {
+        return 'product-variants';
+    }
+}

addon/components/admin/product-category.hbs

@@ -1,6 +1,6 @@
 <ContentPanel @title="Categories" @open={{true}} @pad={{true}} @panelBodyClass="bg-white dark:bg-gray-800">
     <div class="mt-3 flex items-center justify-end">
-        <Button @type="primary" @size="sm" @icon="plus" @text="Add category" @onClick={{this.addCategory}} @disabled={{this.isLoading}} @isLoading={{this.isLoading}} />
+        <Button @type="primary" @size="sm" @icon="plus" @text="Add category" @onClick={{this.addCategory}} />
     </div>
     <div class="mt-3">
         <ul>

addon/components/admin/product-category.js

@@ -13,7 +13,6 @@ export default class AdminProductCategoryComponent extends Component {
     @service hostRouter;
     @tracked categories = [];
     @tracked selectedCategory;
-    @tracked isLoading = false;
     @tracked buttonTitle = null;
 
     constructor() {

addon/components/batch-form-panel.hbs

@@ -3,7 +3,7 @@
     @position="right"
     @noBackdrop={{true}}
     @fullHeight={{true}}
-    @isResizeble={{or this.isResizable @isResizable}}
+    @isResizable={{or this.isResizable @isResizable}}
     @width={{or this.width @width "600px"}}
 >
     <Overlay::Header
@@ -18,8 +18,10 @@
                 @icon={{if this.batch.id "save" "check"}}
                 @type="primary"
                 @text={{if this.batch.id "Save Batch" "Add Batch"}}
-                @onClick={{this.save}}
+                @onClick={{perform this.saveTask}}
                 @wrapperClass="mr-2"
+                @isLoading={{this.saveTask.isRunning}}
+                @disabled={{this.saveTask.isRunning}}
             />
             {{#if this.batch.id}}
                 <Button @type="default" @icon="batch" @helpText="View batch details" @onClick={{this.onViewDetails}} @wrapperClass="mr-2" />

addon/components/batch-form-panel.js

@@ -2,6 +2,7 @@ import Component from '@glimmer/component';
 import { tracked } from '@glimmer/tracking';
 import { inject as service } from '@ember/service';
 import { action } from '@ember/object';
+import { task } from 'ember-concurrency';
 import contextComponentCallback from '@fleetbase/ember-core/utils/context-component-callback';
 import applyContextComponentArguments from '@fleetbase/ember-core/utils/apply-context-component-arguments';
 
@@ -37,12 +38,6 @@ export default class BatchFormPanelComponent extends Component {
      */
     @tracked context;
 
-    /**
-     * Indicates whether the component is in a loading state.
-     * @type {boolean}
-     */
-    @tracked isLoading = false;
-
     /**
      * Fuel Report status
      * @type {Array}
@@ -75,31 +70,21 @@ export default class BatchFormPanelComponent extends Component {
      * @action
      * @returns {Promise<any>}
      */
-    @action save() {
+    @task *saveTask() {
         const { batch } = this;
 
         this.loader.showLoader('.next-content-overlay-panel-container', { loadingMessage: 'Saving batch...', preserveTargetPosition: true });
-        this.isLoading = true;
-
         contextComponentCallback(this, 'onBeforeSave', batch);
 
         try {
-            return batch
-                .save()
-                .then((batch) => {
-                    this.notifications.success(`Batch saved successfully.`);
-                    contextComponentCallback(this, 'onAfterSave', batch);
-                })
-                .catch((error) => {
-                    this.notifications.serverError(error);
-                })
-                .finally(() => {
-                    this.loader.removeLoader('.next-content-overlay-panel-container ');
-                    this.isLoading = false;
-                });
+            const savedBatch = yield batch.save();
+            this.notifications.success(`Batch saved successfully.`);
+            contextComponentCallback(this, 'onAfterSave', savedBatch);
+            return savedBatch;
         } catch (error) {
+            this.notifications.serverError(error);
+        } finally {
             this.loader.removeLoader('.next-content-overlay-panel-container ');
-            this.isLoading = false;
         }
     }
 

addon/components/batch/details.hbs

@@ -0,0 +1,38 @@
+<div class="details-wrapper" ...attributes>
+    <ContentPanel @title={{t "batch.sections.details"}} @open={{true}} @wrapperClass="bordered-top">
+        <div class="grid grid-cols-2 gap-2 text-xs dark:text-gray-100">
+            <div class="field-info-container">
+                <div class="field-name">{{t "common.id"}}</div>
+                <ClickToCopy @value={{@resource.public_id}} class="field-value">{{n-a @resource.public_id}}</ClickToCopy>
+            </div>
+            <div class="field-info-container">
+                <div class="field-name">{{t "batch.fields.batch-number"}}</div>
+                <ClickToCopy @value={{@resource.batch_number}} class="field-value">{{n-a @resource.batch_number}}</ClickToCopy>
+            </div>
+            <div class="field-info-container">
+                <div class="field-name">{{t "batch.fields.product"}}</div>
+                <div class="field-value">{{n-a @resource.product_name}}</div>
+            </div>
+            <div class="field-info-container">
+                <div class="field-name">{{t "batch.fields.supplier"}}</div>
+                <div class="field-value">{{n-a @resource.supplier_name}}</div>
+            </div>
+            <div class="field-info-container">
+                <div class="field-name">{{t "batch.fields.production-date"}}</div>
+                <div class="field-value">{{format-date @resource.production_date_at}}</div>
+            </div>
+            <div class="field-info-container">
+                <div class="field-name">{{t "batch.fields.expiry-date"}}</div>
+                <div class="field-value">{{format-date @resource.expiry_date_at}}</div>
+            </div>
+            <div class="field-info-container md:col-span-2">
+                <div class="field-name">{{t "common.notes"}}</div>
+                <div class="field-value">{{n-a @resource.notes}}</div>
+            </div>
+        </div>
+    </ContentPanel>
+    <CustomField::Yield @subject={{@resource}} @viewMode={{true}} @wrapperClass="bordered-top" />
+    <ContentPanel @title={{t "common.metadata"}} @open={{true}} @wrapperClass="bordered-top" @panelBodyWrapperClass={{unless (is-object-empty @resource.meta) "px-0i" ""}}>
+        <MetadataViewer @metadata={{@resource.meta}} />
+    </ContentPanel>
+</div>

addon/components/batch/details.js

@@ -0,0 +1,3 @@
+import Component from '@glimmer/component';
+
+export default class BatchDetailsComponent extends Component {}

addon/components/batch/form.hbs

@@ -0,0 +1,54 @@
+<div class="form-wrapper" ...attributes>
+    <ContentPanel @title={{t "batch.sections.details"}} @open={{true}} @wrapperClass="bordered-top">
+        <div class="grid grid-cols-1 lg:grid-cols-2 gap-2 text-xs no-input-group-padding">
+            <InputGroup @name={{t "batch.fields.batch-number"}} @wrapperClass="col-span-2">
+                <Input @value={{@resource.batch_number}} @type="text" class="w-full form-input" placeholder={{t "batch.fields.batch-number"}} disabled={{cannot-write @resource}} />
+            </InputGroup>
+            <InputGroup @name={{t "batch.fields.product"}}>
+                <ModelSelect
+                    @modelName="pallet-product"
+                    @selectedModel={{@resource.product}}
+                    @placeholder={{t "batch.fields.select-product"}}
+                    @triggerClass="form-select form-input"
+                    @infiniteScroll={{false}}
+                    @renderInPlace={{true}}
+                    @onChange={{fn (mut @resource.product)}}
+                    @onChangeId={{fn (mut @resource.product_uuid)}}
+                    @disabled={{cannot-write @resource}}
+                    as |model|
+                >
+                    {{model.name}}
+                </ModelSelect>
+            </InputGroup>
+            <InputGroup @name={{t "batch.fields.supplier"}}>
+                <ModelSelect
+                    @modelName="supplier"
+                    @selectedModel={{@resource.supplier}}
+                    @placeholder={{t "batch.fields.select-supplier"}}
+                    @triggerClass="form-select form-input"
+                    @infiniteScroll={{false}}
+                    @renderInPlace={{true}}
+                    @onChange={{fn (mut @resource.supplier)}}
+                    @onChangeId={{fn (mut @resource.supplier_uuid)}}
+                    @disabled={{cannot-write @resource}}
+                    as |model|
+                >
+                    {{model.name}}
+                </ModelSelect>
+            </InputGroup>
+            <InputGroup @name={{t "batch.fields.production-date"}}>
+                <input value={{@resource.production_date_at}} type="date" class="form-input w-full" disabled={{cannot-write @resource}} />
+            </InputGroup>
+            <InputGroup @name={{t "batch.fields.expiry-date"}}>
+                <input value={{@resource.expiry_date_at}} type="date" class="form-input w-full" disabled={{cannot-write @resource}} />
+            </InputGroup>
+            <InputGroup @name={{t "common.notes"}} @wrapperClass="col-span-2">
+                <Textarea @value={{@resource.notes}} class="w-full form-input" placeholder={{t "common.notes"}} disabled={{cannot-write @resource}} />
+            </InputGroup>
+        </div>
+    </ContentPanel>
+    <CustomField::Yield @subject={{@resource}} @wrapperClass="bordered-top" />
+    <ContentPanel @title={{t "common.metadata"}} @open={{true}} @wrapperClass="bordered-top">
+        <MetadataEditor @value={{@resource.meta}} @onChange={{fn (mut @resource.meta)}} />
+    </ContentPanel>
+</div>

addon/components/batch/form.js

@@ -0,0 +1,3 @@
+import Component from '@glimmer/component';
+
+export default class BatchFormComponent extends Component {}

addon/components/batch/panel-header.hbs

@@ -0,0 +1,13 @@
+<div class="flex flex-row items-center justify-between" ...attributes>
+    <div class="flex flex-col">
+        <div class="text-lg font-semibold">{{@resource.batch_number}}</div>
+        <div class="text-xs text-gray-600 dark:text-gray-400">
+            {{@resource.product_name}}
+        </div>
+    </div>
+    <div class="flex flex-row items-center space-x-2">
+        {{#if @resource.expiry_date_at}}
+            <Badge @status="warning" @hideStatusDot={{true}}>Expires: {{format-date @resource.expiry_date_at}}</Badge>
+        {{/if}}
+    </div>
+</div>

addon/components/batch/panel-header.js

@@ -0,0 +1,3 @@
+import Component from '@glimmer/component';
+
+export default class BatchPanelHeaderComponent extends Component {}

addon/components/batch/pill.hbs

@@ -0,0 +1,3 @@
+<div class="flex flex-row items-center space-x-2 px-2 py-1 bg-gray-100 dark:bg-gray-700 rounded-md" ...attributes>
+    <span class="text-sm font-medium">{{@resource.batch_number}}</span>
+</div>

addon/components/batch/pill.js

@@ -0,0 +1,3 @@
+import Component from '@glimmer/component';
+
+export default class BatchPillComponent extends Component {}