$${(product.BasePrice * ((100 - product.PercentOff)/100)).toFixed(2)}
`\n\t} else\n\t\treturn `$${product.BasePrice.toFixed(2)}
`\n}\n\nexport const getPercentOffPrice = (product: any) => {\n\tconst price = product.PercentOff > 0 ? (product.BasePrice * ((100 - product.PercentOff)/100)) : product.BasePrice\n\treturn product.Quantity !== undefined ? (price * product.Quantity) : price * product.SelectedQuantity\n}\n\nexport function safeConvertStringToNumber(value: string): number | null {\n\tconst numberValue = Number(value);\n\treturn isNaN(numberValue) ? null : numberValue;\n}\n\n\nexport const isValidPaymentMethod = (uid: string, snippetProfile?: ClubSignupSnippetProfile, paymentMethods?: ArrayPlease enter a valid custom amount.
}\n \n\t\t\t);\n\t\tdefault:\n\t\t\treturn (\n\t\t\t\t\n \n {showError && props.showError &&
\n )\n\t}\n}","import React, {createContext} from 'react';\n\n// @ts-ignore\nconst DeviceSessionContext = createContext();\nDeviceSessionContext.displayName = 'DeviceSessionContext';\n\ntype DeviceSessionProviderProps = {\n\tprofile: any,\n\tchildren: any\n}\n\nfunction DeviceSessionProvider(props: DeviceSessionProviderProps) {\n\n\tconst profile = props.profile\n\n\tconst value = React.useMemo(() => ({ profile }), [\n\t\tprops.profile\n\t]);\n\n\treturn Please enter a valid custom amount.
}\n\n {value !== '' &&\n {props.label} \n }\n \n \n {props.options.map(option => {\n return (\n \n )\n })}\n \n
\n );\n default:\n return (\n \n
)\n }\n}","import {useQuery} from 'react-query';\nimport {client} from './ApiClient';\nimport {mapServiceUrls} from '../Helpers/Functions';\n\nconst getCountries = (key: any, urls: any, domain: string, deviceCode: string) => client(urls.LoyaltyEngineApiUrl, `api/v4/${domain}/${deviceCode}/countries`);\n\nexport default function useCountries(urls: any, domain: string, deviceCode: string) {\n\tconst {status, data, error, isFetching } = useQuery('Countries', (key) => getCountries(key, mapServiceUrls(urls), domain, deviceCode), {enabled: urls, staleTime: 1000*60*30});\n\tconst countriesStatus = status;\n\tconst countries = data ? data.data : undefined;\n\tconst countriesError = error;\n\tconst countriesFetching = isFetching;\n\treturn {countriesStatus, countries, countriesError, countriesFetching};\n}\n","import {useQuery} from 'react-query';\nimport {client} from './ApiClient';\nimport {mapServiceUrls} from '../Helpers/Functions';\n\nconst getStates = (key: any, urls: any, domain: string, deviceCode: string, countryUid: string) => client(urls.LoyaltyEngineApiUrl, `api/v4/${domain}/${deviceCode}/states?countryCode=${countryUid}`);\n\nexport default function useStates(urls: any, domain: string, deviceCode: string, countryUid: string, enabled: boolean) {\n\tconst {status, data, error, isFetching } = useQuery(['States', countryUid], (key) => getStates(key, mapServiceUrls(urls), domain, deviceCode, countryUid), {enabled: urls && enabled, staleTime: 1000*60*30});\n\tconst statesStatus = status;\n\tconst states = data ? data.data : undefined;\n\tconst statesError = error;\n\tconst statesFetching = isFetching;\n\treturn {statesStatus, states, statesError, statesFetching};\n}\n","import React, {useEffect, useState} from 'react';\nimport {ISyntheticEvent} from \"./Helpers/Types\";\n\ntype CheckboxInputProps = {\n id: string\n value: boolean\n label: string\n handleChange: (value: boolean, field: string) => void\n}\n\nexport default function CheckboxInput(props: CheckboxInputProps) {\n const [value, setValue] = useState(props.value)\n \n const handleChange = (e: ISyntheticEvent) => {\n e.persist();\n setValue(e.target.checked)\n props.handleChange(e.target.checked, props.id)\n }\n \n return (\n <>\n \n \n \n \n )\n}","import React, {Fragment, useEffect, useMemo, useReducer, useState} from 'react';\nimport useSnippetConfig from './Utils/UseSnippetConfig';\nimport useServiceUrls from './Utils/UseServiceUrls';\nimport LoadingSpinner from './LoadingSpinner';\nimport {\n ICountry,\n ICustomFieldType,\n IQuickSignupField,\n ISelectOption,\n ISignupState,\n IState,\n ISyntheticEvent,\n PasswordState, SubscriberGroupConfig,\n SnippetType, LegacySubscriberGroupConfig\n} from './Helpers/Types';\nimport TextInput from './TextInput';\nimport {\n SignupAction,\n SignupActionTypes,\n updateCustomSignupFieldAction,\n updateSignupFieldAction,\n updateSubscriberGroupsFieldAction\n} from './SignupActions';\nimport UseSignupCustomer from './Utils/UseSignupCustomer';\nimport {doesCountryHaveStates, mapServiceUrls} from './Helpers/Functions';\nimport PasswordField from './PasswordField';\nimport EmailInput from './EmailInput';\nimport {useSnippetContext} from './Utils/UseSnippetContext';\nimport {useAuth} from './Utils/UseAuth';\nimport useDeviceSessionProfile from './Utils/UseDeviceSessionProfile';\nimport NumberInput from './NumberInput';\nimport {useDeviceSessionContext} from './Utils/UseDeviceSessionProfileContext';\nimport SelectInput from './SelectInput';\nimport useCountries from './Utils/UseCountries';\nimport useStates from './Utils/UseStates';\nimport {useStyleContext} from \"./Utils/UseStyleContext\";\nimport CheckboxInput from \"./CheckboxInput\";\nimport {v4 as uuid} from 'uuid'\n\nexport const signupState: ISignupState = {\n SubscriberGroups: [],\n BirthdayMonth1: '',\n BirthdayMonth2: '',\n FirstName2: '',\n LastName2: '',\n LoyaltyCardNumber: '',\n Password: '',\n VerifyPassword: '',\n FirstName: '',\n LastName: '',\n CompanyName: '',\n Address1: '',\n Address2: '',\n City: '',\n State: '',\n PostalCode: '',\n Country: '',\n EmailAddress: '',\n Phone1: '',\n MobilePhone: '',\n BirthDate: '',\n CustomFields: [],\n RegisterCard: '',\n};\n\nexport const signupReducer = (state = signupState, action: SignupAction): ISignupState => {\n switch (action.type) {\n case SignupActionTypes.UpdateCustomField:\n if (state.CustomFields.filter(field => field.Key === action.fieldName).length > 0){\n let newArray = state.CustomFields.map(field => {\n if (field.Key === action.fieldName)\n return { Key: action.fieldName, Value: action.value }\n return field;\n })\n return {...state, CustomFields: newArray}\n }\n let fields = state.CustomFields\n fields.push({Key: action.fieldName, Value: action.value})\n return {...state, CustomFields: fields}\n case SignupActionTypes.UpdateField:\n return {\n ...state,\n [action.fieldName]: action.value\n };\n case SignupActionTypes.UpdateSubscriberGroupsField:\n return {\n ...state,\n SubscriberGroups: action.value\n }\n default:\n return state;\n }\n};\n\ntype LegacySignupSnippetProps = {\n snippetCode: string\n isStandalone: boolean\n setShowSignup?: Function;\n}\n\nexport default function LegacySignupSnippet(props: LegacySignupSnippetProps) {\n // @ts-ignore\n const {setSession} = useAuth();\n // @ts-ignore\n const {profile} = useDeviceSessionContext();\n signupState.Country = profile.DefaultCountry;\n const [state, dispatch] = useReducer(signupReducer, signupState);\n // @ts-ignore\n const { domain, deviceCode } = useSnippetContext();\n // @ts-ignore\n const {theme, setTheme} = useStyleContext();\n const { serviceUrls } = useServiceUrls(domain);\n const { deviceSessionProfile } = useDeviceSessionProfile(serviceUrls, domain, deviceCode)\n const { SnippetConfig: config } = useSnippetConfig(serviceUrls, domain, deviceCode, props.snippetCode);\n const [signupCustomer, { data, isSuccess, isLoading, isError, error, reset }] = UseSignupCustomer();\n const [signupFields, setSignupFields] = useState
\n
\n
\n
\n
\n
\n )\n }\n\n if (isError) {\n alert(error);\n reset();\n }\n\n return (\n \n {!SnippetConfig &&\n
\n );\n}","import {useMutation} from 'react-query';\nimport {client} from './ApiClient';\nimport { v4 as uuid } from 'uuid';\nimport {mapSignupStateToLESignupCommand} from \"../Helpers/Maps\";\nimport {ISignupState} from \"../Helpers/Types\";\n\nconst setCustomerToCart = ({urls, domain, deviceCode, cartUid, cartExternalId, cartSourceExternalId, customerUid}: {urls: any; domain: string; deviceCode: string; cartUid: string; cartExternalId: string; cartSourceExternalId: string; customerUid: string}) => {\n\tlet params = `${cartUid ? `?cartUid=${cartUid}` : ''}`\n\tif (cartExternalId)\n\t\tparams = `${params === '' ? '?' : '&'}externalId=${cartExternalId}`\n\t\n\tif (cartSourceExternalId)\n\t\tparams = `${params === '' ? '?' : '&'}sourceExternalId=${cartSourceExternalId}`\n\treturn client(urls.LoyaltyEngineApiUrl, `api/v4/${domain}/${deviceCode}/carts/commands/setcustomer${params}`, {\n\t\tbody: {\n\t\t\tUid: customerUid,\n\t\t}\n\t});\n}\n\nexport default function useSetCustomerToCart() {\n\t// @ts-ignore\n\treturn useMutation(setCustomerToCart)\n}","import React, {useEffect} from 'react';\n\ntype SnippetHeaderProps = {\n title: string,\n message: string,\n logoUrl: string,\n snippetCode: string\n}\n\nexport default function SnippetHeader(props: SnippetHeaderProps) {\n useEffect(() => {\n const title = document.getElementById(`bl-snippet-title-${props.snippetCode}`)\n const body = document.getElementById(`bl-snippet-body-${props.snippetCode}`)\n if (title)\n title.innerHTML = props.title\n if (body)\n body.innerHTML = props.message\n }, [])\n \n return (\n <>\n {props.logoUrl && Signup Complete
\n }\n {isSuccess && SnippetConfig.IsReturnSuccessMessage &&\n{SnippetConfig.SuccessMessage}
\n }\n {SnippetConfig && !isSuccess &&\n <>\n \n {passwordState === PasswordState.Unmatching &&\nPasswords must match.
\n }\n {isLoading &&\n{error}
\n }\n \n }\n{props.label}
\n\n\t\t\t\t\t
\n\t\t\t
\n\t\t\t\t\t
\n\t\t\t\t\t
\n\t\t\t\t
\n\t\t)\n\t}\n\t\n\tconst handleRegisterCardChange = (field: string, value: string) => {\n\t\tvalidateRegisteredCardNumber(value)\n\t\tsetRegisteredCardChanged(true)\n\t\tsetCardNumber(value);\n\t}\n\n\t// @ts-ignore\n\treturn (\n\t\t\n\t\t\t{!SnippetConfig &&\n \n \n\t {passwordState === PasswordState.Unmatching &&\n\t\t\t\t\n \n\t\t\t}\n\t\t
\n\t);\n}","import React from 'react';\nimport {useSnippetContext} from \"./Utils/UseSnippetContext\";\nimport {useStyleContext} from \"./Utils/UseStyleContext\";\nimport useServiceUrls from \"./Utils/UseServiceUrls\";\nimport useDeviceSessionProfile from \"./Utils/UseDeviceSessionProfile\";\nimport useSnippetConfig from \"./Utils/UseSnippetConfig\";\nimport LoadingSpinner from \"./LoadingSpinner\";\nimport LegacySignupSnippet from \"./LegacySignupSnippet\";\nimport SignupSnippet from \"./SignupSnippet\";\n\ntype SignupWrapperProps = {\n snippetCode: string\n setShowSignup: Function\n}\n\nexport default function SignupWrapper(props: SignupWrapperProps) {\n // @ts-ignore\n const { domain, deviceCode } = useSnippetContext();\n const { serviceUrls } = useServiceUrls(domain);\n const { SnippetConfig, SnippetConfigStatus } = useSnippetConfig(serviceUrls, domain, deviceCode, props.snippetCode);\n \n return (\n <>\n {SnippetConfigStatus === 'loading' && Signup Complete
\n\t\t\t}\n\t\t\t{(isSuccess && config.OnSuccessMessage) &&\n\t\t\t{config.OnSuccessMessage}
\n\t\t\t}\n\t\t\t{SnippetConfig && (!isSuccess || (isSuccess && isRegisteringCard())) &&\n <>\n\t\t\t\tPasswords must match.
\n\t }\n\t\t\t\t{!validLoyaltyCard && checkLoyaltyCardNumber && loyaltyNumberChanged &&{`Loyalty Card Number must have ${SnippetConfig.LoyaltyCardMaxLength === null ? `at least ${SnippetConfig.LoyaltyCardMinLength} characters` : `between ${SnippetConfig.LoyaltyCardMinLength} and ${SnippetConfig.LoyaltyCardMaxLength} characters`} and include only ${SnippetConfig.LoyaltyCardCharacterType === CharacterTypeOptions.Numeric ? 'numbers' : SnippetConfig.LoyaltyCardCharacterType === CharacterTypeOptions.Alpha ? 'letters' : 'letters and numbers'} `}
}\n\t\t\t\t{!validRegisteredCard && checkRegisteredCardNumber && registeredCardChanged &&{`Registered Card Number must have ${SnippetConfig.RegisteredCardMaxLength === null ? `at least ${SnippetConfig.RegisteredCardMinLength} characters` : `between ${SnippetConfig.RegisteredCardMinLength} and ${SnippetConfig.RegisteredCardMaxLength} characters`} and include only ${SnippetConfig.RegisteredCardCharacterType === CharacterTypeOptions.Numeric ? 'numbers' : SnippetConfig.RegisteredCardCharacterType === CharacterTypeOptions.Alpha ? 'letters' : 'letters and numbers'} `}
}\n\t\t\t\t{isLoading &&\n{`${config.OnErrorMessage ? config.OnErrorMessage : 'There was an error completing the request.'}: ${error}`}
\n\t\t\t\t}\n\t\t\t\t{setCustomerStatus === 'error' &&\n\t\t\t\t\t{`${config.OnErrorMessage ? config.OnErrorMessage : 'There was an error completing the request.'}: ${setCustomerError}`}
\n\t\t\t\t}\n\t\t\t\tUnable to load snippet profile {props.snippetCode}
}\n {SnippetConfig &&\n <>\n {SnippetConfig.Signup &&Snippet is not a signup snippet.
}\n \n }\n \n )\n}","import { useMutation} from 'react-query';\nimport {client} from './ApiClient';\n\nconst loginCustomer = ({urls, domain, deviceCode, email, password}: {urls: any; domain: string; deviceCode: string; email: string; password: string;}) => {\n\treturn client(urls.LoyaltyEngineApiUrl, `api/v4/${domain}/${deviceCode}/sessions/commands/createsession`, {\n\t\tbody: {\n\t\t\tEmailAddress: email,\n\t\t\tPassword: password\n\t\t}\n\t});\n}\n\nexport default function useLogin() {\n\t// @ts-ignore\n\treturn useMutation(loginCustomer)\n}","\n\nimport { useMutation} from 'react-query';\nimport {client} from './ApiClient';\n\nconst resetPassword = ({urls, domain, deviceCode, email}: {urls: any; domain: string; deviceCode: string; email: string;}) => {\n return client(urls.LoyaltyEngineApiUrl, `api/v4/${domain}/${deviceCode}/snippets/customers/commands/resetpassword`, {\n body: {\n EmailAddress: email,\n }\n });\n}\n\nexport default function useResetPassword() {\n // @ts-ignore\n return useMutation(resetPassword)\n}","import React, {useState} from 'react';\nimport useResetPassword from \"./Utils/UseResetPassword\";\nimport TextInput from \"./TextInput\";\nimport {ISyntheticEvent} from \"./Helpers/Types\";\nimport {useSnippetContext} from \"./Utils/UseSnippetContext\";\nimport useServiceUrls from \"./Utils/UseServiceUrls\";\nimport {mapServiceUrls} from \"./Helpers/Functions\";\nimport LoadingSpinner from \"./LoadingSpinner\";\nimport EmailInput from \"./EmailInput\";\n\ntype ResetPasswordProps = {\n emailAddress: string\n back: Function\n}\n\nexport default function ResetPassword(props: ResetPasswordProps) {\n const [email, setEmail] = useState(props.emailAddress)\n // @ts-ignore \n const { domain, deviceCode } = useSnippetContext();\n const { serviceUrls } = useServiceUrls(domain);\n const [resetPassword, { isLoading, isSuccess, data, isError, error, status, reset }] = useResetPassword();\n \n const handleChange = (fieldName: string, value: string) => {\n reset();\n setEmail(value);\n }\n \n const back = (e: ISyntheticEvent) => {\n e.preventDefault();\n props.back();\n }\n \n const submit = (e: ISyntheticEvent) => {\n e.preventDefault();\n resetPassword({urls: mapServiceUrls(serviceUrls), domain, deviceCode, email})\n }\n \n return (\n\n
\n )\n}","import React, {useEffect, useMemo, useState} from 'react';\nimport {ISyntheticEvent, LoginType} from './Helpers/Types';\nimport TextInput from './TextInput';\nimport PasswordField from './PasswordField';\nimport useServiceUrls from './Utils/UseServiceUrls';\nimport {mapServiceUrls} from './Helpers/Functions';\nimport useSnippetConfig from './Utils/UseSnippetConfig';\nimport {useSnippetContext} from './Utils/UseSnippetContext';\nimport LoadingSpinner from './LoadingSpinner';\nimport useLogin from './Utils/UseLogin';\nimport {useAuth} from './Utils/UseAuth';\nimport ResetPassword from \"./ResetPassword\";\nimport {parse} from \"query-string\";\n\ntype LoginProps = {\n\tonSuccess: (config: any) => string | null\n\tonError: (config: any) => string | null\n\tsnippetCode: string\n\tsetSignupSnippet: Function\n\tloginType: LoginType\n\tremoteLoginUrl?: string\n}\n\nexport default function LegacyLogin(props: LoginProps) {\n\t//@ts-ignore\n\tconst { domain, deviceCode, returnUrlParam, loginUrl } = useSnippetContext();\n\tconst [remoteLogin, ] = useState(props.loginType === LoginType.ConfiguredUrl || props.loginType === LoginType.Undefined && props.remoteLoginUrl);\n\t//@ts-ignore\n\tconst { setSession, session } = useAuth();\n\tconst { serviceUrls } = useServiceUrls(domain);\n\tconst [login, { isLoading, data, isError, error, isSuccess }] = useLogin();\n\tconst { SnippetConfig } = useSnippetConfig(serviceUrls, domain, deviceCode, props.snippetCode);\n\tconst [email, setEmail] = useState('');\n\tconst [password, setPassword] = useState('');\n\tconst [showMessage, setShowMessage] = useState(false);\n\tconst [message, setMessage] = useState('');\n\tconst [showResetPassword, setShowResetPassword] = useState(false);\n\tconst [validLogin, setValidLogin] = useState(false)\n\tconst [loginError, setLoginError] = useState('')\n\tconst [loginQueryUrl, setLoginQueryUrl] = useState('')\n\n\tuseEffect(() => {\n\t\tconst params = parse(window.location.search)\n\t\tif (params.bl_lurl) {\n\t\t\t\t// @ts-ignore\n\t\t\t\tsetLoginQueryUrl(params.bl_lurl)\n\t\t}\n\t}, [])\n\n\tuseEffect(() => {\n\t\tif (!loginQueryUrl && !loginUrl && !props.remoteLoginUrl && remoteLogin) {\n\t\t\tsetValidLogin(false)\n\t\t\tsetLoginError('No Login url provided with login type set to external url. Please provide a login url as a query param, on the snippet element or in the configuration')\n\t\t}\n\t\tsetValidLogin(true)\n\t}, [loginQueryUrl, loginUrl, props.remoteLoginUrl, remoteLogin])\n\t\n\t\n\tconst config = useMemo(() => SnippetConfig?.LegacyLogin, [SnippetConfig])\n\n\tfunction onSuccess(data: any) {\n\t\tconst value = props.onSuccess(config);\n\t\tif (value === null) {\n\t\t\tsetSession(data.data.SessionKey, data.data.Customer);\n\t\t\treturn;\n\t\t}\n\t\tsetMessage(value);\n\t\tsetShowMessage(true);\n\t}\n\n\tfunction onError(data: any) {\n\t\tprops.onError(config);\n\t}\n\n\tconst submit = (e: ISyntheticEvent) => {\n\t\te.preventDefault();\n\t\tlogin({ urls: mapServiceUrls(serviceUrls), domain, deviceCode, password, email });\n\t};\n\n\tconst signup = (e: ISyntheticEvent) => {\n\t\te.preventDefault();\n\t\tprops.setSignupSnippet(config.CustomerSignupSnippetCode);\n\t};\n\t\n\tconst closeResetPassword = () => {\n\t\tsetShowResetPassword(false);\n\t}\n\n\tuseEffect(() => {\n\t\tif (data)\n\t\t\tonSuccess(data);\n\n\t\tif (error)\n\t\t\tonError(error);\n\t}, [data, error]);\n\n\t// const goToRemoteLogin = (e: ISyntheticEvent) => {\n\t// \te.preventDefault();\n\t// \twindow.location.assign(`${props.remoteLoginUrl}?ReturnUrl=${window.location.protocol + '//' + window.location.host + window.location.pathname}`);\n\t// };\n\t\n\tif (remoteLogin && !session && validLogin) {\n\t\tlet url = props.remoteLoginUrl ? props.remoteLoginUrl : loginUrl ? loginUrl : loginQueryUrl\n\t\tconst isValid = /[-a-zA-Z0-9@:%._\\+~#=]{1,256}\\.[a-zA-Z0-9()]{1,6}\\b([-a-zA-Z0-9()@:%_\\+.~#?&//=]*)?/gi.test(url)\n\t\tif (!isValid) {\n\t\t\tif (url.includes('localhost'))\n\t\t\t\twindow.location.assign(`${url}?${returnUrlParam}=${window.location.protocol + '//' + window.location.host + window.location.pathname}`);\n\t\t\telse {\n\t\t\t\t\tsetValidLogin(false)\n\t\t\t\t\tsetLoginError('The url provided is not a valid url')\n\t\t\t}\n\t\t} else {\n\t\t\turl = url.includes('http') ? url : `https://${url}`\n\t\t\twindow.location.assign(`${url}?${returnUrlParam}=${window.location.protocol + '//' + window.location.host + window.location.pathname}`);\n\t\t}\n\t}\n\t\n\tif (!validLogin)\n\t\treturn (\n\t\t\tPassword Reset
\nPlease enter your email address and we will send you a link to reset your password.
\n\n \n {isLoading &&
\n If a customer exists with this email address, a reset mail will be sent.
\n }\n {isSuccess &&If a customer exists with this email address, a reset mail will be sent.
}\n\n\t\t\t\t{`Configuration Error: ${loginError}`}\n\t\t\t
\n\t\t)\n\t\n\tif (!remoteLogin && !props.snippetCode)\n\t\treturn (\n\t\t\t\n\t\t\t\t{`Configuration Error: You must set a snippet code or change the login type to configured url`}\n\t\t\t
\n\t\t)\n\n\treturn (\n\t\t<>\n\t\t\t{showResetPassword &&\n\t\t\t\t\t{/*{remoteLogin &&*/}\n\t\t\t\t\t{/**/}\n\t\t\t\t\t{/*}*/}\n\t\t\t\t\t{!remoteLogin &&\n\t\t\t\t\t<>\n\t\t\t\t\t\t{!config &&\n\t\t\t\t\t\t
\n\t\t\t}\n\t\t\n\t);\n}","import React, {Fragment, useEffect, useMemo, useState} from 'react';\nimport {ICountry, IInputConfig, ISyntheticEvent, LoginType} from './Helpers/Types';\nimport TextInput from './TextInput';\nimport PasswordField from './PasswordField';\nimport useServiceUrls from './Utils/UseServiceUrls';\nimport {getDisplayValue, mapServiceUrls} from './Helpers/Functions';\nimport useSnippetConfig from './Utils/UseSnippetConfig';\nimport {useSnippetContext} from './Utils/UseSnippetContext';\nimport LoadingSpinner from './LoadingSpinner';\nimport useLogin from './Utils/UseLogin';\nimport {useAuth} from './Utils/UseAuth';\nimport ResetPassword from \"./ResetPassword\";\nimport {parse} from \"query-string\";\nimport SnippetHeader from \"./Helpers/SnippetHeader\";\nimport SnippetFooter from \"./Helpers/SnippetFooter\";\nimport EmailInput from \"./EmailInput\";\nimport SelectInput from \"./SelectInput\";\n\ntype LoginProps = {\n\tonSuccess: (config: any) => string | null\n\tonError: (config: any) => string | null\n\tsnippetCode: string\n\tsetSignupSnippet: Function\n\tloginType: LoginType\n\tremoteLoginUrl?: string\n}\n\nexport default function Login(props: LoginProps) {\n\t//@ts-ignore\n\tconst { domain, deviceCode, returnUrlParam, loginUrl } = useSnippetContext();\n\tconst [remoteLogin, ] = useState(props.loginType === LoginType.ConfiguredUrl || props.loginType === LoginType.Undefined && props.remoteLoginUrl);\n\t//@ts-ignore\n\tconst { setSession, session } = useAuth();\n\tconst { serviceUrls } = useServiceUrls(domain);\n\tconst [login, { isLoading, data, isError, error, isSuccess }] = useLogin();\n\tconst { SnippetConfig } = useSnippetConfig(serviceUrls, domain, deviceCode, props.snippetCode);\n\tconst [email, setEmail] = useState('');\n\tconst [password, setPassword] = useState('');\n\tconst [showMessage, setShowMessage] = useState(false);\n\tconst [message, setMessage] = useState('');\n\tconst [showResetPassword, setShowResetPassword] = useState(false);\n\tconst [validLogin, setValidLogin] = useState(false)\n\tconst [loginError, setLoginError] = useState('')\n\tconst [loginQueryUrl, setLoginQueryUrl] = useState('')\n\n\tuseEffect(() => {\n\t\tconst params = parse(window.location.search)\n\t\tif (params.bl_lurl) {\n\t\t\t\t// @ts-ignore\n\t\t\t\tsetLoginQueryUrl(params.bl_lurl)\n\t\t}\n\t}, [])\n\n\tuseEffect(() => {\n\t\tif (!loginQueryUrl && !loginUrl && !props.remoteLoginUrl && remoteLogin) {\n\t\t\tsetValidLogin(false)\n\t\t\tsetLoginError('No Login url provided with login type set to external url. Please provide a login url as a query param, on the snippet element or in the configuration')\n\t\t}\n\t\tsetValidLogin(true)\n\t}, [loginQueryUrl, loginUrl, props.remoteLoginUrl, remoteLogin])\n\t\n\tuseEffect(() => {\n\t\tif (remoteLogin && !session && validLogin) {\n\t\t\tlet url = props.remoteLoginUrl ? props.remoteLoginUrl : loginUrl ? loginUrl : loginQueryUrl\n\t\t\tconst isValid = /[-a-zA-Z0-9@:%._\\+~#=]{1,256}\\.[a-zA-Z0-9()]{1,6}\\b([-a-zA-Z0-9()@:%_\\+.~#?&//=]*)?/gi.test(url)\n\t\t\tif (!isValid) {\n\t\t\t\tif (url.includes('localhost'))\n\t\t\t\t\twindow.location.assign(`${url}?${returnUrlParam}=${window.location.protocol + '//' + window.location.host + window.location.pathname}`);\n\t\t\t\telse {\n\t\t\t\t\tsetValidLogin(false)\n\t\t\t\t\tsetLoginError('The url provided is not a valid url')\n\t\t\t\t}\n\t\t\t} else {\n\t\t\t\turl = url.includes('http') ? url : `https://${url}`\n\t\t\t\twindow.location.assign(`${url}?${returnUrlParam}=${window.location.protocol + '//' + window.location.host + window.location.pathname}`);\n\t\t\t}\n\t\t}\n\t}, [remoteLogin, session, validLogin])\n\t\n\t\n\tconst config = useMemo(() => SnippetConfig?.Login ?? SnippetConfig?.LegacyLogin, [SnippetConfig])\n\n\tfunction onSuccess(data: any) {\n\t\tconst value = props.onSuccess(config);\n\t\tif (value === null) {\n\t\t\tsetSession(data.data.SessionKey, data.data.Customer);\n\t\t\treturn;\n\t\t}\n\t\tsetMessage(value);\n\t\tsetShowMessage(true);\n\t}\n\n\tfunction onError(data: any) {\n\t\tprops.onError(config);\n\t}\n\n\tconst submit = (e: ISyntheticEvent) => {\n\t\te.preventDefault();\n\t\tlogin({ urls: mapServiceUrls(serviceUrls), domain, deviceCode, password, email });\n\t};\n\n\tconst signup = (e: ISyntheticEvent) => {\n\t\te.preventDefault();\n\t\tprops.setSignupSnippet(config.SignupSnippetCode);\n\t};\n\t\n\tconst closeResetPassword = () => {\n\t\tsetShowResetPassword(false);\n\t}\n\n\tuseEffect(() => {\n\t\tif (data)\n\t\t\tonSuccess(data);\n\n\t\tif (error)\n\t\t\tonError(error);\n\t}, [data, error]);\n\n\n\t\n\tif (!validLogin)\n\t\treturn (\n\t\t\tLogin
\n\t\t\t\t\t\t\t{!showMessage &&\n\t\t\t\t\t\t\t<>\n\t\t\t\t\t\t\t\t{config.BodyText}
\n\t\t\t\t\t\t\t\t\n\t\t\t\t\t\t\t\t\n\t\t\t\t\t\t\t\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t{showMessage &&\n\t\t\t\t\t\t\t{message}
\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\n\t\t\t\t\t\t}\n\t\n\t\t\t\t\t\t{isLoading &&\n\t\t\t\t\t\tLogin Error: {error}
\n\t\t\t\t\t}\n\t\t\t\t\n\t\t\t\t{`Configuration Error: ${loginError}`}\n\t\t\t
\n\t\t)\n\t\n\tif (!remoteLogin && !props.snippetCode)\n\t\treturn (\n\t\t\t\n\t\t\t\t{`Configuration Error: You must set a snippet code or change the login type to configured url`}\n\t\t\t
\n\t\t)\n\t\n\tconst handleChange = (field: string, value: string) => {\n\t\tswitch (field) {\n\t\t\tcase 'Password':\n\t\t\t\tsetPassword(value)\n\t\t\t\tbreak;\n\t\t\tcase 'EmailAddress':\n\t\t\t\tsetEmail(value)\n\t\t\t\tbreak;\n\t\t}\n\t}\n\n\tconst mapField = (field: IInputConfig, index: number) => {\n\t\tif (!field.IsIncluded && !field.IsRequired)\n\t\t\treturn;\n\n\t\tlet value = field.FieldName === 'EmailAddress' ? email : password\n\t\tlet inputField: any;\n\t\tconst label = field.Label ? field.Label : getDisplayValue(field.FieldName);\n\t\tswitch (field.FieldName) {\n\t\t\tcase 'Password':\n\t\t\t\tinputField = <>\n\t\t\t\t\t\n\t\t\t
\n\t\t\t\t\t{!remoteLogin &&\n\t\t\t\t\t<>\n\t\t\t\t\t\t{!config &&\n\t\t\t\t\t\t
\n\t\t\t}\n\t\t\n\t);\n}","import React, {useEffect, useMemo, useState} from 'react';\nimport {useSnippetContext} from \"./Utils/UseSnippetContext\";\nimport {LoginType} from \"./Helpers/Types\";\nimport useServiceUrls from \"./Utils/UseServiceUrls\";\nimport useSnippetConfig from \"./Utils/UseSnippetConfig\";\nimport LoadingSpinner from \"./LoadingSpinner\";\nimport LegacyLogin from \"./LegacyLogin\";\nimport Login from \"./Login\";\nimport {parse} from \"query-string\";\nimport {useAuth} from './Utils/UseAuth';\n\ntype LoginHandlerProps = {\n onSuccess: (config: any) => string | null\n onError: (config: any) => string | null\n snippetCode: string\n setSignupSnippet: Function\n loginType: LoginType\n remoteLoginUrl?: string\n}\n\nexport default function LoginHandler(props: LoginHandlerProps) {\n //@ts-ignore\n const { setSession, session } = useAuth();\n //@ts-ignore\n const { domain, deviceCode, returnUrlParam, loginUrl } = useSnippetContext();\n const { serviceUrls } = useServiceUrls(domain);\n const { SnippetConfig, SnippetConfigStatus } = useSnippetConfig(serviceUrls, domain, deviceCode, props.snippetCode);\n const [loginQueryUrl, setLoginQueryUrl] = useState('')\n const [validLogin, setValidLogin] = useState(false)\n const [loginError, setLoginError] = useState('')\n const remoteLogin = useMemo(() => props.loginType === LoginType.ConfiguredUrl || props.loginType === LoginType.ExternalQueryUrl || props.loginType === LoginType.ExternalElementUrl, [props.loginType])\n\n useEffect(() => {\n const params = parse(window.location.search)\n if (params.bl_lurl) {\n // @ts-ignore\n setLoginQueryUrl(params.bl_lurl)\n }\n }, [])\n\n useEffect(() => {\n if (!loginQueryUrl && !loginUrl && !props.remoteLoginUrl && remoteLogin) {\n setValidLogin(false)\n setLoginError('No Login url provided with login type set to external url. Please provide a login url as a query param, on the snippet element or in the configuration')\n }\n setValidLogin(true)\n }, [loginQueryUrl, loginUrl, props.remoteLoginUrl, remoteLogin])\n\n useEffect(() => {\n if (props.loginType === LoginType.ConfiguredUrl && !session && validLogin) {\n let url = props.remoteLoginUrl ? props.remoteLoginUrl : loginUrl ? loginUrl : loginQueryUrl\n const isValid = /[-a-zA-Z0-9@:%._\\+~#=]{1,256}\\.[a-zA-Z0-9()]{1,6}\\b([-a-zA-Z0-9()@:%_\\+.~#?&//=]*)?/gi.test(url)\n if (!isValid) {\n if (url.includes('localhost'))\n window.location.assign(`${url}?${returnUrlParam}=${window.location.protocol + '//' + window.location.host + window.location.pathname}`);\n else {\n console.log(\"Should not display\")\n setValidLogin(false)\n setLoginError('The url provided is not a valid url')\n }\n } else {\n url = url.includes('http') ? url : `https://${url}`\n window.location.assign(`${url}?${returnUrlParam}=${window.location.protocol + '//' + window.location.host + window.location.pathname}`);\n }\n }\n }, [validLogin]);\n\n if (!validLogin || loginError)\n return (\n {message}
\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\n\t\t\t\t\t\t}\n\t\n\t\t\t\t\t\t{isLoading &&\n\t\t\t\t\t\tLogin Error: {error}
\n\t\t\t\t\t}\n\t\t\t\t\t\n {`Configuration Error: ${loginError}`}\n
\n )\n \n return (\n <>\n {SnippetConfigStatus === 'loading' &&This is not a login snippet.
}\n \n )\n}","import React, {useEffect, useState} from 'react';\nimport './App.css';\nimport {useAuth} from './Utils/UseAuth';\nimport {ISyntheticEvent, IWizardPage, IWizardPageMap, LoginType} from './Helpers/Types';\nimport Login from './Login';\nimport {onError, onSuccess} from './Utils/LoginFunctions';\nimport SignupSnippet from './SignupSnippet';\nimport useResolveCustomer from './Utils/UseResolveSessionCustomer';\nimport {useSnippetContext} from './Utils/UseSnippetContext';\nimport useServiceUrls from './Utils/UseServiceUrls';\nimport LoadingSpinner from \"./LoadingSpinner\";\nimport {logout} from \"./Utils/AuthClient\";\nimport CustomerSignupApp from \"./CustomerSignupApp\";\nimport SignupWrapper from \"./SignupWrapper\";\nimport LegacyLogin from \"./LegacyLogin\";\nimport LoginHandler from \"./LoginHandler\";\n\n// let theme = createMuiTheme({\n// \tpalette: {\n// \t\tprimary: {\n// \t\t\tmain: '#92c13d'\n// \t\t},\n// \t\tsecondary: {\n// \t\t\tmain: '#393939'\n// \t\t}\n// \t}\n// });\n//\n// theme = responsiveFontSizes(theme);\n\n// export function login(username: string, password: string) {\n// \tif (username === 'bad')\n// \t\treturn Promise.reject('bad password');\n//\n// \treturn Promise.resolve(username);\n// }\n\n// const getConfigFromApi = () => client('http://localhost:55253', 'api/v4/RCTest1/MyRewards/SnippetConfig/test')\n\nlet pageMap: IWizardPageMap = {\n\tPages: new Array\n\t\t\t\t{props.authenticatedComponent}\n\t\t\t
\n\t\t)\n\t\n\treturn (\n\t\t<>\n\t\t\t{sessionCustomerStatus === 'loading' &&\n\t\t\t\t\n\t\t\t\t{session && customer ? \n\t\t\t\t\t<>\n\t\t\t\t\t\t{useLogout &&\n\t\t\t\t\t\t\n\t\t\t\t\t\t}\n\t\t\t\t\t\t{props.authenticatedComponent}\n\t\t\t\t\t\n\t\t\t\t\t:
\n\t\t\t}\n\t\t\n\t);\n\t\n}\n\nexport default AuthenticationApp;\n","import React from 'react';\n\ntype PaymentApprovedLandingProps = {}\n\nexport default function PaymentApprovedLanding(props: PaymentApprovedLandingProps) {\n\treturn (\n\t\t\n\t\t\t
\n\t);\n}","import {useQuery} from 'react-query';\nimport {client, logout} from './ApiClient';\nimport {mapServiceUrls} from '../Helpers/Functions';\n\nconst getClubMembership = (key: any, urls: any, domain: string, deviceCode: string, session: string, clubUid: string) => {\n\treturn client(urls.LoyaltyEngineApiUrl, `api/v4/${domain}/${deviceCode}/sessions/${session}/clubmembership/${clubUid}`);\n}\n\nexport default function useClubMembership(urls: any, domain: string, deviceCode: string, session: string, clubUid: string) {\n\tconst {status, data, error, isFetching, remove: removeMembership } = useQuery(['ClubMembership', clubUid], (key) => getClubMembership(key, mapServiceUrls(urls), domain, deviceCode, session, clubUid), { enabled: urls && clubUid, staleTime: 1000*60*5 });\n\tconst membershipStatus = status;\n\tconst membership = data ? data.data : undefined;\n\tconst membershipError = error;\n\tconst membershipIsFetching = isFetching;\n\tif (error === 'Expired key')\n\t\tlogout();\n\n\treturn {membershipStatus, membership, membershipError, membershipIsFetching, removeMembership};\n}\n","import React from 'react';\nimport {ISyntheticEvent, MembershipType} from './Helpers/Types';\nimport {FormControlLabel, Radio, RadioGroup} from '@material-ui/core';\n\ntype ClubMembershipTypeProps = {\n\ttype: MembershipType,\n\tsetType: (type: MembershipType) => void\n\tsnippetConfig: any\n}\n\nexport default function ClubMembershipType(props: ClubMembershipTypeProps) {\n\tconst handleChange = (event: ISyntheticEvent) => {\n\t\tprops.setType(event.target.value);\n\t};\n\n\treturn (\n\t\tPayment Method Approved
\n\t\t\n\t\t\t\n\t\t\t\t} label={props.snippetConfig.StandardMembershipTypeCaption}/>\n\t\t\t\t} label={props.snippetConfig.GiftMembershipTypeCaption}/>\n\t\t\t \n\t\t
\n\t);\n}","import React from 'react';\nimport NumberInput from './NumberInput';\nimport SelectInput from './SelectInput';\n\ntype TableInputProps = {\n\ttype: string,\n\tvalue: any,\n\tlabel: string,\n\tid: string,\n\tgetValue: (value: any, rowNum: number) => void\n\trowNum: number,\n\toptions?: Array{props.snippetConfig.AskMembershipTypeQuestion}
\n\t\t\t\n\t\t\t\t\n\t\t\t
\n\t\t)\n\t}\n\tif (props.type === 'options')\n\t\treturn (\n\t\t\t\n\t\t\t\t\n\t\t\t
\n\t\t)\n\treturn (\n\t\t\n\t\t
\n\t);\n}","import React, {useEffect, useMemo, useState} from 'react';\nimport SelectInput from \"../SelectInput\";\nimport NumberInput from \"../NumberInput\";\nimport {ClubSignupProductConfiguration, EGiftCard, EGiftCardSnippetProfile, ProductPreference} from \"../Helpers/Types\";\nimport {getInputField, safeConvertStringToNumber} from \"../Helpers/Functions\";\nimport {Grid} from \"@mui/material\";\n\ntype GiftAmountProps = {\n product: any\n config: ClubSignupProductConfiguration\n updatePrice: Function\n currencySymbol: string,\n}\n\n\nconst getNumber = (stringValue: string, defaultValue: number) => {\n var num = parseInt(stringValue)\n if (isNaN(num))\n return defaultValue\n\n return num\n}\n\nexport default function ProductAmountSelection(props: GiftAmountProps) {\n // @ts-ignore\n const [selectedAmount, setSelectedAmount] = useState(props.product.BasePrice?.toString() ?? props.config?.AmountOptions?.[0] ?? \"0\");\n // @ts-ignore\n const [customAmount, setCustomAmount] = useState(props.product.BasePrice ?? props.config?.MinValue ?? 0);\n\n const options = useMemo(() => props.config?.AmountOptions?.map(opt => {\n return {text: opt === 'Custom' ? opt : `$${opt}`, value: opt}\n }) ?? [], [props.config?.AmountOptions]);\n\n useEffect(() => {\n if (props.product.BasePrice && props.config.AmountOptions && props.config.AmountOptions.includes(props.product.BasePrice.toString()) && selectedAmount !== 'Custom')\n setSelectedAmount(props.product.BasePrice.toString())\n else if (props.product.BasePrice && props.config.AmountOptions && props.config.AmountOptions.includes(\"Custom\")) {\n setSelectedAmount('Custom')\n setCustomAmount(props.product.BasePrice ?? 0)\n } \n // setSelectedAmount(props.config?.AmountOptions?.[0] ?? \"0\")\n }, [props.product.Price]);\n\n const handleSelectChange = (field: string, value: string) => {\n if (value === 'Custom') {\n setSelectedAmount(value)\n return;\n }\n \n const valueAsNumber = safeConvertStringToNumber(value)\n if (valueAsNumber !== null) {\n props.updatePrice(props.config, valueAsNumber)\n setSelectedAmount(value)\n }\n }\n\n const handleCustomAmountChange = (field: string, value: number) => {\n props.updatePrice(props.config, value)\n setCustomAmount(value)\n }\n\n return (\n <>\n \n \n
\n \n \n
\n {`(${props.config?.MaxValue !== null && props.config?.MaxValue !== undefined ? `${props.currencySymbol}${props.config?.MinValue ?? 0}-${props.currencySymbol}${props.config.MaxValue}` : `- Minimum: ${props.currencySymbol}${props.config?.MinValue ?? 0}`})`}
\n\n \n \n
\n \n\t\t//
\n\t);\n}","import {useQuery} from 'react-query';\nimport {client, logout} from './ApiClient';\nimport {mapServiceUrls} from '../Helpers/Functions';\n\nconst getProductsByCode = (key: any, urls: any, session: string, domain: string, deviceCode: string, lookupCodes: any) => {\n\tlet uidString = '';\n\tlookupCodes.forEach((uid: string, index: number) => {\n\t\tif (index === 0)\n\t\t\tuidString += uid;\n\t\telse\n\t\t\tuidString += ',' + uid;\n\t})\n\treturn client(urls.LoyaltyEngineApiUrl, `api/v4/${domain}/${deviceCode}/sessions/${session}/products?codes=${uidString}`);\n}\n\nexport default function useProducts(urls: any, session: string, domain: string, deviceCode: string, lookupCodes: any) {\n\tconst {status, data, error, isFetching} = useQuery('products', (key) => getProductsByCode(key, mapServiceUrls(urls), session, domain, deviceCode, lookupCodes), {enabled: urls, staleTime: 1000*60*5});\n\tconst productsStatus = status;\n\tconst products = data ? data.data : undefined;\n\tconst productsError = error;\n\tif (error === 'Expired key')\n\t\tlogout();\n\n\treturn { productsStatus, products, productsError, isProductFetching: isFetching };\n}\n","import React, {useState} from 'react';\nimport {ISyntheticEvent, ProductPreference, ProductPreferenceType, QuantityType} from './Helpers/Types';\nimport ProductSelection from './ProductSelection';\nimport useServiceUrls from './Utils/UseServiceUrls';\nimport useProducts from './Utils/UseProducts';\nimport {useAuth} from './Utils/UseAuth';\nimport LoadingSpinner from './LoadingSpinner';\nimport {useSnippetContext} from './Utils/UseSnippetContext';\n\ntype ProductsPageProps = {\n snippetConfig: any\n nextStep: (e: ISyntheticEvent) => void\n prevStep: (e: ISyntheticEvent) => void\n updateField: (field: string, value: any) => void\n productPreferenceType: ProductPreferenceType,\n productPreferences: Array\n
\n
{`${formatDate(row.row.original.Created)}`}
\n })\n break;\n case 'Order #':\n columns.push({\n Header: c.Label ? c.Label : getDisplayValue(c.Name),\n accessor: 'OrderNumber',\n Cell: (row: any) =>{`${getOrderNumber(row.row.original)}`}
\n })\n break;\n case 'Store':\n columns.push({\n Header: c.Label ? c.Label : getDisplayValue(c.Name),\n accessor: 'StoreName',\n Cell: (row: any) =>{`${row.row.original.StoreName !== null ? row.row.original.StoreName : 'Not found'}`}
\n })\n break;\n case 'Product Discount':\n columns.push({\n Header: c.Label ? c.Label : getDisplayValue(c.Name),\n accessor: 'TotalDiscount',\n Cell: (row: any) =>{`${getCurrencyString(getProductsDiscount(row.row.original))}`}
\n })\n break;\n case 'Product Price':\n columns.push({\n Header: c.Label ? c.Label : getDisplayValue(c.Name),\n accessor: 'TotalProducts',\n Cell: (row: any) =>{`${getCurrencyString(getProductsPrice(row.row.original))}`}
\n })\n break;\n case 'Net Product Price':\n columns.push({\n Header: c.Label ? c.Label : getDisplayValue(c.Name),\n accessor: 'NetProducts',\n Cell: (row: any) =>{`${getCurrencyString(getNetProductsPrice(row.row.original))}`}
\n })\n break;\n case 'Net Shipping':\n columns.push({\n Header: c.Label ? c.Label : getDisplayValue(c.Name),\n accessor: 'ShippingCharge',\n Cell: (row: any) =>{`${getCurrencyString(getNetShipping(row.row.original))}`}
\n })\n break;\n case 'Total Taxes':\n columns.push({\n Header: c.Label ? c.Label : getDisplayValue(c.Name),\n accessor: 'TotalTax',\n Cell: (row: any) =>{`${getCurrencyString(row.row.original.TotalTax)}`}
\n })\n break;\n case 'Total Amount':\n columns.push({\n Header: c.Label ? c.Label : getDisplayValue(c.Name),\n accessor: 'TotalPayment',\n Cell: (row: any) =>{`${getCurrencyString(row.row.original.TotalPayment)}`}
\n })\n break;\n default:\n columns.push({\n Header: c.Label ? c.Label : getDisplayValue(c.Name),\n accessor: c.Name,\n Cell: (row: any) =>{`${row.row.original[c.Name]}`}
\n })\n }\n })\n \n return columns\n}","import React, {Fragment, SyntheticEvent, useEffect, useReducer, useState} from 'react';\nimport {\n\tIAddressState,\n\tICountry,\n\tICustomer,\n\tIInputConfig,\n\tISelectOption,\n\tIShippingAddress, IShippingState,\n\tIState,\n\tISyntheticEvent\n} from './Helpers/Types';\nimport {AddressAction, AddressActionTypes, copyAddress, updateFieldAction} from './AddressActions';\nimport useSaveShippingAddress from './Utils/UseSaveShippingAddress';\nimport useServiceUrls from './Utils/UseServiceUrls';\nimport {doesCountryHaveStates, flattenAddress, formatDate, languageCode, mapServiceUrls} from './Helpers/Functions';\nimport {useSnippetContext} from './Utils/UseSnippetContext';\nimport useCountries from './Utils/UseCountries';\nimport useStates from './Utils/UseStates';\nimport SelectInput from \"./SelectInput\";\nimport TextInput from \"./TextInput\";\nimport {useDeviceSessionContext} from './Utils/UseDeviceSessionProfileContext';\nimport {v4 as uuid} from 'uuid'\nimport {mapInputField} from \"./Helpers/ComponentFunctions\";\n\nexport const addressState: IAddressState = {\n\tShippingAddress: {\n\t\tUid: '',\n\t\tCustomerUid: '',\n\t\tExternalId: '',\n\t\tTitle: '',\n\t\tIsPrimary: false,\n\t\tFirstName: '',\n\t\tLastName: '',\n\t\tCompany: '',\n\t\tAddress: {\n\t\t\tAddress1: '',\n\t\t\tAddress2: '',\n\t\t\tCity: '',\n\t\t\tState: '',\n\t\t\tPostalCode: '',\n\t\t\tCountry: '',\n\t\t},\n\t\tEmailAddress: '',\n\t\tPhone1: '',\n\t\tPhone2: '',\n\t\tMobilePhone: '',\n\t\tFaxNumber: '',\n\t\tBirthDate: '',\n\t\tInstructions: '',\n\t\tIsClubAddress: false\n\t}\n};\n\n\texport const addressReducer = (state = addressState, action: AddressAction): IAddressState => {\n\tswitch (action.type) {\n\t\tcase AddressActionTypes.CopyAddress:\n\t\t\tlet birthDate = formatDate(action.customer.BirthDate ? action.customer.BirthDate : '') ?? '';\n\t\t\t\n\t\t\tlet address = {\n\t\t\t\tShippingAddress: {\n\t\t\t\t\t...state.ShippingAddress,\n\t\t\t\t\tCustomerUid: action.customer.Uid,\n\t\t\t\t\tFirstName: action.customer.FirstName,\n\t\t\t\t\tLastName: action.customer.LastName,\n\t\t\t\t\tCompany: action.customer.CompanyName ? action.customer.CompanyName : '',\n\t\t\t\t\tEmailAddress: action.customer.EmailAddress,\n\t\t\t\t\tPhone1: action.customer.Phone1,\n\t\t\t\t\tMobilePhone: action.customer.MobilePhone,\n\t\t\t\t\tBirthDate: birthDate,\n\t\t\t\t\tAddress: {\n\t\t\t\t\t\t...state.ShippingAddress.Address,\n\t\t\t\t\t\t...action.customer,\n\t\t\t\t\t\t...action.customer.Address,\n\t\t\t\t\t}\n\t\t\t\t}\n\t\t\t};\n\t\t\tif (address.ShippingAddress.Address.Country === null)\n\t\t\t\taddress.ShippingAddress.Address.Country = '';\n\t\t\tif (address.ShippingAddress.Address.State === null)\n\t\t\t\taddress.ShippingAddress.Address.State = '';\n\t\t\treturn address;\n\t\tcase AddressActionTypes.UpdateField:\n\t\t\tconst field = action.fieldName;\n\t\t\tif (field === 'Address1' || field === 'Address2' || field === 'City' || field === 'State' || field === 'PostalCode' || field === 'Country')\n\t\t\t\treturn {\n\t\t\t\t\t...state,\n\t\t\t\t\tShippingAddress: {\n\t\t\t\t\t\t...state.ShippingAddress,\n\t\t\t\t\t\tAddress: {\n\t\t\t\t\t\t\t...state.ShippingAddress.Address,\n\t\t\t\t\t\t\t[action.fieldName]: action.value\n\t\t\t\t\t\t}\n\t\t\t\t\t}\n\t\t\t\t}\n\t\t\t\n\t\t\treturn {\n\t\t\t\t...state,\n\t\t\t\tShippingAddress: {\n\t\t\t\t\t...state.ShippingAddress,\n\t\t\t\t\t[action.fieldName]: action.value\n\t\t\t\t}\n\t\t\t};\n\t\tdefault:\n\t\t\treturn state;\n\t}\n};\n\ntype AddressProps = {\n\taddress: IShippingAddress | null,\n\ttoggleEdit: (type: string) => void,\n\tsessionKey: string,\n\tcustomer: ICustomer\n\tfields: Array\n\t\t\t\n\t\t\t{props.address?.IsClubAddress &&
\n\t);\n}","import React from 'react';\nimport {IShippingAddress} from './Helpers/Types';\n\ntype AddressPreviewProps = {\n\taddress: IShippingAddress,\n\tdisabled: boolean,\n}\n\nexport default function AddressPreview(props: AddressPreviewProps) {\n\tif (!props.address)\n\t\treturn <>\n\tconst { LastName, FirstName, Address } = props.address;\n\treturn (\n\t\tThis address is currently used on a club.
}\n\t\t\t\n\t\t\t{status === 'success' &&\n\t\t\t\t{props.onSuccessMessage ?? \"Success\"}
\n\t\t\t}\n\t\t\n\t\t\t
\n\t);\n}","import React from 'react';\nimport SelectInput from './SelectInput';\nimport {IShippingAddress, ISyntheticEvent} from './Helpers/Types';\nimport AddressPreview from './AddressPreview';\nimport {MDBCol, MDBRow} from 'mdbreact';\n\ntype AddressSelectorProps = {\n\tdisabled: boolean,\n\toptions: { text: string, value: string }[],\n\tvalue: string,\n\thandleChange: Function,\n\teditAddress: (type: string) => void,\n\taddress: IShippingAddress,\n\tediting: boolean\n}\n\nexport default function AddressSelector(props: AddressSelectorProps) {\n\n\tconst handleChange = (fieldName: string, value: string) => {\n\t\tprops.handleChange('ShippingAddress', value);\n\t};\n\n\tconst editAddress = (event: ISyntheticEvent, type: string) => {\n\t\tevent.preventDefault();\n\t\tprops.editAddress(type);\n\t};\n\n\treturn (\n\t\t// {FirstName + ' ' + LastName}
\n\t\t\t{Address.Address1 + ' ' + Address.Address2}
\n\t\t\t{Address.City + ', ' + Address.State + ' ' + Address.PostalCode}
\n\t\t\n\t\t<>\n\t\t\t\t\n\t\t\t\t\t\n\t\t\t\t \n\t\t\t\t\n\t\t\t\t\t\n\t\t\t\t\t\n\t\t\t\t \n\t\t\t
\n\t\t\t{props.value !== '' && !props.editing &&\n\n\t\t\t}\n\t\t\n\t\t//
\n\t);\n}","import React from 'react';\nimport SelectInput from './SelectInput';\n\ntype InventorySelectorProps = {\n\tdisabled: boolean,\n\toptions: { text: string, value: string }[],\n\tvalue: string,\n\thandleChange: Function\n}\n\nexport default function InventoryLocationSelector(props: InventorySelectorProps) {\n\n\tconst handleChange = (field: string, value: string) => {\n\t\tprops.handleChange('InventoryLocation', value);\n\t};\n\n\treturn (\n\t\t\t\n\t\t\t{props.value !== '' && !props.editing &&\n
\n\t\t\t\t\n\t\t\t
\n\t);\n}","import {useQuery} from 'react-query';\nimport {client, logout} from './ApiClient';\nimport {mapServiceUrls} from '../Helpers/Functions';\n\nconst getShippingAddresses = (key: any, urls: any, session: string, domain: string, deviceCode: string) => {\n\treturn client(urls.LoyaltyEngineApiUrl, `api/v4/${domain}/${deviceCode}/sessions/${session}/shippingaddresses`);\n}\n\nexport default function useShippingAddress(urls: any, session: string, domain: string, deviceCode: string, disabled: boolean = false) {\n\tconst {status, data, error, isFetching } = useQuery('ShippingAddresses', (key) => getShippingAddresses(key, mapServiceUrls(urls), session, domain, deviceCode), {enabled: urls && !disabled, staleTime: 1000*60*5});\n\tconst shippingAddressesStatus = status;\n\tconst shippingAddresses = data;\n\tconst shippingAddressesError = error;\n\tconst shippingAddressesFetching = isFetching;\n\tif (error === 'Expired key')\n\t\tlogout();\n\treturn {shippingAddressesStatus, shippingAddresses, shippingAddressesError, shippingAddressesFetching};\n}\n","import {useQuery} from 'react-query';\nimport {client, logout} from './ApiClient';\nimport {mapServiceUrls} from '../Helpers/Functions';\n\nconst getInventoryLocationsByUid = (key: any, urls: any, session: string, domain: string, deviceCode: string, uids: Array\n\t\t\t\t{(shippingAddressesStatus === 'loading' || inventoryLocationStatus === 'loading') &&\n \n\t\t\t\t\t\t\n\t\t\t\t\t\t\t\n\t\t\t\t\t\t\t\t\n\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t\t\t\t\t label={props.config.ShippingAddressSelectionText + ':'}/>\n\t\t\n\t\t\t\t\t\t\t\t \n\t\t\t\t\t\t\t\t{props.isGift && state.OrderType === DeliveryType.Ship &&\n\t\t\t\t\t\t\t\t\t\n\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t{!props.isGift &&\n\t\t\t\t\t\t\t\t\t<>\n\t\t\t\t\t\t\t\t\t\t curr.Uid === state.ShippingAddressUid)}\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t editing={editAddress}\n\t\t\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t\t\t\n\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t \n\t\t\t\t\t\t\t
\n\t\t\t\t\t\t\t{editAddress && !props.isGift &&\n\t\t\t\t\t\t\t curr.Uid === state.ShippingAddressUid)}\n\t\t\t\t\t\t\t\t\t toggleEdit={toggleEditAddress}/>\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t{(!editAddress || props.isGift) && props.config.InventoryLocationUids.length !== 0 &&\n\t\t\t\t\t\t\t<>\n\t\t\t\t\t\t\t\t
\n\t\t\t\t\t\t\t\t\n\t\t\t\t\t\t\t\t\t\n\t\t\t\t\t\t\t\t\t\t} label={props.config.PickupLocationSelectionText + ':'}/>\n\t\t\t\t\t\t\t\t\t \n\t\t\t\t\t\t\t\t\t\n\t\t\t\t\t\t\t\t\t\t\n\t\t\t\t\t\t\t\t\t \n\t\t\t\t\t\t\t\t \n\t\t\t\t\t\t\t\n\t\t\t\t\t\t\t}\n\t\t\n\t\t\t\t\t\t \n\t\t\t\t\t \n\t\t\t\t}\n\t\t\t\t{shippingAddressesStatus === 'success' && shippingPreferenceType === ShippingPreferenceType.Shipping &&\n\t\t\t\t\t<>\n\t\t\t\t\n\t\t\t\t\t\n\t\t\t\t\t\t \n\t\t\t\t\t\n\t\t\t\t\t\t{props.isGift &&\n\t\t\t\t\t\t\t\n\t\t\t\t\t\t}\n\t\t\t\t\t\t{!props.isGift &&\n\t\t\t\t\t\t\t<>\n\t\t\t\t\t\t\t\t curr.Uid === state.ShippingAddressUid)}\n\t\t\t\t\t\t\t\t\t\t\t\t editing={editAddress}\n\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t\n\t\t\t\t\t\t}\n\t\t\t\t\t \n\t\t\t\t \n\t\t\t\t
\n\t\t\t\t{editAddress && !props.isGift &&\n\t\t\t\t curr.Uid === state.ShippingAddressUid)}\n\t\t\t\t\t\t toggleEdit={toggleEditAddress}/>\n\t\t\t\t}\n\t\t\t\t\n\t\t\t\t}\n\t\t\t\t{shippingAddressesStatus === 'success' && shippingPreferenceType === ShippingPreferenceType.Pickup &&\n\t\t\t\t\n\t\t\t\t\t\n\t\t\t\t\t\t \n\t\t\t\t\t\n\t\t\t\t\t\t\n\t\t\t\t\t \n\t\t\t\t \n\t\t\t\t}\n\n\t\t\t\t\t
\n\t\t\tRefreshing...
\n\t\t\t\t}\n\t\t\t\t{(shippingAddressesStatus === 'success' || props.isGift) && shippingPreferenceType === ShippingPreferenceType.Option &&\n\t\t\t\t\t\n\t\t\t\t\t\t\t{editAddress && !props.isGift &&\n\t\t\t\t\t\t\t curr.Uid === state.ShippingAddressUid)}\n\t\t\t\t\t\t\t\t\t toggleEdit={toggleEditAddress}/>\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t{(!editAddress || props.isGift) && props.config.InventoryLocationUids.length !== 0 &&\n\t\t\t\t\t\t\t<>\n\t\t\t\t\t\t\t\t
\n\t\t\t\t\t\t\t\t
{props.config.ShippingAddressSelectionText + ':'}
\n\n\t\t\t\t\t\n\t\t\t\t{editAddress && !props.isGift &&\n\t\t\t\t curr.Uid === state.ShippingAddressUid)}\n\t\t\t\t\t\t toggleEdit={toggleEditAddress}/>\n\t\t\t\t}\n\t\t\t\t\n\t\t\t\t}\n\t\t\t\t{shippingAddressesStatus === 'success' && shippingPreferenceType === ShippingPreferenceType.Pickup &&\n\t\t\t\t
{props.config.PickupLocationSelectionText + ':'}
\n\t\t\t\t\t\n\t\t\t{!editAddress &&\n <>\n \n \n \n\t\t\t}\n\t\t\t{(shippingAddressesError || inventoryLocationError) &&\n
{shippingAddressesError ? shippingAddressesError : inventoryLocationError}
\n\t\t\t}\n\t\t\n\t);\n}","import {queryCache, useMutation} from 'react-query';\nimport {client} from './ApiClient';\nimport {PaymentType} from '../Helpers/Types';\n\nconst savePaymentMethod = ({urls, session, domain, deviceCode, paymentType, title, creditCard, giftCard, isPrimary, paymentMethodUid}: { urls: any; session: string; domain: string; deviceCode: string; paymentType: PaymentType; title: string; creditCard: any; giftCard: any; isPrimary: boolean; paymentMethodUid: string | null }) => {\n return client(urls.LoyaltyEngineApiUrl, `api/v4/${domain}/${deviceCode}/sessions/${session}/paymentmethods/commands/save`, {\n body: {\n CreditCard: creditCard,\n GiftCard: giftCard,\n IsPrimary: isPrimary,\n PaymentType: paymentType,\n Title: title,\n PaymentMethodUid: paymentMethodUid\n }\n });\n}\n\nexport default function useSavePaymentMethod() {\n // @ts-ignore\n return useMutation(savePaymentMethod, {\n onMutate: ({ paymentType, title, creditCard, giftCard, isPrimary, paymentMethodUid}: { urls: any; session: string; domain: string; deviceCode: string; paymentType: PaymentType; title: string; creditCard: any; giftCard: any; isPrimary: boolean; paymentMethodUid: string | null; }) => {\n // @ts-ignore\n const previousMethods = queryCache.getQueryData('PaymentMethods')\n queryCache.setQueryData('PaymentMethods', (old: any) => {\n let isNew = true;\n const updated = old.data.map((curr: any) => {\n if (curr.Uid === paymentMethodUid) {\n isNew = false;\n return {\n CreditCard: creditCard,\n GiftCard: giftCard ? {\n CardMask: giftCard.CardNumber\n } : undefined,\n IsPrimary: isPrimary,\n PaymentType: paymentType,\n Title: title,\n Uid: paymentMethodUid\n }\n }\n return curr\n })\n if (isNew)\n return {\n ...old, data: [...updated, {\n CreditCard: creditCard,\n GiftCard: giftCard ? {\n CardMask: giftCard.CardNumber\n } : undefined,\n IsPrimary: isPrimary,\n PaymentType: paymentType,\n Title: title,\n Uid: paymentMethodUid\n }]\n }\n\n return {...old, data: updated}\n })\n\n return () => queryCache.setQueryData('PaymentMethods', previousMethods);\n },\n onSuccess: () => {\n queryCache.invalidateQueries('PaymentMethods')\n },\n onError: (err, data, rollback: Function) => rollback()\n })\n}","import React, {Fragment, SyntheticEvent, useEffect, useMemo, useState} from 'react';\nimport LoadingSpinner from \"../LoadingSpinner\";\nimport useCountries from \"../Utils/UseCountries\";\nimport useStates from \"../Utils/UseStates\";\nimport {doesCountryHaveStates} from \"../Helpers/Functions\";\nimport {useSnippetContext} from \"../Utils/UseSnippetContext\";\nimport {useAuth} from \"../Utils/UseAuth\";\nimport useServiceUrls from \"../Utils/UseServiceUrls\";\nimport {ICountry, IState} from \"../Helpers/Types\";\nimport TextInput from \"../TextInput\";\nimport SelectInput from \"../SelectInput\";\nimport {useDeviceSessionContext} from \"../Utils/UseDeviceSessionProfileContext\";\nimport {use} from \"msw/lib/types/utils/internal/requestHandlerUtils\";\n\ntype BillingAddressFormProps = {\n payment: any\n next: (street: string, street2: string, city: string, state: string, zip: string, country: string, name: string) => void\n prev: Function\n}\n\nexport default function BillingAddressForm(props: BillingAddressFormProps) {\n // @ts-ignore\n const {profile} = useDeviceSessionContext()\n // @ts-ignore\n const { domain, deviceCode } = useSnippetContext();\n // @ts-ignore\n const { session, setSession, customer } = useAuth();\n const { serviceUrls } = useServiceUrls(domain);\n const [street, setStreet] = useState(props.payment?.CreditCard?.BillingAddress1 ?? '')\n const [street2, setStreet2] = useState(props.payment?.CreditCard?.BillingAddress2 ?? '')\n const [city, setCity] = useState(props.payment?.CreditCard?.BillingCity ?? '')\n const [state, setState] = useState(props.payment?.CreditCard?.BillingState ?? '')\n const [zip, setZip] = useState(props.payment?.CreditCard?.BillingPostalCode ?? '')\n const [country, setCountry] = useState(props.payment?.CreditCard?.BillingCountry ?? profile?.DefaultCountry ?? '')\n const [name, setName] = useState(props.payment?.CreditCard?.BillingName ?? '')\n const { countries, countriesStatus } = useCountries(serviceUrls, domain, deviceCode);\n const { states } = useStates(serviceUrls, domain, deviceCode, country, countries && doesCountryHaveStates(countries, country));\n \n const countryOptions = useMemo(() => countries?.map((c: ICountry) => { return {text: c.Name, value: c.Code}}), [countries])\n const stateOptions = useMemo(() => states?.map((s: IState) => { return {text: s.Name, value: s.Code}}), [states])\n const countryHasStates = useMemo(() => doesCountryHaveStates(countries, country), [country])\n \n useEffect(() => {\n if ((country === null || country === '') && profile)\n setCountry(profile.DefaultCountry)\n }, [profile])\n \n const submit = (e: SyntheticEvent) => {\n e.preventDefault()\n props.next(street, street2, city, state, zip, country, name)\n }\n \n const prev = (e: SyntheticEvent) => {\n e.preventDefault()\n props.prev()\n }\n \n const handleChange = (field: string, value: string) => {\n switch (field) {\n case 'BillingName':\n setName(value)\n break;\n case 'BillingAddress':\n setStreet(value)\n break;\n case 'BillingAddress2':\n setStreet2(value)\n break;\n case 'BillingCity':\n setCity(value)\n break;\n case 'BillingState':\n setState(value)\n break;\n case 'BillingZip':\n setZip(value)\n break;\n case 'BillingCountry':\n setCountry(value)\n break;\n }\n }\n \n const copyFromCustomer = () => {\n setName(`${customer?.FirstName === null ? '' : customer?.FirstName === undefined ? '' : customer.FirstName} ${customer?.LastName === null ? '' : customer?.LastName === undefined ? '' : customer.LastName}`)\n setStreet(customer.Address.Address1)\n setStreet2(customer.Address.Address2)\n setCity(customer.Address.City)\n setState(customer.Address.State)\n setZip(customer.Address.PostalCode)\n setCountry(customer.Address.Customer)\n }\n \n return (\n <>\n {countriesStatus === 'loading' &&\n
\n }\n Billing Address
\n\n \n \n \n \n \n \n \n }\n
\n \n \n \n \n )\n}","import React, {useEffect, useMemo, useState} from 'react';\nimport Iframe from 'react-iframe';\nimport {useAuth} from \"./Utils/UseAuth\";\nimport {useSnippetContext} from \"./Utils/UseSnippetContext\";\nimport useServiceUrls from \"./Utils/UseServiceUrls\";\n\ntype UsaePayAddCreditCardFrameProps = {\n\tsavePayment: Function,\n\tpaymentFormUrl: string\n}\n\nexport default function UsaePayAddCreditCardFrame(props: UsaePayAddCreditCardFrameProps) {\n\t// @ts-ignore\n\tconst { session } = useAuth();\n\t// @ts-ignore\n\tconst { redirectToHome, domain } = useSnippetContext()\n\tconst {serviceUrls} = useServiceUrls(domain)\n\tconst [cardSaved, setCardSaved] = useState(false)\n\t\n\t// Removing the trailing '/' because usaepay does not parse the query parameters properly with it on the url\n\tconst url = useMemo(() => {\n\t\tlet formUrl = props.paymentFormUrl\n\t\twhile (formUrl.charAt(formUrl.length - 1) === '/')\n\t\t\tformUrl = formUrl.substr(0, formUrl.length - 1)\n\t\t\n\t\treturn formUrl\n\t}, [props.paymentFormUrl])\n\t\n\tconst snippetUrl = useMemo(() => {\n\t\tconst serverUrl = serviceUrls?.WebSnippetsApiUrl\n\t\treturn serverUrl.toLowerCase().replace('https://websnippets', 'https://snippets')\n\t}, [serviceUrls])\n\t\n\tconst redirectUrl = useMemo(() => {\n\t\treturn `${snippetUrl}/snippetredirect?blSessionKey=${session}`\n\t}, [snippetUrl])\n\t\n\tconst readMessage = (event: any) => {\n\t\t// IMPORTANT: check the origin of the data!\n\t\tif (event.origin === snippetUrl) {\n\t\t\ttry {\n\t\t\t\tconst data = JSON.parse(event.data)\n\t\t\t\tif (data?.Token !== undefined) {\n\t\t\t\t\tif (!cardSaved) {\n\t\t\t\t\t\tprops.savePayment(data.Token, data.CardNumber, data.CardType)\n\t\t\t\t\t\tsetCardSaved(true)\n\t\t\t\t\t}\n\t\t\t\t}\n\t\t\t} catch (e) {\n\t\t\t\tconsole.log(e)\n\t\t\t}\n\t\t}\n\t\treturn;\n\t}\n\t\n\tconst delayedReadMessage = (event: any) => {\n\t\tsetTimeout(() => readMessage(event), 600)\n\t}\n\n\tuseEffect(() => {\n\t\twindow.addEventListener('message', delayedReadMessage);\n\t\treturn () => {\n\t\t\twindow.removeEventListener('message', delayedReadMessage, false);\n\t\t};\n\t}, []);\n\n\t// const checkRef = () => {\n\t// \tsetRefCheckCounter(refCheckCounter + 1)\n\t//\t\n\t// \tif (refCheckCounter === 0)\n\t// \t\treturn;\n\t// \tconst iframe = document?.getElementsByTagName('iframe')[0];\n\t// \tif (iframe === undefined || iframe === null)\n\t// \t\treturn\n\t//\t\n\t// \ttry {\n\t// \t\t// @ts-ignore\n\t// \t\tconst location = iframe.contentWindow.location\n\t// \t\tif (location !== null) {\n\t// \t\t\tconst queryString = require('query-string')\n\t// \t\t\tconst parsed = queryString.parse(location.search)\n\t// \t\t\tlet cardType = parsed.UMcardType;\n\t// \t\t\tcardType = mapCreditCardType(cardType);\n\t// \t\t\tprops.savePayment( parsed.UMcardRef, parsed.UMmaskedCardNum, cardType)\n\t// \t\t}\n\t// \t} catch (err) {\n\t// \t\tconsole.error(err)\n\t// \t}\n\t// };\n\t\n\tif (props.paymentFormUrl === '')\n\t\treturn (\n\t\t\t
The payment provider is unavailable
\n\t\t)\n\n\treturn (\n\t\t\n\t\t\t{redirectUrl &&\n\t\t\t\t<>\t\n\t\t\t\t\t{/*@ts-ignore*/}\n\t\t\t\t\t
\n\t);\n}","import React, {useState} from 'react';\nimport BillingAddressForm from \"./BillingAddressForm\";\nimport UsaePayAddCreditCardFrame from \"../UsaePayAddCreditCardFrame\";\n\ntype UsaepayFormProps = {\n back: Function\n paymentFormUrl: string\n savePayment: Function\n payment: any\n includeBillingAddress: boolean\n}\n\nexport default function UsaepayForm(props: UsaepayFormProps) {\n const [step, setStep] = useState(props.includeBillingAddress ? 1 : 2)\n const [billingAddress, setBillingAddress] = useState({})\n \n const next = (street: string, street2: string, city: string, state: string, zip: string, country: string, name: string) => {\n setBillingAddress({\n BillingName: name,\n BillingAddress1: street,\n BillingAddress2: street2,\n BillingCity: city,\n BillingState: state,\n BillingPostalCode: zip,\n BillingCountry: country\n })\n setStep(2)\n }\n\n const savePayment = (token: string, cardNumber: string, cardType: string) => {\n props.savePayment(token, cardNumber, cardType, billingAddress)\n }\n \n const prev = () => {\n props.back()\n }\n \n return (\n <>\n {step === 1 && \n
\n )\n\n}","import React, {SyntheticEvent, useEffect, useMemo, useState} from 'react';\nimport {set} from \"msw/lib/types/context\";\nimport BillingAddressForm from \"./BillingAddressForm\";\nimport UsaePayAddCreditCardFrame from \"../UsaePayAddCreditCardFrame\";\nimport CardConnectAddCreditCardFrame from \"./CardConnectAddCreditCardFrame\";\nimport {Save} from \"@mui/icons-material\";\n\ntype CardConnectFormProps = {\n savePayment: Function\n back: Function\n paymentFormUrl: string\n cardNumberLabel?: string\n cvvLabel?: string\n expirationLabel?: string\n payment: any\n includeBillingAddress: boolean\n}\n\nexport default function CardConnectForm(props: CardConnectFormProps) {\n const [step, setStep] = useState(props.includeBillingAddress ? 1 : 2)\n const [billingAddress, setBillingAddress] = useState({})\n\n const next = (street: string, street2: string, city: string, state: string, zip: string, country: string, name: string) => {\n setBillingAddress({\n BillingName: name,\n BillingAddress1: street,\n BillingAddress2: street2,\n BillingCity: city,\n BillingState: state,\n BillingPostalCode: zip,\n BillingCountry: country\n })\n setStep(2)\n }\n\n const savePayment = (token: string, cardNumber: string, cardType: string) => {\n props.savePayment(token, cardNumber, cardType, billingAddress)\n }\n\n const prev = () => {\n props.back()\n }\n \n return (\n <>\n {step === 1 && Once your information is entered the form will automatically save your payment method.
\n \n \n {saving &&Please make sure you have entered your card details properly.
}\n\n\t\t\t
\n\t);\n}","import React from 'react';\nimport {Dialog, DialogActions, DialogTitle} from '@material-ui/core';\nimport AddPaymentDetails from './AddPaymentDetails';\nimport {BillingAddress, IPaymentType} from \"./Helpers/Types\";\n\ntype PaymentModalProps = {\n\tclose: () => void\n\tsavePayment: (title: string) => void\n\tsaveCreditPayment: (token: string, cardNumber: string, cardType: string, isPrimary: boolean, title: string, billingAddress: BillingAddress) => void\n\tpayment: any\n\tpaymentTypeList: Array\n\t\t\t\t{!showCreditCard &&\n\t\t\t\t<>\n\t\t\t\t\t\n\t\t\t\t\t\n\t\t\t\t\t\n\t\t\t\t\t\t \n\t\t\t\t\n\t\t\t\t}\n\t\t\t\t{paymentType === PaymentType.GiftCard &&\n\t\t\t\t<>\n\t\t\t\t\t\n\t\t\t\t\t
\n\t\t\t\t\t\n\t\t\t\t\n\t\t\t\t}\n\t\t\t\t{paymentType === PaymentType.CreditCard && !showCreditCard &&\n\t\t\t\t\n\t\t\t\t}\n\t\t\t\t{showCreditCard &&\n\t\t\t\t\t<>\n\t\t\t\t\t\t{deviceSessionProfile.PaymentProviderUid.toLowerCase() === CardConnectProviderUid &&\n\t\t\t\t\t\t\t setShowCreditCard(false)} includeBillingAddress={props.includeBillingAddress}/>\n\t\t\t\t\t\t}\n\t\t\t\t\t\t{deviceSessionProfile.PaymentProviderUid.toLowerCase() === UsaePayProviderUid &&\n\t\t\t\t\t\t\t setShowCreditCard(false)} includeBillingAddress={props.includeBillingAddress}/>\n\t\t\t\t\t\t}\n\t\t\t\t\t\t{deviceSessionProfile.PaymentProviderUid === null &&
\n\t\t\n\t\t\t\t\t\n\t\t\t\t\n\t\t\t\t}\n\t\t\t\t{paymentType === PaymentType.CreditCard && !showCreditCard &&\n\t\t\t\t\n\t\t\t\t}\n\t\t\t\t{showCreditCard &&\n\t\t\t\t\t<>\n\t\t\t\t\t\t{deviceSessionProfile.PaymentProviderUid.toLowerCase() === CardConnectProviderUid &&\n\t\t\t\t\t\t\t
No payment provider found.
}\n\t\t\t\t\t\n\t\t\t\t}\n\t\t\t\n\t\t\t
\n\t);\n}","import {queryCache, useMutation} from 'react-query';\nimport {client} from './ApiClient';\n\nconst deletePaymentMethod = ({urls, session, domain, deviceCode, paymentUid}: {urls: any; session: string; domain: string; deviceCode: string; paymentUid: string}) => {\n\treturn client(urls.LoyaltyEngineApiUrl, `api/v4/${domain}/${deviceCode}/sessions/${session}/PaymentMethods/${paymentUid}`, {\n\t\tcustomConfig: {\n\t\t\tmethod: 'DELETE'\n\t\t}\n\t});\n}\n\nexport default function useDeletePaymentMethod() {\n\t// @ts-ignore\n\treturn useMutation(deletePaymentMethod, {\n\t\tonMutate: ({paymentUid}: {urls: any; session: string; domain: string; deviceCode: string; paymentUid: string}) => {\n\t\t\t// @ts-ignore\n\t\t\tconst previousPayments = queryCache.getQueryData('PaymentMethods')\n\t\t\tqueryCache.setQueryData('PaymentMethods', (old: any) => {\n const updated = old.data.filter((curr: any) => curr.Uid !== paymentUid)\n return {...old, data: updated }\n })\n\t\t\treturn () => queryCache.setQueryData('PaymentMethods', previousPayments);\n\t\t},\n\t\tonSuccess: () => {\n\t\t\tqueryCache.invalidateQueries('PaymentMethods')\n\t\t},\n\t\tonError: (err, data, rollback: Function) => rollback()\n\t})\n}","import React, {useEffect, useState} from 'react';\nimport {BillingAddress, ICustomer, IPaymentData, ISyntheticEvent, PaymentSource, PaymentType} from './Helpers/Types';\nimport PaymentModal from './PaymentModal';\nimport SelectInput from './SelectInput';\nimport {useAuth} from './Utils/UseAuth';\nimport {useSnippetContext} from './Utils/UseSnippetContext';\nimport useServiceUrls from './Utils/UseServiceUrls';\nimport usePaymentMethods from './Utils/UsePaymentMethods';\nimport PaymentMethodPreview from './PaymentMethodPreview';\nimport LoadingSpinner from './LoadingSpinner';\nimport {MDBCol, MDBRow} from 'mdbreact';\nimport useSavePaymentMethod from \"./Utils/UseSavePaymentMethod\";\nimport {isInViewport, mapServiceUrls} from \"./Helpers/Functions\";\nimport useDeletePaymentMethod from \"./Utils/UseDeletePaymentMethod\";\nimport {v4 as uuid} from 'uuid';\n\ntype PaymentEditorProps = {\n\tupdateField: (field: string, value: any) => void\n\tpayment: IPaymentData\n\tnextStep: (e: ISyntheticEvent) => void\n\tprevStep: (e: ISyntheticEvent) => void\n\tconfig: any\n\tsponsor: ICustomer | null\n\tsponsoredPayment?: IPaymentData\n\tisGift?: boolean\n}\n\nexport default function PaymentEditor(props: PaymentEditorProps) {\n\t// @ts-ignore\n\tconst { session } = useAuth();\n\t// @ts-ignore\n\tconst { domain, deviceCode } = useSnippetContext();\n\tconst [savePaymentMethod, {status: saveStatus, error: saveError, data}] = useSavePaymentMethod();\n\tconst [deletePaymentMethod, { status, error}] = useDeletePaymentMethod();\n\tconst { serviceUrls } = useServiceUrls(domain);\n\tconst { paymentMethodsStatus, paymentMethods, paymentMethodsError, paymentMethodsFetching } = usePaymentMethods(serviceUrls, session, domain, deviceCode);\n\tconst [paymentOptions, setPaymentOptions] = useState{Title}
\n\t\t\t{PaymentType === 'CreditCard' &&\n\t\t\t\t<>\n\t\t\t\t{\n\t\t\t\t\tCreditCard.CardType !== CreditCardType.Unknown && CreditCard.Cardmask !== null &&\n\t\t\t\t\t\t{`${CreditCard.CardType} ${CreditCard.CardMask}`}
\n\t\t\t\t}\n\t\t\t\t\n\t\t\t}\n\t\t\t{PaymentType === 'GiftCard' &&\n\t\t\t{GiftCard.CardMask}
\n\t\t\t}\n\t\t\n\t\t\t\t\t
\n\t\t\t\t\t
\n\t\t\t\t
\n\t\t\t
\n\t\t\t\t\t
\n\t\t\t\t\t
\n\t\t\t
{props.config.SuccessMessage ? props.config.SuccessMessage : \"Thank you!\"}
\n\t\t\t\n\t\t);\n\t}\n\n\tconst mapFullPage = (page: IWizardPage, index: number) => {\n\t\treturn (\n\t\t\t\n\t\t\t\t\t\t{page.Title}\n\t\t\t\t\t
\n\t\t\t\t\t\n\t\t\t\t\t\t{page.Title}\n\t\t\t\t\t
\n\n\t\t\t\t\t{page.Title}
\n\t\t\t\t\t\n\t\t\t\t\t\t{page.Title}\n\t\t\t\t\t
\n\t\t\t\t\t\n\t\t\t\t\t\t{page.Title}\n\t\t\t\t\t
\n\t\t\t\t\t\n\t\t\t\t\t\t{page.Title}\n\t\t\t\t\t
\n\n\t\t\t\t\t\n\t\t\t{/*@ts-ignore*/}\n\t\t\t\n\t\t\t\t{width > 550 ?\n\t\t\t\t\t\n\t\t\t\t\t\t{props.pageMap.map((page: IWizardPage) => (\n\t\t\t\t\t\t\t// @ts-ignore\n\t\t\t\t\t\t\t\n\t\t\t\t\t\t\t\t{page.Title} \n\t\t\t\t\t\t\t \n\t\t\t\t\t\t))}\n\t\t\t\t\t : null}\n\t\t\t\t{width <= 550 ?\n\t\t\t\t\t\n\t\t\t\t\t\t{props.pageMap.map((page: IWizardPage) => (\n\t\t\t\t\t\t\t// @ts-ignore\n\t\t\t\t\t\t\t\n\t\t\t\t\t\t\t\t{page.Title} \n\t\t\t\t\t\t\t \n\t\t\t\t\t\t))}\n\t\t\t\t\t : null}\n\t\t\t \n\t\t\t{props.pageMap.map(mapFullPage)}\n\t\t\t{joinError !== '' && \n\t\t\t<>\n\t\t\t\t
\n\t);\n};","import React, {useEffect, useState} from 'react';\nimport {logout} from './Utils/AuthClient';\nimport useClubMembership from './Utils/UseClubMembership';\nimport {useAuth} from './Utils/UseAuth';\nimport {useSnippetContext} from './Utils/UseSnippetContext';\nimport useServiceUrls from './Utils/UseServiceUrls';\nimport {\n\tDeliveryType,\n\tISyntheticEvent,\n\tIWizardFormData,\n\tIWizardPage,\n\tMembershipType,\n\tPaymentSource,\n\tProductPreferenceType\n} from './Helpers/Types';\nimport ClubMembershipType from './ClubMembershipType';\nimport ClubSignupWizard from './ClubSignupWizard';\nimport LoadingSpinner from './LoadingSpinner';\n\ntype ClubManagementProps = {\n\tsnippetConfig: any,\n}\n\nexport default function ClubManagement(props: ClubManagementProps) {\n\t// @ts-ignore\n\tconst { session, customer } = useAuth();\n\t// @ts-ignore\n\tconst { domain, deviceCode, clubCode } = useSnippetContext();\n\tconst { serviceUrls } = useServiceUrls(domain);\n\tconst [isClubError, setClubError] = useState(false);\n\t\n\tconst club = clubCode === '' && props.snippetConfig.Clubs.length === 1 ? props.snippetConfig.Clubs[0] : props.snippetConfig.Clubs.find((club: any) => club.Code.toLowerCase() === clubCode.toLowerCase());\n\t// @ts-ignore\n\tconst [type, setType] = useState{joinError}
\n\t\t\t\t\n\t\t\t\n\t\t\t}\n\t\tClub signup is not available at this time
{props.snippetConfig.SnippetConfigurationErrorMessage}
)\n\n\tconst changeType = (type: MembershipType) => {\n\t\tsetType(type);\n\t};\n\n\tconst nextStep = (e: ISyntheticEvent) => {\n\t\te.preventDefault();\n\t\tsetIsTypeSet(true);\n\t};\n\n\tconst backToTypeSelection = () => {\n\t\tsetIsTypeSet(false);\n\t};\n\n\tif (isTypeSet && !club) {\n\t\talert(`This snippet is not available for club ${clubCode}.`)\n\t}\n\n\tif (props.snippetConfig.GiftMembershipsEnabled)\n\t\treturn <>\n\t\t\t{!isTypeSet &&\n \n\t\t\t}\n\t\t\t{membershipStatus === 'loading' &&\nPlease check your configuration or integration.
\n\t\t\t}\n\t\t\t{membershipError &&\n{membershipError}
\n\t\t\t}\n\t\t\n\telse\n\t\treturn <>\n\t\t\t{membershipStatus === 'loading' &&\n{membershipError}
\n\t\t\t}\n\t\t;\n}","\n\nimport { useMutation} from 'react-query';\nimport {client} from './ApiClient';\n\nconst referCustomer = ({urls, domain, deviceCode, sessionKey, email, firstName, lastName, message}: {urls: any; domain: string; deviceCode: string; sessionKey: string; email: string; firstName: string; lastName: string; message: string;}) => {\n return client(urls.LoyaltyEngineApiUrl, `api/v4/${domain}/${deviceCode}/sessions/${sessionKey}/customerreferrals/commands/refer`, {\n body: {\n EmailAddress: email,\n FirstName: firstName,\n LastName: lastName,\n Message: message\n }\n });\n}\n\nexport default function useReferCustomer() {\n // @ts-ignore\n return useMutation(referCustomer)\n}","import React, {useEffect, useState} from 'react';\nimport {ISyntheticEvent, SnippetTheme} from './Helpers/Types';\nimport {TextField} from '@material-ui/core';\nimport {useStyleContext} from \"./Utils/UseStyleContext\";\n\ntype MultilineTextFieldProps = {\n\tid: string,\n\tvalue: string,\n\tlabel: string,\n\tgetValue?: (value: string) => void\n\thandleChange?: (fieldName: string, value: string) => void\n\trequired?: boolean,\n\tdisabled?: boolean\n}\n\nexport default function MultilineTextInput(props: MultilineTextFieldProps) {\n\tconst [value, setValue] = useState(props.value);\n\t// @ts-ignore\n\tconst {theme} = useStyleContext();\n\t\n\tuseEffect(() => {\n\t\tsetValue(props.value);\n\t}, [props.value])\n\t\n\tconst handleChange = (event: ISyntheticEvent) => {\n\t\tevent.preventDefault();\n\t\tsetValue(event.target.value);\n\t\tprops.getValue?.(event.target.value);\n\t\tprops.handleChange?.(props.id, event.target.value);\n\t};\n\t\n\tswitch (theme) {\n\t\tcase SnippetTheme.MaterialUI:\n\t\t\treturn (\n\t\t\t\t