From 383e457aab9227ed4bbf356b9eeadb145cc72a03 Mon Sep 17 00:00:00 2001
From: Jade <jade@justbetter.nl>
Date: Mon, 11 Aug 2025 13:14:27 +0200
Subject: [PATCH 01/10] Listen to all changes on address data instead of only
 manual input

---
 resources/js/components/GraphqlMutation.vue           | 11 +++++++++++
 .../views/checkout/steps/billing_address.blade.php    | 11 ++++++-----
 .../views/checkout/steps/shipping_address.blade.php   |  9 +++++++--
 3 files changed, 24 insertions(+), 7 deletions(-)

diff --git a/resources/js/components/GraphqlMutation.vue b/resources/js/components/GraphqlMutation.vue
index 34b694653..bc6db1676 100644
--- a/resources/js/components/GraphqlMutation.vue
+++ b/resources/js/components/GraphqlMutation.vue
@@ -110,6 +110,13 @@ export default {
                 deepMerge(this.data, diff)
             }
         },
+
+        data: {
+            handler() {
+                this.changeFn(this)
+            },
+            deep: true
+        },
     },
 
     mounted() {
@@ -123,6 +130,10 @@ export default {
     },
 
     methods: {
+        changeFn: useDebounceFn((self) => {
+            self.$emit('change', { target: self.$el, mutate: self.mutate })
+        }, 500),
+
         async mutateFn() {
             if (this.running) {
                 return
diff --git a/resources/views/checkout/steps/billing_address.blade.php b/resources/views/checkout/steps/billing_address.blade.php
index d24165a36..0d51da001 100644
--- a/resources/views/checkout/steps/billing_address.blade.php
+++ b/resources/views/checkout/steps/billing_address.blade.php
@@ -13,14 +13,15 @@
     :error-callback="checkResponseForExpiredCart"
     group="billing"
     mutate-event="setBillingAddressOnCart"
+    v-on:change="function (e) {
+        e.target.closest('fieldset').querySelector(':invalid') === null
+        && (!variables.same_as_shipping || !!cart?.shipping_addresses?.[0]?.postcode)
+        && window.app.$emit('setBillingAddressOnCart')
+    }" 
     v-slot="{ mutate, variables }"
 >
     <div partial-submit="mutate">
-        <fieldset v-on:change="function (e) {
-            e.target.closest('fieldset').querySelector(':invalid') === null
-            && (!variables.same_as_shipping || !!cart?.shipping_addresses?.[0]?.postcode)
-            && window.app.$emit('setBillingAddressOnCart')
-        }">
+        <fieldset>
             <template v-if="!cart.is_virtual">
                 <x-rapidez::input.checkbox v-model="variables.same_as_shipping">
                     @lang('My billing and shipping address are the same')
diff --git a/resources/views/checkout/steps/shipping_address.blade.php b/resources/views/checkout/steps/shipping_address.blade.php
index 750202bbe..12d162644 100644
--- a/resources/views/checkout/steps/shipping_address.blade.php
+++ b/resources/views/checkout/steps/shipping_address.blade.php
@@ -7,15 +7,20 @@
         country_code: cart.shipping_addresses[0]?.country.code || window.address_defaults.country_code,
         region_id: cart.shipping_addresses[0]?.region.region_id || window.address_defaults.region_id,
     }"
-    group="shipping"
     :before-request="(query, variables, options) => [variables.customer_address_id ? config.queries.setExistingShippingAddressesOnCart : query, variables, options]"
     :callback="updateCart"
     :error-callback="checkResponseForExpiredCart"
+    group="shipping"
     mutate-event="setShippingAddressesOnCart"
+    v-on:change="function (e) {
+        e.target.closest('fieldset').querySelector(':invalid') === null
+        && e.mutate().then(() => (cart?.billing_address?.same_as_shipping ?? true)
+        && window.app.$emit('setBillingAddressOnCart'))
+    }"
     v-slot="{ mutate, variables }"
     v-if="!cart.is_virtual"
 >
-    <fieldset partial-submit="mutate" v-on:change="function (e) {e.target.closest('fieldset').querySelector(':invalid') === null && mutate().then(() => (cart?.billing_address?.same_as_shipping ?? true) && window.app.$emit('setBillingAddressOnCart'))}">
+    <fieldset partial-submit="mutate">
         @include('rapidez::checkout.partials.address', ['type' => 'shipping'])
     </fieldset>
 </graphql-mutation>

From f592006eb8b4e7e3330bf34c01b08615c68bcb88 Mon Sep 17 00:00:00 2001
From: Jade-GG <Jade-GG@users.noreply.github.com>
Date: Mon, 11 Aug 2025 11:14:58 +0000
Subject: [PATCH 02/10] Apply fixes from Duster

---
 resources/views/checkout/steps/billing_address.blade.php | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/resources/views/checkout/steps/billing_address.blade.php b/resources/views/checkout/steps/billing_address.blade.php
index 0d51da001..9d42411f6 100644
--- a/resources/views/checkout/steps/billing_address.blade.php
+++ b/resources/views/checkout/steps/billing_address.blade.php
@@ -17,7 +17,7 @@
         e.target.closest('fieldset').querySelector(':invalid') === null
         && (!variables.same_as_shipping || !!cart?.shipping_addresses?.[0]?.postcode)
         && window.app.$emit('setBillingAddressOnCart')
-    }" 
+    }"
     v-slot="{ mutate, variables }"
 >
     <div partial-submit="mutate">

From 9f07e4463080612f8fc78782391862c4adca4353 Mon Sep 17 00:00:00 2001
From: rapidez-actions <rapidez-actions@users.noreply.github.com>
Date: Mon, 11 Aug 2025 11:15:40 +0000
Subject: [PATCH 03/10] Apply fixes from Prettier

---
 resources/js/components/GraphqlMutation.vue | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/resources/js/components/GraphqlMutation.vue b/resources/js/components/GraphqlMutation.vue
index bc6db1676..b2c5f87d0 100644
--- a/resources/js/components/GraphqlMutation.vue
+++ b/resources/js/components/GraphqlMutation.vue
@@ -115,7 +115,7 @@ export default {
             handler() {
                 this.changeFn(this)
             },
-            deep: true
+            deep: true,
         },
     },
 

From df47559ba2afefae7b93c0b7a456e321bfbd919a Mon Sep 17 00:00:00 2001
From: Jade <jade@justbetter.nl>
Date: Mon, 11 Aug 2025 13:19:53 +0200
Subject: [PATCH 04/10] Change every relevant v-model into v-model.lazy

---
 .../views/checkout/partials/address.blade.php | 24 +++++++++----------
 1 file changed, 12 insertions(+), 12 deletions(-)

diff --git a/resources/views/checkout/partials/address.blade.php b/resources/views/checkout/partials/address.blade.php
index b9a130397..ca29b8803 100644
--- a/resources/views/checkout/partials/address.blade.php
+++ b/resources/views/checkout/partials/address.blade.php
@@ -41,7 +41,7 @@
                                 <x-rapidez::label>@lang('Company')</x-rapidez::label>
                                 <x-rapidez::input
                                     name="{{ $type }}_company"
-                                    v-model="variables.company"
+                                    v-model.lazy="variables.company"
                                     :required="Rapidez::config('customer/address/company_show') == 'req'"
                                 />
                             </label>
@@ -53,7 +53,7 @@
                                 <x-rapidez::label>@lang('Tax ID')</x-rapidez::label>
                                 <x-rapidez::input
                                     name="{{ $type }}_vat_id"
-                                    v-model="variables.vat_id"
+                                    v-model.lazy="variables.vat_id"
                                     v-on:change="window.app.$emit('vat-change', $event)"
                                     :required="Rapidez::config('customer/address/taxvat_show') == 'req'"
                                 />
@@ -89,7 +89,7 @@
                 <x-rapidez::label>@lang('Firstname')</x-rapidez::label>
                 <x-rapidez::input
                     name="{{ $type }}_firstname"
-                    v-model="variables.firstname"
+                    v-model.lazy="variables.firstname"
                     required
                 />
             </label>
@@ -100,7 +100,7 @@
                     <x-rapidez::label>@lang('Middlename')</x-rapidez::label>
                     <x-rapidez::input
                         name="{{ $type }}_middlename"
-                        v-model="variables.middlename"
+                        v-model.lazy="variables.middlename"
                     />
                 </label>
             </div>
@@ -110,7 +110,7 @@
                 <x-rapidez::label>@lang('Lastname')</x-rapidez::label>
                 <x-rapidez::input
                     name="{{ $type }}_lastname"
-                    v-model="variables.lastname"
+                    v-model.lazy="variables.lastname"
                     required
                 />
             </label>
@@ -167,7 +167,7 @@ class="region exists"
                     <x-rapidez::label>@lang('Telephone')</x-rapidez::label>
                     <x-rapidez::input
                         name="{{ $type }}_telephone"
-                        v-model="variables.telephone"
+                        v-model.lazy="variables.telephone"
                         :required="Rapidez::config('customer/address/telephone_show') == 'req'"
                     />
                 </label>
@@ -178,7 +178,7 @@ class="region exists"
                 <x-rapidez::label>@lang('Postcode')</x-rapidez::label>
                 <x-rapidez::input
                     name="{{ $type }}_postcode"
-                    v-model="variables.postcode"
+                    v-model.lazy="variables.postcode"
                     v-on:change="$root.$nextTick(() => window.app.$emit('postcode-change', variables))"
                     required
                 />
@@ -190,7 +190,7 @@ class="region exists"
                     <x-rapidez::label>@lang('Housenumber')</x-rapidez::label>
                     <x-rapidez::input
                         name="{{ $type }}_housenumber"
-                        v-model="variables.street[1]"
+                        v-model.lazy="variables.street[1]"
                         v-on:change="$root.$nextTick(() => window.app.$emit('postcode-change', variables))"
                         required
                     />
@@ -203,7 +203,7 @@ class="region exists"
                     <x-rapidez::label>@lang('Addition')</x-rapidez::label>
                     <x-rapidez::input
                         name="{{ $type }}_addition"
-                        v-model="variables.street[2]"
+                        v-model.lazy="variables.street[2]"
                     />
                 </label>
             </div>
@@ -213,7 +213,7 @@ class="region exists"
                 <x-rapidez::label>@lang('Street')</x-rapidez::label>
                 <x-rapidez::input
                     name="{{ $type }}_street"
-                    v-model="variables.street[0]"
+                    v-model.lazy="variables.street[0]"
                     required
                 />
             </label>
@@ -223,7 +223,7 @@ class="region exists"
                 <x-rapidez::label>@lang('City')</x-rapidez::label>
                 <x-rapidez::input
                     name="{{ $type }}_city"
-                    v-model="variables.city"
+                    v-model.lazy="variables.city"
                     required
                 />
             </label>
@@ -234,7 +234,7 @@ class="region exists"
                     <x-rapidez::label>@lang('Fax')</x-rapidez::label>
                     <x-rapidez::input
                         name="{{ $type }}_fax"
-                        v-model="variables.fax"
+                        v-model.lazy="variables.fax"
                         :required="Rapidez::config('customer/address/fax_show') === 'req'"
                     />
                 </label>

From dcdbf89c6d7b99c1ea5b87d4571411e8577bbd46 Mon Sep 17 00:00:00 2001
From: Jade Geels <jade@justbetter.nl>
Date: Mon, 11 Aug 2025 14:40:31 +0200
Subject: [PATCH 05/10] Remove extra div

---
 .../checkout/steps/billing_address.blade.php  | 22 +++++++++----------
 1 file changed, 10 insertions(+), 12 deletions(-)

diff --git a/resources/views/checkout/steps/billing_address.blade.php b/resources/views/checkout/steps/billing_address.blade.php
index 9d42411f6..2cbb15651 100644
--- a/resources/views/checkout/steps/billing_address.blade.php
+++ b/resources/views/checkout/steps/billing_address.blade.php
@@ -20,16 +20,14 @@
     }"
     v-slot="{ mutate, variables }"
 >
-    <div partial-submit="mutate">
-        <fieldset>
-            <template v-if="!cart.is_virtual">
-                <x-rapidez::input.checkbox v-model="variables.same_as_shipping">
-                    @lang('My billing and shipping address are the same')
-                </x-rapidez::input.checkbox>
-            </template>
-            <template v-if="!variables.same_as_shipping">
-                @include('rapidez::checkout.partials.address', ['type' => 'billing'])
-            </template>
-        </fieldset>
-    </div>
+    <fieldset partial-submit="mutate">
+        <template v-if="!cart.is_virtual">
+            <x-rapidez::input.checkbox v-model="variables.same_as_shipping">
+                @lang('My billing and shipping address are the same')
+            </x-rapidez::input.checkbox>
+        </template>
+        <template v-if="!variables.same_as_shipping">
+            @include('rapidez::checkout.partials.address', ['type' => 'billing'])
+        </template>
+    </fieldset>
 </graphql-mutation>

From 0140aa8e1ce191411bbb42e06cd357fcda398a6d Mon Sep 17 00:00:00 2001
From: Jade <jade@justbetter.nl>
Date: Mon, 11 Aug 2025 15:01:34 +0200
Subject: [PATCH 06/10] Fix constant re-querying because of uid change

---
 resources/js/components/GraphqlMutation.vue          | 12 +++++++++++-
 .../views/checkout/steps/billing_address.blade.php   |  1 +
 .../views/checkout/steps/shipping_address.blade.php  |  1 +
 3 files changed, 13 insertions(+), 1 deletion(-)

diff --git a/resources/js/components/GraphqlMutation.vue b/resources/js/components/GraphqlMutation.vue
index b2c5f87d0..180310cd9 100644
--- a/resources/js/components/GraphqlMutation.vue
+++ b/resources/js/components/GraphqlMutation.vue
@@ -113,7 +113,17 @@ export default {
 
         data: {
             handler() {
-                this.changeFn(this)
+                let diff = objectDiff(this.prevData, this.data)
+
+                // Remove ignored variables
+                diff = Object.fromEntries(Object.entries(diff).filter(([key, _]) => !this.watchIgnore.includes(key)))
+
+                // Only send event when changes are detected
+                if (Object.keys(diff).length > 0) {
+                    this.changeFn(this)
+                }
+
+                deepMerge(this.prevData, JSON.parse(JSON.stringify(diff)))
             },
             deep: true,
         },
diff --git a/resources/views/checkout/steps/billing_address.blade.php b/resources/views/checkout/steps/billing_address.blade.php
index 9d42411f6..45e6910be 100644
--- a/resources/views/checkout/steps/billing_address.blade.php
+++ b/resources/views/checkout/steps/billing_address.blade.php
@@ -11,6 +11,7 @@
     :before-request="(query, variables, options) => [variables.customer_address_id ? config.queries.setExistingBillingAddressOnCart : query, variables, options]"
     :callback="updateCart"
     :error-callback="checkResponseForExpiredCart"
+    :watch-ignore="['uid']"
     group="billing"
     mutate-event="setBillingAddressOnCart"
     v-on:change="function (e) {
diff --git a/resources/views/checkout/steps/shipping_address.blade.php b/resources/views/checkout/steps/shipping_address.blade.php
index 12d162644..eabfeb4b1 100644
--- a/resources/views/checkout/steps/shipping_address.blade.php
+++ b/resources/views/checkout/steps/shipping_address.blade.php
@@ -10,6 +10,7 @@
     :before-request="(query, variables, options) => [variables.customer_address_id ? config.queries.setExistingShippingAddressesOnCart : query, variables, options]"
     :callback="updateCart"
     :error-callback="checkResponseForExpiredCart"
+    :watch-ignore="['uid']"
     group="shipping"
     mutate-event="setShippingAddressesOnCart"
     v-on:change="function (e) {

From 218ee05d6a767fbd7ca1b8a42c7b9b467791c555 Mon Sep 17 00:00:00 2001
From: Jade <jade@justbetter.nl>
Date: Mon, 11 Aug 2025 15:05:06 +0200
Subject: [PATCH 07/10] Add prevData

---
 resources/js/components/GraphqlMutation.vue | 1 +
 1 file changed, 1 insertion(+)

diff --git a/resources/js/components/GraphqlMutation.vue b/resources/js/components/GraphqlMutation.vue
index 180310cd9..0a81b2689 100644
--- a/resources/js/components/GraphqlMutation.vue
+++ b/resources/js/components/GraphqlMutation.vue
@@ -73,6 +73,7 @@ export default {
         running: false,
         initialVariables: {},
         data: {},
+        prevData: {},
         mutate: () => null,
     }),
 

From c414916f905582d4cc8ad91dd69a297766dc6a97 Mon Sep 17 00:00:00 2001
From: Jade <jade@justbetter.nl>
Date: Mon, 11 Aug 2025 15:06:38 +0200
Subject: [PATCH 08/10] Fix variables not existing on billing address

---
 resources/js/components/GraphqlMutation.vue              | 2 +-
 resources/views/checkout/steps/billing_address.blade.php | 2 +-
 2 files changed, 2 insertions(+), 2 deletions(-)

diff --git a/resources/js/components/GraphqlMutation.vue b/resources/js/components/GraphqlMutation.vue
index 0a81b2689..99b0008a5 100644
--- a/resources/js/components/GraphqlMutation.vue
+++ b/resources/js/components/GraphqlMutation.vue
@@ -142,7 +142,7 @@ export default {
 
     methods: {
         changeFn: useDebounceFn((self) => {
-            self.$emit('change', { target: self.$el, mutate: self.mutate })
+            self.$emit('change', { target: self.$el, mutate: self.mutate, variables: self.variables })
         }, 500),
 
         async mutateFn() {
diff --git a/resources/views/checkout/steps/billing_address.blade.php b/resources/views/checkout/steps/billing_address.blade.php
index 7a676dab3..652ce8d8f 100644
--- a/resources/views/checkout/steps/billing_address.blade.php
+++ b/resources/views/checkout/steps/billing_address.blade.php
@@ -16,7 +16,7 @@
     mutate-event="setBillingAddressOnCart"
     v-on:change="function (e) {
         e.target.closest('fieldset').querySelector(':invalid') === null
-        && (!variables.same_as_shipping || !!cart?.shipping_addresses?.[0]?.postcode)
+        && (!e.variables.same_as_shipping || !!cart?.shipping_addresses?.[0]?.postcode)
         && window.app.$emit('setBillingAddressOnCart')
     }"
     v-slot="{ mutate, variables }"

From 7e4c3e75aab43ae9a640e1f247f1f3946cd1f1f2 Mon Sep 17 00:00:00 2001
From: Jade <jade@justbetter.nl>
Date: Mon, 11 Aug 2025 15:19:30 +0200
Subject: [PATCH 09/10] Hardcode uid for now

---
 resources/js/components/GraphqlMutation.vue               | 2 +-
 resources/views/checkout/steps/billing_address.blade.php  | 1 -
 resources/views/checkout/steps/shipping_address.blade.php | 1 -
 3 files changed, 1 insertion(+), 3 deletions(-)

diff --git a/resources/js/components/GraphqlMutation.vue b/resources/js/components/GraphqlMutation.vue
index 99b0008a5..512df2182 100644
--- a/resources/js/components/GraphqlMutation.vue
+++ b/resources/js/components/GraphqlMutation.vue
@@ -117,7 +117,7 @@ export default {
                 let diff = objectDiff(this.prevData, this.data)
 
                 // Remove ignored variables
-                diff = Object.fromEntries(Object.entries(diff).filter(([key, _]) => !this.watchIgnore.includes(key)))
+                diff = Object.fromEntries(Object.entries(diff).filter(([key, _]) => !['uid'].includes(key)))
 
                 // Only send event when changes are detected
                 if (Object.keys(diff).length > 0) {
diff --git a/resources/views/checkout/steps/billing_address.blade.php b/resources/views/checkout/steps/billing_address.blade.php
index 652ce8d8f..5689e7fd8 100644
--- a/resources/views/checkout/steps/billing_address.blade.php
+++ b/resources/views/checkout/steps/billing_address.blade.php
@@ -11,7 +11,6 @@
     :before-request="(query, variables, options) => [variables.customer_address_id ? config.queries.setExistingBillingAddressOnCart : query, variables, options]"
     :callback="updateCart"
     :error-callback="checkResponseForExpiredCart"
-    :watch-ignore="['uid']"
     group="billing"
     mutate-event="setBillingAddressOnCart"
     v-on:change="function (e) {
diff --git a/resources/views/checkout/steps/shipping_address.blade.php b/resources/views/checkout/steps/shipping_address.blade.php
index eabfeb4b1..12d162644 100644
--- a/resources/views/checkout/steps/shipping_address.blade.php
+++ b/resources/views/checkout/steps/shipping_address.blade.php
@@ -10,7 +10,6 @@
     :before-request="(query, variables, options) => [variables.customer_address_id ? config.queries.setExistingShippingAddressesOnCart : query, variables, options]"
     :callback="updateCart"
     :error-callback="checkResponseForExpiredCart"
-    :watch-ignore="['uid']"
     group="shipping"
     mutate-event="setShippingAddressesOnCart"
     v-on:change="function (e) {

From df1c1741b75e8b9e6b1337f69963682add5ec18a Mon Sep 17 00:00:00 2001
From: Jade Geels <jade@justbetter.nl>
Date: Tue, 12 Aug 2025 09:49:26 +0200
Subject: [PATCH 10/10] Make sure customer_address_id is set to null rather
 than undefined

---
 resources/js/stores/useCart.js | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/resources/js/stores/useCart.js b/resources/js/stores/useCart.js
index b343157fb..9fc16c22f 100644
--- a/resources/js/stores/useCart.js
+++ b/resources/js/stores/useCart.js
@@ -158,7 +158,7 @@ function addCustomerAddressId(address) {
         return address
     }
     const customerAddress = user.value?.addresses?.find((customerAddress) => areAddressesSame(customerAddress, address))
-    address.customer_address_id = address.customer_address_id || customerAddress?.id
+    address.customer_address_id = (address.customer_address_id || customerAddress?.id) ?? null
 
     return address
 }