@justifi/webcomponents 5.4.3 → 5.5.0

package/dist/collection/components/refund-payment/refund-payment.js

@@ -1,71 +1,128 @@
-import { h, } from "@stencil/core";
+import { h } from "@stencil/core";
 import RefundPaymentSchema from "./refund-payment-schema";
-import { Api, ComponentErrorCodes, ComponentErrorSeverity } from "../../api";
+import { ComponentErrorCodes, ComponentErrorSeverity, RefundPayload } from "../../api";
 import { FormController } from "../../ui-components/form/form";
 import { Button, StyledHost } from "../../ui-components";
 import { formatCurrency } from "../../utils/utils";
 import refundReasonOptions from "./refund-reason-options";
+import { PaymentService } from "../../api/services/payment.service";
+import { makeGetPaymentDetails } from "../../actions/payment/get-payment-details";
+import JustifiAnalytics from "../../api/Analytics";
+import { checkPkgVersion } from "../../utils/check-pkg-version";
+import { makePostRefund } from "../../actions/refund/refund-actions";
+import { RefundService } from "../../api/services/refund.service";
+import { RefundLoading } from "./refund-loading";
 export class RefundPayment {
     constructor() {
-        this.authToken = undefined;
-        this.paymentId = undefined;
+        this.refundPayload = {};
+        this.displayAmount = '';
+        this.errors = {};
+        this.paymentLoading = true;
+        this.refundLoading = false;
         this.hideSubmitButton = false;
         this.apiOrigin = PROXY_API_ORIGIN;
-        this.paymentAmountRefundable = 0;
-        this.errorMessage = null;
-        this.errors = {};
-        this.values = {};
-        this.isLoading = false;
+        this.inputHandler = (name, value) => {
+            this.formController.setValues(Object.assign(Object.assign({}, this.formController.values.getValue()), { [name]: value }));
+        };
     }
     componentWillLoad() {
-        this.formController = new FormController(RefundPaymentSchema(this.paymentAmountRefundable.toString()));
+        checkPkgVersion();
+        this.analytics = new JustifiAnalytics(this);
         this.initializeApi();
+        this.formController = new FormController(RefundPaymentSchema());
     }
-    componentDidLoad() {
-        this.formController.errors.subscribe(errors => {
-            this.errors = Object.assign({}, errors);
-        });
-        this.formController.values.subscribe(values => {
-            this.values = Object.assign({}, values);
-        });
+    handleError(code, errorMessage, severity) {
+        this.errorEvent.emit({ errorCode: code, message: errorMessage, severity });
     }
-    async handleSubmit(event) {
-        event.preventDefault();
-        this.formController.validateAndSubmit(this.submitRefund);
+    checkAmount(amount) {
+        return amount > 0;
     }
-    async submitRefund(values) {
-        this.isLoading = true;
-        let refundResponse;
-        try {
-            refundResponse = await this.api.post(`payments/${this.paymentId}/refunds`, values);
-        }
-        catch (error) {
-            console.error('Error submitting refund:', error);
-            this.errorEvent.emit(error);
-        }
-        finally {
-            this.submitEvent.emit({ response: refundResponse });
-            this.isLoading = false;
-        }
+    handleInvalidAmount() {
+        this.submitDisabled = true;
+        const errorMessage = 'Refund amount must be greater than 0';
+        this.handleError(ComponentErrorCodes.INVALID_REFUND_AMOUNT, errorMessage, ComponentErrorSeverity.ERROR);
     }
-    handleInput(field, value) {
-        this.formController.setValues(Object.assign(Object.assign({}, this.formController.values.getValue()), { [field]: value }));
+    initializeFormController() {
+        const amount = this.refundPayload.amount;
+        const amountRefundable = amount ? amount.toString() : '0';
+        this.formController = new FormController(RefundPaymentSchema(amountRefundable));
+        this.formController.setInitialValues({
+            amount: amountRefundable
+        });
+        this.formController.values.subscribe(values => {
+            this.refundPayload = Object.assign({}, values);
+        });
+        this.formController.errors.subscribe(errors => {
+            this.errors = Object.assign({}, errors);
+        });
     }
     initializeApi() {
         if (this.paymentId && this.authToken) {
-            this.api = Api({ authToken: this.authToken, apiOrigin: PROXY_API_ORIGIN });
+            const getPayment = makeGetPaymentDetails({
+                id: this.paymentId,
+                authToken: this.authToken,
+                service: new PaymentService(),
+                apiOrigin: this.apiOrigin
+            });
+            getPayment({
+                onSuccess: ({ payment }) => {
+                    this.refundPayload = new RefundPayload({ amount: payment.amount_refundable });
+                },
+                onError: ({ error, code, severity }) => {
+                    this.handleError(code, error, severity);
+                },
+                final: () => {
+                    const amount = this.refundPayload.amount;
+                    const validAmount = this.checkAmount(amount);
+                    !validAmount ? this.handleInvalidAmount() : this.initializeFormController();
+                    this.paymentLoading = false;
+                }
+            });
         }
         else {
-            this.errorMessage = 'Payment ID and Auth Token are required';
-            this.errorEvent.emit({
-                errorCode: ComponentErrorCodes.MISSING_PROPS,
-                message: this.errorMessage,
-                severity: ComponentErrorSeverity.ERROR,
-            });
+            const errorMessage = 'Payment ID and Auth Token are required';
+            this.handleError(ComponentErrorCodes.MISSING_PROPS, errorMessage, ComponentErrorSeverity.ERROR);
         }
     }
+    async refundPayment(event) {
+        event && event.preventDefault();
+        const valid = await this.formController.validate();
+        if (!valid)
+            return;
+        const postRefund = makePostRefund({
+            authToken: this.authToken,
+            accountId: this.accountId,
+            paymentId: this.paymentId,
+            service: new RefundService(),
+            apiOrigin: this.apiOrigin
+        });
+        const values = this.formController.values.getValue();
+        this.refundLoading = true;
+        return new Promise((resolve) => {
+            let refundResponse;
+            postRefund({
+                refundBody: values,
+                onSuccess: (response) => { refundResponse = response; },
+                onError: ({ error, code, severity }) => {
+                    refundResponse = error;
+                    this.handleError(error, code, severity);
+                },
+                final: () => {
+                    this.submitEvent.emit({ response: refundResponse });
+                    this.submitDisabled = true;
+                    this.refundLoading = false;
+                    resolve(refundResponse.data);
+                },
+            });
+        });
+    }
     render() {
-        return (h(StyledHost, { key: 'ea0429d62ea383b6525251150978bb0ebfb2704e' }, h("form", { key: '8f2e00b871ee896ba82311d8975574e5a2cbf6e3' }, h("div", { key: 'fa6476367e4a8b7fd7cdfff906671ef597b453de', class: "row gy-3" }, h("div", { key: '72a48181200d6116ceb4bb511bdd33c8c8197742', class: "form-group" }, h("form-control-monetary", { key: 'f6a3b3a7d8d8c733cb032db96878ad64ff712356', name: "amount", label: "Refund Amount", inputHandler: (name, value) => this.handleInput(name, value), errorText: this.errors.amount, defaultValue: this.paymentAmountRefundable.toString() })), h("div", { key: '47e6dc07510e192caf00ce959348a2a9472f48f8', class: "form-group" }, h("form-control-select", { key: '9f9b761eea9964c7f6ac1dd907a4fee8cd63c906', label: "Reason for refund (optional)", options: refundReasonOptions, name: "reason", defaultValue: '' })), h("div", { key: 'daa4bf44ec311e0554ea28f97a0932673d542a31', class: "form-group" }, h("form-control-textarea", { key: 'a03d055e6462b9a23e714ca58a942a6da0365919', name: "description", label: "Note (optional)", inputHandler: (name, value) => this.handleInput(name, value), errorText: this.errors.description, maxLength: 250 })), h("div", { key: 'b744d28ff0a2d6aa37b1ebe2b7ea6d9b3edbbc39', class: "form-group d-flex flex-row-reverse" }, h(Button, { key: '3f62881a5fa333277478d35a7c19a8c4ca8bb929', variant: "primary", type: "submit", onClick: e => this.handleSubmit(e), isLoading: this.isLoading, hidden: this.hideSubmitButton }, `Refund ${formatCurrency(+this.values.amount)}`))))));
+        if (this.paymentLoading) {
+            return h(RefundLoading, null);
+        }
+        const defaultValues = this.formController.getInitialValues();
+        const currentRefundAmount = this.refundPayload.amount;
+        return (h(StyledHost, null, h("form", null, h("fieldset", null, h("div", { class: "row gy-3" }, h("div", { class: "col-12" }, h("form-control-monetary", { name: "amount", label: "Refund Amount", defaultValue: defaultValues.amount, inputHandler: this.inputHandler, errorText: this.errors.amount })), h("div", { class: "col-12" }, h("form-control-select", { name: "reason", label: "Reason for refund (optional)", defaultValue: defaultValues.reason, inputHandler: this.inputHandler, options: refundReasonOptions, errorText: this.errors.reason })), h("div", { class: "col-12" }, h("form-control-textarea", { name: "description", label: "Note (optional)", defaultValue: defaultValues.description, inputHandler: this.inputHandler, maxLength: 250, errorText: this.errors.description })), h("div", { class: "form-group d-flex flex-row-reverse" }, h(Button, { variant: "primary", type: "submit", onClick: this.refundPayment.bind(this), isLoading: this.paymentLoading || this.refundLoading, hidden: this.hideSubmitButton, disabled: this.submitDisabled }, `Refund ${formatCurrency(+currentRefundAmount)}`)))))));
     }
     static get is() { return "justifi-refund-payment"; }
     static get encapsulation() { return "shadow"; }
@@ -73,6 +130,7 @@ export class RefundPayment {
         return {
             "authToken": {
                 "type": "string",
+                "attribute": "auth-token",
                 "mutable": false,
                 "complexType": {
                     "original": "string",
@@ -85,11 +143,13 @@ export class RefundPayment {
                     "tags": [],
                     "text": ""
                 },
-                "attribute": "auth-token",
+                "getter": false,
+                "setter": false,
                 "reflect": false
             },
-            "paymentId": {
+            "accountId": {
                 "type": "string",
+                "attribute": "account-id",
                 "mutable": false,
                 "complexType": {
                     "original": "string",
@@ -102,11 +162,32 @@ export class RefundPayment {
                     "tags": [],
                     "text": ""
                 },
+                "getter": false,
+                "setter": false,
+                "reflect": false
+            },
+            "paymentId": {
+                "type": "string",
                 "attribute": "payment-id",
+                "mutable": false,
+                "complexType": {
+                    "original": "string",
+                    "resolved": "string",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                },
+                "getter": false,
+                "setter": false,
                 "reflect": false
             },
             "hideSubmitButton": {
                 "type": "boolean",
+                "attribute": "hide-submit-button",
                 "mutable": false,
                 "complexType": {
                     "original": "boolean",
@@ -119,12 +200,14 @@ export class RefundPayment {
                     "tags": [],
                     "text": ""
                 },
-                "attribute": "hide-submit-button",
+                "getter": false,
+                "setter": false,
                 "reflect": false,
                 "defaultValue": "false"
             },
             "apiOrigin": {
                 "type": "string",
+                "attribute": "api-origin",
                 "mutable": false,
                 "complexType": {
                     "original": "string",
@@ -137,7 +220,8 @@ export class RefundPayment {
                     "tags": [],
                     "text": ""
                 },
-                "attribute": "api-origin",
+                "getter": false,
+                "setter": false,
                 "reflect": false,
                 "defaultValue": "PROXY_API_ORIGIN"
             }
@@ -145,11 +229,13 @@ export class RefundPayment {
     }
     static get states() {
         return {
-            "paymentAmountRefundable": {},
-            "errorMessage": {},
+            "formController": {},
+            "refundPayload": {},
+            "displayAmount": {},
             "errors": {},
-            "values": {},
-            "isLoading": {}
+            "paymentLoading": {},
+            "refundLoading": {},
+            "submitDisabled": {}
         };
     }
     static get events() {
@@ -199,21 +285,35 @@ export class RefundPayment {
     }
     static get methods() {
         return {
-            "submitRefund": {
+            "refundPayment": {
                 "complexType": {
-                    "signature": "(values: any) => Promise<void>",
+                    "signature": "(event?: CustomEvent) => Promise<IRefund>",
                     "parameters": [{
-                            "name": "values",
-                            "type": "any",
+                            "name": "event",
+                            "type": "CustomEvent<any>",
                             "docs": ""
                         }],
                     "references": {
                         "Promise": {
                             "location": "global",
                             "id": "global::Promise"
+                        },
+                        "IRefund": {
+                            "location": "import",
+                            "path": "../../api",
+                            "id": "src/api/index.ts::IRefund"
+                        },
+                        "CustomEvent": {
+                            "location": "global",
+                            "id": "global::CustomEvent"
+                        },
+                        "IApiResponse": {
+                            "location": "import",
+                            "path": "../../api",
+                            "id": "src/api/index.ts::IApiResponse"
                         }
                     },
-                    "return": "Promise<void>"
+                    "return": "Promise<IRefund>"
                 },
                 "docs": {
                     "text": "",

package/dist/collection/components/terminal-orders-list/terminal-order-status.js

@@ -17,6 +17,21 @@ export const MapTerminalOrderStatusToBadge = (status) => {
             title: 'This order is created',
             text: 'Created',
         },
+        in_progress: {
+            variant: BadgeVariant.PRIMARY,
+            title: 'This order is in progress',
+            text: 'In Progress',
+        },
+        on_hold: {
+            variant: BadgeVariant.WARNING,
+            title: 'This order is on hold',
+            text: 'On Hold',
+        },
+        canceled: {
+            variant: BadgeVariant.DANGER,
+            title: 'This order is canceled',
+            text: 'Canceled',
+        }
     };
     const badgeProps = statusToBadgeProps[status];
     return h(Badge, Object.assign({}, badgeProps));

package/dist/collection/components/terminal-orders-list/terminal-orders-list-core.js

@@ -8,6 +8,10 @@ import { TableClickActions } from "../../ui-components/table/event-types";
 import { getRequestParams, onQueryParamsChange } from "./terminal-orders-list-params-state";
 export class TerminalOrdersListCore {
     constructor() {
+        this.terminalOrders = [];
+        this.loading = true;
+        this.paging = pagingDefaults;
+        this.pagingParams = {};
         this.handleClickPrevious = (beforeCursor) => {
             this.pagingParams = { before_cursor: beforeCursor };
             this.clickEvent.emit({ name: TableClickActions.previous });
@@ -23,14 +27,6 @@ export class TerminalOrdersListCore {
             const orderData = this.terminalOrders.find((order) => order.id === clickedOrderId);
             this.clickEvent.emit({ name: TableClickActions.row, data: orderData });
         };
-        this.getTerminalOrders = undefined;
-        this.columns = undefined;
-        this.terminalOrders = [];
-        this.terminalOrdersTable = undefined;
-        this.loading = true;
-        this.errorMessage = undefined;
-        this.paging = pagingDefaults;
-        this.pagingParams = {};
     }
     updateOnPropChange() {
         this.fetchData();
@@ -86,13 +82,14 @@ export class TerminalOrdersListCore {
         return !this.showEmptyState && !this.showErrorState && !this.loading;
     }
     render() {
-        return (h("div", { key: '029644a4c7e2f8957ffafb9ff62390b6b6869fce' }, h("div", { key: 'c6d0ae6e68f45252bbc276da1ed853fc6b9b5338', class: "table-wrapper" }, h("table", { key: '1809d7ddfd9b9c6834498115ac43df8f7b4ea5d9', class: "table table-hover", part: table }, h("thead", { key: 'bcd8f0c82e5aa97ba1bd1207353bc09a4c21bd05', class: "table-head sticky-top" }, h("tr", { key: 'bfe9dc35dc30acf4f483c0359989db9ff82ceb7a', class: "table-light text-nowrap" }, this.terminalOrdersTable.columnData.map((column) => column))), h("tbody", { key: '5181c615bbc06bf347c9e567064fcbbf6b518d2d', class: "table-body" }, h(TableLoadingState, { key: 'a48ee705634008f203e01327ea6f9efdf980fdc5', columnSpan: this.terminalOrdersTable.columnKeys.length, isLoading: this.loading }), h(TableEmptyState, { key: 'ae1daed5464b7719e4f4e7c116a408b6b37cb997', isEmpty: this.showEmptyState, columnSpan: this.terminalOrdersTable.columnKeys.length }), h(TableErrorState, { key: '9496b60d37f5ad699083f3cd305e14550a4b6770', columnSpan: this.terminalOrdersTable.columnKeys.length, errorMessage: this.errorMessage }), this.showRowData && this.terminalOrdersTable.rowData.map((data, index) => (h("tr", { "data-test-id": "table-row", "data-row-entity-id": this.entityId[index], onClick: this.rowClickHandler }, data)))), this.paging && (h("tfoot", { key: '0ac98a7e41add32367010e0c09f99c4328f2d717', class: "sticky-bottom" }, h("tr", { key: 'a8fda69087663a8707ef16c2fa153d351426fe0c', class: "table-light align-middle" }, h("td", { key: 'f805502e404b69e86f3ec0963321bd9989c035b8', part: tableCell, colSpan: this.terminalOrdersTable.columnData.length }, h("pagination-menu", { key: '93848e212dce3b8e00b4e44e4907045c2ca5fd67', paging: Object.assign(Object.assign({}, this.paging), { handleClickPrevious: this.handleClickPrevious, handleClickNext: this.handleClickNext }) })))))))));
+        return (h("div", { key: '22211fd032271f20083a7b85904b7150e1f83fdc' }, h("div", { key: '0f76ac5866f5fc50e2b3fe7889d837e9cb792fbf', class: "table-wrapper" }, h("table", { key: 'c5c0d1fad6791191e7e8b3c0fc1f571886cde243', class: "table table-hover", part: table }, h("thead", { key: 'fc99465274e660c4e78ece7d303d6c11e4a21a2d', class: "table-head sticky-top" }, h("tr", { key: 'ed7e76e48bc34ed0a69a9b5e980181245153b155', class: "table-light text-nowrap" }, this.terminalOrdersTable.columnData.map((column) => column))), h("tbody", { key: '5d5b95d48ef93a2d30e9af2acc8a80a3a77f8a4a', class: "table-body" }, h(TableLoadingState, { key: '4a409f123dd9fe7e40ba3088137f722ce803a4cc', columnSpan: this.terminalOrdersTable.columnKeys.length, isLoading: this.loading }), h(TableEmptyState, { key: 'ab1007e8c417730b91aade5035791126d33fbc73', isEmpty: this.showEmptyState, columnSpan: this.terminalOrdersTable.columnKeys.length }), h(TableErrorState, { key: '1fd6094de024b38c4037abee441d697a3cbe21f7', columnSpan: this.terminalOrdersTable.columnKeys.length, errorMessage: this.errorMessage }), this.showRowData && this.terminalOrdersTable.rowData.map((data, index) => (h("tr", { "data-test-id": "table-row", "data-row-entity-id": this.entityId[index], onClick: this.rowClickHandler }, data)))), this.paging && (h("tfoot", { key: '2a0ea46390d4a2b1c3a18e7d03f1c303f1919310', class: "sticky-bottom" }, h("tr", { key: '299790ab5ba6f64859823d2f83302a5cb08c94fa', class: "table-light align-middle" }, h("td", { key: '6efbdc2b9bb55817a542affaf5a246a36c528af4', part: tableCell, colSpan: this.terminalOrdersTable.columnData.length }, h("pagination-menu", { key: '2df3ccd696a3bc59bf2dc485596dff00e0825dcd', paging: Object.assign(Object.assign({}, this.paging), { handleClickPrevious: this.handleClickPrevious, handleClickNext: this.handleClickNext }) })))))))));
     }
     static get is() { return "terminal-orders-list-core"; }
     static get properties() {
         return {
             "getTerminalOrders": {
                 "type": "unknown",
+                "attribute": "get-terminal-orders",
                 "mutable": false,
                 "complexType": {
                     "original": "Function",
@@ -109,10 +106,13 @@ export class TerminalOrdersListCore {
                 "docs": {
                     "tags": [],
                     "text": ""
-                }
+                },
+                "getter": false,
+                "setter": false
             },
             "columns": {
                 "type": "string",
+                "attribute": "columns",
                 "mutable": false,
                 "complexType": {
                     "original": "string",
@@ -125,7 +125,8 @@ export class TerminalOrdersListCore {
                     "tags": [],
                     "text": ""
                 },
-                "attribute": "columns",
+                "getter": false,
+                "setter": false,
                 "reflect": false
             }
         };

package/dist/collection/components/terminal-orders-list/terminal-orders-list-filters.js

@@ -13,10 +13,6 @@ export class TerminalOrdersListFilters {
             const utcDate = convertToUTC(value, { setExactTime: true });
             this.setParamsOnChange(name, utcDate);
         };
-        this.orderStatus = undefined;
-        this.orderType = undefined;
-        this.createdAfter = undefined;
-        this.createdBefore = undefined;
     }
     componentWillLoad() {
         const propsToSet = {
@@ -37,6 +33,9 @@ export class TerminalOrdersListFilters {
             { label: 'Created', value: TerminalOrderStatus.created },
             { label: 'Completed', value: TerminalOrderStatus.completed },
             { label: 'Submitted', value: TerminalOrderStatus.submitted },
+            { label: 'In Progress', value: TerminalOrderStatus.in_progress },
+            { label: 'On Hold', value: TerminalOrderStatus.on_hold },
+            { label: 'Canceled', value: TerminalOrderStatus.canceled }
         ];
     }
     get terminalOrderTypeOptions() {
@@ -48,8 +47,8 @@ export class TerminalOrdersListFilters {
     }
     render() {
         const filterMenuParams = Object.assign({}, filterParams);
-        return (h(StyledHost, { key: 'fa53c48c1a916781c8fffe7910f524ea334cdf27' }, h("table-filters-menu", { key: 'e8ba7a019f92234775acbaf2dafb817fb98f8d70', params: filterMenuParams, clearParams: clearParams, part: terminalOrdersListFilterMenu }, h("div", { key: '67e0b83350c37c7fa73f8e2808266fb8fda96838', class: "grid-cols-2 gap-3 p-1" }, h("div", { key: '08fd58b47b35fcb073b116c827ad2bb07c17f879', class: "p-2" }, h("form-control-select", { key: '1a6a468d37afb5a25d37e4f9e43d6bd23414c6a3', name: "order_status", label: "Order Status", options: this.terminalOrderStatusOptions, inputHandler: this.setParamsOnChange, defaultValue: this.orderStatus || filterParams.order_status, disabled: !!this.orderStatus, part: orderStatusTerminalOrdersListFilterParam })), h("div", { key: '92c8b10d0c48811a63d0ed796637dfadb85b00c4', class: "p-2" }, h("form-control-select", { key: 'f8d7e96f8c0a9215ebb5b7a1f581b4dc60e5ad10', name: "order_type", label: "Order Type", options: this.terminalOrderTypeOptions, inputHandler: this.setParamsOnChange, defaultValue: this.orderType || filterParams.order_type, disabled: !!this.orderType, part: orderTypeTerminalOrdersListFilterParam })), h("div", { key: '2d5b3262a022d3122d533ef7f7e886dec5c2b701', class: "p-2" }, h("form-control-date", { key: '4b1e799b9a99ce9046ea3a3e0b3249d566448ae6', name: "created_after", label: "Created After", inputHandler: this.handleDateInput, defaultValue: convertToLocal(this.createdAfter, { showInputDateTime: true }) ||
-                convertToLocal(filterParams.created_after, { showInputDateTime: true }), showTime: true, disabled: !!this.createdAfter, part: createdAfterTerminalOrdersListFilterParam })), h("div", { key: '93019260d2befe0ca3d99c17a769f2ebb1b6f07f', class: "p-2" }, h("form-control-date", { key: '3aba4879d8998c90a36f2fa5326c230792768403', name: "created_before", label: "Created Before", inputHandler: this.handleDateInput, defaultValue: convertToLocal(this.createdBefore, { showInputDateTime: true }) ||
+        return (h(StyledHost, { key: 'fceaf9a2565bb0b2012f9d0c151159b5a0b013b6' }, h("table-filters-menu", { key: '04d455d0edefb0478ef50c58bb35aef2167a8bac', params: filterMenuParams, clearParams: clearParams, part: terminalOrdersListFilterMenu }, h("div", { key: 'aefc85e6401613cd92300a613ce0b6f50dec01c9', class: "grid-cols-2 gap-3 p-1" }, h("div", { key: '852d230caf3b239a19a585f5316a9507db9b5bf4', class: "p-2" }, h("form-control-select", { key: '5302296b38a69a9e5d224aaaa029cf03f561c47a', name: "order_status", label: "Order Status", options: this.terminalOrderStatusOptions, inputHandler: this.setParamsOnChange, defaultValue: this.orderStatus || filterParams.order_status, disabled: !!this.orderStatus, part: orderStatusTerminalOrdersListFilterParam })), h("div", { key: '86d62ad1d273857cddd4d594b2fbdaa481e9cf8b', class: "p-2" }, h("form-control-select", { key: '5880d9eb2afd60d31a0d8be9921fc80ed10a5135', name: "order_type", label: "Order Type", options: this.terminalOrderTypeOptions, inputHandler: this.setParamsOnChange, defaultValue: this.orderType || filterParams.order_type, disabled: !!this.orderType, part: orderTypeTerminalOrdersListFilterParam })), h("div", { key: '99df89875c2a1be8287392b1db7392461c0c1538', class: "p-2" }, h("form-control-date", { key: '61d044d107ab4c7a3c5941a86b6cacf423e06b6f', name: "created_after", label: "Created After", inputHandler: this.handleDateInput, defaultValue: convertToLocal(this.createdAfter, { showInputDateTime: true }) ||
+                convertToLocal(filterParams.created_after, { showInputDateTime: true }), showTime: true, disabled: !!this.createdAfter, part: createdAfterTerminalOrdersListFilterParam })), h("div", { key: 'c6e44ad049bc5a2f5bb78f5a3799098f8f7e255f', class: "p-2" }, h("form-control-date", { key: '254ad26b1fabb7dd8a983b7095a2ce93dc25dafe', name: "created_before", label: "Created Before", inputHandler: this.handleDateInput, defaultValue: convertToLocal(this.createdBefore, { showInputDateTime: true }) ||
                 convertToLocal(filterParams.created_before, { showInputDateTime: true }), showTime: true, disabled: !!this.createdBefore, part: createdBeforeTerminalOrdersListFilterParam }))))));
     }
     static get is() { return "justifi-terminal-orders-list-filters"; }
@@ -58,10 +57,11 @@ export class TerminalOrdersListFilters {
         return {
             "orderStatus": {
                 "type": "string",
+                "attribute": "order-status",
                 "mutable": false,
                 "complexType": {
                     "original": "TerminalOrderStatus",
-                    "resolved": "TerminalOrderStatus.completed | TerminalOrderStatus.created | TerminalOrderStatus.submitted",
+                    "resolved": "TerminalOrderStatus.canceled | TerminalOrderStatus.completed | TerminalOrderStatus.created | TerminalOrderStatus.in_progress | TerminalOrderStatus.on_hold | TerminalOrderStatus.submitted",
                     "references": {
                         "TerminalOrderStatus": {
                             "location": "import",
@@ -76,11 +76,13 @@ export class TerminalOrdersListFilters {
                     "tags": [],
                     "text": ""
                 },
-                "attribute": "order-status",
+                "getter": false,
+                "setter": false,
                 "reflect": false
             },
             "orderType": {
                 "type": "string",
+                "attribute": "order-type",
                 "mutable": false,
                 "complexType": {
                     "original": "TerminalOrderType",
@@ -99,11 +101,13 @@ export class TerminalOrdersListFilters {
                     "tags": [],
                     "text": ""
                 },
-                "attribute": "order-type",
+                "getter": false,
+                "setter": false,
                 "reflect": false
             },
             "createdAfter": {
                 "type": "string",
+                "attribute": "created-after",
                 "mutable": false,
                 "complexType": {
                     "original": "string",
@@ -116,11 +120,13 @@ export class TerminalOrdersListFilters {
                     "tags": [],
                     "text": ""
                 },
-                "attribute": "created-after",
+                "getter": false,
+                "setter": false,
                 "reflect": false
             },
             "createdBefore": {
                 "type": "string",
+                "attribute": "created-before",
                 "mutable": false,
                 "complexType": {
                     "original": "string",
@@ -133,7 +139,8 @@ export class TerminalOrdersListFilters {
                     "tags": [],
                     "text": ""
                 },
-                "attribute": "created-before",
+                "getter": false,
+                "setter": false,
                 "reflect": false
             }
         };

package/dist/collection/components/terminal-orders-list/terminal-orders-list.js

@@ -8,16 +8,13 @@ import { ComponentErrorCodes, ComponentErrorSeverity } from "../../api";
 import JustifiAnalytics from "../../api/Analytics";
 export class TerminalOrdersList {
     constructor() {
+        this.errorMessage = null;
+        this.apiOrigin = PROXY_API_ORIGIN;
+        this.columns = defaultColumnsKeys;
         this.handleErrorEvent = (event) => {
             this.errorMessage = event.detail.message;
             this.errorEvent.emit(event.detail);
         };
-        this.getTerminalOrders = undefined;
-        this.errorMessage = null;
-        this.accountId = undefined;
-        this.authToken = undefined;
-        this.apiOrigin = PROXY_API_ORIGIN;
-        this.columns = defaultColumnsKeys;
     }
     componentWillLoad() {
         checkPkgVersion();
@@ -43,7 +40,7 @@ export class TerminalOrdersList {
         }
     }
     render() {
-        return (h(StyledHost, { key: 'beb7ebe2397c43c28b818133294b6c972d2834ac' }, h("terminal-orders-list-core", { key: '87db98176b2a462b9446170c348352958d4e3a05', getTerminalOrders: this.getTerminalOrders, "onError-event": this.handleErrorEvent, columns: this.columns })));
+        return (h(StyledHost, { key: '2a268ef2e2128e8a0ed23092c78caa7f59539c6f' }, h("terminal-orders-list-core", { key: 'a56b31da3f4672a7f63aaff473dbdcb985eed3fc', getTerminalOrders: this.getTerminalOrders, "onError-event": this.handleErrorEvent, columns: this.columns })));
     }
     static get is() { return "justifi-terminal-orders-list"; }
     static get encapsulation() { return "shadow"; }
@@ -51,6 +48,7 @@ export class TerminalOrdersList {
         return {
             "accountId": {
                 "type": "string",
+                "attribute": "account-id",
                 "mutable": false,
                 "complexType": {
                     "original": "string",
@@ -63,11 +61,13 @@ export class TerminalOrdersList {
                     "tags": [],
                     "text": ""
                 },
-                "attribute": "account-id",
+                "getter": false,
+                "setter": false,
                 "reflect": false
             },
             "authToken": {
                 "type": "string",
+                "attribute": "auth-token",
                 "mutable": false,
                 "complexType": {
                     "original": "string",
@@ -80,11 +80,13 @@ export class TerminalOrdersList {
                     "tags": [],
                     "text": ""
                 },
-                "attribute": "auth-token",
+                "getter": false,
+                "setter": false,
                 "reflect": false
             },
             "apiOrigin": {
                 "type": "string",
+                "attribute": "api-origin",
                 "mutable": false,
                 "complexType": {
                     "original": "string",
@@ -97,12 +99,14 @@ export class TerminalOrdersList {
                     "tags": [],
                     "text": ""
                 },
-                "attribute": "api-origin",
+                "getter": false,
+                "setter": false,
                 "reflect": false,
                 "defaultValue": "PROXY_API_ORIGIN"
             },
             "columns": {
                 "type": "string",
+                "attribute": "columns",
                 "mutable": false,
                 "complexType": {
                     "original": "string",
@@ -115,7 +119,8 @@ export class TerminalOrdersList {
                     "tags": [],
                     "text": ""
                 },
-                "attribute": "columns",
+                "getter": false,
+                "setter": false,
                 "reflect": false,
                 "defaultValue": "defaultColumnsKeys"
             }

package/dist/collection/components/terminal-orders-list/terminal-orders-table.js

@@ -1,6 +1,7 @@
 import { h } from "@stencil/core";
 import { getAlternateTableCellPart, tableHeadCell } from "../../styles/parts";
 import { convertToLocal } from "../../utils/utils";
+import { TerminalOrderType } from "../../api";
 import { MapTerminalOrderStatusToBadge } from "./terminal-order-status";
 export const defaultColumnsKeys = 'created_at,updated_at,order_status,quantity';
 export const terminalOrdersTableColumns = {
@@ -20,6 +21,15 @@ export const terminalOrdersTableCells = {
     business_id: (terminalOrder, index) => (h("td", { part: getAlternateTableCellPart(index) }, terminalOrder.business_id)),
     company_name: (terminalOrder, index) => (h("td", { part: getAlternateTableCellPart(index) }, terminalOrder.company_name)),
     provider: (terminalOrder, index) => (h("td", { part: getAlternateTableCellPart(index) }, terminalOrder.provider)),
-    order_type: (terminalOrder, index) => (h("td", { part: getAlternateTableCellPart(index) }, terminalOrder.order_type)),
+    order_type: (terminalOrder, index) => {
+        let orderType;
+        if (terminalOrder.order_type === TerminalOrderType.boardingOnly) {
+            orderType = 'Boarding Only';
+        }
+        else if (terminalOrder.order_type === TerminalOrderType.boardingShipping) {
+            orderType = 'Boarding & Shipping';
+        }
+        return (h("td", { part: getAlternateTableCellPart(index) }, orderType));
+    },
     quantity: (terminalOrder, index) => (h("td", { part: getAlternateTableCellPart(index) }, terminalOrder.terminals.length)),
 };