feat(BOOK-743): Replaced deprecated Button component

Approved-by: Bianca Widstam
This commit is contained in:
Erik Tiekstra
2026-01-21 09:38:38 +00:00
parent f834433d4d
commit 8e08af718c
77 changed files with 575 additions and 2233 deletions

View File

@@ -8,10 +8,10 @@ import { useIntl } from "react-intl"
import { profileEdit } from "@scandic-hotels/common/constants/routes/myPages"
import { formatPhoneNumber } from "@scandic-hotels/common/utils/phone"
import { Button } from "@scandic-hotels/design-system/Button"
import { MaterialIcon } from "@scandic-hotels/design-system/Icons/MaterialIcon"
import Modal from "@scandic-hotels/design-system/Modal"
import { ModalContentWithActions } from "@scandic-hotels/design-system/Modal/ModalContentWithActions"
import { OldDSButton as Button } from "@scandic-hotels/design-system/OldDSButton"
import { toast } from "@scandic-hotels/design-system/Toast"
import { Typography } from "@scandic-hotels/design-system/Typography"
import { trpc } from "@scandic-hotels/trpc/client"
@@ -232,56 +232,32 @@ export default function GuestDetails({
<>
{isMemberBooking ? (
<Button
variant="icon"
color="burgundy"
intent="secondary"
onClick={handleModifyMemberDetails}
disabled={isCancelled}
size="small"
variant="Secondary"
onPress={handleModifyMemberDetails}
isDisabled={isCancelled}
size="sm"
leadingIconName="edit"
>
<MaterialIcon
icon="edit"
color="Icon/Interactive/Default"
size={20}
/>
<Typography variant="Body/Paragraph/mdRegular">
<span>
{intl.formatMessage({
id: "myStay.guestDetails.modifyGuestDetails",
defaultMessage: "Edit guest details",
})}
</span>
</Typography>
{intl.formatMessage({
id: "myStay.guestDetails.modifyGuestDetails",
defaultMessage: "Edit guest details",
})}
</Button>
) : (
<>
<Button
variant="icon"
color="burgundy"
intent="secondary"
onClick={() =>
variant="Secondary"
onPress={() =>
setIsModifyGuestDetailsOpen(!isModifyGuestDetailsOpen)
}
disabled={isCancelled}
size="small"
isDisabled={isCancelled}
size="sm"
leadingIconName="edit"
>
<MaterialIcon
icon="edit"
color={
isCancelled
? "Icon/Interactive/Disabled"
: "Icon/Interactive/Default"
}
size={20}
/>
<Typography variant="Body/Paragraph/mdRegular">
<span>
{intl.formatMessage({
id: "myStay.guestDetails.modifyGuestDetails",
defaultMessage: "Edit guest details",
})}
</span>
</Typography>
{intl.formatMessage({
id: "myStay.guestDetails.modifyGuestDetails",
defaultMessage: "Edit guest details",
})}
</Button>
{isModifyGuestDetailsOpen && (
<Modal
@@ -322,11 +298,14 @@ export default function GuestDetails({
id: "common.confirm",
defaultMessage: "Confirm",
}),
onClick: isFirstStep
? () => setCurrentStep(MODAL_STEPS.CONFIRMATION)
: form.handleSubmit(onSubmit),
disabled: !form.formState.isValid || isLoading,
intent: isFirstStep ? "secondary" : "primary",
onPress: () =>
isFirstStep
? setCurrentStep(MODAL_STEPS.CONFIRMATION)
: form.handleSubmit(onSubmit)(),
type: isFirstStep ? "button" : "submit",
isDisabled: !form.formState.isValid,
isPending: isLoading,
variant: isFirstStep ? "Secondary" : "Primary",
}}
secondaryAction={{
label: isFirstStep
@@ -338,7 +317,7 @@ export default function GuestDetails({
id: "common.cancel",
defaultMessage: "Cancel",
}),
onClick: () => {
onPress: () => {
close()
setCurrentStep(MODAL_STEPS.INITIAL)
},