Feat/SW-1281 ancillaries add flow * feat(SW-1546): update design * feat(SW-1546): show points only if logged in * feat(SW-1546): always show points * feat(SW-1281): ancillary add flow initial * feat(SW-1546): add api call * feat(SW-1281): refactor naming and break out components * feat(SW-1281): handle back button * feat(SW-1281): make mobile cards clickable * feat(SW-1281): refactor spread ancillaries * feat(SW-1281): add deliverytimes * feat(SW-1281): rebase master * feat(SW-1281): add design for logged in or not * feat(SW-1281): add design * feat(SW-1281): add mobile design * feat(SW-1281): fix carousel * feat(SW-1281): show deliverytime only if ancillary has not been added * feat(SW-1281): add design * feat(SW-1281): add translations * feat(SW-1281): add translations * feat(SW-1281): add translations * feat(SW-1281): base dates on check in date only * feat(SW-1281): fix show correct toast when no valid data * feat(SW-1281): hande logic if deliverytime is not required * feat(SW-1281): fix max width for mobile * feat(SW-1281): refactor after pr comment Approved-by: Niclas Edenvin Approved-by: Linus Flood
51 lines
1.5 KiB
TypeScript
51 lines
1.5 KiB
TypeScript
import { useIntl } from "react-intl"
|
|
|
|
import Input from "@/components/TempDesignSystem/Form/Input"
|
|
import Select from "@/components/TempDesignSystem/Form/Select"
|
|
import Body from "@/components/TempDesignSystem/Text/Body"
|
|
import Caption from "@/components/TempDesignSystem/Text/Caption"
|
|
import Subtitle from "@/components/TempDesignSystem/Text/Subtitle"
|
|
|
|
import styles from "./deliveryDetailsStep.module.css"
|
|
|
|
import type { DeliveryMethodStepProps } from "@/types/components/myPages/myStay/ancillaries"
|
|
|
|
export default function DeliveryMethodStep({
|
|
deliveryTimeOptions,
|
|
}: DeliveryMethodStepProps) {
|
|
const intl = useIntl()
|
|
|
|
return (
|
|
<div className={styles.selectContainer}>
|
|
<div className={styles.select}>
|
|
<Subtitle type="two">
|
|
{intl.formatMessage({ id: "Delivered at:" })}
|
|
</Subtitle>
|
|
<Select
|
|
name="deliveryTime"
|
|
label={""}
|
|
items={deliveryTimeOptions}
|
|
registerOptions={{ required: true }}
|
|
isNestedInModal
|
|
/>
|
|
<Body>
|
|
{intl.formatMessage({
|
|
id: "All add-ons are delivered at the same time. Changes to delivery times will affect earlier add-ons.",
|
|
})}
|
|
</Body>
|
|
</div>
|
|
<div className={styles.select}>
|
|
<Input
|
|
label={intl.formatMessage({ id: "Other Requests" })}
|
|
name="optionalText"
|
|
/>
|
|
<Caption>
|
|
{intl.formatMessage({
|
|
id: "Optional",
|
|
})}
|
|
</Caption>
|
|
</div>
|
|
</div>
|
|
)
|
|
}
|