Merged in fix/LOY-439-boosted-by-sas-bug (pull request #3047)
fix(LOY-439): fix "boosted by sas" issue * fix(LOY-439): fix "boosted by sas" issue Approved-by: Chuma Mcphoy (We Ahead)
This commit is contained in:
@@ -2,37 +2,28 @@ import { dt } from "@scandic-hotels/common/dt"
|
|||||||
import { Divider } from "@scandic-hotels/design-system/Divider"
|
import { Divider } from "@scandic-hotels/design-system/Divider"
|
||||||
import { Typography } from "@scandic-hotels/design-system/Typography"
|
import { Typography } from "@scandic-hotels/design-system/Typography"
|
||||||
|
|
||||||
|
import { getIntl } from "@/i18n"
|
||||||
import { getLang } from "@/i18n/serverContext"
|
import { getLang } from "@/i18n/serverContext"
|
||||||
import { getSasTierExpirationDate } from "@/utils/sas"
|
|
||||||
|
|
||||||
import styles from "./membershipOverviewCard.module.css"
|
import styles from "./membershipOverviewCard.module.css"
|
||||||
|
|
||||||
import type { EurobonusMembership } from "@scandic-hotels/trpc/types/user"
|
|
||||||
import type { IntlShape } from "react-intl"
|
|
||||||
|
|
||||||
interface SasBoostStatusProps {
|
interface SasBoostStatusProps {
|
||||||
sasMembership: EurobonusMembership
|
expiryDate: string
|
||||||
intl: IntlShape
|
|
||||||
}
|
}
|
||||||
|
|
||||||
export default async function SasBoostStatus({
|
export default async function SasBoostStatus({
|
||||||
sasMembership,
|
expiryDate,
|
||||||
intl,
|
|
||||||
}: SasBoostStatusProps) {
|
}: SasBoostStatusProps) {
|
||||||
const lang = await getLang()
|
const lang = await getLang()
|
||||||
const tierExpirationDate = getSasTierExpirationDate(sasMembership)
|
const intl = await getIntl()
|
||||||
|
|
||||||
if (!tierExpirationDate || sasMembership.boostedByScandic) {
|
|
||||||
return null
|
|
||||||
}
|
|
||||||
|
|
||||||
const sasBoostExpiryText = intl.formatMessage(
|
const sasBoostExpiryText = intl.formatMessage(
|
||||||
{
|
{
|
||||||
id: "membershipOverViewCard.sasBoostedUntilDate",
|
id: "membershipOverViewCard.sasBoostedUntilDate",
|
||||||
defaultMessage: "Linked with SAS until {date}",
|
defaultMessage: "Boosted by SAS until {date}",
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
date: dt(tierExpirationDate).locale(lang).format("D MMM YYYY"),
|
date: dt(expiryDate).locale(lang).format("D MMM YYYY"),
|
||||||
}
|
}
|
||||||
)
|
)
|
||||||
|
|
||||||
@@ -40,7 +31,7 @@ export default async function SasBoostStatus({
|
|||||||
<>
|
<>
|
||||||
<Divider variant="vertical" color="Border/Divider/Accent" />
|
<Divider variant="vertical" color="Border/Divider/Accent" />
|
||||||
<Typography variant="Label/xsRegular">
|
<Typography variant="Label/xsRegular">
|
||||||
<span className={styles.sasBoostText}>{sasBoostExpiryText}</span>
|
<span className={styles.headingText}>{sasBoostExpiryText}</span>
|
||||||
</Typography>
|
</Typography>
|
||||||
</>
|
</>
|
||||||
)
|
)
|
||||||
|
|||||||
@@ -2,13 +2,12 @@ import { MembershipLevelEnum } from "@scandic-hotels/common/constants/membership
|
|||||||
import { Divider } from "@scandic-hotels/design-system/Divider"
|
import { Divider } from "@scandic-hotels/design-system/Divider"
|
||||||
import { MaterialIcon } from "@scandic-hotels/design-system/Icons/MaterialIcon"
|
import { MaterialIcon } from "@scandic-hotels/design-system/Icons/MaterialIcon"
|
||||||
import { Typography } from "@scandic-hotels/design-system/Typography"
|
import { Typography } from "@scandic-hotels/design-system/Typography"
|
||||||
import { getEurobonusMembership } from "@scandic-hotels/trpc/routers/user/helpers"
|
import { isBoostedBySas } from "@scandic-hotels/trpc/routers/user/helpers"
|
||||||
|
|
||||||
import { membershipLevels } from "@/constants/membershipLevels"
|
import { membershipLevels } from "@/constants/membershipLevels"
|
||||||
|
|
||||||
import MembershipLevelIcon from "@/components/Levels/Icon"
|
import MembershipLevelIcon from "@/components/Levels/Icon"
|
||||||
import { getIntl } from "@/i18n"
|
import { getIntl } from "@/i18n"
|
||||||
import { getSasTierExpirationDate } from "@/utils/sas"
|
|
||||||
|
|
||||||
import SasBoostStatus from "./SasBoostStatus"
|
import SasBoostStatus from "./SasBoostStatus"
|
||||||
|
|
||||||
@@ -34,23 +33,16 @@ export default async function MembershipOverviewCard({
|
|||||||
? intl.formatNumber(user.membership.currentPoints)
|
? intl.formatNumber(user.membership.currentPoints)
|
||||||
: intl.formatMessage({ id: "common.NA", defaultMessage: "N/A" })
|
: intl.formatMessage({ id: "common.NA", defaultMessage: "N/A" })
|
||||||
|
|
||||||
const sasMembership = user.loyalty
|
const boostedBySas = user.loyalty ? isBoostedBySas(user.loyalty) : null
|
||||||
? getEurobonusMembership(user.loyalty)
|
|
||||||
: null
|
|
||||||
|
|
||||||
const showSasBoostIcon =
|
|
||||||
sasMembership &&
|
|
||||||
getSasTierExpirationDate(sasMembership) &&
|
|
||||||
!sasMembership.boostedByScandic
|
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<section className={styles.card} aria-labelledby="membership-level">
|
<section className={styles.card} aria-labelledby="membership-level">
|
||||||
<header className={styles.membershipHeader}>
|
<header className={styles.membershipHeader}>
|
||||||
{showSasBoostIcon && (
|
{boostedBySas ? (
|
||||||
<MaterialIcon icon="travel" size={20} color="Icon/Accent" />
|
<MaterialIcon icon="travel" size={20} color="Icon/Accent" />
|
||||||
)}
|
) : null}
|
||||||
<Typography variant="Title/Overline/sm">
|
<Typography variant="Title/Overline/sm">
|
||||||
<h2 className={styles.levelText} id="membership-level">
|
<h2 className={styles.headingText} id="membership-level">
|
||||||
{intl.formatMessage(
|
{intl.formatMessage(
|
||||||
{
|
{
|
||||||
id: "common.membershipLevelWithValue",
|
id: "common.membershipLevelWithValue",
|
||||||
@@ -60,9 +52,10 @@ export default async function MembershipOverviewCard({
|
|||||||
)}
|
)}
|
||||||
</h2>
|
</h2>
|
||||||
</Typography>
|
</Typography>
|
||||||
{sasMembership && (
|
|
||||||
<SasBoostStatus sasMembership={sasMembership} intl={intl} />
|
{user.loyalty && boostedBySas ? (
|
||||||
)}
|
<SasBoostStatus expiryDate={user.loyalty?.tierExpires} />
|
||||||
|
) : null}
|
||||||
</header>
|
</header>
|
||||||
|
|
||||||
<MembershipLevelIcon
|
<MembershipLevelIcon
|
||||||
@@ -78,7 +71,7 @@ export default async function MembershipOverviewCard({
|
|||||||
/>
|
/>
|
||||||
|
|
||||||
<Typography variant="Title/Overline/sm">
|
<Typography variant="Title/Overline/sm">
|
||||||
<h3 className={styles.pointsLabel}>
|
<h3 className={styles.headingText}>
|
||||||
{intl.formatMessage({
|
{intl.formatMessage({
|
||||||
id: "common.pointsToSpend",
|
id: "common.pointsToSpend",
|
||||||
defaultMessage: "Points to spend",
|
defaultMessage: "Points to spend",
|
||||||
|
|||||||
@@ -16,16 +16,10 @@
|
|||||||
margin-bottom: var(--Space-x05);
|
margin-bottom: var(--Space-x05);
|
||||||
}
|
}
|
||||||
|
|
||||||
.levelText,
|
.headingText {
|
||||||
.sasBoostText,
|
|
||||||
.pointsLabel {
|
|
||||||
color: var(--Text-Brand-OnPrimary-3-Heading);
|
color: var(--Text-Brand-OnPrimary-3-Heading);
|
||||||
}
|
}
|
||||||
|
|
||||||
.levelText {
|
|
||||||
text-transform: uppercase;
|
|
||||||
}
|
|
||||||
|
|
||||||
.divider {
|
.divider {
|
||||||
margin: var(--Space-x4) 0;
|
margin: var(--Space-x4) 0;
|
||||||
}
|
}
|
||||||
|
|||||||
@@ -5,7 +5,10 @@ import DiamondAddIcon from "@scandic-hotels/design-system/Icons/DiamondAddIcon"
|
|||||||
import { MaterialIcon } from "@scandic-hotels/design-system/Icons/MaterialIcon"
|
import { MaterialIcon } from "@scandic-hotels/design-system/Icons/MaterialIcon"
|
||||||
import SkeletonShimmer from "@scandic-hotels/design-system/SkeletonShimmer"
|
import SkeletonShimmer from "@scandic-hotels/design-system/SkeletonShimmer"
|
||||||
import { Typography } from "@scandic-hotels/design-system/Typography"
|
import { Typography } from "@scandic-hotels/design-system/Typography"
|
||||||
import { getEurobonusMembership } from "@scandic-hotels/trpc/routers/user/helpers"
|
import {
|
||||||
|
getEurobonusMembership,
|
||||||
|
isBoostedBySas,
|
||||||
|
} from "@scandic-hotels/trpc/routers/user/helpers"
|
||||||
|
|
||||||
import {
|
import {
|
||||||
SAS_EUROBONUS_TIER_TO_NAME_MAP,
|
SAS_EUROBONUS_TIER_TO_NAME_MAP,
|
||||||
@@ -346,7 +349,7 @@ function calculateMatchState(loyalty: UserLoyalty): MatchState {
|
|||||||
if (eurobonusMembership?.boostedByScandic) return "boostedByScandic"
|
if (eurobonusMembership?.boostedByScandic) return "boostedByScandic"
|
||||||
|
|
||||||
if (!loyalty.tierBoostedBy) return "noBoost"
|
if (!loyalty.tierBoostedBy) return "noBoost"
|
||||||
if (loyalty.tierBoostedBy === "SAS_EB") return "boostedBySAS"
|
if (isBoostedBySas(loyalty)) return "boostedBySAS"
|
||||||
|
|
||||||
return "noBoost"
|
return "noBoost"
|
||||||
}
|
}
|
||||||
|
|||||||
@@ -48,6 +48,10 @@ export function getFriendsMembership(userLoyalty: UserLoyalty) {
|
|||||||
return result
|
return result
|
||||||
}
|
}
|
||||||
|
|
||||||
|
export function isBoostedBySas(loyalty: UserLoyalty) {
|
||||||
|
return loyalty.tierBoostedBy === scandicMembershipTypes.SAS_EB
|
||||||
|
}
|
||||||
|
|
||||||
function isEurobonusMembership(
|
function isEurobonusMembership(
|
||||||
membership: Membership
|
membership: Membership
|
||||||
): membership is EurobonusMembership {
|
): membership is EurobonusMembership {
|
||||||
|
|||||||
Reference in New Issue
Block a user