\r\n {error && (\r\n \r\n {' '}\r\n {validationMessage}\r\n \r\n )}\r\n \r\n handleUpdateData(value, 'name')}\r\n onKeyDown={(e: any) =>\r\n e.key === 'Enter' && (isExistingOrder ? updateOrder() : addOrder())\r\n }\r\n validation={{\r\n required: true,\r\n errorMessage: recurringOrderValidationLabel,\r\n }}\r\n />\r\n\r\n handleUpdateData(value, 'startDate')}\r\n onKeyDown={(e: any) =>\r\n e.key === 'Enter' && (isExistingOrder ? updateOrder() : addOrder())\r\n }\r\n validation={{\r\n required: true,\r\n errorMessage: recurringOrderValidationLabel,\r\n }}\r\n />\r\n\r\n \r\n handleUpdateData(value, 'intervalInDays')\r\n }\r\n onKeyDown={(e: any) =>\r\n e.key === 'Enter' && (isExistingOrder ? updateOrder() : addOrder())\r\n }\r\n validation={{\r\n required: true,\r\n errorMessage: recurringOrderValidationLabel,\r\n }}\r\n />\r\n \r\n\r\n \r\n \r\n {isExistingOrder ? updateOrderLabel : subscribeLabel}\r\n \r\n {isExistingOrder && (\r\n <>\r\n \r\n {deleteLabel}\r\n \r\n >\r\n )}\r\n {isExistingOrder && (\r\n <>\r\n \r\n {recurringOrderData.onHold ? activateLabel : onHoldLabel}\r\n \r\n >\r\n )}\r\n
\r\n \r\n );\r\n}\r\n\r\nconst Container = styled('div', {\r\n backgroundColor: '$white',\r\n p: 4,\r\n '@mediaMinLarge': {\r\n p: 8,\r\n },\r\n});\r\n\r\nconst StyledButton = styled(CtaButton, {\r\n w: '100%',\r\n '&:first-of-type': {\r\n mt: 2,\r\n },\r\n '&:not(:last-of-type)': {\r\n mb: 4,\r\n },\r\n});\r\n\r\nconst ErrorMessage = styled('p', {\r\n flexGrow: 1,\r\n flexShrink: 1,\r\n flexBasis: '0%',\r\n});\r\n\r\nconst ValidationMessage = styled('div', {\r\n backgroundColor: '$errorPrimary',\r\n color: '$errorText',\r\n p: 6,\r\n my: 6,\r\n display: 'flex',\r\n});\r\n\r\nexport default RecurringOrderInformation;\r\n","import { useEffect, useState } from 'react';\r\nimport { useKexNavigate } from '../../Kex/KexRouter/KexRouter';\r\nimport { GetOrder } from '../../OrderComponent/Order';\r\nimport { Add, Delete, Update } from '../../OrderComponent/RecurringOrder';\r\nimport { getUrlParameter } from '../../Shared/Common/Helpers';\r\nimport useCurrentPage from '../../Shared/Hooks/useCurrentPage';\r\nimport PageModelBase from '../../Shared/Models/PageModelBase.interface';\r\nimport { useAppSettingsData } from '../../Shared/Providers/AppSettingsProvider';\r\nimport { useUserStateData } from '../../Shared/UserContextProvider/UserContextProvider';\r\nimport { GetCart } from '../CartPage/Cart';\r\nimport RecurringOrderInformation from '../../OrderComponent/RecurringOrderInformation';\r\nimport { styled } from '../../stitches.config';\r\nimport { H4 } from '../../Atoms/Typography/Headings/Heading';\r\nimport CartProductList from '../../Organisms/ProductList/CartProductList';\r\n\r\nconst initialState = {\r\n name: '',\r\n intervalInDays: '0',\r\n startDate: '',\r\n};\r\n\r\nfunction RecurringOrderCartPage() {\r\n const { cart, isLoading } = GetCart();\r\n const { channelId } = useCurrentPage