From ca92a0a519970f47af5450fc5578c6fdc87a3303 Mon Sep 17 00:00:00 2001 From: Andi Carlstrom Date: Sun, 26 Apr 2026 12:59:52 -0600 Subject: [PATCH] Added checkbox to toggle if different shipping address than billing address for square order and payments. --- constructors/constructors.js | 46 ++++++++++++++---- utils/order/order.js | 91 ++++++++++++++++++++++++++++++++---- 2 files changed, 120 insertions(+), 17 deletions(-) diff --git a/constructors/constructors.js b/constructors/constructors.js index 628cc7b..1089cda 100644 --- a/constructors/constructors.js +++ b/constructors/constructors.js @@ -63,7 +63,28 @@ export class SquareCustomerWrapper { } } -export class SquareAddress { +export class SquareShippingAddress { + constructor(formData) { + this.address_line_1 = formData.shippingAddress1; + this.address_line_2 = formData.shippingAddress2; + this.first_name = formData.name; + this.locality = formData.shippingCity; // city + this.administrative_district_level_1 = formData.shippingState; // state + this.postal_code = formData.shippingZipcode; + } + + build() { + return { + address_line_1: this.address_line_1, + address_line_2: this.address_line_2, + first_name: this.first_name, + locality: this.locality, + administrative_district_level_1: this.administrative_district_level_1, + postal_code: this.postal_code, + }; + } +} +export class SquareBillingAddress { constructor(formData) { this.address_line_1 = formData.address1; this.address_line_2 = formData.address2; @@ -108,7 +129,7 @@ export class SquareCustomer { this.idempotency_key = data.idempotency_key; this.email_address = data.orderFormData.email; this.phone_number = data.orderFormData.phone; - this.address = new SquareAddress(data.orderFormData).build(); + this.address = new SquareBillingAddress(data.orderFormData).build(); } attachGivenName(givenName) { @@ -195,9 +216,11 @@ export class SquareTaxData { } } -export class SquareOrderShipmentAddress { +export class SquareOrderAddress { constructor(data) { - this.address = new SquareAddress(data).build(); + this.address = data.includeShippingAddress + ? new SquareShippingAddress(data).build() + : new SquareBillingAddress(data).build(); this.email_address = data.email; this.phone_number = data.phone; this.display_name = data.name; @@ -215,7 +238,7 @@ export class SquareOrderShipmentAddress { export class SquareShippingDeets { constructor(fillByDate, data) { - this.recipient = new SquareOrderShipmentAddress(data).build(); + this.recipient = new SquareOrderAddress(data).build(); this.expected_shipped_at = fillByDate; } @@ -243,7 +266,7 @@ export class SquareShippingData { export class SquarePickupDeets { constructor(pickupDate, data) { - this.recipient = new SquareOrderShipmentAddress(data).build(); + this.recipient = new SquareBillingAddress(data).build(); this.pickup_at = pickupDate; } @@ -328,8 +351,15 @@ export class SquarePayment { this.buyer_phone_number = formatPhoneNumberToE164(formData.phone); this.location_id = orderData.order.location_id; this.order_id = orderData.order.id; - this.shipping_address = !formData.isPickupOrder ? new SquareAddress(formData).build() : null; - this.billing_address = !formData.isPickupOrder ? new SquareAddress(formData).build() : null; + if (!formData.isPickupOrder) { + this.billing_address = new SquareBillingAddress(formData).build(); + this.shipping_address = formData.includeShippingAddress + ? new SquareShippingAddress(formData).build() + : new SquareBillingAddress(formData).build(); + } else { + this.billing_address = null; + this.shipping_address = null; + } // this.tip_money = {} } diff --git a/utils/order/order.js b/utils/order/order.js index 201fa6b..d2c2e3d 100644 --- a/utils/order/order.js +++ b/utils/order/order.js @@ -37,6 +37,15 @@ const addressFields = [ 'city', 'state', 'zipcode', + 'includeShippingAddress', +]; + +const shippingAddressFields = [ + 'shippingAddress1', + 'shippingAddress2', + 'shippingCity', + 'shippingState', + 'shippingZipcode', ]; const pickupFields = [ @@ -140,6 +149,47 @@ const fields = [ required: true, placeholder: 'your zip code', }, + { + type: 'checkbox', + label: 'Include shipping address? (if different from billing address)', + name: 'includeShippingAddress', + val: 'include-shipping', + required: false, + }, + { + type: 'input', + label: 'Shipping Address', + name: 'shippingAddress1', + required: true, + placeholder: 'shipping address', + }, + { + type: 'input', + label: 'shipping Apt # or building code', + name: 'shippingAddress2', + placeholder: 'shipping apt# or building code? add here!', + }, + { + type: 'input', + label: 'Shipping City', + name: 'shippingCity', + required: true, + placeholder: 'shipping city', + }, + { + type: 'input', + label: 'Shipping State', + name: 'shippingState', + required: true, + placeholder: 'shipping state', + }, + { + type: 'input', + label: 'Shipping Zip Code', + name: 'shippingZipcode', + required: true, + placeholder: 'shipping zip code', + }, ]; export function getOrderFormData() { @@ -159,6 +209,11 @@ export function getOrderFormData() { city: '', state: '', zipcode: '', + shippingAddress1: '', + shippingAddress2: '', + shippingCity: '', + shippingState: '', + shippingZipcode: '', isPickupOrder: false, // false for pickup, true for delivery })); } @@ -207,10 +262,10 @@ function populateFormFields(formFields, key, modal) { visibleFields.forEach((field) => fieldsToDisplay.push(field)); const storeFields = []; - const shippingFields = []; + const billingAddressFields = []; addressFields.forEach((field) => { - const shippingField = formFields.find((f) => f.name === field); - if (shippingField) shippingFields.push(shippingField); + const billingAddressField = formFields.find((f) => f.name === field); + if (billingAddressField) billingAddressFields.push(billingAddressField); }); if (key === 'pickup') { @@ -224,7 +279,16 @@ function populateFormFields(formFields, key, modal) { localStorageOrderFields.isPickupOrder = true; localStorage.setItem('orderFormData', JSON.stringify(localStorageOrderFields)); } else if (key === 'shipping') { - shippingFields.forEach((field) => fieldsToDisplay.push(field)); + billingAddressFields.forEach((field) => fieldsToDisplay.push(field)); + + const shouldIncludeShippingAddress = getOrderFormData().includeShippingAddress; + + if (shouldIncludeShippingAddress) { + shippingAddressFields.forEach((field) => { + const shippingField = formFields.find((f) => f.name === field); + if (shippingField) fieldsToDisplay.push(shippingField); + }); + } const localStorageOrderFields = getOrderFormData(); localStorageOrderFields.isPickupOrder = false; @@ -241,12 +305,12 @@ function populateFormFields(formFields, key, modal) { if (pickupField) fieldsToDisplay.push(pickupField); }); - shippingFields.forEach((field) => { - const shippingFieldIndex = fieldsToDisplay.findIndex((f) => f.name === field.name); + billingAddressFields.forEach((field) => { + const billingAddressFieldIndex = fieldsToDisplay.findIndex((f) => f.name === field.name); // remove items then refresh cart - if (shippingFieldIndex !== -1) { + if (billingAddressFieldIndex !== -1) { // Remove the field from "fieldsToDisplay" - fieldsToDisplay.splice(shippingFieldIndex, 1); + fieldsToDisplay.splice(billingAddressFieldIndex, 1); } }); } else { @@ -259,7 +323,16 @@ function populateFormFields(formFields, key, modal) { } }); - shippingFields.forEach((field) => fieldsToDisplay.push(field)); + billingAddressFields.forEach((field) => fieldsToDisplay.push(field)); + + const shouldIncludeShippingAddress = getOrderFormData().includeShippingAddress; + + if (shouldIncludeShippingAddress) { + shippingAddressFields.forEach((field) => { + const shippingField = formFields.find((f) => f.name === field); + if (shippingField) fieldsToDisplay.push(shippingField); + }); + } } }