scandic/web
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Fixes bookingwidget skeleton and memoize fetching of creditcards

Browse Source
This commit is contained in:
Linus Flood
2024-12-17 14:31:52 +01:00
parent 0ea742db86
commit 431ab477eb
3 changed files with 66 additions and 64 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
components/Forms/BookingWidget/FormContent/Search/index.tsx
View File

@@ -245,7 +245,7 @@ export function SearchSkeleton() {
</Caption> </Caption>
</div> </div>
<div className={styles.input}> <div className={styles.input}>
<SkeletonShimmer /> <SkeletonShimmer width={"100%"} />
</div> </div>
</div> </div>
) )

4
components/Forms/BookingWidget/FormContent/index.tsx
View File

@@ -104,13 +104,13 @@ export function BookingWidgetFormContentSkeleton() {
<Caption color="red" type="bold"> <Caption color="red" type="bold">
{intl.formatMessage({ id: "booking.nights" }, { totalNights: 0 })} {intl.formatMessage({ id: "booking.nights" }, { totalNights: 0 })}
</Caption> </Caption>
<SkeletonShimmer /> <SkeletonShimmer width={"100%"} />
</div> </div>
<div className={styles.rooms}> <div className={styles.rooms}>
<Caption color="red" type="bold" asChild> <Caption color="red" type="bold" asChild>
<span>{intl.formatMessage({ id: "Guests & Rooms" })}</span> <span>{intl.formatMessage({ id: "Guests & Rooms" })}</span>
</Caption> </Caption>
<SkeletonShimmer /> <SkeletonShimmer width={"100%"} />
</div> </div>
</div> </div>
<div className={styles.voucherContainer}> <div className={styles.voucherContainer}>

124
server/routers/user/query.ts
View File

@@ -214,73 +214,75 @@ export function parsedUser(data: User, isMFA: boolean) {
return user return user
} }
async function getCreditCards({ const getCreditCards = cache(
session, async ({
onlyNonExpired, session,
}: { onlyNonExpired,
session: Session }: {
onlyNonExpired?: boolean session: Session
}) { onlyNonExpired?: boolean
getCreditCardsCounter.add(1) }) => {
console.info("api.profile.creditCards start", JSON.stringify({})) getCreditCardsCounter.add(1)
const apiResponse = await api.get(api.endpoints.v1.Profile.creditCards, { console.info("api.profile.creditCards start", JSON.stringify({}))
headers: { const apiResponse = await api.get(api.endpoints.v1.Profile.creditCards, {
Authorization: `Bearer ${session.token.access_token}`, headers: {
}, Authorization: `Bearer ${session.token.access_token}`,
}) },
if (!apiResponse.ok) {
const text = await apiResponse.text()
getCreditCardsFailCounter.add(1, {
error_type: "http_error",
error: JSON.stringify({
status: apiResponse.status,
statusText: apiResponse.statusText,
text,
}),
}) })
console.error(
"api.profile.creditCards error ", if (!apiResponse.ok) {
JSON.stringify({ const text = await apiResponse.text()
error: { getCreditCardsFailCounter.add(1, {
error_type: "http_error",
error: JSON.stringify({
status: apiResponse.status, status: apiResponse.status,
statusText: apiResponse.statusText, statusText: apiResponse.statusText,
text, text,
}, }),
}) })
) console.error(
return null "api.profile.creditCards error ",
} JSON.stringify({
error: {
const apiJson = await apiResponse.json() status: apiResponse.status,
const verifiedData = creditCardsSchema.safeParse(apiJson) statusText: apiResponse.statusText,
if (!verifiedData.success) { text,
getCreditCardsFailCounter.add(1, { },
error_type: "validation_error", })
error: JSON.stringify(verifiedData.error), )
}) return null
console.error(
"api.profile.creditCards validation error ",
JSON.stringify({ error: verifiedData.error })
)
return null
}
getCreditCardsSuccessCounter.add(1)
console.info("api.profile.creditCards success", JSON.stringify({}))
return verifiedData.data.data.filter((card) => {
if (onlyNonExpired) {
try {
const expirationDate = dt(card.expirationDate).startOf("day")
const currentDate = dt().startOf("day")
return expirationDate > currentDate
} catch (error) {
return false
}
} }
return true
}) const apiJson = await apiResponse.json()
} const verifiedData = creditCardsSchema.safeParse(apiJson)
if (!verifiedData.success) {
getCreditCardsFailCounter.add(1, {
error_type: "validation_error",
error: JSON.stringify(verifiedData.error),
})
console.error(
"api.profile.creditCards validation error ",
JSON.stringify({ error: verifiedData.error })
)
return null
}
getCreditCardsSuccessCounter.add(1)
console.info("api.profile.creditCards success", JSON.stringify({}))
return verifiedData.data.data.filter((card) => {
if (onlyNonExpired) {
try {
const expirationDate = dt(card.expirationDate).startOf("day")
const currentDate = dt().startOf("day")
return expirationDate > currentDate
} catch (error) {
return false
}
}
return true
})
}
)
export const userQueryRouter = router({ export const userQueryRouter = router({
get: protectedProcedure get: protectedProcedure