Skip to content

Commit f9d01b6

Browse files
acasazzamalessani
acasazza
authored and
malessani
committed
fix: Add Fragment component to avoid React 18 type errors
1 parent 4697a2a commit f9d01b6

6 files changed

Lines changed: 160 additions & 103 deletions

File tree

‎components/composite/StepCustomer/index.tsx‎

Lines changed: 43 additions & 39 deletions
Original file line numberDiff line numberDiff line change
@@ -124,7 +124,7 @@ export const StepCustomer: React.FC<Props> = () => {
124124
const tab = document.querySelector('div[tabindex="2"]')
125125
const top = tab?.scrollLeft as number
126126
const left = tab?.scrollTop as number
127-
window.scrollTo({ left, top: top, behavior: "smooth" })
127+
window.scrollTo({ left, top, behavior: "smooth" })
128128

129129
setIsLocalLoader(false)
130130
}
@@ -139,44 +139,48 @@ export const StepCustomer: React.FC<Props> = () => {
139139
>
140140
<StepContent>
141141
<>
142-
{accordionCtx.isActive && (
143-
<>
144-
{isGuest ? (
145-
<CheckoutAddresses
146-
shippingAddress={shippingAddress}
147-
billingAddress={billingAddress}
148-
emailAddress={emailAddress}
149-
hasSameAddresses={hasSameAddresses}
150-
setCustomerEmail={setCustomerEmail}
151-
isShipmentRequired={isShipmentRequired}
152-
isLocalLoader={isLocalLoader}
153-
openShippingAddress={openShippingAddress}
154-
shipToDifferentAddress={shipToDifferentAddress}
155-
setShipToDifferentAddress={setShipToDifferentAddress}
156-
disabledShipToDifferentAddress={disabledShipToDifferentAddress}
157-
handleSave={handleSave}
158-
/>
159-
) : (
160-
<CheckoutCustomerAddresses
161-
shippingAddress={shippingAddress}
162-
billingAddress={billingAddress}
163-
emailAddress={emailAddress}
164-
hasCustomerAddresses={hasCustomerAddresses}
165-
isShipmentRequired={isShipmentRequired}
166-
isUsingNewShippingAddress={isUsingNewShippingAddress}
167-
isUsingNewBillingAddress={isUsingNewBillingAddress}
168-
hasSameAddresses={hasSameAddresses}
169-
isLocalLoader={isLocalLoader}
170-
shippingCountryCodeLock={shippingCountryCodeLock}
171-
openShippingAddress={openShippingAddress}
172-
shipToDifferentAddress={shipToDifferentAddress}
173-
setShipToDifferentAddress={setShipToDifferentAddress}
174-
disabledShipToDifferentAddress={disabledShipToDifferentAddress}
175-
handleSave={handleSave}
176-
/>
177-
)}
178-
</>
179-
)}
142+
{accordionCtx.isActive && (
143+
<>
144+
{isGuest ? (
145+
<CheckoutAddresses
146+
shippingAddress={shippingAddress}
147+
billingAddress={billingAddress}
148+
emailAddress={emailAddress}
149+
hasSameAddresses={hasSameAddresses}
150+
setCustomerEmail={setCustomerEmail}
151+
isShipmentRequired={isShipmentRequired}
152+
isLocalLoader={isLocalLoader}
153+
openShippingAddress={openShippingAddress}
154+
shipToDifferentAddress={shipToDifferentAddress}
155+
setShipToDifferentAddress={setShipToDifferentAddress}
156+
disabledShipToDifferentAddress={
157+
disabledShipToDifferentAddress
158+
}
159+
handleSave={handleSave}
160+
/>
161+
) : (
162+
<CheckoutCustomerAddresses
163+
shippingAddress={shippingAddress}
164+
billingAddress={billingAddress}
165+
emailAddress={emailAddress}
166+
hasCustomerAddresses={hasCustomerAddresses}
167+
isShipmentRequired={isShipmentRequired}
168+
isUsingNewShippingAddress={isUsingNewShippingAddress}
169+
isUsingNewBillingAddress={isUsingNewBillingAddress}
170+
hasSameAddresses={hasSameAddresses}
171+
isLocalLoader={isLocalLoader}
172+
shippingCountryCodeLock={shippingCountryCodeLock}
173+
openShippingAddress={openShippingAddress}
174+
shipToDifferentAddress={shipToDifferentAddress}
175+
setShipToDifferentAddress={setShipToDifferentAddress}
176+
disabledShipToDifferentAddress={
177+
disabledShipToDifferentAddress
178+
}
179+
handleSave={handleSave}
180+
/>
181+
)}
182+
</>
183+
)}
180184
</>
181185
</StepContent>
182186
</StepContainer>

‎components/data/AppProvider/index.tsx‎

Lines changed: 20 additions & 18 deletions
Original file line numberDiff line numberDiff line change
@@ -100,7 +100,7 @@ export const AppProvider: React.FC<AppProviderProps> = ({
100100

101101
const cl = CommerceLayer({
102102
organization: slug,
103-
accessToken: accessToken,
103+
accessToken,
104104
domain,
105105
})
106106

@@ -148,6 +148,7 @@ export const AppProvider: React.FC<AppProviderProps> = ({
148148
const setAddresses = async (order?: Order) => {
149149
dispatch({ type: ActionType.START_LOADING })
150150
const currentOrder = order ?? (await getOrderFromRef())
151+
console.log(currentOrder)
151152
const isShipmentRequired = await checkIfShipmentRequired(cl, orderId)
152153

153154
const others = calculateSettings(
@@ -157,14 +158,15 @@ export const AppProvider: React.FC<AppProviderProps> = ({
157158
// we don't receive them from fetchOrder
158159
state.customerAddresses
159160
)
160-
161-
dispatch({
162-
type: ActionType.SET_ADDRESSES,
163-
payload: {
164-
order: currentOrder,
165-
others,
166-
},
167-
})
161+
setTimeout(() => {
162+
dispatch({
163+
type: ActionType.SET_ADDRESSES,
164+
payload: {
165+
order: currentOrder,
166+
others,
167+
},
168+
})
169+
}, 100)
168170
}
169171

170172
const setCouponOrGiftCard = async (order?: Order) => {
@@ -214,21 +216,21 @@ export const AppProvider: React.FC<AppProviderProps> = ({
214216
})
215217
}
216218

217-
const autoSelectShippingMethod = async (_order?: Order) => {
219+
const autoSelectShippingMethod = async (order?: Order) => {
218220
dispatch({ type: ActionType.START_LOADING })
219-
const currentOrder = await fetchOrder(cl, orderId)
221+
const currentOrder = order ?? (await fetchOrder(cl, orderId))
222+
220223
const others = calculateSettings(
221224
currentOrder,
222225
state.isShipmentRequired,
223226
state.customerAddresses
224227
)
225-
dispatch({
226-
type: ActionType.SAVE_SHIPMENTS,
227-
payload: {
228-
order: currentOrder,
229-
others,
230-
},
231-
})
228+
setTimeout(() => {
229+
dispatch({
230+
type: ActionType.SAVE_SHIPMENTS,
231+
payload: { order: currentOrder, others },
232+
})
233+
}, 100)
232234
}
233235

234236
const saveShipments = async () => {

‎components/hooks/useActiveStep.ts‎

Lines changed: 0 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -67,7 +67,6 @@ export const useActiveStep = (): UseActiveStep => {
6767
canSelectShippingMethod &&
6868
canSelectPayment &&
6969
ctx.hasPaymentMethod
70-
7170
if (canPlaceOrder) {
7271
setActiveStep("Complete")
7372
setLastActivableStep("Complete")

‎package.json‎

Lines changed: 2 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -71,7 +71,7 @@
7171
],
7272
"dependencies": {
7373
"@commercelayer/js-auth": "^2.3.0",
74-
"@commercelayer/react-components": "4.2.1-beta.4",
74+
"@commercelayer/react-components": "4.2.1-beta.5",
7575
"@commercelayer/sdk": "^4.21.0",
7676
"@faker-js/faker": "^7.6.0",
7777
"@headlessui/react": "^1.7.8",
@@ -118,6 +118,7 @@
118118
"eslint-config-prettier": "^8.6.0",
119119
"eslint-config-standard": "17.0.0",
120120
"eslint-plugin-import": "^2.27.5",
121+
"eslint-plugin-n": "^15.6.1",
121122
"eslint-plugin-node": "^11.1.0",
122123
"eslint-plugin-prettier": "^4.2.1",
123124
"eslint-plugin-promise": "^6.1.1",

0 commit comments

Comments
 (0)
⚡