\r\n
\r\n \r\n );\r\n}\r\n\r\nconst ModalHeader = ({ closeModal }) => (\r\n \r\n \r\n {\" \"}\r\n We Help You Find The Right Size{\" \"}\r\n \r\n \r\n ×\r\n \r\n
\r\n);\r\n\r\nconst ModalBody = ({\r\n findYourFitResult,\r\n setFindYourFitResult,\r\n measurements,\r\n setMeasurementValues,\r\n measurementValues,\r\n WeHelpYouFindTheBestFit,\r\n DicFindYourFit,\r\n setOpen,\r\n productId,\r\n isLogged,\r\n token,\r\n customerToken,\r\n}) => {\r\n const [errorMessage, setErrorMessage] = useState(\"\");\r\n\r\n const handleInputChange = (id, value) => {\r\n const sizeChartValue = value.trim();\r\n setMeasurementValues((prevValues) => {\r\n const existingValueIndex = prevValues.findIndex(\r\n (item) => item.measurementAttributeId === id\r\n );\r\n if (sizeChartValue !== \"\") {\r\n if (existingValueIndex !== -1) {\r\n const updatedValues = [...prevValues];\r\n updatedValues[existingValueIndex].sizeChartValue =\r\n parseFloat(sizeChartValue);\r\n return updatedValues;\r\n } else {\r\n return [\r\n ...prevValues,\r\n {\r\n measurementAttributeId: id,\r\n sizeChartValue: parseFloat(sizeChartValue),\r\n },\r\n ];\r\n }\r\n } else {\r\n return prevValues.filter((item) => item.measurementAttributeId !== id);\r\n }\r\n });\r\n };\r\n\r\n const getValue = (id) => {\r\n const measurement = measurementValues.find(\r\n (item) => item.measurementAttributeId === id\r\n );\r\n return measurement ? measurement.sizeChartValue : \"\";\r\n };\r\n const FindYourFit = async () => {\r\n if (measurements.length !== measurementValues.length) {\r\n setErrorMessage(\"Fill all the measurments\");\r\n } else {\r\n const response = await fetch(Global.API_URL + \"FindYourFit\", {\r\n method: \"POST\",\r\n headers: {\r\n Accept: \"application/json\",\r\n \"Content-Type\": \"application/json\",\r\n \"Access-Control-Allow-Origin\": Global.HostAPI,\r\n AuthorizationCustomer: isLogged ? customerToken : token,\r\n countryCode: Cookies.get(\"Country\"),\r\n },\r\n body: JSON.stringify({\r\n productId: productId,\r\n customerInsertedValues: measurementValues,\r\n }),\r\n });\r\n if (!response.ok) {\r\n throw new Error(\"Something went wrong!\");\r\n } else {\r\n const result = await response.json();\r\n setFindYourFitResult(result);\r\n }\r\n }\r\n };\r\n return (\r\n \r\n
\r\n \r\n \r\n );\r\n};\r\n\r\nexport default FindYourFitModal;\r\n","import React, { useState, useEffect } from \"react\";\r\nimport Modal from \"react-modal\";\r\nimport { Tabs, TabList, Tab, TabPanel } from \"react-tabs\";\r\nimport { toast } from \"react-toastify\";\r\nimport { Global } from \"../../../Global\";\r\nimport { useDispatch, useSelector } from \"react-redux\";\r\nimport { useNavigate, useParams } from \"react-router-dom\";\r\nimport {\r\n GetCustomerCart,\r\n setCredential,\r\n} from \"../../../store/slices/credential-slice\";\r\nimport { addAllToCart } from \"../../../store/slices/cart-slice\";\r\nimport { FaRegEye, FaRegEyeSlash, FaApple } from \"react-icons/fa\";\r\nimport ALink from \"../alink\";\r\nimport Cookies from \"js-cookie\";\r\nimport { GoogleOAuthProvider, useGoogleLogin } from \"@react-oauth/google\";\r\nimport { GoogleLogin } from \"@react-oauth/google\";\r\nimport AppleSignin from \"react-apple-signin-auth\";\r\nimport axios from \"axios\";\r\nimport { deleteAllFromCart } from \"../../../store/slices/cart-slice\";\r\nimport { TfiAlert } from \"react-icons/tfi\";\r\nimport { FaCheckCircle } from \"react-icons/fa\";\r\nimport { OtpInput } from \"reactjs-otp-input\";\r\nimport { useRef } from \"react\";\r\nimport { jwtDecode } from \"jwt-decode\";\r\n\r\nconst clientId =\r\n \"1010940463856-5pa4m8b5v81rp5sqa8mtfusndhjaamfk.apps.googleusercontent.com\";\r\n\r\nconst CustomGoogleLoginButton = ({ onSuccess, onFailure }) => {\r\n const login = useGoogleLogin({\r\n onSuccess: (CodeResponse) => {\r\n onSuccess(CodeResponse);\r\n },\r\n onError: (error) => {\r\n onFailure(error);\r\n },\r\n });\r\n\r\n return (\r\n \r\n {/* Display No Result or Results */}\r\n {findYourFitResult.length === 0 ? (\r\n
\r\n )}\r\n\r\n {/* Measurements Section */}\r\n \r\n
\r\n ) : (\r\n \r\n
\r\n \r\n
\r\n Size No Result
\r\n \r\n
\r\n \r\n
\r\n \r\n {findYourFitResult.map((result) => (\r\n \r\n
\r\n ))}\r\n Size {result.SizeName}
\r\n \r\n
\r\n \r\n
\r\n \r\n
\r\n \r\n {WeHelpYouFindTheBestFit}\r\n
\r\n \r\n {measurements.map((measurement) => (\r\n \r\n
\r\n ))}\r\n \r\n {measurement.MeasurementAttributeName}:\r\n
\r\n \r\n \r\n handleInputChange(\r\n measurement.MeasurementAttributeId,\r\n e.target.value\r\n )\r\n }\r\n />\r\n
\r\n \r\n \r\n {measurement.MeasurementAttributeUnit}\r\n \r\n
\r\n \r\n FindYourFit()}\r\n >\r\n {DicFindYourFit}\r\n \r\n
\r\n \r\n ![\"Google](\"/assets/images/google-icon-primary.svg\")
\r\n
\r\n );\r\n};\r\n\r\nconst customStyles = {\r\n overlay: {\r\n backgroundColor: \"rgba(77,77,77,0.6)\",\r\n zIndex: \"9000\",\r\n },\r\n};\r\n\r\nModal.setAppElement(\"body\");\r\n\r\nconst LoginModal = () => {\r\n const navigate = useNavigate();\r\n const dictionary = useSelector((state) => state.dictionary.dictionary);\r\n const guestId = useSelector((state) => state.credential.guestId);\r\n const token = useSelector((state) => state.credential.token);\r\n const customerId = useSelector((state) => state.credential.customerId);\r\n const FirstName = useSelector((state) => state.credential.firstName);\r\n const LastName = useSelector((state) => state.credential.lastName);\r\n const customerToken = useSelector((state) => state.credential.customerToken);\r\n const email = useSelector((state) => state.credential.email);\r\n const customer = useSelector((state) => state.credential.customer);\r\n const { country } = useParams();\r\n let countryCode = country ? country : Cookies.get(\"Country\");\r\n const [open, setOpen] = useState(false);\r\n const [disable, setDisable] = useState(false);\r\n const [showPasswordLogin, setShowPasswordLogin] = useState(false);\r\n const [showPasswordRegister, setShowPasswordRegister] = useState(false);\r\n const [showPasswordConfirm, setShowPasswordConfirm] = useState(false);\r\n const [firstName, setFirstName] = useState(\"\");\r\n const [lastName, setLastName] = useState(\"\");\r\n const [emails, setEmails] = useState(\"\");\r\n const [password, setPassword] = useState(\"\");\r\n const [confirmPassword, setConfirmPassword] = useState(\"\");\r\n const [genders, setGenders] = useState([]);\r\n const [selectedGender, setSelectedGender] = useState(0);\r\n const [isSubscribed, setIsSubscribed] = useState(false);\r\n const [isTerm, setIsTerm] = useState(false);\r\n const [openMerge, setOpenMerge] = useState(false);\r\n const cartlist = useSelector((state) => state.cart.cartItems);\r\n const currency = useSelector((state) => state.currency.currency);\r\n const [guest, setGuest] = useState(\"\");\r\n const [customerDetail, setCustomerDetail] = useState(0);\r\n const [isForget, setIsForget] = useState(false);\r\n const [forgetEmail, setForgetEmail] = useState(\"\");\r\n const [isSent, setIsSent] = useState(false);\r\n const [errorMessage, setErrorMessage] = useState(\"\");\r\n const [successMessage, setSuccessMessage] = useState(\"\");\r\n const [isButtonDisabled, setIsButtonDisabled] = useState(false);\r\n const [timer, setTimer] = useState(0);\r\n const [data, setData] = useState({});\r\n\r\n const [openOTP, setOpenOTP] = useState(false);\r\n const [otp, setOtp] = useState(\"\");\r\n const [otpDeviceKey, setOtpDeviceKey] = useState(\"\");\r\n\r\n const dispatch = useDispatch();\r\n const handleOTPChange = (otp) => setOtp(otp);\r\n\r\n const handleChange = (event) => {\r\n setSelectedGender(parseInt(event.target.value));\r\n };\r\n\r\n const SendEmail = async () => {\r\n setErrorMessage(\"\");\r\n setSuccessMessage(\"\");\r\n if (forgetEmail.trim() === \"\") {\r\n setErrorMessage(\"Enter Valid Email\");\r\n } else {\r\n const response = await fetch(\r\n Global.API_URL + \"Customer/SendForgetPasswordEmailURL\",\r\n {\r\n method: \"POST\",\r\n headers: {\r\n Accept: \"application/json\",\r\n \"Content-Type\": \"application/json\",\r\n \"Access-Control-Allow-Origin\": Global.HostAPI,\r\n CountryCode: countryCode,\r\n },\r\n body: JSON.stringify({\r\n forgetPasswordEmail: forgetEmail.trim().toLowerCase(),\r\n languageId: Cookies.get(\"Language\"),\r\n }),\r\n }\r\n );\r\n const result = await response.json();\r\n if (response.ok) {\r\n if (result.Code === 0) {\r\n setSuccessMessage(result.Message);\r\n setForgetEmail(\"\");\r\n } else {\r\n setErrorMessage(result.Message);\r\n setIsSent(true);\r\n setIsButtonDisabled(true);\r\n setTimer(60);\r\n }\r\n } else {\r\n if (result.Message) {\r\n setErrorMessage(result.Message);\r\n setIsSent(true);\r\n setIsButtonDisabled(true);\r\n setTimer(60);\r\n } else {\r\n setErrorMessage(result);\r\n setIsSent(true);\r\n setIsButtonDisabled(true);\r\n setTimer(60);\r\n }\r\n }\r\n }\r\n };\r\n\r\n const isRegisterValid =\r\n firstName.trim() !== \"\" &&\r\n lastName.trim() !== \"\" &&\r\n emails.trim() !== \"\" &&\r\n password.trim() !== \"\";\r\n\r\n const isLoginValid = emails.trim() !== \"\" && password.trim() !== \"\";\r\n const isValidEmail = emails.includes(\".\") && emails.includes(\"@\");\r\n\r\n const Register = async (e) => {\r\n e.preventDefault();\r\n if (!isRegisterValid) {\r\n toast.error(\"Fill all required fields\", {\r\n theme: \"light\",\r\n });\r\n } else if (!isValidEmail) {\r\n toast.error(\"Enter a valid email\", {\r\n theme: \"light\",\r\n });\r\n } else if (password !== confirmPassword) {\r\n toast.error(\"Confirm password does not match the original password.\", {\r\n theme: \"light\",\r\n });\r\n } else if (!isTerm) {\r\n toast.error(\r\n \"Accept the terms and conditions to proceed with completing the registration\",\r\n {\r\n theme: \"light\",\r\n }\r\n );\r\n } else {\r\n setDisable(true);\r\n const referralCode = \"\";\r\n const respose = await fetch(\r\n Global.API_URL + \"Customer/RegisterCustomer\",\r\n {\r\n method: \"POST\",\r\n headers: {\r\n Accept: \"application/json\",\r\n \"Content-Type\": \"application/json\",\r\n \"Access-Control-Allow-Origin\": Global.HostAPI,\r\n CountryCode: countryCode,\r\n },\r\n body: JSON.stringify({\r\n languageId: Cookies.get(\"Language\"),\r\n firstName: firstName,\r\n lastName: lastName,\r\n email: emails.trim().toLowerCase(),\r\n password: password,\r\n genderID: selectedGender,\r\n loginTypeId: 1,\r\n guestId: guestId,\r\n isSubscribed: isSubscribed,\r\n referralCode: referralCode,\r\n idToken: \"\",\r\n deviceToken: \"\",\r\n deviceType: 0,\r\n }),\r\n }\r\n );\r\n const customerData = await respose.json();\r\n if (customerData.Code === 0) {\r\n toast.success(customerData.Message, {\r\n theme: \"light\",\r\n });\r\n if (window.snaptr) {\r\n window.snaptr(\"track\", \"SIGN_UP\", {\r\n sign_up_method: \"sheyaaka register\",\r\n uuid_c1: guestId,\r\n user_email: emails,\r\n user_phone_number: \"\",\r\n });\r\n console.log(\"SIGN_UP\");\r\n }\r\n if (typeof window !== \"undefined\" && window.gtag) {\r\n window.gtag(\"event\", \"sign_up\", {\r\n method: \"sheyaaka register\",\r\n });\r\n }\r\n setEmails(\"\");\r\n setPassword(\"\");\r\n setFirstName(\"\");\r\n setLastName(\"\");\r\n setConfirmPassword(\"\");\r\n setGenders(0);\r\n setIsSubscribed(false);\r\n setIsTerm(false);\r\n closeModal();\r\n } else {\r\n toast.error(customerData.Message, {\r\n theme: \"light\",\r\n });\r\n }\r\n setDisable(false);\r\n }\r\n };\r\n const closeMergeModal = async () => {\r\n dispatch(setCredential(data));\r\n dispatch(deleteAllFromCart());\r\n setOpenMerge(false);\r\n };\r\n\r\n useEffect(() => {\r\n window.AppleID.auth.init({\r\n clientId: \"com.sheyaaka.sheyaaka.web\", // Replace with your Apple Client ID\r\n scope: \"email name\",\r\n redirectURI: Global.redirectURI, // Your redirect URI\r\n state: \"your_custom_state\",\r\n usePopup: true, // To avoid redirection\r\n });\r\n }, []);\r\n\r\n const handleAppleLogin = async () => {\r\n try {\r\n const response = await window.AppleID.auth.signIn();\r\n\r\n const { authorization, user } = response;\r\n\r\n if (authorization) {\r\n const { id_token } = authorization;\r\n\r\n // Decode the ID token\r\n const decoded = jwtDecode(id_token);\r\n\r\n setDisable(true);\r\n const referralCode = \"\";\r\n\r\n const response = await fetch(\r\n Global.API_URL + \"Customer/RegisterCustomer\",\r\n {\r\n method: \"POST\",\r\n headers: {\r\n Accept: \"application/json\",\r\n \"Content-Type\": \"application/json\",\r\n \"Access-Control-Allow-Origin\": Global.HostAPI,\r\n CountryCode: countryCode,\r\n },\r\n body: JSON.stringify({\r\n languageId: Cookies.get(\"Language\"),\r\n firstName: \"apple\",\r\n lastName: \"user\",\r\n email: decoded.email.trim().toLowerCase(),\r\n password: \"\",\r\n genderID: 3,\r\n loginTypeId: 4,\r\n guestId: guestId,\r\n isSubscribed: isSubscribed,\r\n referralCode: referralCode,\r\n idToken: id_token,\r\n deviceToken: \"\",\r\n deviceType: 0,\r\n }),\r\n }\r\n );\r\n\r\n const result = await response.json();\r\n if (!response.ok) {\r\n toast.error(result.Message, {\r\n theme: \"light\",\r\n });\r\n throw new Error(\"Something went wrong\");\r\n }\r\n\r\n if (result.Code === 1) {\r\n toast.success(result.Message, { theme: \"light\" });\r\n if (window.snaptr) {\r\n window.snaptr(\"track\", \"LOGIN\", {\r\n uuid_c1: result.customerReturn.CustomerId,\r\n user_email: result.customerReturn.Email,\r\n user_phone_number: result.customerReturn.PhoneNumber,\r\n });\r\n console.log(\"LOGIN\");\r\n }\r\n\r\n if (\r\n cartlist.cartItemsCheckout &&\r\n cartlist.cartItemsCheckout.length > 0\r\n ) {\r\n setOpen(false);\r\n setOpenMerge(true);\r\n setCustomerDetail(result.customerReturn.CustomerId);\r\n setGuest(guestId);\r\n const credentials = {\r\n isLogged: true,\r\n guestId: \"\",\r\n customerId: result.customerReturn.CustomerId,\r\n customerToken: result.JwtToken,\r\n token: result.JwtToken,\r\n firstName: result.customerReturn.FirstName,\r\n lastName: result.customerReturn.LastName,\r\n email: result.customerReturn.Email,\r\n purchasedProducts: [],\r\n customer: result.CustomerSecret,\r\n };\r\n setData(credentials);\r\n } else {\r\n const credentials = {\r\n isLogged: true,\r\n guestId: \"\",\r\n customerId: result.customerReturn.CustomerId,\r\n customerToken: result.JwtToken,\r\n token: result.JwtToken,\r\n firstName: result.customerReturn.FirstName,\r\n lastName: result.customerReturn.LastName,\r\n email: result.customerReturn.Email,\r\n purchasedProducts: [],\r\n customer: result.CustomerSecret,\r\n };\r\n\r\n dispatch(setCredential(credentials));\r\n navigate(`/${countryCode}/profile`);\r\n }\r\n } else if (result.Code === 2) {\r\n setOtpDeviceKey(result.OtpDeviceKey);\r\n closeModal();\r\n setOpenOTP(true);\r\n } else if (result.Code === -1 || result.Code === -2) {\r\n toast.error(result.Message, { theme: \"light\" });\r\n } else if (result.Code === -3) {\r\n toast.error(result.Message, { theme: \"light\" });\r\n navigate(\"/reset-password/\" + emails);\r\n } else {\r\n toast.error(result.Message, { theme: \"light\" });\r\n }\r\n setDisable(false);\r\n }\r\n } catch (error) {\r\n console.error(\"Apple Login Error:\", error);\r\n }\r\n };\r\n\r\n const Login = async (e) => {\r\n e.preventDefault();\r\n\r\n if (!isLoginValid) {\r\n toast.error(\"Fill all required fields\", {\r\n theme: \"light\",\r\n });\r\n } else if (!isValidEmail) {\r\n toast.error(\"Enter a valid email\", {\r\n theme: \"light\",\r\n });\r\n } else {\r\n try {\r\n const response = await fetch(\r\n Global.API_URL + \"Customer/CustomerLogin\",\r\n {\r\n method: \"POST\",\r\n headers: {\r\n Accept: \"application/json\",\r\n \"Content-Type\": \"application/json\",\r\n \"Access-Control-Allow-Origin\": Global.HostAPI,\r\n CountryCode: countryCode,\r\n },\r\n body: JSON.stringify({\r\n languageId: Cookies.get(\"Language\"),\r\n email: emails.trim().toLowerCase(),\r\n password: password,\r\n }),\r\n }\r\n );\r\n const result = await response.json();\r\n if (!response.ok) {\r\n toast.error(result.Message, {\r\n theme: \"light\",\r\n });\r\n throw new Error(\"Something went wrong\");\r\n }\r\n\r\n if (result.Code === 1) {\r\n toast.success(result.Message, { theme: \"light\" });\r\n if (window.snaptr) {\r\n window.snaptr(\"track\", \"LOGIN\", {\r\n uuid_c1: result.customerReturn.CustomerId,\r\n user_email: result.customerReturn.Email,\r\n user_phone_number: result.customerReturn.PhoneNumber,\r\n });\r\n console.log(\"LOGIN\");\r\n }\r\n\r\n if (\r\n cartlist.cartItemsCheckout &&\r\n cartlist.cartItemsCheckout.length > 0\r\n ) {\r\n setOpen(false);\r\n setOpenMerge(true);\r\n setCustomerDetail(result.customerReturn.CustomerId);\r\n setGuest(guestId);\r\n const credentials = {\r\n isLogged: true,\r\n guestId: \"\",\r\n customerId: result.customerReturn.CustomerId,\r\n customerToken: result.JwtToken,\r\n token: result.JwtToken,\r\n firstName: result.customerReturn.FirstName,\r\n lastName: result.customerReturn.LastName,\r\n email: result.customerReturn.Email,\r\n purchasedProducts: [],\r\n customer: result.CustomerSecret,\r\n };\r\n setData(credentials);\r\n } else {\r\n const credentials = {\r\n isLogged: true,\r\n guestId: \"\",\r\n customerId: result.customerReturn.CustomerId,\r\n customerToken: result.JwtToken,\r\n token: result.JwtToken,\r\n firstName: result.customerReturn.FirstName,\r\n lastName: result.customerReturn.LastName,\r\n email: result.customerReturn.Email,\r\n purchasedProducts: [],\r\n customer: result.CustomerSecret,\r\n };\r\n\r\n dispatch(setCredential(credentials));\r\n navigate(`/${countryCode}/profile`);\r\n }\r\n } else if (result.Code === 2) {\r\n setOtpDeviceKey(result.OtpDeviceKey);\r\n closeModal();\r\n setOpenOTP(true);\r\n } else if (result.Code === -1 || result.Code === -2) {\r\n toast.error(result.Message, { theme: \"light\" });\r\n } else if (result.Code === -3) {\r\n toast.error(result.Message, { theme: \"light\" });\r\n navigate(\"/reset-password/\" + emails);\r\n } else {\r\n toast.error(result.Message, { theme: \"light\" });\r\n }\r\n } catch (error) {\r\n console.log(\"Something went wrong!\");\r\n }\r\n }\r\n };\r\n\r\n const onSuccess = async (response) => {\r\n // const userInfo = await axios.get(\r\n // \"https://www.googleapis.com/oauth2/v3/userinfo\",\r\n // { headers: { Authorization: `Bearer ${response.access_token} ` } }\r\n // );\r\n\r\n const token = response.credential;\r\n const decoded = jwtDecode(token);\r\n setDisable(true);\r\n const referralCode = \"\";\r\n const respose = await fetch(Global.API_URL + \"Customer/RegisterCustomer\", {\r\n method: \"POST\",\r\n headers: {\r\n Accept: \"application/json\",\r\n \"Content-Type\": \"application/json\",\r\n \"Access-Control-Allow-Origin\": Global.HostAPI,\r\n CountryCode: countryCode,\r\n },\r\n body: JSON.stringify({\r\n languageId: Cookies.get(\"Language\"),\r\n firstName: decoded.given_name,\r\n lastName: decoded.family_name,\r\n email: decoded.email.trim().toLowerCase(),\r\n password: \"\",\r\n genderID: 3,\r\n loginTypeId: 2,\r\n guestId: guestId,\r\n isSubscribed: isSubscribed,\r\n referralCode: referralCode,\r\n idToken: response.credential,\r\n deviceToken: \"\",\r\n deviceType: 0,\r\n }),\r\n });\r\n const customerData = await respose.json();\r\n if (customerData.Code === 0) {\r\n dispatch(deleteAllFromCart());\r\n toast.success(customerData.Message, {\r\n theme: \"light\",\r\n });\r\n if (window.snaptr) {\r\n window.snaptr(\"track\", \"SIGN_UP\", {\r\n sign_up_method: \"google register\",\r\n uuid_c1: guestId,\r\n user_email: emails,\r\n user_phone_number: \"\",\r\n });\r\n console.log(\"SIGN_UP\");\r\n }\r\n if (typeof window !== \"undefined\" && window.gtag) {\r\n window.gtag(\"event\", \"sign_up\", {\r\n method: \"google register\",\r\n });\r\n }\r\n setEmails(\"\");\r\n setPassword(\"\");\r\n setFirstName(\"\");\r\n setLastName(\"\");\r\n setConfirmPassword(\"\");\r\n setGenders(0);\r\n setIsSubscribed(false);\r\n setIsTerm(false);\r\n closeModal();\r\n } else {\r\n toast.error(customerData.Message, {\r\n theme: \"light\",\r\n });\r\n }\r\n setDisable(false);\r\n };\r\n\r\n const onFailure = (error) => {\r\n console.log(\"Login Failed:\", error);\r\n // Handle the error\r\n };\r\n\r\n async function openModal(e) {\r\n e.preventDefault();\r\n const response = await fetch(Global.API_URL + \"Gender/GetGenders\", {\r\n method: \"GET\",\r\n headers: {\r\n Accept: \"application/json\",\r\n \"Content-Type\": \"application/json\",\r\n \"Access-Control-Allow-Origin\": Global.HostAPI,\r\n CountryCode: countryCode,\r\n },\r\n });\r\n const result = await response.json();\r\n if (response.ok) {\r\n setGenders(result);\r\n }\r\n setOpen(true);\r\n setIsForget(false);\r\n }\r\n\r\n function closeModal() {\r\n setEmails(\"\");\r\n setPassword(\"\");\r\n setFirstName(\"\");\r\n setLastName(\"\");\r\n setConfirmPassword(\"\");\r\n setGenders(0);\r\n setIsSubscribed(false);\r\n setIsTerm(false);\r\n setOpen(false);\r\n }\r\n\r\n const MergeCart = async () => {\r\n const offset = new Date().getTimezoneOffset();\r\n let CurrencyId = currency.filter(\r\n (c) =>\r\n c.CountryCode.toLocaleUpperCase() === countryCode.toLocaleUpperCase()\r\n )[0]\r\n ? currency.filter(\r\n (c) =>\r\n c.CountryCode.toLocaleUpperCase() ===\r\n countryCode.toLocaleUpperCase()\r\n )[0]?.Id\r\n : currency.filter((c) => c.CountryCode.toLocaleUpperCase() === \"INT\")[0]\r\n ?.Id;\r\n const response = await fetch(\r\n Global.API_URL +\r\n \"Cart/MergeCartRequest/Language/\" +\r\n Cookies.get(\"Language\") +\r\n \"/Currency/\" +\r\n CurrencyId +\r\n \"/Offset/\" +\r\n offset +\r\n \"/Country/\" +\r\n countryCode,\r\n {\r\n method: \"PUT\",\r\n headers: {\r\n Accept: \"application/json\",\r\n \"Content-Type\": \"application/json\",\r\n AuthorizationCustomer: token,\r\n \"Access-Control-Allow-Origin\": Global.HostAPI,\r\n CountryCode: countryCode,\r\n },\r\n body: JSON.stringify({\r\n customerId: customerDetail,\r\n guestId: guest,\r\n Offset: offset,\r\n }),\r\n }\r\n );\r\n const result = await response.json();\r\n if (result.Code === 0) {\r\n dispatch(setCredential(data));\r\n dispatch(deleteAllFromCart());\r\n let promise;\r\n let cart = dispatch(\r\n GetCustomerCart(\r\n customerDetail,\r\n Cookies.get(\"Language\"),\r\n offset,\r\n Cookies.get(\"Country\"),\r\n data.customerToken\r\n ),\r\n Cookies.get(\"Country\")\r\n );\r\n promise = Promise.resolve(cart);\r\n promise.then((value) => {\r\n if (value !== -1) {\r\n dispatch(addAllToCart(value));\r\n }\r\n });\r\n setOpenMerge(false);\r\n }\r\n };\r\n\r\n useEffect(() => {\r\n let interval = null;\r\n if (timer > 0) {\r\n interval = setInterval(() => {\r\n setTimer((prevTimer) => prevTimer - 1);\r\n }, 1000);\r\n } else if (timer === 0) {\r\n setIsButtonDisabled(false);\r\n setIsSent(false);\r\n }\r\n return () => clearInterval(interval);\r\n }, [timer]);\r\n const ValidateOTP = async () => {\r\n const response = await fetch(Global.API_URL + \"Customer/ValidateTOTP\", {\r\n method: \"POST\",\r\n headers: {\r\n Accept: \"application/json\",\r\n \"Content-Type\": \"application/json\",\r\n \"Access-Control-Allow-Origin\": Global.HostAPI,\r\n countryCode: countryCode,\r\n },\r\n body: JSON.stringify({\r\n otpDeviceKey: otpDeviceKey,\r\n languageId: Cookies.get(\"Language\"),\r\n deviceToken: \"\",\r\n deviceType: 0,\r\n sixDigitCode: otp,\r\n }),\r\n });\r\n const result = await response.json();\r\n if (response.ok) {\r\n if (result.Code === 1) {\r\n toast.success(result.Message, { theme: \"light\" });\r\n if (\r\n cartlist.cartItemsCheckout &&\r\n cartlist.cartItemsCheckout.length > 0\r\n ) {\r\n setOpen(false);\r\n setOpenMerge(true);\r\n setCustomerDetail(result.customerReturn.CustomerId);\r\n setGuest(guestId);\r\n const credentials = {\r\n isLogged: false,\r\n guestId: \"\",\r\n customerId: result.customerReturn.CustomerId,\r\n customerToken: result.JwtToken,\r\n token: result.JwtToken,\r\n firstName: result.customerReturn.FirstName,\r\n lastName: result.customerReturn.LastName,\r\n email: result.customerReturn.Email,\r\n purchasedProducts: [],\r\n customer: result.CustomerSecret,\r\n };\r\n\r\n dispatch(setCredential(credentials));\r\n } else {\r\n const credentials = {\r\n isLogged: true,\r\n guestId: \"\",\r\n customerId: result.customerReturn.CustomerId,\r\n customerToken: result.JwtToken,\r\n token: result.JwtToken,\r\n firstName: result.customerReturn.FirstName,\r\n lastName: result.customerReturn.LastName,\r\n email: result.customerReturn.Email,\r\n purchasedProducts: [],\r\n customer: result.CustomerSecret,\r\n };\r\n\r\n dispatch(setCredential(credentials));\r\n navigate(`/${countryCode}/profile`);\r\n }\r\n }\r\n }\r\n };\r\n const ForgetOTP = async () => {\r\n closeModal();\r\n localStorage.setItem(\"acc\", otpDeviceKey);\r\n navigate(\"/\" + countryCode + \"/account-recovery\");\r\n };\r\n\r\n return (\r\n \r\n \r\n
\r\n \r\n ) : (\r\n \"\"\r\n )}\r\n\r\n {open ? (\r\n \r\n \r\n Merge Carts?\r\n \r\n closeMergeModal()}\r\n >\r\n ×\r\n \r\n
\r\n \r\n
\r\n Do you want to merge the cart?
\r\n\r\n closeMergeModal()}\r\n >\r\n Dismiss\r\n \r\n MergeCart()}\r\n >\r\n Merge Carts\r\n \r\n
\r\n \r\n
\r\n \r\n \r\n {/* \r\n \r\n {isForget\r\n ? \"Forgot Your Password?\"\r\n : dictionary.WelcomeToYourFashionHome}\r\n \r\n \r\n
\r\n {isForget ? (\r\n \r\n
\r\n ) : (\r\n \r\n
\r\n \r\n
\r\n \r\n
\r\n \r\n {errorMessage !== \"\" ? (\r\n
\r\n \r\n \r\n setErrorMessage(\"\")}\r\n >\r\n ×\r\n \r\n
\r\n ) : successMessage !== \"\" ? (\r\n \r\n setSuccessMessage(\"\")}\r\n >\r\n ×\r\n \r\n
\r\n ) : (\r\n \"\"\r\n )}\r\n \r\n
\r\n \r\n
\r\n \r\n {\" \"}\r\n Enter your email address and we'll send you a link\r\n to reset your password.{\" \"}\r\n
\r\n \r\n \r\n {dictionary.Email}\r\n \r\n setForgetEmail(e.target.value)}\r\n />\r\n {isSent ? (\r\n
\r\n \r\n {\" \"}\r\n Link will be sent in{\" \"}\r\n {timer} s\r\n
\r\n ) : (\r\n \"\"\r\n )}\r\n \r\n SendEmail()}\r\n >\r\n
\r\n SEND LINK
\r\n \r\n \r\n
\r\n \r\n \r\n {\r\n onSuccess(credentialResponse);\r\n }}\r\n onError={(error) => {\r\n onFailure(error);\r\n }}\r\n type=\"icon\"\r\n />\r\n \r\n
\r\n \r\n \r\n
\r\n \r\n \r\n
\r\n \r\n
\r\n \r\n \r\n
\r\n \r\n
\r\n \r\n \r\n
\r\n \r\n \r\n \r\n \r\n \r\n {dictionary.SignIn}\r\n \r\n \r\n\r\n \r\n \r\n {dictionary.ImNewHere}\r\n \r\n \r\n \r\n\r\n
\r\n \r\n\r\n \r\n \r\n
\r\n \r\n \r\n
\r\n \r\n
\r\n \r\n \r\n {dictionary.SignIn}\r\n \r\n
\r\n \r\n {/*
\r\n \r\n \r\n {\r\n onSuccess(credentialResponse);\r\n }}\r\n onError={(error) => {\r\n onFailure(error);\r\n }}\r\n type=\"icon\"\r\n />\r\n \r\n
\r\n \r\n \r\n
\r\n \r\n
\r\n \r\n
\r\n \r\n \r\n \r\n setEmails(\r\n e.target.value.toLowerCase()\r\n )\r\n }\r\n required\r\n />\r\n
\r\n \r\n
\r\n \r\n
\r\n \r\n
\r\n \r\n \r\n
\r\n \r\n \r\n setPassword(e.target.value)\r\n }\r\n required\r\n />\r\n \r\n setShowPasswordRegister(\r\n !showPasswordRegister\r\n )\r\n }\r\n >\r\n {showPasswordRegister ? (\r\n
\r\n \r\n
\r\n \r\n
\r\n \r\n \r\n
\r\n \r\n \r\n setConfirmPassword(e.target.value)\r\n }\r\n required\r\n />\r\n \r\n setShowPasswordConfirm(\r\n !showPasswordConfirm\r\n )\r\n }\r\n >\r\n {showPasswordConfirm ? (\r\n
\r\n \r\n
\r\n\r\n \r\n
\r\n \r\n
\r\n \r\n \r\n setIsSubscribed(e.target.checked)\r\n }\r\n />\r\n \r\n
\r\n \r\n
\r\n \r\n \r\n {dictionary.SignUpForNewsLetter}\r\n
\r\n\r\n {dictionary.NewsLetter}\r\n
\r\n\r\n
\r\n\r\n \r\n
\r\n \r\n
\r\n \r\n \r\n setIsTerm(e.target.checked)\r\n }\r\n />\r\n \r\n
\r\n \r\n
\r\n \r\n \r\n I Have Already Read and Agreed To\r\n All{\" \"}\r\n \r\n Terms & Conditions\r\n \r\n
\r\n\r\n of Sheyaaka and All{\" \"}\r\n \r\n Data Protection Regulations\r\n {\" \"}\r\n of Sheyaaka. You are Entitled to Revoke\r\n Any Consent Granted By You At Any Time.\r\n
\r\n\r\n \r\n {dictionary.RegisterHere}\r\n \r\n
\r\n \r\n \r\n
\r\n \r\n \r\n
\r\n \r\n \r\n {\r\n onSuccess(credentialResponse);\r\n }}\r\n onError={(error) => {\r\n onFailure(error);\r\n }}\r\n type=\"icon\"\r\n />\r\n \r\n
\r\n\r\n \r\n \r\n
\r\n \r\n \r\n
*/}\r\n \r\n \r\n )}\r\n \r\n \r\n ) : (\r\n \"\"\r\n )}\r\n {openOTP ? (\r\n \r\n ForgetOTP()}\r\n >\r\n Don't have access to your OTP?\r\n
\r\n \r\n
\r\n \r\n Verify\r\n
\r\n\r\n
\r\n \r\n Verification Code\r\n
\r\n \r\n Enter verification code\r\n
\r\n \r\n
\r\n \r\n ValidateOTP()}\r\n className=\"btn btn-primary border-radius-5 text-white text-center w-100 mb-26 cursor-pointer\"\r\n >\r\n Enter\r\n \r\n
\r\n \r\n \r\n ) : (\r\n \"\"\r\n )}\r\n \r\n \r\n
\r\n );\r\n};\r\n\r\nconst customStyles = {\r\n overlay: {\r\n backgroundColor: \"rgba(77,77,77,0.6)\",\r\n zIndex: \"9000\",\r\n },\r\n};\r\n\r\nModal.setAppElement(\"body\");\r\n\r\nconst MobileLogin = ({ setShowSidebar, setOpen, open, show, setShow }) => {\r\n const navigate = useNavigate();\r\n const dictionary = useSelector((state) => state.dictionary.dictionary);\r\n const guestId = useSelector((state) => state.credential.guestId);\r\n const token = useSelector((state) => state.credential.token);\r\n const customerId = useSelector((state) => state.credential.customerId);\r\n const FirstName = useSelector((state) => state.credential.firstName);\r\n const LastName = useSelector((state) => state.credential.lastName);\r\n const customerToken = useSelector((state) => state.credential.customerToken);\r\n const email = useSelector((state) => state.credential.email);\r\n const customer = useSelector((state) => state.credential.customer);\r\n const { country } = useParams();\r\n let countryCode = country ? country : Cookies.get(\"Country\");\r\n\r\n const [disable, setDisable] = useState(false);\r\n const [showPasswordLogin, setShowPasswordLogin] = useState(false);\r\n const [showPasswordRegister, setShowPasswordRegister] = useState(false);\r\n const [showPasswordConfirm, setShowPasswordConfirm] = useState(false);\r\n const [firstName, setFirstName] = useState(\"\");\r\n const [lastName, setLastName] = useState(\"\");\r\n const [emails, setEmails] = useState(\"\");\r\n const [password, setPassword] = useState(\"\");\r\n const [confirmPassword, setConfirmPassword] = useState(\"\");\r\n const [genders, setGenders] = useState([]);\r\n const [selectedGender, setSelectedGender] = useState(0);\r\n const [isSubscribed, setIsSubscribed] = useState(false);\r\n const [isTerm, setIsTerm] = useState(false);\r\n const [openMerge, setOpenMerge] = useState(false);\r\n const cartlist = useSelector((state) => state.cart.cartItems);\r\n const currency = useSelector((state) => state.currency.currency);\r\n const [guest, setGuest] = useState(\"\");\r\n const [customerDetail, setCustomerDetail] = useState(0);\r\n const [isForget, setIsForget] = useState(false);\r\n const [forgetEmail, setForgetEmail] = useState(\"\");\r\n const [isSent, setIsSent] = useState(false);\r\n const [errorMessage, setErrorMessage] = useState(\"\");\r\n const [successMessage, setSuccessMessage] = useState(\"\");\r\n const [isButtonDisabled, setIsButtonDisabled] = useState(false);\r\n const [timer, setTimer] = useState(0);\r\n const [data, setData] = useState({});\r\n\r\n const [openOTP, setOpenOTP] = useState(false);\r\n const [otp, setOtp] = useState(\"\");\r\n const [otpDeviceKey, setOtpDeviceKey] = useState(\"\");\r\n\r\n const dispatch = useDispatch();\r\n const handleOTPChange = (otp) => setOtp(otp);\r\n\r\n const handleChange = (event) => {\r\n setSelectedGender(parseInt(event.target.value));\r\n };\r\n\r\n const SendEmail = async () => {\r\n setErrorMessage(\"\");\r\n setSuccessMessage(\"\");\r\n if (forgetEmail.trim() === \"\") {\r\n setErrorMessage(\"Enter Valid Email\");\r\n } else {\r\n const response = await fetch(\r\n Global.API_URL + \"Customer/SendForgetPasswordEmailURL\",\r\n {\r\n method: \"POST\",\r\n headers: {\r\n Accept: \"application/json\",\r\n \"Content-Type\": \"application/json\",\r\n \"Access-Control-Allow-Origin\": Global.HostAPI,\r\n CountryCode: countryCode,\r\n },\r\n body: JSON.stringify({\r\n forgetPasswordEmail: forgetEmail.trim().toLowerCase(),\r\n languageId: Cookies.get(\"Language\"),\r\n }),\r\n }\r\n );\r\n const result = await response.json();\r\n if (response.ok) {\r\n if (result.Code === 0) {\r\n setSuccessMessage(result.Message);\r\n setForgetEmail(\"\");\r\n } else {\r\n setErrorMessage(result.Message);\r\n setIsSent(true);\r\n setIsButtonDisabled(true);\r\n setTimer(60);\r\n }\r\n } else {\r\n if (result.Message) {\r\n setErrorMessage(result.Message);\r\n setIsSent(true);\r\n setIsButtonDisabled(true);\r\n setTimer(60);\r\n } else {\r\n setErrorMessage(result);\r\n setIsSent(true);\r\n setIsButtonDisabled(true);\r\n setTimer(60);\r\n }\r\n }\r\n }\r\n };\r\n\r\n const isRegisterValid =\r\n firstName.trim() !== \"\" &&\r\n lastName.trim() !== \"\" &&\r\n emails.trim() !== \"\" &&\r\n password.trim() !== \"\";\r\n\r\n const isLoginValid = emails.trim() !== \"\" && password.trim() !== \"\";\r\n const isValidEmail = emails.includes(\".\") && emails.includes(\"@\");\r\n\r\n const Register = async (e) => {\r\n e.preventDefault();\r\n if (!isRegisterValid) {\r\n toast.error(\"Fill all required fields\", {\r\n theme: \"light\",\r\n });\r\n } else if (!isValidEmail) {\r\n toast.error(\"Enter a valid email\", {\r\n theme: \"light\",\r\n });\r\n } else if (password !== confirmPassword) {\r\n toast.error(\"Confirm password does not match the original password.\", {\r\n theme: \"light\",\r\n });\r\n } else if (!isTerm) {\r\n toast.error(\r\n \"Accept the terms and conditions to proceed with completing the registration\",\r\n {\r\n theme: \"light\",\r\n }\r\n );\r\n } else {\r\n setDisable(true);\r\n const referralCode = \"\";\r\n const respose = await fetch(\r\n Global.API_URL + \"Customer/RegisterCustomer\",\r\n {\r\n method: \"POST\",\r\n headers: {\r\n Accept: \"application/json\",\r\n \"Content-Type\": \"application/json\",\r\n \"Access-Control-Allow-Origin\": Global.HostAPI,\r\n CountryCode: countryCode,\r\n },\r\n body: JSON.stringify({\r\n languageId: Cookies.get(\"Language\"),\r\n firstName: firstName,\r\n lastName: lastName,\r\n email: emails.trim().toLowerCase(),\r\n password: password,\r\n genderID: selectedGender,\r\n loginTypeId: 1,\r\n guestId: guestId,\r\n isSubscribed: isSubscribed,\r\n referralCode: referralCode,\r\n idToken: \"\",\r\n deviceToken: \"\",\r\n deviceType: 0,\r\n }),\r\n }\r\n );\r\n const customerData = await respose.json();\r\n if (customerData.Code === 0) {\r\n toast.success(customerData.Message, {\r\n theme: \"light\",\r\n });\r\n if (window.snaptr) {\r\n window.snaptr(\"track\", \"SIGN_UP\", {\r\n sign_up_method: \"sheyaaka register\",\r\n uuid_c1: guestId,\r\n user_email: emails,\r\n user_phone_number: \"\",\r\n });\r\n console.log(\"SIGN_UP\");\r\n }\r\n if (typeof window !== \"undefined\" && window.gtag) {\r\n window.gtag(\"event\", \"sign_up\", {\r\n method: \"sheyaaka register\",\r\n });\r\n }\r\n setEmails(\"\");\r\n setPassword(\"\");\r\n setFirstName(\"\");\r\n setLastName(\"\");\r\n setConfirmPassword(\"\");\r\n setGenders(0);\r\n setIsSubscribed(false);\r\n setIsTerm(false);\r\n closeModal();\r\n } else {\r\n toast.error(customerData.Message, {\r\n theme: \"light\",\r\n });\r\n }\r\n setDisable(false);\r\n }\r\n };\r\n const closeMergeModal = async () => {\r\n dispatch(setCredential(data));\r\n dispatch(deleteAllFromCart());\r\n setOpenMerge(false);\r\n setShowSidebar(false);\r\n };\r\n useEffect(() => {\r\n openModal();\r\n\r\n window.AppleID.auth.init({\r\n clientId: \"com.sheyaaka.sheyaaka.web\", // Replace with your Apple Client ID\r\n scope: \"email name\",\r\n redirectURI: Global.redirectURI, // Your redirect URI\r\n state: \"your_custom_state\",\r\n usePopup: true, // To avoid redirection\r\n });\r\n }, []);\r\n\r\n const handleAppleLogin = async () => {\r\n try {\r\n const response = await window.AppleID.auth.signIn();\r\n\r\n const { authorization, user } = response;\r\n\r\n if (authorization) {\r\n const { id_token } = authorization;\r\n\r\n // Decode the ID token\r\n const decoded = jwtDecode(id_token);\r\n\r\n setDisable(true);\r\n const referralCode = \"\";\r\n\r\n const response = await fetch(\r\n Global.API_URL + \"Customer/RegisterCustomer\",\r\n {\r\n method: \"POST\",\r\n headers: {\r\n Accept: \"application/json\",\r\n \"Content-Type\": \"application/json\",\r\n \"Access-Control-Allow-Origin\": Global.HostAPI,\r\n CountryCode: countryCode,\r\n },\r\n body: JSON.stringify({\r\n languageId: Cookies.get(\"Language\"),\r\n firstName: \"apple\",\r\n lastName: \"user\",\r\n email: decoded.email.trim().toLowerCase(),\r\n password: \"\",\r\n genderID: 3,\r\n loginTypeId: 4,\r\n guestId: guestId,\r\n isSubscribed: isSubscribed,\r\n referralCode: referralCode,\r\n idToken: id_token,\r\n deviceToken: \"\",\r\n deviceType: 0,\r\n }),\r\n }\r\n );\r\n\r\n const result = await response.json();\r\n if (!response.ok) {\r\n toast.error(result.Message, {\r\n theme: \"light\",\r\n });\r\n throw new Error(\"Something went wrong\");\r\n }\r\n\r\n if (result.Code === 1) {\r\n toast.success(result.Message, { theme: \"light\" });\r\n if (window.snaptr) {\r\n window.snaptr(\"track\", \"LOGIN\", {\r\n uuid_c1: result.customerReturn.CustomerId,\r\n user_email: result.customerReturn.Email,\r\n user_phone_number: result.customerReturn.PhoneNumber,\r\n });\r\n console.log(\"LOGIN\");\r\n }\r\n\r\n if (\r\n cartlist.cartItemsCheckout &&\r\n cartlist.cartItemsCheckout.length > 0\r\n ) {\r\n setOpen(false);\r\n setShow(false)\r\n setOpenMerge(true);\r\n setCustomerDetail(result.customerReturn.CustomerId);\r\n setGuest(guestId);\r\n const credentials = {\r\n isLogged: true,\r\n guestId: \"\",\r\n customerId: result.customerReturn.CustomerId,\r\n customerToken: result.JwtToken,\r\n token: result.JwtToken,\r\n firstName: result.customerReturn.FirstName,\r\n lastName: result.customerReturn.LastName,\r\n email: result.customerReturn.Email,\r\n purchasedProducts: [],\r\n customer: result.CustomerSecret,\r\n };\r\n setData(credentials);\r\n } else {\r\n const credentials = {\r\n isLogged: true,\r\n guestId: \"\",\r\n customerId: result.customerReturn.CustomerId,\r\n customerToken: result.JwtToken,\r\n token: result.JwtToken,\r\n firstName: result.customerReturn.FirstName,\r\n lastName: result.customerReturn.LastName,\r\n email: result.customerReturn.Email,\r\n purchasedProducts: [],\r\n customer: result.CustomerSecret,\r\n };\r\n\r\n dispatch(setCredential(credentials));\r\n navigate(`/${countryCode}/profile`);\r\n }\r\n } else if (result.Code === 2) {\r\n setOtpDeviceKey(result.OtpDeviceKey);\r\n closeModal();\r\n setOpenOTP(true);\r\n } else if (result.Code === -1 || result.Code === -2) {\r\n toast.error(result.Message, { theme: \"light\" });\r\n } else if (result.Code === -3) {\r\n toast.error(result.Message, { theme: \"light\" });\r\n navigate(\"/reset-password/\" + emails);\r\n } else {\r\n toast.error(result.Message, { theme: \"light\" });\r\n }\r\n setDisable(false);\r\n }\r\n } catch (error) {\r\n console.error(\"Apple Login Error:\", error);\r\n }\r\n };\r\n const Login = async (e) => {\r\n e.preventDefault();\r\n\r\n if (!isLoginValid) {\r\n toast.error(\"Fill all required fields\", {\r\n theme: \"light\",\r\n });\r\n } else if (!isValidEmail) {\r\n toast.error(\"Enter a valid email\", {\r\n theme: \"light\",\r\n });\r\n } else {\r\n try {\r\n const response = await fetch(\r\n Global.API_URL + \"Customer/CustomerLogin\",\r\n {\r\n method: \"POST\",\r\n headers: {\r\n Accept: \"application/json\",\r\n \"Content-Type\": \"application/json\",\r\n \"Access-Control-Allow-Origin\": Global.HostAPI,\r\n CountryCode: countryCode,\r\n },\r\n body: JSON.stringify({\r\n languageId: Cookies.get(\"Language\"),\r\n email: emails.trim().toLowerCase(),\r\n password: password,\r\n }),\r\n }\r\n );\r\n const result = await response.json();\r\n if (!response.ok) {\r\n toast.error(result.Message, {\r\n theme: \"light\",\r\n });\r\n throw new Error(\"Something went wrong\");\r\n }\r\n\r\n if (result.Code === 1) {\r\n toast.success(result.Message, { theme: \"light\" });\r\n if (window.snaptr) {\r\n window.snaptr(\"track\", \"LOGIN\", {\r\n uuid_c1: result.customerReturn.CustomerId,\r\n user_email: result.customerReturn.Email,\r\n user_phone_number: result.customerReturn.PhoneNumber,\r\n });\r\n console.log(\"LOGIN\");\r\n }\r\n\r\n if (\r\n cartlist.cartItemsCheckout &&\r\n cartlist.cartItemsCheckout.length > 0\r\n ) {\r\n setOpen(false);\r\n setShow(false)\r\n setOpenMerge(true);\r\n setCustomerDetail(result.customerReturn.CustomerId);\r\n setGuest(guestId);\r\n const credentials = {\r\n isLogged: true,\r\n guestId: \"\",\r\n customerId: result.customerReturn.CustomerId,\r\n customerToken: result.JwtToken,\r\n token: result.JwtToken,\r\n firstName: result.customerReturn.FirstName,\r\n lastName: result.customerReturn.LastName,\r\n email: result.customerReturn.Email,\r\n purchasedProducts: [],\r\n customer: result.CustomerSecret,\r\n };\r\n setData(credentials);\r\n } else {\r\n const credentials = {\r\n isLogged: true,\r\n guestId: \"\",\r\n customerId: result.customerReturn.CustomerId,\r\n customerToken: result.JwtToken,\r\n token: result.JwtToken,\r\n firstName: result.customerReturn.FirstName,\r\n lastName: result.customerReturn.LastName,\r\n email: result.customerReturn.Email,\r\n purchasedProducts: [],\r\n customer: result.CustomerSecret,\r\n };\r\n\r\n dispatch(setCredential(credentials));\r\n navigate(`/${countryCode}/profile`);\r\n }\r\n } else if (result.Code === 2) {\r\n setOtpDeviceKey(result.OtpDeviceKey);\r\n closeModal();\r\n setOpenOTP(true);\r\n } else if (result.Code === -1 || result.Code === -2) {\r\n toast.error(result.Message, { theme: \"light\" });\r\n } else if (result.Code === -3) {\r\n toast.error(result.Message, { theme: \"light\" });\r\n navigate(\"/reset-password/\" + emails);\r\n } else {\r\n toast.error(result.Message, { theme: \"light\" });\r\n }\r\n } catch (error) {\r\n console.log(\"Something went wrong!\");\r\n }\r\n }\r\n };\r\n\r\n const onSuccess = async (response) => {\r\n // const userInfo = await axios.get(\r\n // \"https://www.googleapis.com/oauth2/v3/userinfo\",\r\n // { headers: { Authorization: `Bearer ${response.access_token} ` } }\r\n // );\r\n\r\n const token = response.credential;\r\n const decoded = jwtDecode(token);\r\n setDisable(true);\r\n const referralCode = \"\";\r\n const respose = await fetch(Global.API_URL + \"Customer/RegisterCustomer\", {\r\n method: \"POST\",\r\n headers: {\r\n Accept: \"application/json\",\r\n \"Content-Type\": \"application/json\",\r\n \"Access-Control-Allow-Origin\": Global.HostAPI,\r\n CountryCode: countryCode,\r\n },\r\n body: JSON.stringify({\r\n languageId: Cookies.get(\"Language\"),\r\n firstName: decoded.given_name,\r\n lastName: decoded.family_name,\r\n email: decoded.email.trim().toLowerCase(),\r\n password: \"\",\r\n genderID: 3,\r\n loginTypeId: 2,\r\n guestId: guestId,\r\n isSubscribed: isSubscribed,\r\n referralCode: referralCode,\r\n idToken: response.credential,\r\n deviceToken: \"\",\r\n deviceType: 0,\r\n }),\r\n });\r\n const customerData = await respose.json();\r\n if (customerData.Code === 0) {\r\n dispatch(deleteAllFromCart());\r\n toast.success(customerData.Message, {\r\n theme: \"light\",\r\n });\r\n if (window.snaptr) {\r\n window.snaptr(\"track\", \"SIGN_UP\", {\r\n sign_up_method: \"google register\",\r\n uuid_c1: guestId,\r\n user_email: emails,\r\n user_phone_number: \"\",\r\n });\r\n console.log(\"SIGN_UP\");\r\n }\r\n if (typeof window !== \"undefined\" && window.gtag) {\r\n window.gtag(\"event\", \"sign_up\", {\r\n method: \"google register\",\r\n });\r\n }\r\n setEmails(\"\");\r\n setPassword(\"\");\r\n setFirstName(\"\");\r\n setLastName(\"\");\r\n setConfirmPassword(\"\");\r\n setGenders(0);\r\n setIsSubscribed(false);\r\n setIsTerm(false);\r\n closeModal();\r\n } else {\r\n toast.error(customerData.Message, {\r\n theme: \"light\",\r\n });\r\n }\r\n setDisable(false);\r\n };\r\n\r\n const onFailure = (error) => {\r\n console.log(\"Login Failed:\", error);\r\n // Handle the error\r\n };\r\n\r\n async function openModal() {\r\n const response = await fetch(Global.API_URL + \"Gender/GetGenders\", {\r\n method: \"GET\",\r\n headers: {\r\n Accept: \"application/json\",\r\n \"Content-Type\": \"application/json\",\r\n \"Access-Control-Allow-Origin\": Global.HostAPI,\r\n CountryCode: countryCode,\r\n },\r\n });\r\n const result = await response.json();\r\n if (response.ok) {\r\n setGenders(result);\r\n }\r\n setOpen(true);\r\n setIsForget(false);\r\n }\r\n\r\n function closeModal() {\r\n setEmails(\"\");\r\n setPassword(\"\");\r\n setFirstName(\"\");\r\n setLastName(\"\");\r\n setConfirmPassword(\"\");\r\n setGenders(0);\r\n setIsSubscribed(false);\r\n setIsTerm(false);\r\n setOpen(false);\r\n setShow(false)\r\n setShowSidebar(false);\r\n }\r\n\r\n const MergeCart = async () => {\r\n const offset = new Date().getTimezoneOffset();\r\n let CurrencyId = currency.filter(\r\n (c) =>\r\n c.CountryCode.toLocaleUpperCase() === countryCode.toLocaleUpperCase()\r\n )[0]\r\n ? currency.filter(\r\n (c) =>\r\n c.CountryCode.toLocaleUpperCase() ===\r\n countryCode.toLocaleUpperCase()\r\n )[0]?.Id\r\n : currency.filter((c) => c.CountryCode.toLocaleUpperCase() === \"INT\")[0]\r\n ?.Id;\r\n const response = await fetch(\r\n Global.API_URL +\r\n \"Cart/MergeCartRequest/Language/\" +\r\n Cookies.get(\"Language\") +\r\n \"/Currency/\" +\r\n CurrencyId +\r\n \"/Offset/\" +\r\n offset +\r\n \"/Country/\" +\r\n countryCode,\r\n {\r\n method: \"PUT\",\r\n headers: {\r\n Accept: \"application/json\",\r\n \"Content-Type\": \"application/json\",\r\n AuthorizationCustomer: token,\r\n \"Access-Control-Allow-Origin\": Global.HostAPI,\r\n CountryCode: countryCode,\r\n },\r\n body: JSON.stringify({\r\n customerId: customerDetail,\r\n guestId: guest,\r\n Offset: offset,\r\n }),\r\n }\r\n );\r\n const result = await response.json();\r\n if (result.Code === 0) {\r\n dispatch(setCredential(data));\r\n dispatch(deleteAllFromCart());\r\n let promise;\r\n let cart = dispatch(\r\n GetCustomerCart(\r\n customerDetail,\r\n Cookies.get(\"Language\"),\r\n offset,\r\n Cookies.get(\"Country\"),\r\n data.customerToken\r\n ),\r\n Cookies.get(\"Country\")\r\n );\r\n promise = Promise.resolve(cart);\r\n promise.then((value) => {\r\n if (value !== -1) {\r\n dispatch(addAllToCart(value));\r\n }\r\n });\r\n setOpenMerge(false);\r\n }\r\n };\r\n\r\n useEffect(() => {\r\n let interval = null;\r\n if (timer > 0) {\r\n interval = setInterval(() => {\r\n setTimer((prevTimer) => prevTimer - 1);\r\n }, 1000);\r\n } else if (timer === 0) {\r\n setIsButtonDisabled(false);\r\n setIsSent(false);\r\n }\r\n return () => clearInterval(interval);\r\n }, [timer]);\r\n const ValidateOTP = async () => {\r\n const response = await fetch(Global.API_URL + \"Customer/ValidateTOTP\", {\r\n method: \"POST\",\r\n headers: {\r\n Accept: \"application/json\",\r\n \"Content-Type\": \"application/json\",\r\n \"Access-Control-Allow-Origin\": Global.HostAPI,\r\n countryCode: countryCode,\r\n },\r\n body: JSON.stringify({\r\n otpDeviceKey: otpDeviceKey,\r\n languageId: Cookies.get(\"Language\"),\r\n deviceToken: \"\",\r\n deviceType: 0,\r\n sixDigitCode: otp,\r\n }),\r\n });\r\n const result = await response.json();\r\n if (response.ok) {\r\n if (result.Code === 1) {\r\n toast.success(result.Message, { theme: \"light\" });\r\n if (\r\n cartlist.cartItemsCheckout &&\r\n cartlist.cartItemsCheckout.length > 0\r\n ) {\r\n setOpen(false);\r\n setShow(false)\r\n setOpenMerge(true);\r\n setCustomerDetail(result.customerReturn.CustomerId);\r\n setGuest(guestId);\r\n const credentials = {\r\n isLogged: false,\r\n guestId: \"\",\r\n customerId: result.customerReturn.CustomerId,\r\n customerToken: result.JwtToken,\r\n token: result.JwtToken,\r\n firstName: result.customerReturn.FirstName,\r\n lastName: result.customerReturn.LastName,\r\n email: result.customerReturn.Email,\r\n purchasedProducts: [],\r\n customer: result.CustomerSecret,\r\n };\r\n\r\n dispatch(setCredential(credentials));\r\n } else {\r\n const credentials = {\r\n isLogged: true,\r\n guestId: \"\",\r\n customerId: result.customerReturn.CustomerId,\r\n customerToken: result.JwtToken,\r\n token: result.JwtToken,\r\n firstName: result.customerReturn.FirstName,\r\n lastName: result.customerReturn.LastName,\r\n email: result.customerReturn.Email,\r\n purchasedProducts: [],\r\n customer: result.CustomerSecret,\r\n };\r\n\r\n dispatch(setCredential(credentials));\r\n navigate(`/${countryCode}/profile`);\r\n }\r\n }\r\n }\r\n };\r\n const ForgetOTP = async () => {\r\n closeModal();\r\n localStorage.setItem(\"acc\", otpDeviceKey);\r\n navigate(\"/\" + countryCode + \"/account-recovery\");\r\n };\r\n return (\r\n \r\n \r\n
\r\n \r\n ) : (\r\n \"\"\r\n )}\r\n\r\n {open ? (\r\n \r\n \r\n Merge Carts?\r\n \r\n closeMergeModal()}\r\n >\r\n ×\r\n \r\n
\r\n \r\n
\r\n Do you want to merge the cart?
\r\n\r\n closeMergeModal()}\r\n >\r\n Dismiss\r\n \r\n MergeCart()}\r\n >\r\n Merge Carts\r\n \r\n
\r\n \r\n
\r\n \r\n \r\n {/* \r\n \r\n {isForget\r\n ? \"Forgot Your Password?\"\r\n : dictionary.WelcomeToYourFashionHome}\r\n \r\n \r\n
\r\n {isForget ? (\r\n \r\n
\r\n ) : (\r\n \r\n
\r\n \r\n
\r\n \r\n
\r\n \r\n {errorMessage !== \"\" ? (\r\n
\r\n \r\n \r\n setErrorMessage(\"\")}\r\n >\r\n ×\r\n \r\n
\r\n ) : successMessage !== \"\" ? (\r\n \r\n setSuccessMessage(\"\")}\r\n >\r\n ×\r\n \r\n
\r\n ) : (\r\n \"\"\r\n )}\r\n \r\n
\r\n \r\n
\r\n \r\n {\" \"}\r\n Enter your email address and we'll send you a link\r\n to reset your password.{\" \"}\r\n
\r\n \r\n \r\n {dictionary.Email}\r\n \r\n setForgetEmail(e.target.value)}\r\n />\r\n {isSent ? (\r\n
\r\n \r\n {\" \"}\r\n Link will be sent in{\" \"}\r\n {timer} s\r\n
\r\n ) : (\r\n \"\"\r\n )}\r\n \r\n SendEmail()}\r\n >\r\n
\r\n SEND LINK
\r\n \r\n \r\n
\r\n \r\n \r\n {\r\n onSuccess(credentialResponse);\r\n }}\r\n onError={(error) => {\r\n onFailure(error);\r\n }}\r\n type=\"icon\"\r\n />\r\n \r\n
\r\n \r\n \r\n
\r\n \r\n \r\n
\r\n \r\n
\r\n \r\n \r\n
\r\n \r\n
\r\n \r\n \r\n
\r\n \r\n \r\n \r\n \r\n \r\n {dictionary.SignIn}\r\n \r\n \r\n\r\n \r\n \r\n {dictionary.ImNewHere}\r\n \r\n \r\n \r\n\r\n
\r\n \r\n\r\n \r\n \r\n
\r\n \r\n \r\n
\r\n \r\n
\r\n \r\n \r\n {dictionary.SignIn}\r\n \r\n
\r\n \r\n
\r\n \r\n \r\n {\r\n onSuccess(credentialResponse);\r\n }}\r\n onError={(error) => {\r\n onFailure(error);\r\n }}\r\n type=\"icon\"\r\n />\r\n \r\n
\r\n \r\n \r\n
\r\n \r\n
\r\n \r\n
\r\n \r\n \r\n \r\n setEmails(\r\n e.target.value.toLowerCase()\r\n )\r\n }\r\n required\r\n />\r\n
\r\n \r\n
\r\n \r\n
\r\n \r\n
\r\n \r\n \r\n
\r\n \r\n \r\n setPassword(e.target.value)\r\n }\r\n required\r\n />\r\n \r\n setShowPasswordRegister(\r\n !showPasswordRegister\r\n )\r\n }\r\n >\r\n {showPasswordRegister ? (\r\n
\r\n \r\n
\r\n \r\n
\r\n \r\n \r\n
\r\n \r\n \r\n setConfirmPassword(e.target.value)\r\n }\r\n required\r\n />\r\n \r\n setShowPasswordConfirm(\r\n !showPasswordConfirm\r\n )\r\n }\r\n >\r\n {showPasswordConfirm ? (\r\n
\r\n \r\n
\r\n\r\n \r\n
\r\n \r\n
\r\n \r\n \r\n setIsSubscribed(e.target.checked)\r\n }\r\n />\r\n \r\n
\r\n \r\n
\r\n \r\n \r\n {dictionary.SignUpForNewsLetter}\r\n
\r\n\r\n {dictionary.NewsLetter}\r\n
\r\n\r\n
\r\n\r\n \r\n
\r\n \r\n
\r\n \r\n \r\n setIsTerm(e.target.checked)\r\n }\r\n />\r\n \r\n
\r\n \r\n
\r\n \r\n \r\n I Have Already Read and Agreed To\r\n All{\" \"}\r\n \r\n Terms & Conditions\r\n \r\n
\r\n\r\n of Sheyaaka and All{\" \"}\r\n \r\n Data Protection Regulations\r\n {\" \"}\r\n of Sheyaaka. You are Entitled to Revoke\r\n Any Consent Granted By You At Any Time.\r\n
\r\n\r\n \r\n {dictionary.RegisterHere}\r\n \r\n
\r\n \r\n \r\n
\r\n \r\n \r\n
\r\n \r\n \r\n {\r\n onSuccess(credentialResponse);\r\n }}\r\n onError={(error) => {\r\n onFailure(error);\r\n }}\r\n type=\"icon\"\r\n />\r\n \r\n
\r\n\r\n \r\n \r\n
\r\n \r\n \r\n
*/}\r\n \r\n \r\n )}\r\n \r\n \r\n ) : (\r\n \"\"\r\n )}\r\n {openOTP ? (\r\n \r\n ForgetOTP()}\r\n >\r\n Don't have access to your OTP?\r\n
\r\n \r\n
\r\n \r\n Verify\r\n
\r\n\r\n
\r\n \r\n Verification Code\r\n
\r\n \r\n Enter verification code\r\n
\r\n \r\n
\r\n \r\n ValidateOTP()}\r\n className=\"btn btn-primary border-radius-5 text-white text-center w-100 mb-26 cursor-pointer\"\r\n >\r\n Enter\r\n \r\n
\r\n \r\n \r\n ) : (\r\n \"\"\r\n )}\r\n \r\n
\r\n \r\n );\r\n}\r\n\r\nconst ModalHeader = ({ closeModal, SizeChart }) => (\r\n \r\n \r\n {SizeChart}\r\n \r\n \r\n ×\r\n \r\n
\r\n);\r\n\r\nconst ModalBody = ({\r\n sizechart,\r\n HowToMeasureCorrectly,\r\n SizeChartAccurateResults,\r\n SizeChartResultOne,\r\n SizeChartResultThree,\r\n SizeChartResultTwo,\r\n SizeChartNote,\r\n setOpen,\r\n productId,\r\n isLogged,\r\n token,\r\n customerToken,\r\n}) => {\r\n const measurementAttributes = sizechart[0].measurementsWithValues.map(\r\n (m) => m.MeasurementAttributeName\r\n );\r\n return (\r\n \r\n {SizeChartNote}\r\n
\r\n );\r\n};\r\n\r\nexport default SizeChartModal;\r\n","import React, { useState, useEffect, useRef, Fragment } from \"react\";\r\nimport ReactModal from \"react-modal\";\r\nimport { Global } from \"../../../Global\";\r\nimport FindYourFitModal from \"../../features/modals/FindYourFitModal\";\r\nimport SizeChartModal from \"../../features/modals/SizeChartModal\";\r\nimport \"./ModalSidebar.css\";\r\nimport { useSelector, useDispatch } from \"react-redux\";\r\nimport Cookies from \"js-cookie\";\r\nimport { addAllToCart, AddToCart } from \"../../../store/slices/cart-slice\";\r\n\r\nconst SizeModal = ({\r\n isVisible,\r\n setIsVisible,\r\n setProductState,\r\n productState,\r\n dictionary,\r\n windowSize,\r\n customerToken,\r\n customerId,\r\n guestId,\r\n isLogged,\r\n token,\r\n hasSizeChart,\r\n productId,\r\n setHasSizeChart,\r\n setProductId,\r\n selectedVariation,\r\n setSelectedVariation,\r\n setShowSidebar,\r\n email\r\n}) => {\r\n const [activeIndex, setActiveIndex] = useState(0);\r\n const [showFindYourFit, setShowFindYourFit] = useState(false);\r\n const [showSizeChart, setShowSizeChart] = useState(false);\r\n const [sizechart, setSizeChart] = useState([]);\r\n const [measurements, setMeasurements] = useState([]);\r\n\r\n const dispatch = useDispatch();\r\n\r\n useEffect(() => {\r\n if (isVisible) {\r\n document.body.classList.add(\"modal-open\");\r\n } else {\r\n document.body.classList.remove(\"modal-open\");\r\n }\r\n }, [isVisible]);\r\n const handleSizeClick = (sizeId, i) => {\r\n // Update the selectedVariation sizes\r\n const updatedSizes = selectedVariation.size.map((size) =>\r\n size.sizeId === sizeId\r\n ? { ...size, IsSelectedvariation: true, IsSelected: true }\r\n : { ...size, IsSelectedvariation: false, IsSelected: false }\r\n );\r\n\r\n const updatedSelectedVariation = {\r\n ...selectedVariation,\r\n size: updatedSizes,\r\n };\r\n\r\n // Update the active index\r\n setActiveIndex(i);\r\n\r\n // Update the product state with the modified selectedVariation\r\n setProductState({\r\n ...productState,\r\n variants: productState.variants.map((variant) =>\r\n variant.color === selectedVariation.color\r\n ? updatedSelectedVariation\r\n : variant\r\n ),\r\n });\r\n setSelectedVariation(updatedSelectedVariation);\r\n };\r\n\r\n const closeModal = () => {\r\n setIsVisible(false);\r\n setShowFindYourFit(false);\r\n setShowFindYourFit(false);\r\n setProductId(0);\r\n setHasSizeChart(false);\r\n setSelectedVariation({});\r\n document.body.classList.remove(\"modal-open\");\r\n };\r\n const AddItemToCart = async () => {\r\n const updatedSizes = selectedVariation.size.map((size, i) => ({\r\n ...size,\r\n IsSelectedvariation: i === activeIndex,\r\n IsSelected: i === activeIndex,\r\n }));\r\n\r\n const updatedSelectedVariation = {\r\n ...selectedVariation,\r\n size: updatedSizes,\r\n };\r\n setProductState({\r\n ...productState,\r\n variants: productState.variants.map((variant) =>\r\n variant.color === selectedVariation.color\r\n ? updatedSelectedVariation\r\n : variant\r\n ),\r\n });\r\n setSelectedVariation(updatedSelectedVariation);\r\n const offset = new Date().getTimezoneOffset();\r\n let ProductVariationId = updatedSizes.filter(\r\n (s) => s.IsSelectedvariation && s.IsSelected\r\n )[0].ProductVariationId;\r\n let QuantityRemaining = productState.variations.filter(\r\n (v) => v.ProductVariationId === ProductVariationId\r\n )[0].QuantityRemaining;\r\n let IsInStock = productState.variations.filter(\r\n (v) => v.ProductVariationId === ProductVariationId\r\n )[0].IsInStock;\r\n if (parseInt(QuantityRemaining) > 0 && IsInStock) {\r\n if (window.fbq) {\r\n window.fbq(\"track\", \"AddToCart\", {\r\n content_ids: [productId],\r\n content_type: \"product\",\r\n value:\r\n parseFloat(selectedVariation.DiscountPercentage) > 0 ||\r\n selectedVariation.DiscountPercentage !== \"\"\r\n ? selectedVariation.FormattedSalePrice\r\n : selectedVariation.FormattedRegularPrice,\r\n currency: productState.Currency,\r\n });\r\n console.log(\"Add to cart\");\r\n }\r\n if (window.snaptr) {\r\n window.snaptr(\"track\", \"ADD_CART\", {\r\n currency: productState.Currency,\r\n price: parseFloat(selectedVariation.DiscountPercentage) > 0 ||\r\n selectedVariation.DiscountPercentage !== \"\"\r\n ? selectedVariation.FormattedSalePrice\r\n : selectedVariation.FormattedRegularPrice,\r\n item_ids: [ProductVariationId],\r\n item_category: productState.BrandName,\r\n number_items: 1,\r\n uuid_c1: isLogged ? customerId : guestId,\r\n user_email: isLogged ? email : \"\",\r\n });\r\n console.log(\"ADD_CART\");\r\n }\r\n if (typeof window !== \"undefined\" && window.gtag) {\r\n window.gtag(\"event\", \"add_to_cart\", {\r\n currency: productState.Currency,\r\n value:\r\n parseFloat(selectedVariation.DiscountPercentage) > 0\r\n ? selectedVariation.FormattedSalePrice\r\n : selectedVariation.FormattedRegularPrice,\r\n items: [\r\n {\r\n item_id: ProductVariationId,\r\n price:\r\n parseFloat(selectedVariation.DiscountPercentage) > 0\r\n ? selectedVariation.FormattedSalePrice\r\n : selectedVariation.FormattedRegularPrice,\r\n quantity: 1,\r\n },\r\n ],\r\n });\r\n console.log(\"google Tag\");\r\n }\r\n let cart = dispatch(\r\n AddToCart(\r\n customerId,\r\n guestId,\r\n Cookies.get(\"Language\"),\r\n ProductVariationId,\r\n 1,\r\n isLogged,\r\n offset,\r\n Cookies.get(\"Country\"),\r\n customerToken,\r\n token,\r\n false\r\n )\r\n );\r\n let promise = Promise.resolve(cart);\r\n promise.then((value) => {\r\n dispatch(addAllToCart(value.CartWithItems));\r\n setIsVisible(false);\r\n setSelectedVariation({});\r\n setShowSidebar(true);\r\n \r\n });\r\n }\r\n };\r\n\r\n const selectedColor = selectedVariation;\r\n\r\n useEffect(() => {\r\n const handleScroll = (event) => {\r\n setActiveIndex((prev) => {\r\n let newIndex = event.deltaY > 0 ? prev + 1 : prev - 1;\r\n // Keep index within bounds\r\n newIndex = Math.max(\r\n 0,\r\n Math.min(newIndex, selectedColor.size.length - 1)\r\n );\r\n return newIndex;\r\n });\r\n };\r\n\r\n window.addEventListener(\"wheel\", handleScroll);\r\n\r\n // Cleanup\r\n return () => window.removeEventListener(\"wheel\", handleScroll);\r\n }, [selectedColor.size.length]);\r\n useEffect(() => {\r\n let Language;\r\n if (Cookies.get(\"Language\")) {\r\n Language = Cookies.get(\"Language\");\r\n } else {\r\n Cookies.set(\"Language\", 1, { expires: 31536000 });\r\n Language = 1;\r\n }\r\n const fetchSizeChart = async () => {\r\n const responseSizeChart = await fetch(\r\n Global.API_URL +\r\n \"FindYourFit/ProductSizeChart/Product/\" +\r\n productId +\r\n \"/Language/\" +\r\n Language,\r\n {\r\n method: \"GET\",\r\n headers: {\r\n Accept: \"application/json\",\r\n \"Content-Type\": \"application/json\",\r\n \"Access-Control-Allow-Origin\": Global.HostAPI,\r\n AuthorizationCustomer: isLogged ? customerToken : token,\r\n countryCode: Cookies.get(\"Country\"),\r\n },\r\n }\r\n );\r\n if (!responseSizeChart.ok) {\r\n throw new Error(\"Something went wrong!\");\r\n } else {\r\n const resultSizeChart = await responseSizeChart.json();\r\n\r\n setSizeChart(resultSizeChart);\r\n setMeasurements(resultSizeChart[0].measurementsWithValues);\r\n }\r\n };\r\n if (productId !== 0 && hasSizeChart) {\r\n fetchSizeChart();\r\n }\r\n }, [productId, hasSizeChart]);\r\n return (\r\n \r\n
\r\n \r\n \r\n \r\n \r\n \r\n Size \r\n {measurementAttributes.map((attribute) => (\r\n \r\n {attribute}\r\n \r\n ))}\r\n \r\n \r\n \r\n {sizechart.map((size) => (\r\n \r\n {size.SizeName} \r\n {measurementAttributes.map((attribute) => (\r\n \r\n {\r\n size.measurementsWithValues.find(\r\n (m) => m.MeasurementAttributeName === attribute\r\n ).SizeChartValueString\r\n }\r\n \r\n ))}\r\n \r\n ))}\r\n \r\n \r\n
\r\n \r\n
\r\n \r\n
\r\n {HowToMeasureCorrectly}
\r\n {SizeChartAccurateResults}
\r\n {SizeChartResultOne}
\r\n {SizeChartResultTwo}
\r\n {SizeChartResultThree}
\r\n \r\n {isVisible && (\r\n \r\n {\r\n setIsVisible(false);\r\n setShowSizeChart(true);\r\n }}\r\n type=\"button\"\r\n >\r\n
\r\n \r\n ) : (\r\n \"\"\r\n )}\r\n\r\n \r\n
\r\n \r\n \r\n \r\n
\r\n \r\n
\r\n \r\n
\r\n \r\n {selectedColor?.size.map((size, i) => (\r\n handleSizeClick(size.sizeId, i)}\r\n className={`item row ${\r\n i === activeIndex ? \"active text-primary\" : \"opacity-50\"\r\n }`}\r\n >\r\n \r\n
\r\n ))}\r\n {size.sizeSuffix}
\r\n \r\n \r\n {hasSizeChart ? (\r\n \r\n {\r\n setIsVisible(false);\r\n setShowFindYourFit(true);\r\n }}\r\n type=\"button\"\r\n >\r\n
\r\n \r\n Find Your Fit\r\n
\r\n \r\n Show Size Chart\r\n
\r\n \r\n AddItemToCart()}\r\n type=\"button\"\r\n className=\"btn btn-primary d-flex align-items-center justify-content-center text-white fs-14 px-44 py-12 text-uppercase\"\r\n >\r\n Add to Cart\r\n \r\n
\r\n \r\n \r\n \r\n )}\r\n \r\n
\r\n );\r\n}\r\n\r\nexport default React.memo( PageHeader );","// src/components/Pagination.js\r\nimport React from \"react\";\r\n\r\nfunction Pagination({ totalPages, page, GetProductsByPage }) {\r\n const getVisiblePages = (page, total) => {\r\n const visiblePages = [];\r\n let startPage = Math.max(1, page - 2);\r\n let endPage = Math.min(total, page + 4);\r\n\r\n if (endPage - startPage < 3) {\r\n if (startPage === 1) {\r\n endPage = Math.min(total, startPage + 3);\r\n } else if (endPage === total) {\r\n startPage = Math.max(1, endPage - 3);\r\n }\r\n }\r\n\r\n for (let i = startPage; i <= endPage; i++) {\r\n visiblePages.push(i);\r\n }\r\n\r\n return visiblePages;\r\n };\r\n\r\n const visiblePages = getVisiblePages(parseInt(page), totalPages.length);\r\n\r\n return (\r\n \r\n );\r\n}\r\n\r\nexport default Pagination;\r\n","import React, { useState, useEffect, useRef, Fragment } from \"react\";\r\nimport LazyLoad from \"react-lazyload\";\r\nimport { useParams } from \"react-router-dom\";\r\nimport ALink from \"../../features/alink\";\r\n\r\nimport { Global } from \"../../../Global\";\r\nimport { Swiper, SwiperSlide } from \"swiper/react\";\r\n\r\nimport \"swiper/css\";\r\nimport SwiperCore, { Navigation } from \"swiper\";\r\nimport { useSelector, useDispatch } from \"react-redux\";\r\nimport Cookies from \"js-cookie\";\r\nimport { addAllToCart, AddToCart } from \"../../../store/slices/cart-slice\";\r\nimport SizeModal from \"../modals/SizeModal\";\r\n\r\nSwiperCore.use([Navigation]);\r\n\r\nfunction ProductTwelve(props) {\r\n const {\r\n product,\r\n variation,\r\n handleButtonHover,\r\n windowSize,\r\n setShowSidebar,\r\n onWishlistClick,\r\n addWishList,\r\n showSidebar\r\n } = props;\r\n const dispatch = useDispatch();\r\n const { dictionary } = useSelector((state) => state.dictionary);\r\n const isLogged = useSelector((state) => state.credential.isLogged);\r\n const token = useSelector((state) => state.credential.token);\r\n const customerToken = useSelector((state) => state.credential.customerToken);\r\n const guestId = useSelector((state) => state.credential.guestId);\r\n const customerId = useSelector((state) => state.credential.customerId);\r\n const email = useSelector((state) => state.credential.email);\r\n const [productState, setProductState] = useState(product);\r\n const [variationState, setVariationState] = useState(variation);\r\n const [isVisible, setIsVisible] = useState(false);\r\n const [selectedVariation, setSelectedVariation] = useState({});\r\n const swiperRef = useRef(null);\r\n const [currentSlide, setCurrentSlide] = useState(0);\r\n const cartlist = useSelector((state) => state.cart.cartItems);\r\n const [productId, setProductId] = useState(0);\r\n const [hasSizeChart, setHasSizeChart] = useState(false);\r\n\r\n const [isHovered, setIsHovered] = useState(false);\r\n\r\n let { country } = useParams();\r\n\r\n const handleSlideChange = (swiper) => {\r\n setCurrentSlide(swiper.activeIndex);\r\n };\r\n useEffect(() => {\r\n setProductState(product);\r\n setVariationState(variation);\r\n }, [product, variation]);\r\n\r\n const AddItemToCart = async (ProductVariationId) => {\r\n const updatedProduct = { ...productState };\r\n const offset = new Date().getTimezoneOffset();\r\n if (\r\n productState.variations.some(\r\n (v) =>\r\n parseInt(v.ProductVariationId) === parseInt(ProductVariationId) &&\r\n v.QuantityRemaining > 0\r\n )\r\n ) {\r\n const productId = productState.variations.some(\r\n (v) =>\r\n parseInt(v.ProductVariationId) === parseInt(ProductVariationId) &&\r\n v.QuantityRemaining > 0\r\n )\r\n ? productState.ProductId\r\n : null;\r\n if (window.fbq) {\r\n window.fbq(\"track\", \"AddToCart\", {\r\n content_ids: [productId],\r\n content_type: \"product\",\r\n value:\r\n parseFloat(variationState.DiscountPercentage) > 0 ||\r\n variationState.DiscountPercentage !== \"\"\r\n ? variationState.FormattedSalePrice\r\n : variationState.FormattedRegularPrice,\r\n currency: productState.Currency,\r\n });\r\n console.log(\"Add to cart\");\r\n }\r\n if (window.snaptr) {\r\n window.snaptr(\"track\", \"ADD_CART\", {\r\n currency: productState.Currency,\r\n price: parseFloat(variationState.DiscountPercentage) > 0 ||\r\n variationState.DiscountPercentage !== \"\"\r\n ? variationState.FormattedSalePrice\r\n : variationState.FormattedRegularPrice,\r\n item_ids: [ProductVariationId],\r\n item_category: productState.BrandName,\r\n number_items: 1,\r\n uuid_c1: isLogged ? customerId : guestId,\r\n user_email: isLogged ? email : \"\",\r\n });\r\n console.log(\"ADD_CART\");\r\n }\r\n if (typeof window !== \"undefined\" && window.gtag) {\r\n window.gtag(\"event\", \"add_to_cart\", {\r\n currency: productState.Currency,\r\n value:\r\n parseFloat(variationState.DiscountPercentage) > 0\r\n ? variationState.FormattedSalePrice\r\n : variationState.FormattedRegularPrice,\r\n items: [\r\n {\r\n item_id: ProductVariationId,\r\n price:\r\n parseFloat(variationState.DiscountPercentage) > 0\r\n ? variationState.FormattedSalePrice\r\n : variationState.FormattedRegularPrice,\r\n quantity: 1,\r\n },\r\n ],\r\n });\r\n console.log(\"google Tag\");\r\n }\r\n let cart = dispatch(\r\n AddToCart(\r\n customerId,\r\n guestId,\r\n Cookies.get(\"Language\"),\r\n ProductVariationId,\r\n 1,\r\n isLogged,\r\n offset,\r\n Cookies.get(\"Country\"),\r\n customerToken,\r\n token,\r\n false\r\n )\r\n );\r\n let promise = Promise.resolve(cart);\r\n promise.then((value) => {\r\n dispatch(addAllToCart(value.CartWithItems));\r\n setIsVisible(false);\r\n setSelectedVariation({});\r\n setShowSidebar(true);\r\n });\r\n }\r\n\r\n updatedProduct.variants.forEach((c) => {\r\n if (c.IsSelected) {\r\n c.size.forEach((s) => {\r\n s.IsSelectedvariation = s.ProductVariationId === ProductVariationId;\r\n });\r\n }\r\n });\r\n setProductState(updatedProduct);\r\n };\r\n\r\n const changeColor = (color) => {\r\n const updatedProduct = { ...productState };\r\n\r\n updatedProduct.variants.forEach((c) => {\r\n if (c.color === color.color) {\r\n c.IsSelected = true;\r\n } else {\r\n c.IsSelected = false;\r\n }\r\n });\r\n let isFirstColor = true;\r\n\r\n updatedProduct.variations.forEach((v, index) => {\r\n if (v.ColorHex === color.color && isFirstColor) {\r\n updatedProduct.variations[index].IsSelected = isFirstColor;\r\n isFirstColor = false;\r\n } else {\r\n updatedProduct.variations[index].IsSelected = false;\r\n }\r\n });\r\n setVariationState(updatedProduct.variations.filter((v) => v.IsSelected)[0]);\r\n\r\n setProductState(updatedProduct);\r\n };\r\n \r\n\r\n const handleClick = async (item, productItem) => {\r\n setProductId(productItem.ProductId);\r\n setHasSizeChart(productItem.HasSizeChart);\r\n setSelectedVariation(productItem.variants.filter((s) => s.IsSelected)[0]);\r\n const offset = new Date().getTimezoneOffset();\r\n if (item.SizeId && item.SizeId !== 0) {\r\n setIsVisible(!isVisible);\r\n } else {\r\n if (parseInt(item.QuantityRemaining) > 0 && item.IsInStock) {\r\n if (window.fbq) {\r\n window.fbq(\"track\", \"AddToCart\", {\r\n content_ids: [productItem.ProductId],\r\n content_type: \"product\",\r\n value:\r\n parseFloat(variationState.DiscountPercentage) > 0 ||\r\n variationState.DiscountPercentage !== \"\"\r\n ? variationState.FormattedSalePrice\r\n : variationState.FormattedRegularPrice,\r\n currency: productState.Currency,\r\n });\r\n console.log(\"Add to cart\");\r\n }\r\n if (window.snaptr) {\r\n window.snaptr(\"track\", \"ADD_CART\", {\r\n currency: productState.Currency,\r\n price: parseFloat(variationState.DiscountPercentage) > 0 ||\r\n variationState.DiscountPercentage !== \"\"\r\n ? variationState.FormattedSalePrice\r\n : variationState.FormattedRegularPrice,\r\n item_ids: [item.ProductVariationId],\r\n item_category: product.BrandName,\r\n number_items: 1,\r\n uuid_c1: isLogged ? customerId : guestId,\r\n user_email: isLogged ? email : \"\",\r\n });\r\n console.log(\"ADD_CART\");\r\n }\r\n if (window.gtag) {\r\n window.gtag(\"event\", \"add_to_cart\", {\r\n currency: productState.Currency,\r\n value:\r\n parseFloat(variationState.DiscountPercentage) > 0\r\n ? variationState.FormattedSalePrice\r\n : variationState.FormattedRegularPrice,\r\n items: [\r\n {\r\n item_id: item.ProductVariationId,\r\n price:\r\n parseFloat(variationState.DiscountPercentage) > 0\r\n ? variationState.FormattedSalePrice\r\n : variationState.FormattedRegularPrice,\r\n quantity: 1,\r\n },\r\n ],\r\n });\r\n console.log(\"google Tag\");\r\n }\r\n let cart = dispatch(\r\n AddToCart(\r\n customerId,\r\n guestId,\r\n Cookies.get(\"Language\"),\r\n item.ProductVariationId,\r\n 1,\r\n isLogged,\r\n offset,\r\n Cookies.get(\"Country\"),\r\n customerToken,\r\n token,\r\n false\r\n )\r\n );\r\n let promise = Promise.resolve(cart);\r\n promise.then((value) => {\r\n dispatch(addAllToCart(value.CartWithItems));\r\n setIsVisible(false);\r\n setSelectedVariation({});\r\n setShowSidebar(true);\r\n });\r\n }\r\n }\r\n };\r\n\r\n return (\r\n \r\n
\r\n { title }{ subTitle }{subSubTitle && {subSubTitle}}
\r\n\r\n {product.IsInWishList ? (\r\n \r\n onWishlistClick(variationState, product, product.IsInWishList)\r\n }\r\n >\r\n {\"\"}\r\n \r\n ) : (\r\n \r\n onWishlistClick(variationState, product, product.IsInWishList)\r\n }\r\n aria-label=\"Add to Wishlist\"\r\n >\r\n {\"\"}\r\n \r\n )}\r\n
\r\n ) : (\r\n \"\"\r\n )}\r\n\r\n {productState.variants &&\r\n productState.variants.every((variant, index) =>\r\n variant.size.every((size) => size.sizeId !== 0)\r\n ) ? (\r\n windowSize ? (\r\n \r\n \r\n
\r\n \r\n
\r\n {variationState ? (\r\n \r\n {parseFloat(variationState.DiscountPercentage) > 0 ||\r\n variationState.DiscountPercentage !== \"\" ? (\r\n \r\n ) : (\r\n \"\"\r\n )}\r\n\r\n {productState.variants && productState.variants.length > 0 ? (\r\n
\r\n ) : (\r\n \"\"\r\n )}\r\n \r\n \r\n );\r\n}\r\n\r\nexport default ProductTwelve;\r\n","import React, { useEffect, useRef } from \"react\";\r\n\r\nfunction StickyHeader(props) {\r\n const { top = 50 } = props;\r\n const ref = useRef(null);\r\n // const [ height, setHeight ] = useState( 'auto' );\r\n\r\n useEffect(() => {\r\n const scrollHandler = () => {\r\n if (ref.current) {\r\n let stickyContent = ref.current.children[0];\r\n if (stickyContent) {\r\n if (window.pageYOffset > top) {\r\n if (!stickyContent.classList.contains(\"fixed\")) {\r\n stickyContent.classList.add(\"fixed\");\r\n }\r\n } else if (stickyContent.classList.contains(\"fixed\")) {\r\n stickyContent.classList.remove(\"fixed\");\r\n } else {\r\n // setHeight( stickyContent.offsetHeight + 'px' );\r\n }\r\n }\r\n }\r\n };\r\n\r\n const resizeHandler = () => {\r\n // let stickyContent = ref.current.children[ 0 ];\r\n // setHeight( stickyContent.offsetHeight + 'px' );\r\n scrollHandler();\r\n };\r\n\r\n scrollHandler();\r\n window.addEventListener(\"scroll\", scrollHandler, { passive: true });\r\n window.addEventListener(\"resize\", resizeHandler, { passive: true });\r\n\r\n return () => {\r\n window.removeEventListener(\"scroll\", scrollHandler);\r\n window.removeEventListener(\"resize\", resizeHandler);\r\n };\r\n }, [top]);\r\n\r\n return (\r\n \r\n \r\n {productState.BrandName}\r\n \r\n
\r\n \r\n \r\n {\r\n windowSize ? (\r\n \r\n{productState.ShortDescription.length > 39\r\n ? productState.ShortDescription.substring(0, 39) + \"...\"\r\n : productState.ShortDescription}\r\n \r\n ) : (\r\n \r\n {productState.ShortDescription.length > 22\r\n ? productState.ShortDescription.substring(0, 22) + \"...\"\r\n : productState.ShortDescription}\r\n \r\n )\r\n }\r\n \r\n \r\n
\r\n {variationState ? (\r\n \r\n \r\n {productState.Currency}\r\n {\" \" + variationState.FormattedSalePrice}\r\n \r\n \r\n {productState.Currency}\r\n {\" \" + variationState.FormattedRegularPrice}\r\n \r\n
\r\n ) : (\r\n \r\n {productState.Currency}\r\n {\" \" + variationState.FormattedRegularPrice}\r\n
\r\n )}\r\n \r\n handleClick(variationState, productState)}\r\n >\r\n
\r\n ) : (\r\n \"\"\r\n )}\r\n \r\n {productState.variants.map((item, index) => {\r\n if (item.color === \"MultiColor\") {\r\n return (\r\n changeColor(item)}\r\n title={item.color_name}\r\n >\r\n {item.color_name}\r\n \r\n );\r\n } else if (item.color === \"\") {\r\n return (\r\n changeColor(item)}\r\n title={item.color_name}\r\n >\r\n {item.color_name}\r\n \r\n );\r\n } else {\r\n return (\r\n changeColor(item)}\r\n title={item.color_name}\r\n >\r\n {item.color_name}\r\n \r\n );\r\n }\r\n })}\r\n
\r\n {variationState && variationState.QuantityRemaining > 0 ? (\r\n \r\n NavigateToMenu(\"home\")}>\r\n
\r\n );\r\n}\r\n\r\nexport default BottomMenu;\r\n","import React, { useState, useEffect, Fragment } from \"react\";\r\nimport { useDispatch, useSelector } from \"react-redux\";\r\nimport ALink from \"../../features/alink\";\r\nimport Cookies from \"js-cookie\";\r\nimport BottomMenu from \"./BottomMenu\";\r\nimport { GetFooter, setFooter } from \"../../../store/slices/widget-slice\";\r\n\r\nfunction Footer() {\r\n const [isBottomSticky, setIsBottomSticky] = useState(false);\r\n const [footerContent, setFooterContent] = useState([]);\r\n const selectedParent = useSelector((state) => state.menu.selectedParent);\r\n const isLogged = useSelector((state) => state.credential.isLogged);\r\n const token = useSelector((state) => state.credential.token);\r\n const customerToken = useSelector((state) => state.credential.customerToken);\r\n const footer = useSelector((state) => state.widget.footer);\r\n const { dictionary } = useSelector((state) => state.dictionary);\r\n const dispatch = useDispatch();\r\n // const [value, setValue] = React.useState(0);\r\n // const [ containerClass, setContainerClass ] = useState( 'container' );\r\n\r\n useEffect(() => {\r\n handleBottomSticky();\r\n // setContainerClass( router.asPath.includes( 'fullwidth' ) ? 'container-fluid' : 'container' );\r\n }, []);\r\n\r\n useEffect(() => {\r\n window.addEventListener(\"resize\", handleBottomSticky, { passive: true });\r\n return () => {\r\n window.removeEventListener(\"resize\", handleBottomSticky);\r\n };\r\n }, []);\r\n\r\n function handleBottomSticky() {\r\n setIsBottomSticky(\r\n window.location.pathname.includes(\"product/default\") &&\r\n window.innerWidth > 991\r\n );\r\n }\r\n useEffect(() => {\r\n let promise;\r\n let footer = dispatch(GetFooter(1));\r\n promise = Promise.resolve(footer, isLogged, customerToken, token);\r\n promise.then((value) => {\r\n if (value !== -1) {\r\n const filteredContent = value.map((page) => ({\r\n ...page,\r\n widgetUsingPageIdModels: page.widgetUsingPageIdModels.filter(\r\n (widget) => widget.ParentCategoryId === selectedParent\r\n ),\r\n }));\r\n setFooterContent(filteredContent);\r\n dispatch(setFooter(value));\r\n }\r\n });\r\n }, [selectedParent, dispatch, customerToken, isLogged, token]);\r\n const filteredContent = footer?.map((page) => ({\r\n ...page,\r\n widgetUsingPageIdModels: page.widgetUsingPageIdModels?.filter(\r\n (widget) => widget.ParentCategoryId === selectedParent\r\n ),\r\n }));\r\n return (\r\n \r\n
\r\n );\r\n};\r\n\r\nexport default ProductItemSkeleton;\r\n","import React, { useState, useEffect, Fragment, useRef } from \"react\";\r\nimport \"./ModalSidebar.css\"; // Add your custom styles here\r\nimport ProductItemSkeleton from \"./ProductItemSkeleton\";\r\nimport ReactModal from \"react-modal\";\r\nimport { Swiper, SwiperSlide } from \"swiper/react\";\r\nimport \"swiper/css\";\r\nimport {\r\n GetCustomerCart,\r\n GetGuestCart,\r\n GetProductsMayAlsoLike,\r\n} from \"../../../store/slices/credential-slice\";\r\nimport {\r\n addAllToWishlist,\r\n GetWishlistItems,\r\n UpdateWishlistCount,\r\n} from \"../../../store/slices/wishlist-slice\";\r\nimport { useDispatch, useSelector } from \"react-redux\";\r\nimport Cookies from \"js-cookie\";\r\nimport { Global } from \"../../../Global\";\r\nimport { useNavigate, useParams } from \"react-router-dom\";\r\nimport {\r\n addAllToCart,\r\n RemoveItemFromCart,\r\n MoveItemsTowishList,\r\n AddToCart,\r\n} from \"../../../store/slices/cart-slice\";\r\nimport Offcanvas from \"react-bootstrap/Offcanvas\";\r\nimport MobileLogin from \"./MobileLogin\";\r\nconst ModalSidebar = ({\r\n showSidebar,\r\n setShowSidebar,\r\n windowSize,\r\n dictionary,\r\n cartlist,\r\n isLogged,\r\n guestId,\r\n customerId,\r\n customerToken,\r\n token,\r\n}) => {\r\n const swiperRef = useRef(null);\r\n const [activeIndex, setActiveIndex] = useState(0);\r\n const wishlistItems = useSelector((state) => state.wishlist.wishlistItems);\r\n const [showSmallModal, setShowSmallModal] = useState(false);\r\n const [isLoadingCart, setIsLoadingCart] = useState(true);\r\n const { country } = useParams();\r\n const dispatch = useDispatch();\r\n const navigate = useNavigate();\r\n const [showCartModal, setShowCartModal] = useState(true);\r\n const [show, setShow] = useState(false);\r\n const [showCanvas, setShowCanvas] = useState(false);\r\n const [open, setOpen] = useState(false);\r\n\r\n const [cart, setCart] = useState({\r\n CartFinalTotal: 0,\r\n CartId: 0,\r\n CartTotal: 0,\r\n Currency: \"\",\r\n CurrencySymbol: \"\",\r\n Discount: \"\",\r\n DiscountPercentage: \"\",\r\n FormattedCartFinalTotal: \"\",\r\n FormattedCartTotal: \"\",\r\n FormattedOriginalCartFinalTotal: \"\",\r\n FormattedOriginalCartTotal: \"\",\r\n IsVATIncluded: true,\r\n PromoCodeDiscount: null,\r\n cartItemsCheckout: [],\r\n });\r\n const [crossProductList, setCrossProductList] = useState([]);\r\n const [disableQuantity, setDisableQuantity] = useState(false);\r\n\r\n const handlePrev = () => {\r\n if (activeIndex > 0) {\r\n setActiveIndex(activeIndex - 1);\r\n swiperRef.current.swiper.slidePrev();\r\n }\r\n };\r\n\r\n const handleNext = () => {\r\n if (activeIndex < crossProductList.length - 1) {\r\n setActiveIndex(activeIndex + 1);\r\n swiperRef.current.swiper.slideNext();\r\n }\r\n };\r\n\r\n const handleClose = () => {\r\n setShow(false);\r\n setShowCanvas(false);\r\n setShowSidebar(false);\r\n };\r\n\r\n const SignRegister = () => {\r\n setShow(false);\r\n };\r\n const ContinueAsaGuest = () => {\r\n closeModal();\r\n navigate(`/${Cookies.get(\"Country\")}/shopping-cart`);\r\n };\r\n\r\n const ProceedToSecureCheckout = async () => {\r\n if (windowSize) {\r\n closeModal();\r\n navigate(`/${Cookies.get(\"Country\")}/shopping-bag`);\r\n } else {\r\n if (isLogged) {\r\n closeModal();\r\n navigate(`/${Cookies.get(\"Country\")}/shopping-cart`);\r\n } else {\r\n setShowCanvas(true);\r\n setShow(true);\r\n setShowCartModal(false);\r\n }\r\n }\r\n };\r\n\r\n const MoveTowishList = (productVariationId) => {\r\n const offset = new Date().getTimezoneOffset();\r\n setIsLoadingCart(true);\r\n let Language;\r\n if (Cookies.get(\"Language\")) {\r\n Language = Cookies.get(\"Language\");\r\n } else {\r\n Language = 1;\r\n }\r\n let promiseWishList;\r\n let wishListResult = [...wishlistItems];\r\n setIsLoadingCart(true);\r\n let cart = dispatch(\r\n MoveItemsTowishList(\r\n customerId,\r\n guestId,\r\n Cookies.get(\"Language\"),\r\n productVariationId,\r\n isLogged,\r\n offset,\r\n Cookies.get(\"Country\"),\r\n customerToken,\r\n token,\r\n true\r\n )\r\n );\r\n let promise = Promise.resolve(cart);\r\n promise.then((value) => {\r\n if (value !== -1) {\r\n dispatch(addAllToCart(value.CartWithItems));\r\n setCart(value.CartWithItems);\r\n setIsLoadingCart(false);\r\n\r\n const WishList = dispatch(\r\n GetWishlistItems(\r\n isLogged,\r\n customerId,\r\n guestId,\r\n customerToken,\r\n token,\r\n 0,\r\n Language,\r\n offset,\r\n Cookies.get(\"Country\"),\r\n false\r\n )\r\n );\r\n promiseWishList = Promise.resolve(WishList);\r\n promiseWishList\r\n .then((value) => {\r\n if (value !== -1) {\r\n dispatch(UpdateWishlistCount(value.Count));\r\n const uniqueArray = [...wishListResult, ...value.wishlistProducts]\r\n .reduce((map, product) => {\r\n if (!map.has(product.ProductId)) {\r\n map.set(product.ProductId, product);\r\n }\r\n return map;\r\n }, new Map())\r\n .values();\r\n\r\n const AllwishlistItems = Array.from(uniqueArray);\r\n dispatch(addAllToWishlist(AllwishlistItems));\r\n } else {\r\n dispatch(UpdateWishlistCount(0));\r\n dispatch(addAllToWishlist([]));\r\n }\r\n })\r\n .catch((error) => {\r\n // console.error(\"Error fetching cart:\", error);\r\n });\r\n }\r\n setIsLoadingCart(false);\r\n });\r\n };\r\n\r\n function increment(max, value, ProductVariationId) {\r\n const offset = new Date().getTimezoneOffset();\r\n if (max <= 0 || value >= max || disableQuantity) return;\r\n var current = value + 1;\r\n setDisableQuantity(true);\r\n setIsLoadingCart(true);\r\n let cart = dispatch(\r\n AddToCart(\r\n customerId,\r\n guestId,\r\n Cookies.get(\"Language\"),\r\n ProductVariationId,\r\n current,\r\n isLogged,\r\n offset,\r\n Cookies.get(\"Country\"),\r\n customerToken,\r\n token,\r\n true\r\n )\r\n );\r\n let promise = Promise.resolve(cart);\r\n promise.then((value) => {\r\n setDisableQuantity(false);\r\n setIsLoadingCart(false);\r\n dispatch(addAllToCart(value.CartWithItems));\r\n setCart(value.CartWithItems);\r\n });\r\n }\r\n\r\n function decrement(value, ProductVariationId) {\r\n const offset = new Date().getTimezoneOffset();\r\n if (value > 1 && !disableQuantity) {\r\n var current = value - 1;\r\n setDisableQuantity(true);\r\n setIsLoadingCart(true);\r\n let cart = dispatch(\r\n AddToCart(\r\n customerId,\r\n guestId,\r\n Cookies.get(\"Language\"),\r\n ProductVariationId,\r\n current,\r\n isLogged,\r\n offset,\r\n Cookies.get(\"Country\"),\r\n customerToken,\r\n token,\r\n true\r\n )\r\n );\r\n let promise = Promise.resolve(cart);\r\n promise.then((value) => {\r\n setDisableQuantity(false);\r\n setIsLoadingCart(false);\r\n dispatch(addAllToCart(value.CartWithItems));\r\n setCart(value.CartWithItems);\r\n });\r\n }\r\n }\r\n\r\n const RemoveFromCart = (ProductVariationId) => {\r\n const offset = new Date().getTimezoneOffset();\r\n setIsLoadingCart(true);\r\n let cart = dispatch(\r\n RemoveItemFromCart(\r\n customerId,\r\n guestId,\r\n Cookies.get(\"Language\"),\r\n ProductVariationId,\r\n isLogged,\r\n offset,\r\n Cookies.get(\"Country\"),\r\n customerToken,\r\n token\r\n )\r\n );\r\n let promise = Promise.resolve(cart);\r\n promise.then((value) => {\r\n if (value !== -1) {\r\n dispatch(addAllToCart(value.CartWithItems));\r\n setCart(value.CartWithItems);\r\n if (value.CartWithItems.cartItemsCheckout.length > 0) {\r\n if (isLogged) {\r\n let cross = dispatch(\r\n GetProductsMayAlsoLike(\r\n customerToken,\r\n value.CartWithItems.cartItemsCheckout[\r\n value.CartWithItems.cartItemsCheckout.length - 1\r\n ].ProductId,\r\n Cookies.get(\"Language\"),\r\n offset,\r\n Cookies.get(\"Country\"),\r\n 2\r\n )\r\n );\r\n promise = Promise.resolve(cross);\r\n promise.then((value) => {\r\n if (value !== -1) {\r\n setCrossProductList(value.AlsoLikeProducts);\r\n }\r\n });\r\n } else {\r\n let cross = dispatch(\r\n GetProductsMayAlsoLike(\r\n token,\r\n value.CartWithItems.cartItemsCheckout[\r\n value.CartWithItems.cartItemsCheckout.length - 1\r\n ].ProductId,\r\n Cookies.get(\"Language\"),\r\n offset,\r\n Cookies.get(\"Country\"),\r\n 1\r\n )\r\n );\r\n promise = Promise.resolve(cross);\r\n promise.then((value) => {\r\n if (value !== -1) {\r\n setCrossProductList(value.AlsoLikeProducts);\r\n }\r\n });\r\n }\r\n } else {\r\n setCrossProductList([]);\r\n }\r\n }\r\n setIsLoadingCart(false);\r\n });\r\n };\r\n const NavigateToProduct = (ProductId) => {\r\n setShowSidebar(false);\r\n setShowSmallModal(false);\r\n navigate(\"/\" + country + \"/product/\" + ProductId);\r\n };\r\n useEffect(() => {\r\n if (showSidebar) {\r\n const offset = new Date().getTimezoneOffset();\r\n let promise;\r\n document.body.classList.add(\"modal-open\");\r\n setShowSmallModal(false);\r\n setShowCartModal(true);\r\n if (isLogged) {\r\n let cart = dispatch(\r\n GetCustomerCart(\r\n customerId,\r\n Cookies.get(\"Language\"),\r\n offset,\r\n Cookies.get(\"Country\"),\r\n customerToken\r\n ),\r\n Cookies.get(\"Country\")\r\n );\r\n promise = Promise.resolve(cart);\r\n promise.then((value) => {\r\n if (value !== -1) {\r\n setCart(value);\r\n\r\n dispatch(addAllToCart(value));\r\n setIsLoadingCart(false);\r\n if (value.cartItemsCheckout.length > 0) {\r\n let cross = dispatch(\r\n GetProductsMayAlsoLike(\r\n customerToken,\r\n value.cartItemsCheckout[value.cartItemsCheckout.length - 1]\r\n .ProductId,\r\n Cookies.get(\"Language\"),\r\n offset,\r\n Cookies.get(\"Country\"),\r\n 2\r\n )\r\n );\r\n promise = Promise.resolve(cross);\r\n promise.then((value) => {\r\n setCrossProductList(value.AlsoLikeProducts);\r\n });\r\n }\r\n }\r\n });\r\n } else {\r\n let cart = dispatch(\r\n GetGuestCart(\r\n guestId,\r\n Cookies.get(\"Language\"),\r\n offset,\r\n Cookies.get(\"Country\"),\r\n token\r\n )\r\n );\r\n promise = Promise.resolve(cart);\r\n promise.then((value) => {\r\n if (value !== -1) {\r\n setCart(value);\r\n\r\n dispatch(addAllToCart(value));\r\n setIsLoadingCart(false);\r\n if (value.cartItemsCheckout.length > 0) {\r\n let cross = dispatch(\r\n GetProductsMayAlsoLike(\r\n token,\r\n value.cartItemsCheckout[value.cartItemsCheckout.length - 1]\r\n .ProductId,\r\n Cookies.get(\"Language\"),\r\n offset,\r\n Cookies.get(\"Country\"),\r\n 1\r\n )\r\n );\r\n promise = Promise.resolve(cross);\r\n promise.then((value) => {\r\n setCrossProductList(value.AlsoLikeProducts);\r\n });\r\n }\r\n } else {\r\n dispatch(addAllToCart([]));\r\n }\r\n });\r\n }\r\n if (windowSize) {\r\n const timer = setTimeout(() => {\r\n setShowSmallModal(true);\r\n }, 400);\r\n\r\n return () => {\r\n clearTimeout(timer);\r\n document.body.classList.remove(\"modal-open\");\r\n };\r\n } else {\r\n setShowSmallModal(false);\r\n }\r\n }\r\n }, [\r\n showSidebar,\r\n windowSize,\r\n customerId,\r\n customerToken,\r\n dispatch,\r\n guestId,\r\n isLogged,\r\n token,\r\n ]);\r\n\r\n const closeModal = () => {\r\n setShowSidebar(false);\r\n setShowSmallModal(false);\r\n document.body.classList.remove(\"modal-open\");\r\n };\r\n\r\n return (\r\n \r\n \r\n
\r\n \r\n \r\n \r\n
\r\n \r\n \r\n \r\n \r\n
\r\n \r\n \r\n
\r\n \r\n {showSidebar && (\r\n \r\n {showCartModal ? (\r\n \r\n \r\n {isLoadingCart ? (\r\n Array(3).fill(\r\n \r\n
\r\n \r\n \r\n \r\n \r\n ))\r\n : cart.cartItemsCheckout.map((product) => (\r\n \r\n
\r\n \r\n
\r\n \r\n \r\n \r\n
\r\n \r\n {dictionary.ItemsInShoppingBagAreNotReserved}\r\n
\r\n \r\n \r\n
\r\n {windowSize\r\n ? cart.cartItemsCheckout.map((product) => (\r\n \r\n {dictionary.TheItemHasBeenAddedToYourShoppingBag}\r\n
\r\n \r\n \r\n NavigateToProduct(product.ProductId)\r\n }\r\n >\r\n {parseFloat(product.FormattedSalePrice) ===\r\n 0 ? (\r\n \r\n {cart.CurrencySymbol}{\" \"}\r\n {product.FormattedRegularPrice}\r\n \r\n ) : (\r\n
\r\n \r\n \r\n NavigateToProduct(product.ProductId)\r\n }\r\n >\r\n
\r\n \r\n \r\n NavigateToProduct(product.ProductId)\r\n }\r\n >\r\n
\r\n \r\n \r\n RemoveFromCart(\r\n product.ProductVariationId\r\n )\r\n }\r\n />\r\n
\r\n \r\n {product.ProductName}\r\n
\r\n \r\n {product.ShortDescription.length > 35\r\n ? product.ShortDescription.substring(\r\n 0,\r\n 35\r\n ) + \" ...\"\r\n : product.ShortDescription}\r\n
\r\n\r\n
\r\n Quantity {product.Quantity}
\r\n \r\n Shipping From {product.StoreCountryName}\r\n
\r\n {product.Size && product.Size !== \"\" ? (\r\n Size {product.Size}
\r\n ) : (\r\n \"\"\r\n )}\r\n \r\n \r\n \r\n {cart.CurrencySymbol}{\" \"}\r\n {product.FormattedRegularPrice}\r\n \r\n {\" \"}\r\n \r\n {cart.CurrencySymbol}{\" \"}\r\n {product.FormattedSalePrice}\r\n \r\n
\r\n )}\r\n \r\n \r\n NavigateToProduct(product.ProductId)\r\n }\r\n >\r\n
\r\n \r\n
\r\n\r\n \r\n {product.ProductName.length > 15\r\n ? product.ProductName.substring(0, 15) +\r\n \" ...\"\r\n : product.ProductName}\r\n \r\n MoveTowishList(product.ProductVariationId)\r\n }\r\n >\r\n
\r\n \r\n Vendor: {product.Brand}\r\n
\r\n \r\n Shipping From: {product.StoreCountryName}\r\n
\r\n \r\n {product.Size && product.Size !== \"\" ? (\r\n {product.Size}\r\n ) : (\r\n \"\"\r\n )}{\" \"}\r\n {product.Color && product.Color !== \"\" ? (\r\n {product.Color}\r\n ) : (\r\n \"\"\r\n )}\r\n
\r\n \r\n {\" \"}\r\n {parseFloat(product.FormattedSalePrice) ===\r\n 0 ? (\r\n \r\n {cart.CurrencySymbol}{\" \"}\r\n {product.FormattedRegularPrice}\r\n \r\n ) : (\r\n \r\n \r\n \r\n {cart.CurrencySymbol}{\" \"}\r\n {product.FormattedRegularPrice}\r\n \r\n {\" \"}\r\n \r\n {cart.CurrencySymbol}{\" \"}\r\n {product.FormattedSalePrice}\r\n \r\n \r\n )}\r\n
\r\n \r\n \r\n increment(\r\n product.QuantityRemaining,\r\n product.Quantity,\r\n product.ProductVariationId\r\n )\r\n }\r\n >\r\n +\r\n \r\n \r\n {product.Quantity}\r\n \r\n {product.Quantity > 1 ? (\r\n \r\n decrement(\r\n product.Quantity,\r\n product.ProductVariationId\r\n )\r\n }\r\n >\r\n -\r\n \r\n ) : (\r\n \r\n RemoveFromCart(product.ProductVariationId)\r\n }\r\n >\r\n
\r\n \r\n ))}\r\n \r\n ) : (\r\n \r\n \r\n
\r\n \r\n \r\n
\r\n {showSmallModal &&\r\n windowSize &&\r\n cart.cartItemsCheckout &&\r\n cart.cartItemsCheckout.length > 0 && (\r\n \r\n
\r\n \r\n
\r\n \r\n
\r\n \r\n {dictionary.Subtotal} {dictionary.Items}\r\n
\r\n \r\n {cart.CurrencySymbol} {\" \"}\r\n {cart.FormattedOriginalCartTotal}\r\n
\r\n \r\n
\r\n {cart.Discount ? (\r\n \r\n
\r\n \r\n {dictionary.ShippingFees}\r\n
\r\n \r\n {dictionary.ToBeCalculated}\r\n
\r\n \r\n
\r\n ) : (\r\n \"\"\r\n )}\r\n\r\n \r\n
\r\n Discount
\r\n \r\n {cart.CurrencySymbol} {cart.Discount}\r\n
\r\n \r\n
\r\n \r\n \r\n
\r\n \r\n {dictionary.Total}\r\n
\r\n \r\n {dictionary.VatIncluded}\r\n
\r\n \r\n {cart.CurrencySymbol} {\" \"}\r\n {cart.FormattedOriginalCartFinalTotal}\r\n
\r\n \r\n {\r\n ProceedToSecureCheckout();\r\n }}\r\n >\r\n {dictionary.ProceedToSecureCheckout}\r\n \r\n \r\n {dictionary.ContinueShopping}\r\n \r\n
\r\n \r\n
\r\n \r\n \r\n )}\r\n \r\n ) : !windowSize && showCanvas ? (\r\n show ? (\r\n \r\n \r\n >\r\n
\r\n \r\n ) : (\r\n \"\"\r\n )}\r\n \r\n \r\n setActiveIndex(swiper.activeIndex)\r\n }\r\n breakpoints={{\r\n 1024: {\r\n slidesPerView: 3,\r\n },\r\n 600: {\r\n slidesPerView: 2,\r\n },\r\n 480: {\r\n slidesPerView: 1,\r\n },\r\n }}\r\n >\r\n {crossProductList.map((product, index) => {\r\n // Find the default variation\r\n const defaultVariation = product.variations.find(\r\n (variation) => variation.IsDefaultVariation\r\n );\r\n\r\n // If no default variation is found, skip this product\r\n if (!defaultVariation) return null;\r\n\r\n return (\r\n \r\n NavigateToProduct(product.ProductId)\r\n }\r\n >\r\n \r\n \r\n <\r\n
\r\n \r\n
\r\n \r\n {crossProductList.length > 0 ? (\r\n \r\n
\r\n \r\n \r\n
\r\n \r\n
\r\n \r\n );\r\n })}\r\n \r\n ) : (\r\n \r\n \r\n {product.BrandName}\r\n \r\n
\r\n \r\n {product.ShortDescription.length > 15\r\n ? product.ShortDescription.substring(\r\n 0,\r\n 15\r\n ) + \" ...\"\r\n : product.ShortDescription}\r\n
\r\n {parseInt(\r\n defaultVariation.FormattedSalePrice\r\n ) === 0 ? (\r\n\r\n {product.CurrencySymbol}{\" \"}\r\n {\r\n defaultVariation.FormattedRegularPrice\r\n }\r\n
\r\n ) : (\r\n\r\n \r\n {product.CurrencySymbol}{\" \"}\r\n {\r\n defaultVariation.FormattedRegularPrice\r\n }\r\n {\" \"}\r\n \r\n {product.CurrencySymbol}\r\n {\r\n defaultVariation.FormattedSalePrice\r\n }\r\n \r\n
\r\n
*/}\r\n \r\n \r\n White\r\n \r\n
\r\n \r\n
\r\n \r\n
\r\n )}\r\n \r\n\r\n {crossProductList.length > 0 ? (\r\n \r\n \r\n
\r\n \r\n
\r\n \r\n \r\n SignRegister()}\r\n >\r\n {dictionary.SignIn} / {dictionary.Register}\r\n \r\n ContinueAsaGuest()}\r\n >\r\n {dictionary.ContinueAsaGuest}\r\n \r\n
\r\n \r\n Secure Checkout\r\n
\r\n \r\n To continue with the checkout process, please pick if you\r\n ant to proceed as a guest or through your account.\r\n
\r\n \r\n \r\n {\r\n windowSize\r\n ? setShowSidebar(true)\r\n : navigate(`/${Cookies.get(\"Country\")}/shopping-bag`);\r\n }}\r\n />\r\n {itemTotal}\r\n \r\n\r\n
\r\n );\r\n}\r\n\r\nexport default CartMenu;\r\n","import React, { useState, useEffect } from \"react\";\r\nimport { useNavigate } from \"react-router-dom\";\r\nimport { useDispatch, useSelector } from \"react-redux\";\r\nimport { setSlides } from \"../../../../store/slices/widget-slice\";\r\nimport Cookies from \"js-cookie\";\r\nimport {\r\n setMenu,\r\n setSelectedParent,\r\n GetMenu,\r\n} from \"../../../../store/slices/menu-slice\";\r\nimport { Global } from \"../../../../Global\";\r\n\r\nfunction HeaderSearch({ setIsLoading }) {\r\n const navigate = useNavigate();\r\n const dispatch = useDispatch();\r\n const [searchTerm, setSearchTerm] = useState(\"\");\r\n const [extendedSearch, setExtendSearch] = useState(false);\r\n const [searchDiscovey, setSearchDiscovery] = useState([]);\r\n const [searchHistory, setSearchHistory] = useState([]);\r\n const selectedParent = useSelector((state) => state.menu.selectedParent);\r\n const [parent, setParent] = useState(selectedParent);\r\n const menu = useSelector((state) => state.menu.menu);\r\n const isLogged = useSelector((state) => state.credential.isLogged);\r\n const token = useSelector((state) => state.credential.token);\r\n const guestId = useSelector((state) => state.credential.guestId);\r\n const customerId = useSelector((state) => state.credential.customerId);\r\n const email = useSelector((state) => state.credential.email);\r\n const customerToken = useSelector((state) => state.credential.customerToken);\r\n\r\n const Search = () => {\r\n setIsLoading(true);\r\n Cookies.set(\"Parent\", parent);\r\n if (window.snaptr) {\r\n window.snaptr(\"track\", \"SEARCH\", {\r\n item_ids: [searchTerm],\r\n item_category: parent,\r\n number_items: 1,\r\n uuid_c1: isLogged ? customerId : guestId,\r\n user_email: isLogged ? email : \"\",\r\n });\r\n console.log(\"SEARCH\");\r\n }\r\n if (typeof window !== \"undefined\" && window.gtag) {\r\n window.gtag(\"event\", \"search\", {\r\n search_term: searchTerm\r\n });\r\n }\r\n navigate(\r\n \"/\" +\r\n Cookies.get(\"Country\") +\r\n \"/search/\" +\r\n searchTerm +\r\n \"?categoryType=\" +\r\n parent\r\n );\r\n };\r\n\r\n function onSearchChange(e) {\r\n setSearchTerm(e.target.value);\r\n }\r\n const ChangeParent = (Id, ParentName) => {\r\n // setIsLoading(true);\r\n // Cookies.set(\"Parent\", Id, { expires: 31536000 });\r\n // dispatch(setSelectedParent(parseInt(Id)));\r\n // const updatedMenu = menu.map((category) => ({\r\n // ...category,\r\n // IsSelected: parseInt(category.ParentID) === parseInt(Id),\r\n // }));\r\n\r\n // dispatch(setMenu(updatedMenu));\r\n // dispatch(setSlides([]));\r\n setParent(Id);\r\n // setSelectedParent(Id)\r\n fetchSearchDiscovery(Id);\r\n };\r\n const fetchSearchDiscovery = async (Id) => {\r\n let response, result;\r\n response = await fetch(\r\n Global.API_URL + \"SEO/GetTopSearchedTerms/ParentCategory/\" + Id,\r\n {\r\n method: \"GET\",\r\n headers: {\r\n Accept: \"application/json\",\r\n \"Content-Type\": \"application/json\",\r\n AuthorizationCustomer: isLogged ? customerToken : token,\r\n \"Access-Control-Allow-Origin\": Global.HostAPI,\r\n countryCode: Cookies.get(\"Country\"),\r\n },\r\n }\r\n );\r\n if (response.ok) {\r\n result = await response.json();\r\n if (result.Code === 0) {\r\n setSearchDiscovery([]);\r\n setSearchDiscovery(result.PopularSearchTerms);\r\n }\r\n }\r\n };\r\n const fetchSearchHistory = async (value) => {\r\n let response, result;\r\n if (isLogged) {\r\n response = await fetch(\r\n Global.API_URL +\r\n \"SEO/SearchHistory/Customer/\" +\r\n customerId +\r\n \"/Skip/0/Take/50\",\r\n {\r\n method: \"GET\",\r\n headers: {\r\n Accept: \"application/json\",\r\n \"Content-Type\": \"application/json\",\r\n AuthorizationCustomer: customerToken,\r\n \"Access-Control-Allow-Origin\": Global.HostAPI,\r\n countryCode: Cookies.get(\"Country\"),\r\n },\r\n }\r\n );\r\n } else {\r\n response = await fetch(\r\n Global.API_URL +\r\n \"SEO/SearchHistory/Guest/\" +\r\n guestId +\r\n \"/Skip/0/Take/50\",\r\n {\r\n method: \"GET\",\r\n headers: {\r\n Accept: \"application/json\",\r\n \"Content-Type\": \"application/json\",\r\n AuthorizationCustomer: token,\r\n \"Access-Control-Allow-Origin\": Global.HostAPI,\r\n countryCode: Cookies.get(\"Country\"),\r\n },\r\n }\r\n );\r\n }\r\n if (response.ok) {\r\n result = await response.json();\r\n if (result.Code === 0) {\r\n setSearchHistory([]);\r\n setSearchHistory(result.Keywords);\r\n }\r\n }\r\n };\r\n const ClearSearchDiscovery = async () => {\r\n let response, result;\r\n if (isLogged) {\r\n response = await fetch(\r\n Global.API_URL + \"SEO/DeleteSearchHistoryByCustomerID/\" + customerId,\r\n {\r\n method: \"DELETE\",\r\n headers: {\r\n Accept: \"application/json\",\r\n \"Content-Type\": \"application/json\",\r\n AuthorizationCustomer: isLogged ? customerToken : token,\r\n \"Access-Control-Allow-Origin\": Global.HostAPI,\r\n countryCode: Cookies.get(\"Country\"),\r\n },\r\n }\r\n );\r\n } else {\r\n response = await fetch(\r\n Global.API_URL + \"SEO/DeleteSearchHistoryByGuestID/\" + guestId,\r\n {\r\n method: \"DELETE\",\r\n headers: {\r\n Accept: \"application/json\",\r\n \"Content-Type\": \"application/json\",\r\n AuthorizationCustomer: isLogged ? customerToken : token,\r\n \"Access-Control-Allow-Origin\": Global.HostAPI,\r\n countryCode: Cookies.get(\"Country\"),\r\n },\r\n }\r\n );\r\n }\r\n\r\n if (response.ok) {\r\n result = await response.json();\r\n if (result.Code === 0) {\r\n fetchSearchHistory([]);\r\n }\r\n }\r\n };\r\n\r\n const ClearSearchDiscoverybyID = async (Id) => {\r\n let response, result;\r\n response = await fetch(\r\n Global.API_URL + \"SEO/DeleteSearchHistoryByID/\" + Id,\r\n {\r\n method: \"DELETE\",\r\n headers: {\r\n Accept: \"application/json\",\r\n \"Content-Type\": \"application/json\",\r\n AuthorizationCustomer: isLogged ? customerToken : token,\r\n \"Access-Control-Allow-Origin\": Global.HostAPI,\r\n countryCode: Cookies.get(\"Country\"),\r\n },\r\n }\r\n );\r\n\r\n if (response.ok) {\r\n result = await response.json();\r\n if (result.Code === 0) {\r\n fetchSearchHistory([]);\r\n }\r\n }\r\n };\r\n useEffect(() => {\r\n if (token || customerToken) {\r\n fetchSearchHistory([]);\r\n fetchSearchDiscovery(parent);\r\n }\r\n }, [parent, extendedSearch, token, customerToken]);\r\n useEffect(() => {\r\n setParent(selectedParent);\r\n }, []);\r\n\r\n return (\r\n \r\n \r\n\r\n
\r\n {extendedSearch ? (\r\n \r\n {menu &&\r\n menu.map((m, firstIndex) => {\r\n return (\r\n ChangeParent(m.ParentID, m.ParentName)}\r\n className={`fs-23 cursor-pointer text-uppercase ${\r\n parent === m.ParentID\r\n ? \"fw-700 active-parent\"\r\n : \"text-secondary\"\r\n }`}\r\n id=\"menu-home\"\r\n >\r\n {m.ParentName}\r\n
\r\n );\r\n })}\r\n \r\n {searchHistory.length > 0 ? (\r\n \r\n
\r\n \r\n ClearSearchDiscovery()}\r\n >\r\n Clear\r\n
\r\n \r\n Recent Search\r\n
\r\n \r\n {searchHistory.map((s) => {\r\n return (\r\n setSearchTerm(s.OriginalSearchTerm)}\r\n className=\"position-relative d-flex justify-content-center align-items-center cursor-pointer recent-search-value\"\r\n >\r\n \r\n ClearSearchDiscoverybyID(s.CustomerSearchHistoryId)\r\n }\r\n >\r\n ![](\"/assets/images/close-icon.svg\")
\r\n
\r\n \r\n );\r\n })}\r\n \r\n \r\n ) : (\r\n \"\"\r\n )}\r\n {searchDiscovey.length > 0 ? (\r\n \r\n {s.OriginalSearchTerm}\r\n
\r\n \r\n \r\n
\r\n \r\n ) : (\r\n \"\"\r\n )}\r\n \r\n ) : (\r\n \"\"\r\n )}\r\n \r\n \r\n );\r\n}\r\n\r\nexport default HeaderSearch;\r\n","import ALink from \"../../../features/alink\";\r\nimport React, { Fragment, useState } from \"react\";\r\nimport { Global } from \"../../../../Global\";\r\nimport Cookies from \"js-cookie\";\r\nimport { useNavigate, useParams } from \"react-router-dom\";\r\n\r\nfunction MainMenu({ subMenu, windowSize, menu, selectedParent }) {\r\n const [firstSub, setFirstSub] = useState(0);\r\n const [open, setOpen] = useState(false);\r\n const [imageSrc, setImageSrc] = useState(\r\n \"/assets/images/menu/menu-logo1.png\"\r\n );\r\n const navigate = useNavigate();\r\n let { country } = useParams();\r\n let countryCode =\r\n country !== null && country !== undefined && country !== \"undefined\"\r\n ? country\r\n : Cookies.get(\"Country\");\r\n\r\n // useEffect(() => {\r\n // const body = document.body;\r\n\r\n // if (firstSub !== 0) {\r\n // body.classList.add('no-scroll');\r\n // } else {\r\n // body.classList.remove('no-scroll');\r\n // }\r\n\r\n // // Cleanup function to remove the class when component unmounts\r\n // return () => {\r\n // body.classList.remove('no-scroll');\r\n // };\r\n // }, [firstSub]);\r\n\r\n const handleSubMouseOver = () => {\r\n setImageSrc(\"/assets/images/menu/menu-logo.png\");\r\n };\r\n\r\n const handleMouseOver = (firstSubId, FirstSubImage, MobileIcon) => {\r\n setOpen(true);\r\n setFirstSub(firstSubId);\r\n if (FirstSubImage === \"\" || MobileIcon === \"\") {\r\n setImageSrc(\"/assets/images/menu/menu-logo.png\");\r\n } else {\r\n if (windowSize) {\r\n setImageSrc(Global.PHOTO_URL + FirstSubImage);\r\n } else {\r\n setImageSrc(Global.PHOTO_URL + MobileIcon);\r\n }\r\n }\r\n };\r\n\r\n const handleMouseLeave = () => {\r\n setOpen(false);\r\n setFirstSub(0);\r\n };\r\n\r\n return (\r\n Search Discovery
\r\n\r\n \r\n {searchDiscovey.map((s) => {\r\n return (\r\n setSearchTerm(s)}\r\n >\r\n
\r\n );\r\n })}\r\n \r\n {s}\r\n
\r\n \r\n {/* Arrow on the left */}\r\n \r\n\r\n {/* Settings title in the center */}\r\n \r\n SETTINGS\r\n
\r\n \r\n ) : (\r\n \r\n {/* Arrow on the left */}\r\n \r\n\r\n {/* Settings title in the center */}\r\n \r\n SETTINGS\r\n
\r\n \r\n )}\r\n \r\n
\r\n \r\n
\r\n \r\n \r\n ))}\r\n {filteredContent.map((item, index) => (\r\n \r\n
\r\n \r\n
\r\n \r\n \r\n ))}\r\n \r\n {!isLogged ? (\r\n setShowModal(true)}\r\n >\r\n {dictionary.SignIn}\r\n \r\n ) : (\r\n LogOut()}\r\n >\r\n {dictionary.SignOut}\r\n \r\n )}\r\n
\r\n {title}
\r\n\r\n {loading ? (\r\n\r\n {/* Custom Navigation Arrows */}\r\n {windowSize ? (\r\n
\r\n \r\n ) : (\r\n \"\"\r\n )}\r\n \r\n
\r\n \r\n
\r\n );\r\n};\r\n\r\nexport default ChangeEmail;\r\n","import React, { useState } from \"react\";\r\nimport { useSelector } from \"react-redux\";\r\nimport { Global } from \"../../../Global\";\r\nimport Cookies from \"js-cookie\";\r\nimport { toast } from \"react-toastify\";\r\nimport { FaRegEye, FaRegEyeSlash } from \"react-icons/fa\";\r\n\r\nconst ChangePasword = () => {\r\n const [oldPassword, setOldPassword] = useState(\"\");\r\n const [newPassword, setNewPassword] = useState(\"\");\r\n const [confirmPassword, setConfirmPassword] = useState(\"\");\r\n const [showPassword, setShowPassword] = useState(false);\r\n const [showPasswordConfirm, setShowPasswordConfirm] = useState(false);\r\n const isLogged = useSelector((state) => state.credential.isLogged);\r\n const customer = useSelector((state) => state.credential.customer);\r\n const customerToken = useSelector((state) => state.credential.customerToken);\r\n const customerId = useSelector((state) => state.credential.customerId);\r\n const dictionary = useSelector((state) => state.dictionary.dictionary);\r\n\r\n const ResetPassword = async (e) => {\r\n e.preventDefault();\r\n let response, result;\r\n if (oldPassword === \"\" && newPassword === \"\" && confirmPassword === \"\") {\r\n toast.error(\"All Fields are required\");\r\n } else if (newPassword !== confirmPassword) {\r\n toast.error(\"New Password and Confirmation Password must be the same\");\r\n } else {\r\n response = await fetch(\r\n Global.API_URL + \"CustomerProfile/ChangePassword\",\r\n {\r\n method: \"PUT\",\r\n headers: {\r\n Accept: \"application/json\",\r\n \"Content-Type\": \"application/json\",\r\n \"Access-Control-Allow-Origin\": Global.HostAPI,\r\n AuthorizationCustomer: customerToken,\r\n countryCode: Cookies.get(\"Country\"),\r\n },\r\n body: JSON.stringify({\r\n customerId: customerId,\r\n oldPassword: oldPassword,\r\n newPassword: newPassword,\r\n }),\r\n }\r\n );\r\n result = await response.json();\r\n if (response.ok) {\r\n if (result.Code === 0) {\r\n toast.success(result.Message);\r\n setConfirmPassword(\"\");\r\n setNewPassword(\"\");\r\n setOldPassword(\"\");\r\n } else {\r\n toast.error(result.Message);\r\n }\r\n } else {\r\n if (result.Message) {\r\n toast.error(result.Message);\r\n } else {\r\n toast.error(result);\r\n }\r\n }\r\n }\r\n };\r\n return (\r\n Change E-mail Address
\r\n \r\n\r\n
\r\n \r\n Change Password
\r\n\r\n \r\n Change Password\r\n \r\n
\r\n \r\n \r\n );\r\n};\r\n\r\nexport default ChangePasword;\r\n","import React, { useEffect, useState } from \"react\";\r\nimport { useSelector } from \"react-redux\";\r\nimport { Global } from \"../../../Global\";\r\nimport Cookies from \"js-cookie\";\r\nimport { useNavigate, useParams } from \"react-router-dom\";\r\n\r\nconst Newsletter = () => {\r\n const navigate = useNavigate();\r\n const isLogged = useSelector((state) => state.credential.isLogged);\r\n const customerToken = useSelector((state) => state.credential.customerToken);\r\n const customerId = useSelector((state) => state.credential.customerId);\r\n const [isSubscribed, setIsSubscribed] = useState(false);\r\n const { country } = useParams();\r\n let countryCode = country ? country : Cookies.get(\"Country\");\r\n\r\n const Subscribe = async ()=>{\r\n const response = await fetch(\r\n Global.API_URL + \"Newsletter/SubscribeNewsLetter/\" + customerId,\r\n {\r\n method: \"POST\",\r\n headers: {\r\n Accept: \"application/json\",\r\n \"Content-Type\": \"application/json\",\r\n \"Access-Control-Allow-Origin\": Global.HostAPI,\r\n AuthorizationCustomer: customerToken,\r\n countryCode: Cookies.get(\"Country\"),\r\n },\r\n }\r\n );\r\n const result = await response.json();\r\n if (response.ok) {\r\n if (result.Code === 0) {\r\n CheckIfSubscribe()\r\n }\r\n }\r\n }\r\n const UnSubscribe = async ()=>{\r\n navigate(\"/\"+countryCode+\"/unsubscribe\")\r\n }\r\n const CheckIfSubscribe = async () => {\r\n const response = await fetch(\r\n Global.API_URL + \"Newsletter/CheckIfSubscribed?CustomerId=\" + customerId,\r\n {\r\n method: \"GET\",\r\n headers: {\r\n Accept: \"application/json\",\r\n \"Content-Type\": \"application/json\",\r\n \"Access-Control-Allow-Origin\": Global.HostAPI,\r\n AuthorizationCustomer: customerToken,\r\n countryCode: Cookies.get(\"Country\"),\r\n },\r\n }\r\n );\r\n const result = await response.json();\r\n if (response.ok) {\r\n if (result.Code === 0) {\r\n setIsSubscribed(result.isSubscribed);\r\n }\r\n }\r\n };\r\n\r\n useEffect(() => {\r\n CheckIfSubscribe();\r\n }, []);\r\n\r\n return (\r\n \r\n {\" \"}\r\n
\r\n );\r\n};\r\n\r\nexport default Newsletter;\r\n","var __defProp = Object.defineProperty;\nvar __getOwnPropSymbols = Object.getOwnPropertySymbols;\nvar __hasOwnProp = Object.prototype.hasOwnProperty;\nvar __propIsEnum = Object.prototype.propertyIsEnumerable;\nvar __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;\nvar __spreadValues = (a, b) => {\n for (var prop in b || (b = {}))\n if (__hasOwnProp.call(b, prop))\n __defNormalProp(a, prop, b[prop]);\n if (__getOwnPropSymbols)\n for (var prop of __getOwnPropSymbols(b)) {\n if (__propIsEnum.call(b, prop))\n __defNormalProp(a, prop, b[prop]);\n }\n return a;\n};\nvar __objRest = (source, exclude) => {\n var target = {};\n for (var prop in source)\n if (__hasOwnProp.call(source, prop) && exclude.indexOf(prop) < 0)\n target[prop] = source[prop];\n if (source != null && __getOwnPropSymbols)\n for (var prop of __getOwnPropSymbols(source)) {\n if (exclude.indexOf(prop) < 0 && __propIsEnum.call(source, prop))\n target[prop] = source[prop];\n }\n return target;\n};\n\n// src/index.tsx\nimport React from \"react\";\n\n// src/third-party/qrcodegen/index.ts\n/**\n * @license QR Code generator library (TypeScript)\n * Copyright (c) Project Nayuki.\n * SPDX-License-Identifier: MIT\n */\nvar qrcodegen;\n((qrcodegen2) => {\n const _QrCode = class _QrCode {\n /*-- Constructor (low level) and fields --*/\n // Creates a new QR Code with the given version number,\n // error correction level, data codeword bytes, and mask number.\n // This is a low-level API that most users should not use directly.\n // A mid-level API is the encodeSegments() function.\n constructor(version, errorCorrectionLevel, dataCodewords, msk) {\n this.version = version;\n this.errorCorrectionLevel = errorCorrectionLevel;\n // The modules of this QR Code (false = light, true = dark).\n // Immutable after constructor finishes. Accessed through getModule().\n this.modules = [];\n // Indicates function modules that are not subjected to masking. Discarded when constructor finishes.\n this.isFunction = [];\n if (version < _QrCode.MIN_VERSION || version > _QrCode.MAX_VERSION)\n throw new RangeError(\"Version value out of range\");\n if (msk < -1 || msk > 7)\n throw new RangeError(\"Mask value out of range\");\n this.size = version * 4 + 17;\n let row = [];\n for (let i = 0; i < this.size; i++)\n row.push(false);\n for (let i = 0; i < this.size; i++) {\n this.modules.push(row.slice());\n this.isFunction.push(row.slice());\n }\n this.drawFunctionPatterns();\n const allCodewords = this.addEccAndInterleave(dataCodewords);\n this.drawCodewords(allCodewords);\n if (msk == -1) {\n let minPenalty = 1e9;\n for (let i = 0; i < 8; i++) {\n this.applyMask(i);\n this.drawFormatBits(i);\n const penalty = this.getPenaltyScore();\n if (penalty < minPenalty) {\n msk = i;\n minPenalty = penalty;\n }\n this.applyMask(i);\n }\n }\n assert(0 <= msk && msk <= 7);\n this.mask = msk;\n this.applyMask(msk);\n this.drawFormatBits(msk);\n this.isFunction = [];\n }\n /*-- Static factory functions (high level) --*/\n // Returns a QR Code representing the given Unicode text string at the given error correction level.\n // As a conservative upper bound, this function is guaranteed to succeed for strings that have 738 or fewer\n // Unicode code points (not UTF-16 code units) if the low error correction level is used. The smallest possible\n // QR Code version is automatically chosen for the output. The ECC level of the result may be higher than the\n // ecl argument if it can be done without increasing the version.\n static encodeText(text, ecl) {\n const segs = qrcodegen2.QrSegment.makeSegments(text);\n return _QrCode.encodeSegments(segs, ecl);\n }\n // Returns a QR Code representing the given binary data at the given error correction level.\n // This function always encodes using the binary segment mode, not any text mode. The maximum number of\n // bytes allowed is 2953. The smallest possible QR Code version is automatically chosen for the output.\n // The ECC level of the result may be higher than the ecl argument if it can be done without increasing the version.\n static encodeBinary(data, ecl) {\n const seg = qrcodegen2.QrSegment.makeBytes(data);\n return _QrCode.encodeSegments([seg], ecl);\n }\n /*-- Static factory functions (mid level) --*/\n // Returns a QR Code representing the given segments with the given encoding parameters.\n // The smallest possible QR Code version within the given range is automatically\n // chosen for the output. Iff boostEcl is true, then the ECC level of the result\n // may be higher than the ecl argument if it can be done without increasing the\n // version. The mask number is either between 0 to 7 (inclusive) to force that\n // mask, or -1 to automatically choose an appropriate mask (which may be slow).\n // This function allows the user to create a custom sequence of segments that switches\n // between modes (such as alphanumeric and byte) to encode text in less space.\n // This is a mid-level API; the high-level API is encodeText() and encodeBinary().\n static encodeSegments(segs, ecl, minVersion = 1, maxVersion = 40, mask = -1, boostEcl = true) {\n if (!(_QrCode.MIN_VERSION <= minVersion && minVersion <= maxVersion && maxVersion <= _QrCode.MAX_VERSION) || mask < -1 || mask > 7)\n throw new RangeError(\"Invalid value\");\n let version;\n let dataUsedBits;\n for (version = minVersion; ; version++) {\n const dataCapacityBits2 = _QrCode.getNumDataCodewords(version, ecl) * 8;\n const usedBits = QrSegment.getTotalBits(segs, version);\n if (usedBits <= dataCapacityBits2) {\n dataUsedBits = usedBits;\n break;\n }\n if (version >= maxVersion)\n throw new RangeError(\"Data too long\");\n }\n for (const newEcl of [_QrCode.Ecc.MEDIUM, _QrCode.Ecc.QUARTILE, _QrCode.Ecc.HIGH]) {\n if (boostEcl && dataUsedBits <= _QrCode.getNumDataCodewords(version, newEcl) * 8)\n ecl = newEcl;\n }\n let bb = [];\n for (const seg of segs) {\n appendBits(seg.mode.modeBits, 4, bb);\n appendBits(seg.numChars, seg.mode.numCharCountBits(version), bb);\n for (const b of seg.getData())\n bb.push(b);\n }\n assert(bb.length == dataUsedBits);\n const dataCapacityBits = _QrCode.getNumDataCodewords(version, ecl) * 8;\n assert(bb.length <= dataCapacityBits);\n appendBits(0, Math.min(4, dataCapacityBits - bb.length), bb);\n appendBits(0, (8 - bb.length % 8) % 8, bb);\n assert(bb.length % 8 == 0);\n for (let padByte = 236; bb.length < dataCapacityBits; padByte ^= 236 ^ 17)\n appendBits(padByte, 8, bb);\n let dataCodewords = [];\n while (dataCodewords.length * 8 < bb.length)\n dataCodewords.push(0);\n bb.forEach((b, i) => dataCodewords[i >>> 3] |= b << 7 - (i & 7));\n return new _QrCode(version, ecl, dataCodewords, mask);\n }\n /*-- Accessor methods --*/\n // Returns the color of the module (pixel) at the given coordinates, which is false\n // for light or true for dark. The top left corner has the coordinates (x=0, y=0).\n // If the given coordinates are out of bounds, then false (light) is returned.\n getModule(x, y) {\n return 0 <= x && x < this.size && 0 <= y && y < this.size && this.modules[y][x];\n }\n // Modified to expose modules for easy access\n getModules() {\n return this.modules;\n }\n /*-- Private helper methods for constructor: Drawing function modules --*/\n // Reads this object's version field, and draws and marks all function modules.\n drawFunctionPatterns() {\n for (let i = 0; i < this.size; i++) {\n this.setFunctionModule(6, i, i % 2 == 0);\n this.setFunctionModule(i, 6, i % 2 == 0);\n }\n this.drawFinderPattern(3, 3);\n this.drawFinderPattern(this.size - 4, 3);\n this.drawFinderPattern(3, this.size - 4);\n const alignPatPos = this.getAlignmentPatternPositions();\n const numAlign = alignPatPos.length;\n for (let i = 0; i < numAlign; i++) {\n for (let j = 0; j < numAlign; j++) {\n if (!(i == 0 && j == 0 || i == 0 && j == numAlign - 1 || i == numAlign - 1 && j == 0))\n this.drawAlignmentPattern(alignPatPos[i], alignPatPos[j]);\n }\n }\n this.drawFormatBits(0);\n this.drawVersion();\n }\n // Draws two copies of the format bits (with its own error correction code)\n // based on the given mask and this object's error correction level field.\n drawFormatBits(mask) {\n const data = this.errorCorrectionLevel.formatBits << 3 | mask;\n let rem = data;\n for (let i = 0; i < 10; i++)\n rem = rem << 1 ^ (rem >>> 9) * 1335;\n const bits = (data << 10 | rem) ^ 21522;\n assert(bits >>> 15 == 0);\n for (let i = 0; i <= 5; i++)\n this.setFunctionModule(8, i, getBit(bits, i));\n this.setFunctionModule(8, 7, getBit(bits, 6));\n this.setFunctionModule(8, 8, getBit(bits, 7));\n this.setFunctionModule(7, 8, getBit(bits, 8));\n for (let i = 9; i < 15; i++)\n this.setFunctionModule(14 - i, 8, getBit(bits, i));\n for (let i = 0; i < 8; i++)\n this.setFunctionModule(this.size - 1 - i, 8, getBit(bits, i));\n for (let i = 8; i < 15; i++)\n this.setFunctionModule(8, this.size - 15 + i, getBit(bits, i));\n this.setFunctionModule(8, this.size - 8, true);\n }\n // Draws two copies of the version bits (with its own error correction code),\n // based on this object's version field, iff 7 <= version <= 40.\n drawVersion() {\n if (this.version < 7)\n return;\n let rem = this.version;\n for (let i = 0; i < 12; i++)\n rem = rem << 1 ^ (rem >>> 11) * 7973;\n const bits = this.version << 12 | rem;\n assert(bits >>> 18 == 0);\n for (let i = 0; i < 18; i++) {\n const color = getBit(bits, i);\n const a = this.size - 11 + i % 3;\n const b = Math.floor(i / 3);\n this.setFunctionModule(a, b, color);\n this.setFunctionModule(b, a, color);\n }\n }\n // Draws a 9*9 finder pattern including the border separator,\n // with the center module at (x, y). Modules can be out of bounds.\n drawFinderPattern(x, y) {\n for (let dy = -4; dy <= 4; dy++) {\n for (let dx = -4; dx <= 4; dx++) {\n const dist = Math.max(Math.abs(dx), Math.abs(dy));\n const xx = x + dx;\n const yy = y + dy;\n if (0 <= xx && xx < this.size && 0 <= yy && yy < this.size)\n this.setFunctionModule(xx, yy, dist != 2 && dist != 4);\n }\n }\n }\n // Draws a 5*5 alignment pattern, with the center module\n // at (x, y). All modules must be in bounds.\n drawAlignmentPattern(x, y) {\n for (let dy = -2; dy <= 2; dy++) {\n for (let dx = -2; dx <= 2; dx++)\n this.setFunctionModule(x + dx, y + dy, Math.max(Math.abs(dx), Math.abs(dy)) != 1);\n }\n }\n // Sets the color of a module and marks it as a function module.\n // Only used by the constructor. Coordinates must be in bounds.\n setFunctionModule(x, y, isDark) {\n this.modules[y][x] = isDark;\n this.isFunction[y][x] = true;\n }\n /*-- Private helper methods for constructor: Codewords and masking --*/\n // Returns a new byte string representing the given data with the appropriate error correction\n // codewords appended to it, based on this object's version and error correction level.\n addEccAndInterleave(data) {\n const ver = this.version;\n const ecl = this.errorCorrectionLevel;\n if (data.length != _QrCode.getNumDataCodewords(ver, ecl))\n throw new RangeError(\"Invalid argument\");\n const numBlocks = _QrCode.NUM_ERROR_CORRECTION_BLOCKS[ecl.ordinal][ver];\n const blockEccLen = _QrCode.ECC_CODEWORDS_PER_BLOCK[ecl.ordinal][ver];\n const rawCodewords = Math.floor(_QrCode.getNumRawDataModules(ver) / 8);\n const numShortBlocks = numBlocks - rawCodewords % numBlocks;\n const shortBlockLen = Math.floor(rawCodewords / numBlocks);\n let blocks = [];\n const rsDiv = _QrCode.reedSolomonComputeDivisor(blockEccLen);\n for (let i = 0, k = 0; i < numBlocks; i++) {\n let dat = data.slice(k, k + shortBlockLen - blockEccLen + (i < numShortBlocks ? 0 : 1));\n k += dat.length;\n const ecc = _QrCode.reedSolomonComputeRemainder(dat, rsDiv);\n if (i < numShortBlocks)\n dat.push(0);\n blocks.push(dat.concat(ecc));\n }\n let result = [];\n for (let i = 0; i < blocks[0].length; i++) {\n blocks.forEach((block, j) => {\n if (i != shortBlockLen - blockEccLen || j >= numShortBlocks)\n result.push(block[i]);\n });\n }\n assert(result.length == rawCodewords);\n return result;\n }\n // Draws the given sequence of 8-bit codewords (data and error correction) onto the entire\n // data area of this QR Code. Function modules need to be marked off before this is called.\n drawCodewords(data) {\n if (data.length != Math.floor(_QrCode.getNumRawDataModules(this.version) / 8))\n throw new RangeError(\"Invalid argument\");\n let i = 0;\n for (let right = this.size - 1; right >= 1; right -= 2) {\n if (right == 6)\n right = 5;\n for (let vert = 0; vert < this.size; vert++) {\n for (let j = 0; j < 2; j++) {\n const x = right - j;\n const upward = (right + 1 & 2) == 0;\n const y = upward ? this.size - 1 - vert : vert;\n if (!this.isFunction[y][x] && i < data.length * 8) {\n this.modules[y][x] = getBit(data[i >>> 3], 7 - (i & 7));\n i++;\n }\n }\n }\n }\n assert(i == data.length * 8);\n }\n // XORs the codeword modules in this QR Code with the given mask pattern.\n // The function modules must be marked and the codeword bits must be drawn\n // before masking. Due to the arithmetic of XOR, calling applyMask() with\n // the same mask value a second time will undo the mask. A final well-formed\n // QR Code needs exactly one (not zero, two, etc.) mask applied.\n applyMask(mask) {\n if (mask < 0 || mask > 7)\n throw new RangeError(\"Mask value out of range\");\n for (let y = 0; y < this.size; y++) {\n for (let x = 0; x < this.size; x++) {\n let invert;\n switch (mask) {\n case 0:\n invert = (x + y) % 2 == 0;\n break;\n case 1:\n invert = y % 2 == 0;\n break;\n case 2:\n invert = x % 3 == 0;\n break;\n case 3:\n invert = (x + y) % 3 == 0;\n break;\n case 4:\n invert = (Math.floor(x / 3) + Math.floor(y / 2)) % 2 == 0;\n break;\n case 5:\n invert = x * y % 2 + x * y % 3 == 0;\n break;\n case 6:\n invert = (x * y % 2 + x * y % 3) % 2 == 0;\n break;\n case 7:\n invert = ((x + y) % 2 + x * y % 3) % 2 == 0;\n break;\n default:\n throw new Error(\"Unreachable\");\n }\n if (!this.isFunction[y][x] && invert)\n this.modules[y][x] = !this.modules[y][x];\n }\n }\n }\n // Calculates and returns the penalty score based on state of this QR Code's current modules.\n // This is used by the automatic mask choice algorithm to find the mask pattern that yields the lowest score.\n getPenaltyScore() {\n let result = 0;\n for (let y = 0; y < this.size; y++) {\n let runColor = false;\n let runX = 0;\n let runHistory = [0, 0, 0, 0, 0, 0, 0];\n for (let x = 0; x < this.size; x++) {\n if (this.modules[y][x] == runColor) {\n runX++;\n if (runX == 5)\n result += _QrCode.PENALTY_N1;\n else if (runX > 5)\n result++;\n } else {\n this.finderPenaltyAddHistory(runX, runHistory);\n if (!runColor)\n result += this.finderPenaltyCountPatterns(runHistory) * _QrCode.PENALTY_N3;\n runColor = this.modules[y][x];\n runX = 1;\n }\n }\n result += this.finderPenaltyTerminateAndCount(runColor, runX, runHistory) * _QrCode.PENALTY_N3;\n }\n for (let x = 0; x < this.size; x++) {\n let runColor = false;\n let runY = 0;\n let runHistory = [0, 0, 0, 0, 0, 0, 0];\n for (let y = 0; y < this.size; y++) {\n if (this.modules[y][x] == runColor) {\n runY++;\n if (runY == 5)\n result += _QrCode.PENALTY_N1;\n else if (runY > 5)\n result++;\n } else {\n this.finderPenaltyAddHistory(runY, runHistory);\n if (!runColor)\n result += this.finderPenaltyCountPatterns(runHistory) * _QrCode.PENALTY_N3;\n runColor = this.modules[y][x];\n runY = 1;\n }\n }\n result += this.finderPenaltyTerminateAndCount(runColor, runY, runHistory) * _QrCode.PENALTY_N3;\n }\n for (let y = 0; y < this.size - 1; y++) {\n for (let x = 0; x < this.size - 1; x++) {\n const color = this.modules[y][x];\n if (color == this.modules[y][x + 1] && color == this.modules[y + 1][x] && color == this.modules[y + 1][x + 1])\n result += _QrCode.PENALTY_N2;\n }\n }\n let dark = 0;\n for (const row of this.modules)\n dark = row.reduce((sum, color) => sum + (color ? 1 : 0), dark);\n const total = this.size * this.size;\n const k = Math.ceil(Math.abs(dark * 20 - total * 10) / total) - 1;\n assert(0 <= k && k <= 9);\n result += k * _QrCode.PENALTY_N4;\n assert(0 <= result && result <= 2568888);\n return result;\n }\n /*-- Private helper functions --*/\n // Returns an ascending list of positions of alignment patterns for this version number.\n // Each position is in the range [0,177), and are used on both the x and y axes.\n // This could be implemented as lookup table of 40 variable-length lists of integers.\n getAlignmentPatternPositions() {\n if (this.version == 1)\n return [];\n else {\n const numAlign = Math.floor(this.version / 7) + 2;\n const step = this.version == 32 ? 26 : Math.ceil((this.version * 4 + 4) / (numAlign * 2 - 2)) * 2;\n let result = [6];\n for (let pos = this.size - 7; result.length < numAlign; pos -= step)\n result.splice(1, 0, pos);\n return result;\n }\n }\n // Returns the number of data bits that can be stored in a QR Code of the given version number, after\n // all function modules are excluded. This includes remainder bits, so it might not be a multiple of 8.\n // The result is in the range [208, 29648]. This could be implemented as a 40-entry lookup table.\n static getNumRawDataModules(ver) {\n if (ver < _QrCode.MIN_VERSION || ver > _QrCode.MAX_VERSION)\n throw new RangeError(\"Version number out of range\");\n let result = (16 * ver + 128) * ver + 64;\n if (ver >= 2) {\n const numAlign = Math.floor(ver / 7) + 2;\n result -= (25 * numAlign - 10) * numAlign - 55;\n if (ver >= 7)\n result -= 36;\n }\n assert(208 <= result && result <= 29648);\n return result;\n }\n // Returns the number of 8-bit data (i.e. not error correction) codewords contained in any\n // QR Code of the given version number and error correction level, with remainder bits discarded.\n // This stateless pure function could be implemented as a (40*4)-cell lookup table.\n static getNumDataCodewords(ver, ecl) {\n return Math.floor(_QrCode.getNumRawDataModules(ver) / 8) - _QrCode.ECC_CODEWORDS_PER_BLOCK[ecl.ordinal][ver] * _QrCode.NUM_ERROR_CORRECTION_BLOCKS[ecl.ordinal][ver];\n }\n // Returns a Reed-Solomon ECC generator polynomial for the given degree. This could be\n // implemented as a lookup table over all possible parameter values, instead of as an algorithm.\n static reedSolomonComputeDivisor(degree) {\n if (degree < 1 || degree > 255)\n throw new RangeError(\"Degree out of range\");\n let result = [];\n for (let i = 0; i < degree - 1; i++)\n result.push(0);\n result.push(1);\n let root = 1;\n for (let i = 0; i < degree; i++) {\n for (let j = 0; j < result.length; j++) {\n result[j] = _QrCode.reedSolomonMultiply(result[j], root);\n if (j + 1 < result.length)\n result[j] ^= result[j + 1];\n }\n root = _QrCode.reedSolomonMultiply(root, 2);\n }\n return result;\n }\n // Returns the Reed-Solomon error correction codeword for the given data and divisor polynomials.\n static reedSolomonComputeRemainder(data, divisor) {\n let result = divisor.map((_) => 0);\n for (const b of data) {\n const factor = b ^ result.shift();\n result.push(0);\n divisor.forEach((coef, i) => result[i] ^= _QrCode.reedSolomonMultiply(coef, factor));\n }\n return result;\n }\n // Returns the product of the two given field elements modulo GF(2^8/0x11D). The arguments and result\n // are unsigned 8-bit integers. This could be implemented as a lookup table of 256*256 entries of uint8.\n static reedSolomonMultiply(x, y) {\n if (x >>> 8 != 0 || y >>> 8 != 0)\n throw new RangeError(\"Byte out of range\");\n let z = 0;\n for (let i = 7; i >= 0; i--) {\n z = z << 1 ^ (z >>> 7) * 285;\n z ^= (y >>> i & 1) * x;\n }\n assert(z >>> 8 == 0);\n return z;\n }\n // Can only be called immediately after a light run is added, and\n // returns either 0, 1, or 2. A helper function for getPenaltyScore().\n finderPenaltyCountPatterns(runHistory) {\n const n = runHistory[1];\n assert(n <= this.size * 3);\n const core = n > 0 && runHistory[2] == n && runHistory[3] == n * 3 && runHistory[4] == n && runHistory[5] == n;\n return (core && runHistory[0] >= n * 4 && runHistory[6] >= n ? 1 : 0) + (core && runHistory[6] >= n * 4 && runHistory[0] >= n ? 1 : 0);\n }\n // Must be called at the end of a line (row or column) of modules. A helper function for getPenaltyScore().\n finderPenaltyTerminateAndCount(currentRunColor, currentRunLength, runHistory) {\n if (currentRunColor) {\n this.finderPenaltyAddHistory(currentRunLength, runHistory);\n currentRunLength = 0;\n }\n currentRunLength += this.size;\n this.finderPenaltyAddHistory(currentRunLength, runHistory);\n return this.finderPenaltyCountPatterns(runHistory);\n }\n // Pushes the given value to the front and drops the last value. A helper function for getPenaltyScore().\n finderPenaltyAddHistory(currentRunLength, runHistory) {\n if (runHistory[0] == 0)\n currentRunLength += this.size;\n runHistory.pop();\n runHistory.unshift(currentRunLength);\n }\n };\n /*-- Constants and tables --*/\n // The minimum version number supported in the QR Code Model 2 standard.\n _QrCode.MIN_VERSION = 1;\n // The maximum version number supported in the QR Code Model 2 standard.\n _QrCode.MAX_VERSION = 40;\n // For use in getPenaltyScore(), when evaluating which mask is best.\n _QrCode.PENALTY_N1 = 3;\n _QrCode.PENALTY_N2 = 3;\n _QrCode.PENALTY_N3 = 40;\n _QrCode.PENALTY_N4 = 10;\n _QrCode.ECC_CODEWORDS_PER_BLOCK = [\n // Version: (note that index 0 is for padding, and is set to an illegal value)\n //0, 1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12, 13, 14, 15, 16, 17, 18, 19, 20, 21, 22, 23, 24, 25, 26, 27, 28, 29, 30, 31, 32, 33, 34, 35, 36, 37, 38, 39, 40 Error correction level\n [-1, 7, 10, 15, 20, 26, 18, 20, 24, 30, 18, 20, 24, 26, 30, 22, 24, 28, 30, 28, 28, 28, 28, 30, 30, 26, 28, 30, 30, 30, 30, 30, 30, 30, 30, 30, 30, 30, 30, 30, 30],\n // Low\n [-1, 10, 16, 26, 18, 24, 16, 18, 22, 22, 26, 30, 22, 22, 24, 24, 28, 28, 26, 26, 26, 26, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28],\n // Medium\n [-1, 13, 22, 18, 26, 18, 24, 18, 22, 20, 24, 28, 26, 24, 20, 30, 24, 28, 28, 26, 30, 28, 30, 30, 30, 30, 28, 30, 30, 30, 30, 30, 30, 30, 30, 30, 30, 30, 30, 30, 30],\n // Quartile\n [-1, 17, 28, 22, 16, 22, 28, 26, 26, 24, 28, 24, 28, 22, 24, 24, 30, 28, 28, 26, 28, 30, 24, 30, 30, 30, 30, 30, 30, 30, 30, 30, 30, 30, 30, 30, 30, 30, 30, 30, 30]\n // High\n ];\n _QrCode.NUM_ERROR_CORRECTION_BLOCKS = [\n // Version: (note that index 0 is for padding, and is set to an illegal value)\n //0, 1, 2, 3, 4, 5, 6, 7, 8, 9,10, 11, 12, 13, 14, 15, 16, 17, 18, 19, 20, 21, 22, 23, 24, 25, 26, 27, 28, 29, 30, 31, 32, 33, 34, 35, 36, 37, 38, 39, 40 Error correction level\n [-1, 1, 1, 1, 1, 1, 2, 2, 2, 2, 4, 4, 4, 4, 4, 6, 6, 6, 6, 7, 8, 8, 9, 9, 10, 12, 12, 12, 13, 14, 15, 16, 17, 18, 19, 19, 20, 21, 22, 24, 25],\n // Low\n [-1, 1, 1, 1, 2, 2, 4, 4, 4, 5, 5, 5, 8, 9, 9, 10, 10, 11, 13, 14, 16, 17, 17, 18, 20, 21, 23, 25, 26, 28, 29, 31, 33, 35, 37, 38, 40, 43, 45, 47, 49],\n // Medium\n [-1, 1, 1, 2, 2, 4, 4, 6, 6, 8, 8, 8, 10, 12, 16, 12, 17, 16, 18, 21, 20, 23, 23, 25, 27, 29, 34, 34, 35, 38, 40, 43, 45, 48, 51, 53, 56, 59, 62, 65, 68],\n // Quartile\n [-1, 1, 1, 2, 4, 4, 4, 5, 6, 8, 8, 11, 11, 16, 16, 18, 16, 19, 21, 25, 25, 25, 34, 30, 32, 35, 37, 40, 42, 45, 48, 51, 54, 57, 60, 63, 66, 70, 74, 77, 81]\n // High\n ];\n let QrCode = _QrCode;\n qrcodegen2.QrCode = _QrCode;\n function appendBits(val, len, bb) {\n if (len < 0 || len > 31 || val >>> len != 0)\n throw new RangeError(\"Value out of range\");\n for (let i = len - 1; i >= 0; i--)\n bb.push(val >>> i & 1);\n }\n function getBit(x, i) {\n return (x >>> i & 1) != 0;\n }\n function assert(cond) {\n if (!cond)\n throw new Error(\"Assertion error\");\n }\n const _QrSegment = class _QrSegment {\n /*-- Constructor (low level) and fields --*/\n // Creates a new QR Code segment with the given attributes and data.\n // The character count (numChars) must agree with the mode and the bit buffer length,\n // but the constraint isn't checked. The given bit buffer is cloned and stored.\n constructor(mode, numChars, bitData) {\n this.mode = mode;\n this.numChars = numChars;\n this.bitData = bitData;\n if (numChars < 0)\n throw new RangeError(\"Invalid argument\");\n this.bitData = bitData.slice();\n }\n /*-- Static factory functions (mid level) --*/\n // Returns a segment representing the given binary data encoded in\n // byte mode. All input byte arrays are acceptable. Any text string\n // can be converted to UTF-8 bytes and encoded as a byte mode segment.\n static makeBytes(data) {\n let bb = [];\n for (const b of data)\n appendBits(b, 8, bb);\n return new _QrSegment(_QrSegment.Mode.BYTE, data.length, bb);\n }\n // Returns a segment representing the given string of decimal digits encoded in numeric mode.\n static makeNumeric(digits) {\n if (!_QrSegment.isNumeric(digits))\n throw new RangeError(\"String contains non-numeric characters\");\n let bb = [];\n for (let i = 0; i < digits.length; ) {\n const n = Math.min(digits.length - i, 3);\n appendBits(parseInt(digits.substring(i, i + n), 10), n * 3 + 1, bb);\n i += n;\n }\n return new _QrSegment(_QrSegment.Mode.NUMERIC, digits.length, bb);\n }\n // Returns a segment representing the given text string encoded in alphanumeric mode.\n // The characters allowed are: 0 to 9, A to Z (uppercase only), space,\n // dollar, percent, asterisk, plus, hyphen, period, slash, colon.\n static makeAlphanumeric(text) {\n if (!_QrSegment.isAlphanumeric(text))\n throw new RangeError(\"String contains unencodable characters in alphanumeric mode\");\n let bb = [];\n let i;\n for (i = 0; i + 2 <= text.length; i += 2) {\n let temp = _QrSegment.ALPHANUMERIC_CHARSET.indexOf(text.charAt(i)) * 45;\n temp += _QrSegment.ALPHANUMERIC_CHARSET.indexOf(text.charAt(i + 1));\n appendBits(temp, 11, bb);\n }\n if (i < text.length)\n appendBits(_QrSegment.ALPHANUMERIC_CHARSET.indexOf(text.charAt(i)), 6, bb);\n return new _QrSegment(_QrSegment.Mode.ALPHANUMERIC, text.length, bb);\n }\n // Returns a new mutable list of zero or more segments to represent the given Unicode text string.\n // The result may use various segment modes and switch modes to optimize the length of the bit stream.\n static makeSegments(text) {\n if (text == \"\")\n return [];\n else if (_QrSegment.isNumeric(text))\n return [_QrSegment.makeNumeric(text)];\n else if (_QrSegment.isAlphanumeric(text))\n return [_QrSegment.makeAlphanumeric(text)];\n else\n return [_QrSegment.makeBytes(_QrSegment.toUtf8ByteArray(text))];\n }\n // Returns a segment representing an Extended Channel Interpretation\n // (ECI) designator with the given assignment value.\n static makeEci(assignVal) {\n let bb = [];\n if (assignVal < 0)\n throw new RangeError(\"ECI assignment value out of range\");\n else if (assignVal < 1 << 7)\n appendBits(assignVal, 8, bb);\n else if (assignVal < 1 << 14) {\n appendBits(2, 2, bb);\n appendBits(assignVal, 14, bb);\n } else if (assignVal < 1e6) {\n appendBits(6, 3, bb);\n appendBits(assignVal, 21, bb);\n } else\n throw new RangeError(\"ECI assignment value out of range\");\n return new _QrSegment(_QrSegment.Mode.ECI, 0, bb);\n }\n // Tests whether the given string can be encoded as a segment in numeric mode.\n // A string is encodable iff each character is in the range 0 to 9.\n static isNumeric(text) {\n return _QrSegment.NUMERIC_REGEX.test(text);\n }\n // Tests whether the given string can be encoded as a segment in alphanumeric mode.\n // A string is encodable iff each character is in the following set: 0 to 9, A to Z\n // (uppercase only), space, dollar, percent, asterisk, plus, hyphen, period, slash, colon.\n static isAlphanumeric(text) {\n return _QrSegment.ALPHANUMERIC_REGEX.test(text);\n }\n /*-- Methods --*/\n // Returns a new copy of the data bits of this segment.\n getData() {\n return this.bitData.slice();\n }\n // (Package-private) Calculates and returns the number of bits needed to encode the given segments at\n // the given version. The result is infinity if a segment has too many characters to fit its length field.\n static getTotalBits(segs, version) {\n let result = 0;\n for (const seg of segs) {\n const ccbits = seg.mode.numCharCountBits(version);\n if (seg.numChars >= 1 << ccbits)\n return Infinity;\n result += 4 + ccbits + seg.bitData.length;\n }\n return result;\n }\n // Returns a new array of bytes representing the given string encoded in UTF-8.\n static toUtf8ByteArray(str) {\n str = encodeURI(str);\n let result = [];\n for (let i = 0; i < str.length; i++) {\n if (str.charAt(i) != \"%\")\n result.push(str.charCodeAt(i));\n else {\n result.push(parseInt(str.substring(i + 1, i + 3), 16));\n i += 2;\n }\n }\n return result;\n }\n };\n /*-- Constants --*/\n // Describes precisely all strings that are encodable in numeric mode.\n _QrSegment.NUMERIC_REGEX = /^[0-9]*$/;\n // Describes precisely all strings that are encodable in alphanumeric mode.\n _QrSegment.ALPHANUMERIC_REGEX = /^[A-Z0-9 $%*+.\\/:-]*$/;\n // The set of all legal characters in alphanumeric mode,\n // where each character value maps to the index in the string.\n _QrSegment.ALPHANUMERIC_CHARSET = \"0123456789ABCDEFGHIJKLMNOPQRSTUVWXYZ $%*+-./:\";\n let QrSegment = _QrSegment;\n qrcodegen2.QrSegment = _QrSegment;\n})(qrcodegen || (qrcodegen = {}));\n((qrcodegen2) => {\n let QrCode;\n ((QrCode2) => {\n const _Ecc = class _Ecc {\n // The QR Code can tolerate about 30% erroneous codewords\n /*-- Constructor and fields --*/\n constructor(ordinal, formatBits) {\n this.ordinal = ordinal;\n this.formatBits = formatBits;\n }\n };\n /*-- Constants --*/\n _Ecc.LOW = new _Ecc(0, 1);\n // The QR Code can tolerate about 7% erroneous codewords\n _Ecc.MEDIUM = new _Ecc(1, 0);\n // The QR Code can tolerate about 15% erroneous codewords\n _Ecc.QUARTILE = new _Ecc(2, 3);\n // The QR Code can tolerate about 25% erroneous codewords\n _Ecc.HIGH = new _Ecc(3, 2);\n let Ecc = _Ecc;\n QrCode2.Ecc = _Ecc;\n })(QrCode = qrcodegen2.QrCode || (qrcodegen2.QrCode = {}));\n})(qrcodegen || (qrcodegen = {}));\n((qrcodegen2) => {\n let QrSegment;\n ((QrSegment2) => {\n const _Mode = class _Mode {\n /*-- Constructor and fields --*/\n constructor(modeBits, numBitsCharCount) {\n this.modeBits = modeBits;\n this.numBitsCharCount = numBitsCharCount;\n }\n /*-- Method --*/\n // (Package-private) Returns the bit width of the character count field for a segment in\n // this mode in a QR Code at the given version number. The result is in the range [0, 16].\n numCharCountBits(ver) {\n return this.numBitsCharCount[Math.floor((ver + 7) / 17)];\n }\n };\n /*-- Constants --*/\n _Mode.NUMERIC = new _Mode(1, [10, 12, 14]);\n _Mode.ALPHANUMERIC = new _Mode(2, [9, 11, 13]);\n _Mode.BYTE = new _Mode(4, [8, 16, 16]);\n _Mode.KANJI = new _Mode(8, [8, 10, 12]);\n _Mode.ECI = new _Mode(7, [0, 0, 0]);\n let Mode = _Mode;\n QrSegment2.Mode = _Mode;\n })(QrSegment = qrcodegen2.QrSegment || (qrcodegen2.QrSegment = {}));\n})(qrcodegen || (qrcodegen = {}));\nvar qrcodegen_default = qrcodegen;\n\n// src/index.tsx\n/**\n * @license qrcode.react\n * Copyright (c) Paul O'Shannessy\n * SPDX-License-Identifier: ISC\n */\nvar ERROR_LEVEL_MAP = {\n L: qrcodegen_default.QrCode.Ecc.LOW,\n M: qrcodegen_default.QrCode.Ecc.MEDIUM,\n Q: qrcodegen_default.QrCode.Ecc.QUARTILE,\n H: qrcodegen_default.QrCode.Ecc.HIGH\n};\nvar DEFAULT_SIZE = 128;\nvar DEFAULT_LEVEL = \"L\";\nvar DEFAULT_BGCOLOR = \"#FFFFFF\";\nvar DEFAULT_FGCOLOR = \"#000000\";\nvar DEFAULT_INCLUDEMARGIN = false;\nvar DEFAULT_MINVERSION = 1;\nvar SPEC_MARGIN_SIZE = 4;\nvar DEFAULT_MARGIN_SIZE = 0;\nvar DEFAULT_IMG_SCALE = 0.1;\nfunction generatePath(modules, margin = 0) {\n const ops = [];\n modules.forEach(function(row, y) {\n let start = null;\n row.forEach(function(cell, x) {\n if (!cell && start !== null) {\n ops.push(\n `M${start + margin} ${y + margin}h${x - start}v1H${start + margin}z`\n );\n start = null;\n return;\n }\n if (x === row.length - 1) {\n if (!cell) {\n return;\n }\n if (start === null) {\n ops.push(`M${x + margin},${y + margin} h1v1H${x + margin}z`);\n } else {\n ops.push(\n `M${start + margin},${y + margin} h${x + 1 - start}v1H${start + margin}z`\n );\n }\n return;\n }\n if (cell && start === null) {\n start = x;\n }\n });\n });\n return ops.join(\"\");\n}\nfunction excavateModules(modules, excavation) {\n return modules.slice().map((row, y) => {\n if (y < excavation.y || y >= excavation.y + excavation.h) {\n return row;\n }\n return row.map((cell, x) => {\n if (x < excavation.x || x >= excavation.x + excavation.w) {\n return cell;\n }\n return false;\n });\n });\n}\nfunction getImageSettings(cells, size, margin, imageSettings) {\n if (imageSettings == null) {\n return null;\n }\n const numCells = cells.length + margin * 2;\n const defaultSize = Math.floor(size * DEFAULT_IMG_SCALE);\n const scale = numCells / size;\n const w = (imageSettings.width || defaultSize) * scale;\n const h = (imageSettings.height || defaultSize) * scale;\n const x = imageSettings.x == null ? cells.length / 2 - w / 2 : imageSettings.x * scale;\n const y = imageSettings.y == null ? cells.length / 2 - h / 2 : imageSettings.y * scale;\n const opacity = imageSettings.opacity == null ? 1 : imageSettings.opacity;\n let excavation = null;\n if (imageSettings.excavate) {\n let floorX = Math.floor(x);\n let floorY = Math.floor(y);\n let ceilW = Math.ceil(w + x - floorX);\n let ceilH = Math.ceil(h + y - floorY);\n excavation = { x: floorX, y: floorY, w: ceilW, h: ceilH };\n }\n const crossOrigin = imageSettings.crossOrigin;\n return { x, y, h, w, excavation, opacity, crossOrigin };\n}\nfunction getMarginSize(includeMargin, marginSize) {\n if (marginSize != null) {\n return Math.max(Math.floor(marginSize), 0);\n }\n return includeMargin ? SPEC_MARGIN_SIZE : DEFAULT_MARGIN_SIZE;\n}\nfunction useQRCode({\n value,\n level,\n minVersion,\n includeMargin,\n marginSize,\n imageSettings,\n size,\n boostLevel\n}) {\n let qrcode = React.useMemo(() => {\n const values = Array.isArray(value) ? value : [value];\n const segments = values.reduce((accum, v) => {\n accum.push(...qrcodegen_default.QrSegment.makeSegments(v));\n return accum;\n }, []);\n return qrcodegen_default.QrCode.encodeSegments(\n segments,\n ERROR_LEVEL_MAP[level],\n minVersion,\n void 0,\n void 0,\n boostLevel\n );\n }, [value, level, minVersion, boostLevel]);\n const { cells, margin, numCells, calculatedImageSettings } = React.useMemo(() => {\n let cells2 = qrcode.getModules();\n const margin2 = getMarginSize(includeMargin, marginSize);\n const numCells2 = cells2.length + margin2 * 2;\n const calculatedImageSettings2 = getImageSettings(\n cells2,\n size,\n margin2,\n imageSettings\n );\n return {\n cells: cells2,\n margin: margin2,\n numCells: numCells2,\n calculatedImageSettings: calculatedImageSettings2\n };\n }, [qrcode, size, imageSettings, includeMargin, marginSize]);\n return {\n qrcode,\n margin,\n cells,\n numCells,\n calculatedImageSettings\n };\n}\nvar SUPPORTS_PATH2D = function() {\n try {\n new Path2D().addPath(new Path2D());\n } catch (e) {\n return false;\n }\n return true;\n}();\nvar QRCodeCanvas = React.forwardRef(\n function QRCodeCanvas2(props, forwardedRef) {\n const _a = props, {\n value,\n size = DEFAULT_SIZE,\n level = DEFAULT_LEVEL,\n bgColor = DEFAULT_BGCOLOR,\n fgColor = DEFAULT_FGCOLOR,\n includeMargin = DEFAULT_INCLUDEMARGIN,\n minVersion = DEFAULT_MINVERSION,\n boostLevel,\n marginSize,\n imageSettings\n } = _a, extraProps = __objRest(_a, [\n \"value\",\n \"size\",\n \"level\",\n \"bgColor\",\n \"fgColor\",\n \"includeMargin\",\n \"minVersion\",\n \"boostLevel\",\n \"marginSize\",\n \"imageSettings\"\n ]);\n const _b = extraProps, { style } = _b, otherProps = __objRest(_b, [\"style\"]);\n const imgSrc = imageSettings == null ? void 0 : imageSettings.src;\n const _canvas = React.useRef(null);\n const _image = React.useRef(null);\n const setCanvasRef = React.useCallback(\n (node) => {\n _canvas.current = node;\n if (typeof forwardedRef === \"function\") {\n forwardedRef(node);\n } else if (forwardedRef) {\n forwardedRef.current = node;\n }\n },\n [forwardedRef]\n );\n const [isImgLoaded, setIsImageLoaded] = React.useState(false);\n const { margin, cells, numCells, calculatedImageSettings } = useQRCode({\n value,\n level,\n minVersion,\n boostLevel,\n includeMargin,\n marginSize,\n imageSettings,\n size\n });\n React.useEffect(() => {\n if (_canvas.current != null) {\n const canvas = _canvas.current;\n const ctx = canvas.getContext(\"2d\");\n if (!ctx) {\n return;\n }\n let cellsToDraw = cells;\n const image = _image.current;\n const haveImageToRender = calculatedImageSettings != null && image !== null && image.complete && image.naturalHeight !== 0 && image.naturalWidth !== 0;\n if (haveImageToRender) {\n if (calculatedImageSettings.excavation != null) {\n cellsToDraw = excavateModules(\n cells,\n calculatedImageSettings.excavation\n );\n }\n }\n const pixelRatio = window.devicePixelRatio || 1;\n canvas.height = canvas.width = size * pixelRatio;\n const scale = size / numCells * pixelRatio;\n ctx.scale(scale, scale);\n ctx.fillStyle = bgColor;\n ctx.fillRect(0, 0, numCells, numCells);\n ctx.fillStyle = fgColor;\n if (SUPPORTS_PATH2D) {\n ctx.fill(new Path2D(generatePath(cellsToDraw, margin)));\n } else {\n cells.forEach(function(row, rdx) {\n row.forEach(function(cell, cdx) {\n if (cell) {\n ctx.fillRect(cdx + margin, rdx + margin, 1, 1);\n }\n });\n });\n }\n if (calculatedImageSettings) {\n ctx.globalAlpha = calculatedImageSettings.opacity;\n }\n if (haveImageToRender) {\n ctx.drawImage(\n image,\n calculatedImageSettings.x + margin,\n calculatedImageSettings.y + margin,\n calculatedImageSettings.w,\n calculatedImageSettings.h\n );\n }\n }\n });\n React.useEffect(() => {\n setIsImageLoaded(false);\n }, [imgSrc]);\n const canvasStyle = __spreadValues({ height: size, width: size }, style);\n let img = null;\n if (imgSrc != null) {\n img = /* @__PURE__ */ React.createElement(\n \"img\",\n {\n src: imgSrc,\n key: imgSrc,\n style: { display: \"none\" },\n onLoad: () => {\n setIsImageLoaded(true);\n },\n ref: _image,\n crossOrigin: calculatedImageSettings == null ? void 0 : calculatedImageSettings.crossOrigin\n }\n );\n }\n return /* @__PURE__ */ React.createElement(React.Fragment, null, /* @__PURE__ */ React.createElement(\n \"canvas\",\n __spreadValues({\n style: canvasStyle,\n height: size,\n width: size,\n ref: setCanvasRef,\n role: \"img\"\n }, otherProps)\n ), img);\n }\n);\nQRCodeCanvas.displayName = \"QRCodeCanvas\";\nvar QRCodeSVG = React.forwardRef(\n function QRCodeSVG2(props, forwardedRef) {\n const _a = props, {\n value,\n size = DEFAULT_SIZE,\n level = DEFAULT_LEVEL,\n bgColor = DEFAULT_BGCOLOR,\n fgColor = DEFAULT_FGCOLOR,\n includeMargin = DEFAULT_INCLUDEMARGIN,\n minVersion = DEFAULT_MINVERSION,\n boostLevel,\n title,\n marginSize,\n imageSettings\n } = _a, otherProps = __objRest(_a, [\n \"value\",\n \"size\",\n \"level\",\n \"bgColor\",\n \"fgColor\",\n \"includeMargin\",\n \"minVersion\",\n \"boostLevel\",\n \"title\",\n \"marginSize\",\n \"imageSettings\"\n ]);\n const { margin, cells, numCells, calculatedImageSettings } = useQRCode({\n value,\n level,\n minVersion,\n boostLevel,\n includeMargin,\n marginSize,\n imageSettings,\n size\n });\n let cellsToDraw = cells;\n let image = null;\n if (imageSettings != null && calculatedImageSettings != null) {\n if (calculatedImageSettings.excavation != null) {\n cellsToDraw = excavateModules(\n cells,\n calculatedImageSettings.excavation\n );\n }\n image = /* @__PURE__ */ React.createElement(\n \"image\",\n {\n href: imageSettings.src,\n height: calculatedImageSettings.h,\n width: calculatedImageSettings.w,\n x: calculatedImageSettings.x + margin,\n y: calculatedImageSettings.y + margin,\n preserveAspectRatio: \"none\",\n opacity: calculatedImageSettings.opacity,\n crossOrigin: calculatedImageSettings.crossOrigin\n }\n );\n }\n const fgPath = generatePath(cellsToDraw, margin);\n return /* @__PURE__ */ React.createElement(\n \"svg\",\n __spreadValues({\n height: size,\n width: size,\n viewBox: `0 0 ${numCells} ${numCells}`,\n ref: forwardedRef,\n role: \"img\"\n }, otherProps),\n !!title && /* @__PURE__ */ React.createElement(\"title\", null, title),\n /* @__PURE__ */ React.createElement(\n \"path\",\n {\n fill: bgColor,\n d: `M0,0 h${numCells}v${numCells}H0z`,\n shapeRendering: \"crispEdges\"\n }\n ),\n /* @__PURE__ */ React.createElement(\"path\", { fill: fgColor, d: fgPath, shapeRendering: \"crispEdges\" }),\n image\n );\n }\n);\nQRCodeSVG.displayName = \"QRCodeSVG\";\nexport {\n QRCodeCanvas,\n QRCodeSVG\n};\n","import React, { useEffect, useState } from \"react\";\r\nimport { useSelector } from \"react-redux\";\r\nimport { Global } from \"../../../Global\";\r\nimport Cookies from \"js-cookie\";\r\nimport { QRCodeSVG } from \"qrcode.react\";\r\nimport { OtpInput } from \"reactjs-otp-input\";\r\nimport Modal from \"react-modal\";\r\n\r\nconst customStyles = {\r\n overlay: {\r\n backgroundColor: \"rgba(51,51,51,0.6)\",\r\n zIndex: \"9000\",\r\n },\r\n};\r\n\r\nconst TwoFactor = () => {\r\n const isLogged = useSelector((state) => state.credential.isLogged);\r\n const customer = useSelector((state) => state.credential.customer);\r\n const customerToken = useSelector((state) => state.credential.customerToken);\r\n const customerId = useSelector((state) => state.credential.customerId);\r\n const [isUsing2Fa, setIsUsing2Fa] = useState();\r\n const [show, setShow] = useState(false);\r\n const [otp, setOtp] = useState(\"\");\r\n const [showRecovery, setShowRecovery] = useState(false);\r\n const [recoveryKey, setRecoveryKey] = useState(\"\");\r\n\r\n const CheckIfUsing2Fa = async () => {\r\n const response = await fetch(\r\n Global.API_URL + \"Customer/Check2FAEnabledStatus\",\r\n {\r\n method: \"GET\",\r\n headers: {\r\n Accept: \"application/json\",\r\n \"Content-Type\": \"application/json\",\r\n \"Access-Control-Allow-Origin\": Global.HostAPI,\r\n AuthorizationCustomer: customerToken,\r\n countryCode: Cookies.get(\"Country\"),\r\n },\r\n }\r\n );\r\n const result = await response.json();\r\n if (response.ok) {\r\n if (result.Code === 1) {\r\n setIsUsing2Fa(result.IsUsing2FA);\r\n if (result.IsUsing2FA) {\r\n setShow(result.IsUsing2FA);\r\n } else {\r\n setShow(false);\r\n }\r\n }\r\n }\r\n };\r\n const handleChange = (otp) => setOtp(otp);\r\n\r\n const Submit2FA = async () => {\r\n const response = await fetch(\r\n Global.API_URL + \"Customer/ChangeEnable2FAStatus\",\r\n {\r\n method: \"PATCH\",\r\n headers: {\r\n Accept: \"application/json\",\r\n \"Content-Type\": \"application/json\",\r\n \"Access-Control-Allow-Origin\": Global.HostAPI,\r\n AuthorizationCustomer: customerToken,\r\n countryCode: Cookies.get(\"Country\"),\r\n },\r\n body: JSON.stringify({\r\n customerID: customerId,\r\n sixDigitCode: otp,\r\n isEnabled: true,\r\n }),\r\n }\r\n );\r\n const result = await response.json();\r\n if (response.ok) {\r\n if (result.Code === 0) {\r\n CheckIfUsing2Fa();\r\n setRecoveryKey(result.RecoveryKey);\r\n setShowRecovery(true);\r\n setOtp(false);\r\n }\r\n }\r\n };\r\n const Disable2FA = async () => {\r\n const response = await fetch(\r\n Global.API_URL + \"Customer/ChangeEnable2FAStatus\",\r\n {\r\n method: \"PATCH\",\r\n headers: {\r\n Accept: \"application/json\",\r\n \"Content-Type\": \"application/json\",\r\n \"Access-Control-Allow-Origin\": Global.HostAPI,\r\n AuthorizationCustomer: customerToken,\r\n countryCode: Cookies.get(\"Country\"),\r\n },\r\n body: JSON.stringify({\r\n customerID: customerId,\r\n sixDigitCode: otp,\r\n isEnabled: false,\r\n }),\r\n }\r\n );\r\n const result = await response.json();\r\n if (response.ok) {\r\n if (result.Code === 1) {\r\n CheckIfUsing2Fa();\r\n setShow(false);\r\n setOtp(false);\r\n }\r\n }\r\n };\r\n useEffect(() => {\r\n CheckIfUsing2Fa();\r\n }, []);\r\n return (\r\n \r\n Newsletter Subscription\r\n
\r\n\r\n
\r\n \r\n \r\n
\r\n \r\n Subscribe\r\n
\r\n \r\n \r\n
\r\n \r\n Unsubscribe\r\n
\r\n \r\n {\" \"}\r\n setShowRecovery(false)}\r\n >\r\n setShowRecovery(false)}\r\n >\r\n \r\n Ok\r\n \r\n
\r\n \r\n \r\n ) : (\r\n \"\"\r\n )}\r\n \r\n );\r\n};\r\n\r\nexport default TwoFactor;\r\n","import React, { useState, useEffect, Fragment, useRef } from \"react\";\r\n\r\nimport ProductTwelve from \"../../../features/products/product-twelve\";\r\n\r\nfunction ShopListOneWishList(props) {\r\n const {\r\n loading,\r\n products,\r\n pageLimit,\r\n pageRef,\r\n windowSize,\r\n setShowSidebar,\r\n showSidebar,\r\n country,\r\n menu,\r\n selectedParent,\r\n dictionary,\r\n onWishlistClick,\r\n } = props;\r\n // const router = useRouter();\r\n const [fakeArray, setFakeArray] = useState([]);\r\n const [product, setProduct] = useState([]);\r\n const carouselRef = useRef(null);\r\n\r\n useEffect(() => {\r\n let temp = [];\r\n for (let i = 0; i < pageLimit; i++) {\r\n temp.push(i);\r\n }\r\n setFakeArray(temp);\r\n }, [pageLimit]);\r\n\r\n const handleButtonHover = (isHovering) => {\r\n if (carouselRef.current) {\r\n if (isHovering) {\r\n carouselRef.current.stop();\r\n } else {\r\n carouselRef.current.play();\r\n }\r\n }\r\n };\r\n\r\n useEffect(() => {\r\n if (products) {\r\n let updatedProducts = products.map((product) => {\r\n if (product.variations) {\r\n return {\r\n ...product,\r\n variations: product.variations.map((v) => {\r\n if (v.IsInWishList && v.HasSize) {\r\n return {\r\n ...v,\r\n IsSelected: v.IsDefaultVariation ? true : false,\r\n IsSelectedvariation: v.IsSelected,\r\n IsInWishList: v.IsInWishList,\r\n HasSize: v.HasSize,\r\n };\r\n } else {\r\n return {\r\n ...v,\r\n IsSelected: v.IsDefaultVariation ? true : false,\r\n IsSelectedvariation: false,\r\n IsInWishList: v.IsInWishList,\r\n HasSize: v.HasSize,\r\n };\r\n }\r\n }),\r\n };\r\n }\r\n return product;\r\n });\r\n\r\n updatedProducts.forEach((obj) => {\r\n obj.variants = [];\r\n obj.variations.forEach((variation) => {\r\n let colorExists = obj.variants.find(\r\n (v) => v.color === variation.ColorHex\r\n );\r\n if (colorExists) {\r\n // If color exists, push size to existing color object\r\n colorExists.size.push({\r\n IsSelected: variation.IsSelected,\r\n IsSelectedvariation: variation.IsSelectedvariation,\r\n sizeId: variation.SizeId,\r\n sizeSuffix: variation.SizeSuffix,\r\n IsInStock: variation.IsInStock,\r\n ProductVariationId: variation.ProductVariationId,\r\n });\r\n } else {\r\n // Check if at least one size is selected true for the color\r\n const hasSelectedSize = obj.variations.some(\r\n (v) => v.ColorHex === variation.ColorHex && v.IsSelected\r\n );\r\n\r\n obj.variants.push({\r\n color: variation.ColorHex,\r\n color_name: variation.Color,\r\n IsSelected: hasSelectedSize, // Set IsSelected based on the condition\r\n size: [\r\n {\r\n IsSelected: variation.IsSelected,\r\n IsSelectedvariation: variation.IsSelectedvariation,\r\n sizeId: variation.SizeId,\r\n sizeSuffix: variation.SizeSuffix,\r\n IsInStock: variation.IsInStock,\r\n ProductVariationId: variation.ProductVariationId,\r\n },\r\n ],\r\n });\r\n }\r\n });\r\n\r\n // After all variations have been processed, check if any color has IsSelected true\r\n const anyColorSelected = obj.variants.some((v) => v.IsSelected);\r\n\r\n // Set the IsSelected of the color group based on the condition\r\n obj.IsSelected = anyColorSelected;\r\n });\r\n\r\n setProduct(updatedProducts);\r\n }\r\n }, [products]);\r\n return (\r\n \r\n Two - Factor Authentication\r\n
\r\n\r\n
\r\n {isUsing2Fa && !show ? (\r\n \r\n \r\n
\r\n \r\n Disable\r\n
\r\n \r\n \r\n
\r\n \r\n Enable\r\n
\r\n \r\n
\r\n ) : (\r\n \"\"\r\n )}\r\n {!isUsing2Fa && show ? (\r\n \r\n
\r\n \r\n Submit2FA()}\r\n >\r\n Submit\r\n \r\n
\r\n \r\n Scan this QR code with preferred authenticator app\r\n
\r\n\r\n Enter Code\r\n
\r\n \r\n
\r\n \r\n
\r\n \r\n
\r\n \r\n {\" \"}\r\n or download our authenticator app Available on{\" \"}\r\n
\r\n \r\n
\r\n \r\n ![](\"/assets/images/app-store-icon.svg\")
APP STORE{\" \"}\r\n
\r\n APP STORE{\" \"}\r\n \r\n ![](\"/assets/images/google-store-icon.svg\")
Google\r\n Store\r\n
\r\n Google\r\n Store\r\n \r\n
\r\n ) : (\r\n \"\"\r\n )}\r\n {showRecovery ? (\r\n \r\n
\r\n \r\n Disable2FA()}\r\n >\r\n Submit\r\n \r\n
\r\n \r\n Scan this QR code with preferred authenticator app\r\n
\r\n\r\n Enter Code\r\n
\r\n \r\n
\r\n \r\n
\r\n \r\n setShowRecovery(false)}\r\n >
\r\n \r\n Recovery key\r\n
\r\n \r\n
\r\n \r\n the recovery key is available once\r\n
\r\n {recoveryKey}
\r\n \r\n {product.length === 0 && !loading ? (\r\n \r\n m.ParentID === parseInt(selectedParent))\r\n ? menu.filter((m) => m.ParentID === parseInt(selectedParent))[0]\r\n .ParentName\r\n : \"Women\"\r\n }`}\r\n className=\"d-flex justify-content-center\"\r\n >\r\n \r\n \r\n \r\n ) : (\r\n \r\n \r\n )}\r\n
\r\n );\r\n}\r\n\r\nexport default React.memo(ShopListOneWishList);\r\n","// import { useRouter } from 'next/router';\r\nimport React, { useState, useEffect, Fragment, useRef } from \"react\";\r\n\r\nimport ProductTwelve from \"../../../features/products/product-twelve\";\r\n\r\nfunction ShopListOne(props) {\r\n const {\r\n loading,\r\n products,\r\n pageLimit,\r\n type,\r\n pageRef,\r\n windowSize,\r\n setShowSidebar,\r\n showSidebar,\r\n onWishlistClick,\r\n } = props;\r\n // const router = useRouter();\r\n const [fakeArray, setFakeArray] = useState([]);\r\n const [gridClass, setGridClass] = useState(\"col-6\");\r\n const [product, setProduct] = useState([]);\r\n const carouselRef = useRef(null);\r\n\r\n useEffect(() => {\r\n let temp = [];\r\n for (let i = 0; i < pageLimit; i++) {\r\n temp.push(i);\r\n }\r\n setFakeArray(temp);\r\n }, [pageLimit]);\r\n\r\n const handleButtonHover = (isHovering) => {\r\n if (carouselRef.current) {\r\n if (isHovering) {\r\n carouselRef.current.stop();\r\n } else {\r\n carouselRef.current.play();\r\n }\r\n }\r\n };\r\n\r\n useEffect(() => {\r\n if (type === \"list\" || type === \"2cols\") setGridClass(\"col-6\");\r\n if (type === \"3cols\") setGridClass(\"col-6 col-md-4 col-lg-4\");\r\n if (type === \"4cols\") setGridClass(\"col-6 col-md-4 col-lg-4 col-xl-3\");\r\n }, [type]);\r\n\r\n useEffect(() => {\r\n if (products) {\r\n let updatedProducts = products.map((product) => {\r\n if (product.variations) {\r\n return {\r\n ...product,\r\n variations: product.variations.map((v) => {\r\n if (v.IsInWishList && v.HasSize) {\r\n return {\r\n ...v,\r\n IsSelected: v.IsDefaultVariation ? true : false,\r\n IsSelectedvariation: v.IsSelected,\r\n IsInWishList: v.IsInWishList,\r\n HasSize: v.HasSize,\r\n };\r\n } else {\r\n return {\r\n ...v,\r\n IsSelected: v.IsDefaultVariation ? true : false,\r\n IsSelectedvariation: false,\r\n IsInWishList: v.IsInWishList,\r\n HasSize: v.HasSize,\r\n };\r\n }\r\n }),\r\n };\r\n }\r\n return product;\r\n });\r\n // let updatedProducts = products.map((product) => {\r\n // if (product.variations) {\r\n // return {\r\n // ...product,\r\n // variations: product.variations.map((v) => ({\r\n // ...v,\r\n // IsSelected: v.IsDefaultVariation ? true : false,\r\n // IsSelectedvariation: false,\r\n // IsInWishList: v.IsInWishList,\r\n // HasSize: v.HasSize,\r\n // })),\r\n // };\r\n // }\r\n // return product;\r\n // });\r\n\r\n updatedProducts.forEach((obj) => {\r\n obj.variants = [];\r\n obj.variations.forEach((variation) => {\r\n let colorExists = obj.variants.find(\r\n (v) => v.color === variation.ColorHex\r\n );\r\n if (colorExists) {\r\n // If color exists, push size to existing color object\r\n colorExists.size.push({\r\n IsSelected: variation.IsSelected,\r\n IsSelectedvariation: variation.IsSelectedvariation,\r\n sizeId: variation.SizeId,\r\n sizeSuffix: variation.SizeSuffix,\r\n IsInStock: variation.IsInStock,\r\n ProductVariationId: variation.ProductVariationId,\r\n });\r\n } else {\r\n // Check if at least one size is selected true for the color\r\n const hasSelectedSize = obj.variations.some(\r\n (v) => v.ColorHex === variation.ColorHex && v.IsSelected\r\n );\r\n\r\n obj.variants.push({\r\n color: variation.ColorHex,\r\n color_name: variation.Color,\r\n IsSelected: hasSelectedSize, // Set IsSelected based on the condition\r\n size: [\r\n {\r\n IsSelected: variation.IsSelected,\r\n IsSelectedvariation: variation.IsSelectedvariation,\r\n sizeId: variation.SizeId,\r\n sizeSuffix: variation.SizeSuffix,\r\n IsInStock: variation.IsInStock,\r\n ProductVariationId: variation.ProductVariationId,\r\n },\r\n ],\r\n });\r\n }\r\n });\r\n\r\n // After all variations have been processed, check if any color has IsSelected true\r\n const anyColorSelected = obj.variants.some((v) => v.IsSelected);\r\n\r\n // Set the IsSelected of the color group based on the condition\r\n obj.IsSelected = anyColorSelected;\r\n });\r\n\r\n setProduct(updatedProducts);\r\n }\r\n }, [products]);\r\n return (\r\n \r\n {dictionary.oops}\r\n
\r\n \r\n {dictionary.NoItemWishlist}\r\n
\r\n \r\n {dictionary.YourWishlistIsEmpty}\r\n
\r\n \r\n {loading\r\n ? fakeArray.map((item, index) => (\r\n
\r\n \r\n \r\n
\r\n ))\r\n : product.map((p, index) => (\r\n \r\n v.IsSelectedvariation)[0]\r\n ? p.variations.filter((v) => v.IsSelectedvariation)[0]\r\n : p.variations.filter((v) => v.IsSelected)[0]\r\n }\r\n key={index}\r\n handleButtonHover={handleButtonHover}\r\n onWishlistClick={onWishlistClick}\r\n addWishList={true}\r\n />\r\n
\r\n ))}\r\n \r\n {product.length === 0 && !loading ? (\r\n \r\n \r\n \r\n )}\r\n
\r\n );\r\n}\r\n\r\nexport default React.memo(ShopListOne);\r\n","function _arrayLikeToArray(r, a) {\n (null == a || a > r.length) && (a = r.length);\n for (var e = 0, n = Array(a); e < a; e++) n[e] = r[e];\n return n;\n}\nexport { _arrayLikeToArray as default };","import arrayLikeToArray from \"./arrayLikeToArray.js\";\nfunction _unsupportedIterableToArray(r, a) {\n if (r) {\n if (\"string\" == typeof r) return arrayLikeToArray(r, a);\n var t = {}.toString.call(r).slice(8, -1);\n return \"Object\" === t && r.constructor && (t = r.constructor.name), \"Map\" === t || \"Set\" === t ? Array.from(r) : \"Arguments\" === t || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(t) ? arrayLikeToArray(r, a) : void 0;\n }\n}\nexport { _unsupportedIterableToArray as default };","import arrayWithoutHoles from \"./arrayWithoutHoles.js\";\nimport iterableToArray from \"./iterableToArray.js\";\nimport unsupportedIterableToArray from \"./unsupportedIterableToArray.js\";\nimport nonIterableSpread from \"./nonIterableSpread.js\";\nfunction _toConsumableArray(r) {\n return arrayWithoutHoles(r) || iterableToArray(r) || unsupportedIterableToArray(r) || nonIterableSpread();\n}\nexport { _toConsumableArray as default };","import arrayLikeToArray from \"./arrayLikeToArray.js\";\nfunction _arrayWithoutHoles(r) {\n if (Array.isArray(r)) return arrayLikeToArray(r);\n}\nexport { _arrayWithoutHoles as default };","function _iterableToArray(r) {\n if (\"undefined\" != typeof Symbol && null != r[Symbol.iterator] || null != r[\"@@iterator\"]) return Array.from(r);\n}\nexport { _iterableToArray as default };","function _nonIterableSpread() {\n throw new TypeError(\"Invalid attempt to spread non-iterable instance.\\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.\");\n}\nexport { _nonIterableSpread as default };","import arrayWithHoles from \"./arrayWithHoles.js\";\nimport iterableToArrayLimit from \"./iterableToArrayLimit.js\";\nimport unsupportedIterableToArray from \"./unsupportedIterableToArray.js\";\nimport nonIterableRest from \"./nonIterableRest.js\";\nfunction _slicedToArray(r, e) {\n return arrayWithHoles(r) || iterableToArrayLimit(r, e) || unsupportedIterableToArray(r, e) || nonIterableRest();\n}\nexport { _slicedToArray as default };","function _arrayWithHoles(r) {\n if (Array.isArray(r)) return r;\n}\nexport { _arrayWithHoles as default };","function _iterableToArrayLimit(r, l) {\n var t = null == r ? null : \"undefined\" != typeof Symbol && r[Symbol.iterator] || r[\"@@iterator\"];\n if (null != t) {\n var e,\n n,\n i,\n u,\n a = [],\n f = !0,\n o = !1;\n try {\n if (i = (t = t.call(r)).next, 0 === l) {\n if (Object(t) !== t) return;\n f = !1;\n } else for (; !(f = (e = i.call(t)).done) && (a.push(e.value), a.length !== l); f = !0);\n } catch (r) {\n o = !0, n = r;\n } finally {\n try {\n if (!f && null != t[\"return\"] && (u = t[\"return\"](), Object(u) !== u)) return;\n } finally {\n if (o) throw n;\n }\n }\n return a;\n }\n}\nexport { _iterableToArrayLimit as default };","function _nonIterableRest() {\n throw new TypeError(\"Invalid attempt to destructure non-iterable instance.\\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.\");\n}\nexport { _nonIterableRest as default };","import * as React from 'react';\nexport default function useEvent(callback) {\n var fnRef = React.useRef();\n fnRef.current = callback;\n var memoFn = React.useCallback(function () {\n var _fnRef$current;\n for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {\n args[_key] = arguments[_key];\n }\n return (_fnRef$current = fnRef.current) === null || _fnRef$current === void 0 ? void 0 : _fnRef$current.call.apply(_fnRef$current, [fnRef].concat(args));\n }, []);\n return memoFn;\n}","import * as React from 'react';\nimport canUseDom from \"../Dom/canUseDom\";\n\n/**\n * Wrap `React.useLayoutEffect` which will not throw warning message in test env\n */\nvar useInternalLayoutEffect = process.env.NODE_ENV !== 'test' && canUseDom() ? React.useLayoutEffect : React.useEffect;\nvar useLayoutEffect = function useLayoutEffect(callback, deps) {\n var firstMountRef = React.useRef(true);\n useInternalLayoutEffect(function () {\n return callback(firstMountRef.current);\n }, deps);\n\n // We tell react that first mount has passed\n useInternalLayoutEffect(function () {\n firstMountRef.current = false;\n return function () {\n firstMountRef.current = true;\n };\n }, []);\n};\nexport var useLayoutUpdateEffect = function useLayoutUpdateEffect(callback, deps) {\n useLayoutEffect(function (firstMount) {\n if (!firstMount) {\n return callback();\n }\n }, deps);\n};\nexport default useLayoutEffect;","export default function canUseDom() {\n return !!(typeof window !== 'undefined' && window.document && window.document.createElement);\n}","import _slicedToArray from \"@babel/runtime/helpers/esm/slicedToArray\";\nimport * as React from 'react';\n/**\n * Same as React.useState but `setState` accept `ignoreDestroy` param to not to setState after destroyed.\n * We do not make this auto is to avoid real memory leak.\n * Developer should confirm it's safe to ignore themselves.\n */\nexport default function useSafeState(defaultValue) {\n var destroyRef = React.useRef(false);\n var _React$useState = React.useState(defaultValue),\n _React$useState2 = _slicedToArray(_React$useState, 2),\n value = _React$useState2[0],\n setValue = _React$useState2[1];\n React.useEffect(function () {\n destroyRef.current = false;\n return function () {\n destroyRef.current = true;\n };\n }, []);\n function safeSetState(updater, ignoreDestroy) {\n if (ignoreDestroy && destroyRef.current) {\n return;\n }\n setValue(updater);\n }\n return [value, safeSetState];\n}","import _slicedToArray from \"@babel/runtime/helpers/esm/slicedToArray\";\nimport useEvent from \"./useEvent\";\nimport { useLayoutUpdateEffect } from \"./useLayoutEffect\";\nimport useState from \"./useState\";\n/** We only think `undefined` is empty */\nfunction hasValue(value) {\n return value !== undefined;\n}\n\n/**\n * Similar to `useState` but will use props value if provided.\n * Note that internal use rc-util `useState` hook.\n */\nexport default function useMergedState(defaultStateValue, option) {\n var _ref = option || {},\n defaultValue = _ref.defaultValue,\n value = _ref.value,\n onChange = _ref.onChange,\n postState = _ref.postState;\n\n // ======================= Init =======================\n var _useState = useState(function () {\n if (hasValue(value)) {\n return value;\n } else if (hasValue(defaultValue)) {\n return typeof defaultValue === 'function' ? defaultValue() : defaultValue;\n } else {\n return typeof defaultStateValue === 'function' ? defaultStateValue() : defaultStateValue;\n }\n }),\n _useState2 = _slicedToArray(_useState, 2),\n innerValue = _useState2[0],\n setInnerValue = _useState2[1];\n var mergedValue = value !== undefined ? value : innerValue;\n var postMergedValue = postState ? postState(mergedValue) : mergedValue;\n\n // ====================== Change ======================\n var onChangeFn = useEvent(onChange);\n var _useState3 = useState([mergedValue]),\n _useState4 = _slicedToArray(_useState3, 2),\n prevValue = _useState4[0],\n setPrevValue = _useState4[1];\n useLayoutUpdateEffect(function () {\n var prev = prevValue[0];\n if (innerValue !== prev) {\n onChangeFn(innerValue, prev);\n }\n }, [prevValue]);\n\n // Sync value back to `undefined` when it from control to un-control\n useLayoutUpdateEffect(function () {\n if (!hasValue(value)) {\n setInnerValue(value);\n }\n }, [value]);\n\n // ====================== Update ======================\n var triggerChange = useEvent(function (updater, ignoreDestroy) {\n setInnerValue(updater, ignoreDestroy);\n setPrevValue([mergedValue], ignoreDestroy);\n });\n return [postMergedValue, triggerChange];\n}","/* eslint-disable no-console */\nvar warned = {};\nvar preWarningFns = [];\n\n/**\n * Pre warning enable you to parse content before console.error.\n * Modify to null will prevent warning.\n */\nexport var preMessage = function preMessage(fn) {\n preWarningFns.push(fn);\n};\n\n/**\n * Warning if condition not match.\n * @param valid Condition\n * @param message Warning message\n * @example\n * ```js\n * warning(false, 'some error'); // print some error\n * warning(true, 'some error'); // print nothing\n * warning(1 === 2, 'some error'); // print some error\n * ```\n */\nexport function warning(valid, message) {\n if (process.env.NODE_ENV !== 'production' && !valid && console !== undefined) {\n var finalMessage = preWarningFns.reduce(function (msg, preMessageFn) {\n return preMessageFn(msg !== null && msg !== void 0 ? msg : '', 'warning');\n }, message);\n if (finalMessage) {\n console.error(\"Warning: \".concat(finalMessage));\n }\n }\n}\n\n/** @see Similar to {@link warning} */\nexport function note(valid, message) {\n if (process.env.NODE_ENV !== 'production' && !valid && console !== undefined) {\n var finalMessage = preWarningFns.reduce(function (msg, preMessageFn) {\n return preMessageFn(msg !== null && msg !== void 0 ? msg : '', 'note');\n }, message);\n if (finalMessage) {\n console.warn(\"Note: \".concat(finalMessage));\n }\n }\n}\nexport function resetWarned() {\n warned = {};\n}\nexport function call(method, valid, message) {\n if (!valid && !warned[message]) {\n method(false, message);\n warned[message] = true;\n }\n}\n\n/** @see Same as {@link warning}, but only warn once for the same message */\nexport function warningOnce(valid, message) {\n call(warning, valid, message);\n}\n\n/** @see Same as {@link warning}, but only warn once for the same message */\nexport function noteOnce(valid, message) {\n call(note, valid, message);\n}\nwarningOnce.preMessage = preMessage;\nwarningOnce.resetWarned = resetWarned;\nwarningOnce.noteOnce = noteOnce;\nexport default warningOnce;","import _typeof from \"@babel/runtime/helpers/esm/typeof\";\nimport warning from \"./warning\";\n\n/**\n * Deeply compares two object literals.\n * @param obj1 object 1\n * @param obj2 object 2\n * @param shallow shallow compare\n * @returns\n */\nfunction isEqual(obj1, obj2) {\n var shallow = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : false;\n // https://github.com/mapbox/mapbox-gl-js/pull/5979/files#diff-fde7145050c47cc3a306856efd5f9c3016e86e859de9afbd02c879be5067e58f\n var refSet = new Set();\n function deepEqual(a, b) {\n var level = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : 1;\n var circular = refSet.has(a);\n warning(!circular, 'Warning: There may be circular references');\n if (circular) {\n return false;\n }\n if (a === b) {\n return true;\n }\n if (shallow && level > 1) {\n return false;\n }\n refSet.add(a);\n var newLevel = level + 1;\n if (Array.isArray(a)) {\n if (!Array.isArray(b) || a.length !== b.length) {\n return false;\n }\n for (var i = 0; i < a.length; i++) {\n if (!deepEqual(a[i], b[i], newLevel)) {\n return false;\n }\n }\n return true;\n }\n if (a && b && _typeof(a) === 'object' && _typeof(b) === 'object') {\n var keys = Object.keys(a);\n if (keys.length !== Object.keys(b).length) {\n return false;\n }\n return keys.every(function (key) {\n return deepEqual(a[key], b[key], newLevel);\n });\n }\n // other\n return false;\n }\n return deepEqual(obj1, obj2);\n}\nexport default isEqual;","export function getOffset(value, min, max) {\n return (value - min) / (max - min);\n}\nexport function getDirectionStyle(direction, value, min, max) {\n var offset = getOffset(value, min, max);\n var positionStyle = {};\n switch (direction) {\n case 'rtl':\n positionStyle.right = \"\".concat(offset * 100, \"%\");\n positionStyle.transform = 'translateX(50%)';\n break;\n case 'btt':\n positionStyle.bottom = \"\".concat(offset * 100, \"%\");\n positionStyle.transform = 'translateY(50%)';\n break;\n case 'ttb':\n positionStyle.top = \"\".concat(offset * 100, \"%\");\n positionStyle.transform = 'translateY(-50%)';\n break;\n default:\n positionStyle.left = \"\".concat(offset * 100, \"%\");\n positionStyle.transform = 'translateX(-50%)';\n break;\n }\n return positionStyle;\n}\n\n/** Return index value if is list or return value directly */\nexport function getIndex(value, index) {\n return Array.isArray(value) ? value[index] : value;\n}","/**\n * @ignore\n * some key-codes definition and utils from closure-library\n * @author yiminghe@gmail.com\n */\n\nvar KeyCode = {\n /**\n * MAC_ENTER\n */\n MAC_ENTER: 3,\n /**\n * BACKSPACE\n */\n BACKSPACE: 8,\n /**\n * TAB\n */\n TAB: 9,\n /**\n * NUMLOCK on FF/Safari Mac\n */\n NUM_CENTER: 12,\n // NUMLOCK on FF/Safari Mac\n /**\n * ENTER\n */\n ENTER: 13,\n /**\n * SHIFT\n */\n SHIFT: 16,\n /**\n * CTRL\n */\n CTRL: 17,\n /**\n * ALT\n */\n ALT: 18,\n /**\n * PAUSE\n */\n PAUSE: 19,\n /**\n * CAPS_LOCK\n */\n CAPS_LOCK: 20,\n /**\n * ESC\n */\n ESC: 27,\n /**\n * SPACE\n */\n SPACE: 32,\n /**\n * PAGE_UP\n */\n PAGE_UP: 33,\n // also NUM_NORTH_EAST\n /**\n * PAGE_DOWN\n */\n PAGE_DOWN: 34,\n // also NUM_SOUTH_EAST\n /**\n * END\n */\n END: 35,\n // also NUM_SOUTH_WEST\n /**\n * HOME\n */\n HOME: 36,\n // also NUM_NORTH_WEST\n /**\n * LEFT\n */\n LEFT: 37,\n // also NUM_WEST\n /**\n * UP\n */\n UP: 38,\n // also NUM_NORTH\n /**\n * RIGHT\n */\n RIGHT: 39,\n // also NUM_EAST\n /**\n * DOWN\n */\n DOWN: 40,\n // also NUM_SOUTH\n /**\n * PRINT_SCREEN\n */\n PRINT_SCREEN: 44,\n /**\n * INSERT\n */\n INSERT: 45,\n // also NUM_INSERT\n /**\n * DELETE\n */\n DELETE: 46,\n // also NUM_DELETE\n /**\n * ZERO\n */\n ZERO: 48,\n /**\n * ONE\n */\n ONE: 49,\n /**\n * TWO\n */\n TWO: 50,\n /**\n * THREE\n */\n THREE: 51,\n /**\n * FOUR\n */\n FOUR: 52,\n /**\n * FIVE\n */\n FIVE: 53,\n /**\n * SIX\n */\n SIX: 54,\n /**\n * SEVEN\n */\n SEVEN: 55,\n /**\n * EIGHT\n */\n EIGHT: 56,\n /**\n * NINE\n */\n NINE: 57,\n /**\n * QUESTION_MARK\n */\n QUESTION_MARK: 63,\n // needs localization\n /**\n * A\n */\n A: 65,\n /**\n * B\n */\n B: 66,\n /**\n * C\n */\n C: 67,\n /**\n * D\n */\n D: 68,\n /**\n * E\n */\n E: 69,\n /**\n * F\n */\n F: 70,\n /**\n * G\n */\n G: 71,\n /**\n * H\n */\n H: 72,\n /**\n * I\n */\n I: 73,\n /**\n * J\n */\n J: 74,\n /**\n * K\n */\n K: 75,\n /**\n * L\n */\n L: 76,\n /**\n * M\n */\n M: 77,\n /**\n * N\n */\n N: 78,\n /**\n * O\n */\n O: 79,\n /**\n * P\n */\n P: 80,\n /**\n * Q\n */\n Q: 81,\n /**\n * R\n */\n R: 82,\n /**\n * S\n */\n S: 83,\n /**\n * T\n */\n T: 84,\n /**\n * U\n */\n U: 85,\n /**\n * V\n */\n V: 86,\n /**\n * W\n */\n W: 87,\n /**\n * X\n */\n X: 88,\n /**\n * Y\n */\n Y: 89,\n /**\n * Z\n */\n Z: 90,\n /**\n * META\n */\n META: 91,\n // WIN_KEY_LEFT\n /**\n * WIN_KEY_RIGHT\n */\n WIN_KEY_RIGHT: 92,\n /**\n * CONTEXT_MENU\n */\n CONTEXT_MENU: 93,\n /**\n * NUM_ZERO\n */\n NUM_ZERO: 96,\n /**\n * NUM_ONE\n */\n NUM_ONE: 97,\n /**\n * NUM_TWO\n */\n NUM_TWO: 98,\n /**\n * NUM_THREE\n */\n NUM_THREE: 99,\n /**\n * NUM_FOUR\n */\n NUM_FOUR: 100,\n /**\n * NUM_FIVE\n */\n NUM_FIVE: 101,\n /**\n * NUM_SIX\n */\n NUM_SIX: 102,\n /**\n * NUM_SEVEN\n */\n NUM_SEVEN: 103,\n /**\n * NUM_EIGHT\n */\n NUM_EIGHT: 104,\n /**\n * NUM_NINE\n */\n NUM_NINE: 105,\n /**\n * NUM_MULTIPLY\n */\n NUM_MULTIPLY: 106,\n /**\n * NUM_PLUS\n */\n NUM_PLUS: 107,\n /**\n * NUM_MINUS\n */\n NUM_MINUS: 109,\n /**\n * NUM_PERIOD\n */\n NUM_PERIOD: 110,\n /**\n * NUM_DIVISION\n */\n NUM_DIVISION: 111,\n /**\n * F1\n */\n F1: 112,\n /**\n * F2\n */\n F2: 113,\n /**\n * F3\n */\n F3: 114,\n /**\n * F4\n */\n F4: 115,\n /**\n * F5\n */\n F5: 116,\n /**\n * F6\n */\n F6: 117,\n /**\n * F7\n */\n F7: 118,\n /**\n * F8\n */\n F8: 119,\n /**\n * F9\n */\n F9: 120,\n /**\n * F10\n */\n F10: 121,\n /**\n * F11\n */\n F11: 122,\n /**\n * F12\n */\n F12: 123,\n /**\n * NUMLOCK\n */\n NUMLOCK: 144,\n /**\n * SEMICOLON\n */\n SEMICOLON: 186,\n // needs localization\n /**\n * DASH\n */\n DASH: 189,\n // needs localization\n /**\n * EQUALS\n */\n EQUALS: 187,\n // needs localization\n /**\n * COMMA\n */\n COMMA: 188,\n // needs localization\n /**\n * PERIOD\n */\n PERIOD: 190,\n // needs localization\n /**\n * SLASH\n */\n SLASH: 191,\n // needs localization\n /**\n * APOSTROPHE\n */\n APOSTROPHE: 192,\n // needs localization\n /**\n * SINGLE_QUOTE\n */\n SINGLE_QUOTE: 222,\n // needs localization\n /**\n * OPEN_SQUARE_BRACKET\n */\n OPEN_SQUARE_BRACKET: 219,\n // needs localization\n /**\n * BACKSLASH\n */\n BACKSLASH: 220,\n // needs localization\n /**\n * CLOSE_SQUARE_BRACKET\n */\n CLOSE_SQUARE_BRACKET: 221,\n // needs localization\n /**\n * WIN_KEY\n */\n WIN_KEY: 224,\n /**\n * MAC_FF_META\n */\n MAC_FF_META: 224,\n // Firefox (Gecko) fires this for the meta key instead of 91\n /**\n * WIN_IME\n */\n WIN_IME: 229,\n // ======================== Function ========================\n /**\n * whether text and modified key is entered at the same time.\n */\n isTextModifyingKeyEvent: function isTextModifyingKeyEvent(e) {\n var keyCode = e.keyCode;\n if (e.altKey && !e.ctrlKey || e.metaKey ||\n // Function keys don't generate text\n keyCode >= KeyCode.F1 && keyCode <= KeyCode.F12) {\n return false;\n }\n\n // The following keys are quite harmless, even in combination with\n // CTRL, ALT or SHIFT.\n switch (keyCode) {\n case KeyCode.ALT:\n case KeyCode.CAPS_LOCK:\n case KeyCode.CONTEXT_MENU:\n case KeyCode.CTRL:\n case KeyCode.DOWN:\n case KeyCode.END:\n case KeyCode.ESC:\n case KeyCode.HOME:\n case KeyCode.INSERT:\n case KeyCode.LEFT:\n case KeyCode.MAC_FF_META:\n case KeyCode.META:\n case KeyCode.NUMLOCK:\n case KeyCode.NUM_CENTER:\n case KeyCode.PAGE_DOWN:\n case KeyCode.PAGE_UP:\n case KeyCode.PAUSE:\n case KeyCode.PRINT_SCREEN:\n case KeyCode.RIGHT:\n case KeyCode.SHIFT:\n case KeyCode.UP:\n case KeyCode.WIN_KEY:\n case KeyCode.WIN_KEY_RIGHT:\n return false;\n default:\n return true;\n }\n },\n /**\n * whether character is entered.\n */\n isCharacterKey: function isCharacterKey(keyCode) {\n if (keyCode >= KeyCode.ZERO && keyCode <= KeyCode.NINE) {\n return true;\n }\n if (keyCode >= KeyCode.NUM_ZERO && keyCode <= KeyCode.NUM_MULTIPLY) {\n return true;\n }\n if (keyCode >= KeyCode.A && keyCode <= KeyCode.Z) {\n return true;\n }\n\n // Safari sends zero key code for non-latin characters.\n if (window.navigator.userAgent.indexOf('WebKit') !== -1 && keyCode === 0) {\n return true;\n }\n switch (keyCode) {\n case KeyCode.SPACE:\n case KeyCode.QUESTION_MARK:\n case KeyCode.NUM_PLUS:\n case KeyCode.NUM_MINUS:\n case KeyCode.NUM_PERIOD:\n case KeyCode.NUM_DIVISION:\n case KeyCode.SEMICOLON:\n case KeyCode.DASH:\n case KeyCode.EQUALS:\n case KeyCode.COMMA:\n case KeyCode.PERIOD:\n case KeyCode.SLASH:\n case KeyCode.APOSTROPHE:\n case KeyCode.SINGLE_QUOTE:\n case KeyCode.OPEN_SQUARE_BRACKET:\n case KeyCode.BACKSLASH:\n case KeyCode.CLOSE_SQUARE_BRACKET:\n return true;\n default:\n return false;\n }\n }\n};\nexport default KeyCode;","import * as React from 'react';\nvar SliderContext = /*#__PURE__*/React.createContext({\n min: 0,\n max: 0,\n direction: 'ltr',\n step: 1,\n includedStart: 0,\n includedEnd: 0,\n tabIndex: 0,\n keyboard: true,\n styles: {},\n classNames: {}\n});\nexport default SliderContext;","import _extends from \"@babel/runtime/helpers/esm/extends\";\nimport _objectSpread from \"@babel/runtime/helpers/esm/objectSpread2\";\nimport _defineProperty from \"@babel/runtime/helpers/esm/defineProperty\";\nimport _objectWithoutProperties from \"@babel/runtime/helpers/esm/objectWithoutProperties\";\nvar _excluded = [\"prefixCls\", \"value\", \"valueIndex\", \"onStartMove\", \"style\", \"render\", \"dragging\", \"onOffsetChange\", \"onChangeComplete\", \"onFocus\", \"onMouseEnter\"];\nimport cls from 'classnames';\nimport KeyCode from \"rc-util/es/KeyCode\";\nimport * as React from 'react';\nimport SliderContext from \"../context\";\nimport { getDirectionStyle, getIndex } from \"../util\";\nvar Handle = /*#__PURE__*/React.forwardRef(function (props, ref) {\n var prefixCls = props.prefixCls,\n value = props.value,\n valueIndex = props.valueIndex,\n onStartMove = props.onStartMove,\n style = props.style,\n render = props.render,\n dragging = props.dragging,\n onOffsetChange = props.onOffsetChange,\n onChangeComplete = props.onChangeComplete,\n onFocus = props.onFocus,\n onMouseEnter = props.onMouseEnter,\n restProps = _objectWithoutProperties(props, _excluded);\n var _React$useContext = React.useContext(SliderContext),\n min = _React$useContext.min,\n max = _React$useContext.max,\n direction = _React$useContext.direction,\n disabled = _React$useContext.disabled,\n keyboard = _React$useContext.keyboard,\n range = _React$useContext.range,\n tabIndex = _React$useContext.tabIndex,\n ariaLabelForHandle = _React$useContext.ariaLabelForHandle,\n ariaLabelledByForHandle = _React$useContext.ariaLabelledByForHandle,\n ariaValueTextFormatterForHandle = _React$useContext.ariaValueTextFormatterForHandle,\n styles = _React$useContext.styles,\n classNames = _React$useContext.classNames;\n var handlePrefixCls = \"\".concat(prefixCls, \"-handle\");\n\n // ============================ Events ============================\n var onInternalStartMove = function onInternalStartMove(e) {\n if (!disabled) {\n onStartMove(e, valueIndex);\n }\n };\n var onInternalFocus = function onInternalFocus(e) {\n onFocus === null || onFocus === void 0 || onFocus(e, valueIndex);\n };\n var onInternalMouseEnter = function onInternalMouseEnter(e) {\n onMouseEnter(e, valueIndex);\n };\n\n // =========================== Keyboard ===========================\n var onKeyDown = function onKeyDown(e) {\n if (!disabled && keyboard) {\n var offset = null;\n\n // Change the value\n switch (e.which || e.keyCode) {\n case KeyCode.LEFT:\n offset = direction === 'ltr' || direction === 'btt' ? -1 : 1;\n break;\n case KeyCode.RIGHT:\n offset = direction === 'ltr' || direction === 'btt' ? 1 : -1;\n break;\n\n // Up is plus\n case KeyCode.UP:\n offset = direction !== 'ttb' ? 1 : -1;\n break;\n\n // Down is minus\n case KeyCode.DOWN:\n offset = direction !== 'ttb' ? -1 : 1;\n break;\n case KeyCode.HOME:\n offset = 'min';\n break;\n case KeyCode.END:\n offset = 'max';\n break;\n case KeyCode.PAGE_UP:\n offset = 2;\n break;\n case KeyCode.PAGE_DOWN:\n offset = -2;\n break;\n }\n if (offset !== null) {\n e.preventDefault();\n onOffsetChange(offset, valueIndex);\n }\n }\n };\n var handleKeyUp = function handleKeyUp(e) {\n switch (e.which || e.keyCode) {\n case KeyCode.LEFT:\n case KeyCode.RIGHT:\n case KeyCode.UP:\n case KeyCode.DOWN:\n case KeyCode.HOME:\n case KeyCode.END:\n case KeyCode.PAGE_UP:\n case KeyCode.PAGE_DOWN:\n onChangeComplete === null || onChangeComplete === void 0 || onChangeComplete();\n break;\n }\n };\n\n // ============================ Offset ============================\n var positionStyle = getDirectionStyle(direction, value, min, max);\n\n // ============================ Render ============================\n var divProps = {};\n if (valueIndex !== null) {\n var _getIndex;\n divProps = {\n tabIndex: disabled ? null : getIndex(tabIndex, valueIndex),\n role: 'slider',\n 'aria-valuemin': min,\n 'aria-valuemax': max,\n 'aria-valuenow': value,\n 'aria-disabled': disabled,\n 'aria-label': getIndex(ariaLabelForHandle, valueIndex),\n 'aria-labelledby': getIndex(ariaLabelledByForHandle, valueIndex),\n 'aria-valuetext': (_getIndex = getIndex(ariaValueTextFormatterForHandle, valueIndex)) === null || _getIndex === void 0 ? void 0 : _getIndex(value),\n 'aria-orientation': direction === 'ltr' || direction === 'rtl' ? 'horizontal' : 'vertical',\n onMouseDown: onInternalStartMove,\n onTouchStart: onInternalStartMove,\n onFocus: onInternalFocus,\n onMouseEnter: onInternalMouseEnter,\n onKeyDown: onKeyDown,\n onKeyUp: handleKeyUp\n };\n }\n var handleNode = /*#__PURE__*/React.createElement(\"div\", _extends({\n ref: ref,\n className: cls(handlePrefixCls, _defineProperty(_defineProperty({}, \"\".concat(handlePrefixCls, \"-\").concat(valueIndex + 1), valueIndex !== null && range), \"\".concat(handlePrefixCls, \"-dragging\"), dragging), classNames.handle),\n style: _objectSpread(_objectSpread(_objectSpread({}, positionStyle), style), styles.handle)\n }, divProps, restProps));\n\n // Customize\n if (render) {\n handleNode = render(handleNode, {\n index: valueIndex,\n prefixCls: prefixCls,\n value: value,\n dragging: dragging\n });\n }\n return handleNode;\n});\nif (process.env.NODE_ENV !== 'production') {\n Handle.displayName = 'Handle';\n}\nexport default Handle;","import _extends from \"@babel/runtime/helpers/esm/extends\";\nimport _objectSpread from \"@babel/runtime/helpers/esm/objectSpread2\";\nimport _slicedToArray from \"@babel/runtime/helpers/esm/slicedToArray\";\nimport _objectWithoutProperties from \"@babel/runtime/helpers/esm/objectWithoutProperties\";\nvar _excluded = [\"prefixCls\", \"style\", \"onStartMove\", \"onOffsetChange\", \"values\", \"handleRender\", \"activeHandleRender\", \"draggingIndex\", \"onFocus\"];\nimport * as React from 'react';\nimport { getIndex } from \"../util\";\nimport Handle from \"./Handle\";\nvar Handles = /*#__PURE__*/React.forwardRef(function (props, ref) {\n var prefixCls = props.prefixCls,\n style = props.style,\n onStartMove = props.onStartMove,\n onOffsetChange = props.onOffsetChange,\n values = props.values,\n handleRender = props.handleRender,\n activeHandleRender = props.activeHandleRender,\n draggingIndex = props.draggingIndex,\n onFocus = props.onFocus,\n restProps = _objectWithoutProperties(props, _excluded);\n var handlesRef = React.useRef({});\n React.useImperativeHandle(ref, function () {\n return {\n focus: function focus(index) {\n var _handlesRef$current$i;\n (_handlesRef$current$i = handlesRef.current[index]) === null || _handlesRef$current$i === void 0 || _handlesRef$current$i.focus();\n }\n };\n });\n\n // =========================== Active ===========================\n var _React$useState = React.useState(-1),\n _React$useState2 = _slicedToArray(_React$useState, 2),\n activeIndex = _React$useState2[0],\n setActiveIndex = _React$useState2[1];\n var onHandleFocus = function onHandleFocus(e, index) {\n setActiveIndex(index);\n onFocus === null || onFocus === void 0 || onFocus(e);\n };\n var onHandleMouseEnter = function onHandleMouseEnter(e, index) {\n setActiveIndex(index);\n };\n\n // =========================== Render ===========================\n // Handle Props\n var handleProps = _objectSpread({\n prefixCls: prefixCls,\n onStartMove: onStartMove,\n onOffsetChange: onOffsetChange,\n render: handleRender,\n onFocus: onHandleFocus,\n onMouseEnter: onHandleMouseEnter\n }, restProps);\n return /*#__PURE__*/React.createElement(React.Fragment, null, values.map(function (value, index) {\n return /*#__PURE__*/React.createElement(Handle, _extends({\n ref: function ref(node) {\n if (!node) {\n delete handlesRef.current[index];\n } else {\n handlesRef.current[index] = node;\n }\n },\n dragging: draggingIndex === index,\n style: getIndex(style, index),\n key: index,\n value: value,\n valueIndex: index\n }, handleProps));\n }), activeHandleRender && /*#__PURE__*/React.createElement(Handle, _extends({\n key: \"a11y\"\n }, handleProps, {\n value: values[activeIndex],\n valueIndex: null,\n dragging: draggingIndex !== -1,\n render: activeHandleRender,\n style: {\n pointerEvents: 'none'\n },\n tabIndex: null,\n \"aria-hidden\": true\n })));\n});\nif (process.env.NODE_ENV !== 'production') {\n Handles.displayName = 'Handles';\n}\nexport default Handles;","import _objectSpread from \"@babel/runtime/helpers/esm/objectSpread2\";\nimport _defineProperty from \"@babel/runtime/helpers/esm/defineProperty\";\nimport classNames from 'classnames';\nimport * as React from 'react';\nimport SliderContext from \"../context\";\nimport { getDirectionStyle } from \"../util\";\nvar Mark = function Mark(props) {\n var prefixCls = props.prefixCls,\n style = props.style,\n children = props.children,\n value = props.value,\n _onClick = props.onClick;\n var _React$useContext = React.useContext(SliderContext),\n min = _React$useContext.min,\n max = _React$useContext.max,\n direction = _React$useContext.direction,\n includedStart = _React$useContext.includedStart,\n includedEnd = _React$useContext.includedEnd,\n included = _React$useContext.included;\n var textCls = \"\".concat(prefixCls, \"-text\");\n\n // ============================ Offset ============================\n var positionStyle = getDirectionStyle(direction, value, min, max);\n return /*#__PURE__*/React.createElement(\"span\", {\n className: classNames(textCls, _defineProperty({}, \"\".concat(textCls, \"-active\"), included && includedStart <= value && value <= includedEnd)),\n style: _objectSpread(_objectSpread({}, positionStyle), style),\n onMouseDown: function onMouseDown(e) {\n e.stopPropagation();\n },\n onClick: function onClick() {\n _onClick(value);\n }\n }, children);\n};\nexport default Mark;","import * as React from 'react';\nimport Mark from \"./Mark\";\nvar Marks = function Marks(props) {\n var prefixCls = props.prefixCls,\n marks = props.marks,\n onClick = props.onClick;\n var markPrefixCls = \"\".concat(prefixCls, \"-mark\");\n\n // Not render mark if empty\n if (!marks.length) {\n return null;\n }\n return /*#__PURE__*/React.createElement(\"div\", {\n className: markPrefixCls\n }, marks.map(function (_ref) {\n var value = _ref.value,\n style = _ref.style,\n label = _ref.label;\n return /*#__PURE__*/React.createElement(Mark, {\n key: value,\n prefixCls: markPrefixCls,\n style: style,\n value: value,\n onClick: onClick\n }, label);\n }));\n};\nexport default Marks;","import _defineProperty from \"@babel/runtime/helpers/esm/defineProperty\";\nimport _objectSpread from \"@babel/runtime/helpers/esm/objectSpread2\";\nimport classNames from 'classnames';\nimport * as React from 'react';\nimport SliderContext from \"../context\";\nimport { getDirectionStyle } from \"../util\";\nvar Dot = function Dot(props) {\n var prefixCls = props.prefixCls,\n value = props.value,\n style = props.style,\n activeStyle = props.activeStyle;\n var _React$useContext = React.useContext(SliderContext),\n min = _React$useContext.min,\n max = _React$useContext.max,\n direction = _React$useContext.direction,\n included = _React$useContext.included,\n includedStart = _React$useContext.includedStart,\n includedEnd = _React$useContext.includedEnd;\n var dotClassName = \"\".concat(prefixCls, \"-dot\");\n var active = included && includedStart <= value && value <= includedEnd;\n\n // ============================ Offset ============================\n var mergedStyle = _objectSpread(_objectSpread({}, getDirectionStyle(direction, value, min, max)), typeof style === 'function' ? style(value) : style);\n if (active) {\n mergedStyle = _objectSpread(_objectSpread({}, mergedStyle), typeof activeStyle === 'function' ? activeStyle(value) : activeStyle);\n }\n return /*#__PURE__*/React.createElement(\"span\", {\n className: classNames(dotClassName, _defineProperty({}, \"\".concat(dotClassName, \"-active\"), active)),\n style: mergedStyle\n });\n};\nexport default Dot;","import * as React from 'react';\nimport SliderContext from \"../context\";\nimport Dot from \"./Dot\";\nvar Steps = function Steps(props) {\n var prefixCls = props.prefixCls,\n marks = props.marks,\n dots = props.dots,\n style = props.style,\n activeStyle = props.activeStyle;\n var _React$useContext = React.useContext(SliderContext),\n min = _React$useContext.min,\n max = _React$useContext.max,\n step = _React$useContext.step;\n var stepDots = React.useMemo(function () {\n var dotSet = new Set();\n\n // Add marks\n marks.forEach(function (mark) {\n dotSet.add(mark.value);\n });\n\n // Fill dots\n if (dots && step !== null) {\n var current = min;\n while (current <= max) {\n dotSet.add(current);\n current += step;\n }\n }\n return Array.from(dotSet);\n }, [min, max, step, dots, marks]);\n return /*#__PURE__*/React.createElement(\"div\", {\n className: \"\".concat(prefixCls, \"-step\")\n }, stepDots.map(function (dotValue) {\n return /*#__PURE__*/React.createElement(Dot, {\n prefixCls: prefixCls,\n key: dotValue,\n value: dotValue,\n style: style,\n activeStyle: activeStyle\n });\n }));\n};\nexport default Steps;","import _objectSpread from \"@babel/runtime/helpers/esm/objectSpread2\";\nimport _defineProperty from \"@babel/runtime/helpers/esm/defineProperty\";\nimport cls from 'classnames';\nimport * as React from 'react';\nimport SliderContext from \"../context\";\nimport { getOffset } from \"../util\";\nvar Track = function Track(props) {\n var prefixCls = props.prefixCls,\n style = props.style,\n start = props.start,\n end = props.end,\n index = props.index,\n onStartMove = props.onStartMove,\n replaceCls = props.replaceCls;\n var _React$useContext = React.useContext(SliderContext),\n direction = _React$useContext.direction,\n min = _React$useContext.min,\n max = _React$useContext.max,\n disabled = _React$useContext.disabled,\n range = _React$useContext.range,\n classNames = _React$useContext.classNames;\n var trackPrefixCls = \"\".concat(prefixCls, \"-track\");\n var offsetStart = getOffset(start, min, max);\n var offsetEnd = getOffset(end, min, max);\n\n // ============================ Events ============================\n var onInternalStartMove = function onInternalStartMove(e) {\n if (!disabled && onStartMove) {\n onStartMove(e, -1);\n }\n };\n\n // ============================ Render ============================\n var positionStyle = {};\n switch (direction) {\n case 'rtl':\n positionStyle.right = \"\".concat(offsetStart * 100, \"%\");\n positionStyle.width = \"\".concat(offsetEnd * 100 - offsetStart * 100, \"%\");\n break;\n case 'btt':\n positionStyle.bottom = \"\".concat(offsetStart * 100, \"%\");\n positionStyle.height = \"\".concat(offsetEnd * 100 - offsetStart * 100, \"%\");\n break;\n case 'ttb':\n positionStyle.top = \"\".concat(offsetStart * 100, \"%\");\n positionStyle.height = \"\".concat(offsetEnd * 100 - offsetStart * 100, \"%\");\n break;\n default:\n positionStyle.left = \"\".concat(offsetStart * 100, \"%\");\n positionStyle.width = \"\".concat(offsetEnd * 100 - offsetStart * 100, \"%\");\n }\n var className = replaceCls || cls(trackPrefixCls, _defineProperty(_defineProperty({}, \"\".concat(trackPrefixCls, \"-\").concat(index + 1), index !== null && range), \"\".concat(prefixCls, \"-track-draggable\"), onStartMove), classNames.track);\n return /*#__PURE__*/React.createElement(\"div\", {\n className: className,\n style: _objectSpread(_objectSpread({}, positionStyle), style),\n onMouseDown: onInternalStartMove,\n onTouchStart: onInternalStartMove\n });\n};\nexport default Track;","import _objectSpread from \"@babel/runtime/helpers/esm/objectSpread2\";\nimport cls from 'classnames';\nimport * as React from 'react';\nimport SliderContext from \"../context\";\nimport { getIndex } from \"../util\";\nimport Track from \"./Track\";\nvar Tracks = function Tracks(props) {\n var prefixCls = props.prefixCls,\n style = props.style,\n values = props.values,\n startPoint = props.startPoint,\n onStartMove = props.onStartMove;\n var _React$useContext = React.useContext(SliderContext),\n included = _React$useContext.included,\n range = _React$useContext.range,\n min = _React$useContext.min,\n styles = _React$useContext.styles,\n classNames = _React$useContext.classNames;\n\n // =========================== List ===========================\n var trackList = React.useMemo(function () {\n if (!range) {\n // null value do not have track\n if (values.length === 0) {\n return [];\n }\n var startValue = startPoint !== null && startPoint !== void 0 ? startPoint : min;\n var endValue = values[0];\n return [{\n start: Math.min(startValue, endValue),\n end: Math.max(startValue, endValue)\n }];\n }\n\n // Multiple\n var list = [];\n for (var i = 0; i < values.length - 1; i += 1) {\n list.push({\n start: values[i],\n end: values[i + 1]\n });\n }\n return list;\n }, [values, range, startPoint, min]);\n if (!included) {\n return null;\n }\n\n // ========================== Render ==========================\n var tracksNode = classNames.tracks || styles.tracks ? /*#__PURE__*/React.createElement(Track, {\n index: null,\n prefixCls: prefixCls,\n start: trackList[0].start,\n end: trackList[trackList.length - 1].end,\n replaceCls: cls(classNames.tracks, \"\".concat(prefixCls, \"-tracks\")),\n style: styles.tracks\n }) : null;\n return /*#__PURE__*/React.createElement(React.Fragment, null, tracksNode, trackList.map(function (_ref, index) {\n var start = _ref.start,\n end = _ref.end;\n return /*#__PURE__*/React.createElement(Track, {\n index: index,\n prefixCls: prefixCls,\n style: _objectSpread(_objectSpread({}, getIndex(style, index)), styles.track),\n start: start,\n end: end,\n key: index,\n onStartMove: onStartMove\n });\n }));\n};\nexport default Tracks;","import _typeof from \"@babel/runtime/helpers/esm/typeof\";\nimport { isValidElement, version } from 'react';\nimport { ForwardRef, isFragment, isMemo } from 'react-is';\nimport useMemo from \"./hooks/useMemo\";\nexport var fillRef = function fillRef(ref, node) {\n if (typeof ref === 'function') {\n ref(node);\n } else if (_typeof(ref) === 'object' && ref && 'current' in ref) {\n ref.current = node;\n }\n};\n\n/**\n * Merge refs into one ref function to support ref passing.\n */\nexport var composeRef = function composeRef() {\n for (var _len = arguments.length, refs = new Array(_len), _key = 0; _key < _len; _key++) {\n refs[_key] = arguments[_key];\n }\n var refList = refs.filter(Boolean);\n if (refList.length <= 1) {\n return refList[0];\n }\n return function (node) {\n refs.forEach(function (ref) {\n fillRef(ref, node);\n });\n };\n};\nexport var useComposeRef = function useComposeRef() {\n for (var _len2 = arguments.length, refs = new Array(_len2), _key2 = 0; _key2 < _len2; _key2++) {\n refs[_key2] = arguments[_key2];\n }\n return useMemo(function () {\n return composeRef.apply(void 0, refs);\n }, refs, function (prev, next) {\n return prev.length !== next.length || prev.every(function (ref, i) {\n return ref !== next[i];\n });\n });\n};\nexport var supportRef = function supportRef(nodeOrComponent) {\n var _type$prototype, _nodeOrComponent$prot;\n var type = isMemo(nodeOrComponent) ? nodeOrComponent.type.type : nodeOrComponent.type;\n\n // Function component node\n if (typeof type === 'function' && !((_type$prototype = type.prototype) !== null && _type$prototype !== void 0 && _type$prototype.render) && type.$$typeof !== ForwardRef) {\n return false;\n }\n\n // Class component\n if (typeof nodeOrComponent === 'function' && !((_nodeOrComponent$prot = nodeOrComponent.prototype) !== null && _nodeOrComponent$prot !== void 0 && _nodeOrComponent$prot.render) && nodeOrComponent.$$typeof !== ForwardRef) {\n return false;\n }\n return true;\n};\nfunction isReactElement(node) {\n return /*#__PURE__*/isValidElement(node) && !isFragment(node);\n}\nexport var supportNodeRef = function supportNodeRef(node) {\n return isReactElement(node) && supportRef(node);\n};\n\n/**\n * In React 19. `ref` is not a property from node.\n * But a property from `props.ref`.\n * To check if `props.ref` exist or fallback to `ref`.\n */\nexport var getNodeRef = Number(version.split('.')[0]) >= 19 ?\n// >= React 19\nfunction (node) {\n if (isReactElement(node)) {\n return node.props.ref;\n }\n return null;\n} :\n// < React 19\nfunction (node) {\n if (isReactElement(node)) {\n return node.ref;\n }\n return null;\n};","import _typeof from \"@babel/runtime/helpers/esm/typeof\";\nimport _objectSpread from \"@babel/runtime/helpers/esm/objectSpread2\";\nimport _toConsumableArray from \"@babel/runtime/helpers/esm/toConsumableArray\";\nimport _toArray from \"@babel/runtime/helpers/esm/toArray\";\nimport get from \"./get\";\nfunction internalSet(entity, paths, value, removeIfUndefined) {\n if (!paths.length) {\n return value;\n }\n var _paths = _toArray(paths),\n path = _paths[0],\n restPath = _paths.slice(1);\n var clone;\n if (!entity && typeof path === 'number') {\n clone = [];\n } else if (Array.isArray(entity)) {\n clone = _toConsumableArray(entity);\n } else {\n clone = _objectSpread({}, entity);\n }\n\n // Delete prop if `removeIfUndefined` and value is undefined\n if (removeIfUndefined && value === undefined && restPath.length === 1) {\n delete clone[path][restPath[0]];\n } else {\n clone[path] = internalSet(clone[path], restPath, value, removeIfUndefined);\n }\n return clone;\n}\nexport default function set(entity, paths, value) {\n var removeIfUndefined = arguments.length > 3 && arguments[3] !== undefined ? arguments[3] : false;\n // Do nothing if `removeIfUndefined` and parent object not exist\n if (paths.length && removeIfUndefined && value === undefined && !get(entity, paths.slice(0, -1))) {\n return entity;\n }\n return internalSet(entity, paths, value, removeIfUndefined);\n}\nfunction isObject(obj) {\n return _typeof(obj) === 'object' && obj !== null && Object.getPrototypeOf(obj) === Object.prototype;\n}\nfunction createEmpty(source) {\n return Array.isArray(source) ? [] : {};\n}\nvar keys = typeof Reflect === 'undefined' ? Object.keys : Reflect.ownKeys;\n\n/**\n * Merge objects which will create\n */\nexport function merge() {\n for (var _len = arguments.length, sources = new Array(_len), _key = 0; _key < _len; _key++) {\n sources[_key] = arguments[_key];\n }\n var clone = createEmpty(sources[0]);\n sources.forEach(function (src) {\n function internalMerge(path, parentLoopSet) {\n var loopSet = new Set(parentLoopSet);\n var value = get(src, path);\n var isArr = Array.isArray(value);\n if (isArr || isObject(value)) {\n // Only add not loop obj\n if (!loopSet.has(value)) {\n loopSet.add(value);\n var originValue = get(clone, path);\n if (isArr) {\n // Array will always be override\n clone = set(clone, path, []);\n } else if (!originValue || _typeof(originValue) !== 'object') {\n // Init container if not exist\n clone = set(clone, path, createEmpty(value));\n }\n keys(value).forEach(function (key) {\n internalMerge([].concat(_toConsumableArray(path), [key]), loopSet);\n });\n }\n } else {\n clone = set(clone, path, value);\n }\n }\n internalMerge([]);\n });\n return clone;\n}","import _toConsumableArray from \"@babel/runtime/helpers/esm/toConsumableArray\";\nimport _slicedToArray from \"@babel/runtime/helpers/esm/slicedToArray\";\nimport { useEvent } from 'rc-util';\nimport * as React from 'react';\nfunction getPosition(e) {\n var obj = 'touches' in e ? e.touches[0] : e;\n return {\n pageX: obj.pageX,\n pageY: obj.pageY\n };\n}\nfunction useDrag(containerRef, direction, rawValues, min, max, formatValue, triggerChange, finishChange, offsetValues) {\n var _React$useState = React.useState(null),\n _React$useState2 = _slicedToArray(_React$useState, 2),\n draggingValue = _React$useState2[0],\n setDraggingValue = _React$useState2[1];\n var _React$useState3 = React.useState(-1),\n _React$useState4 = _slicedToArray(_React$useState3, 2),\n draggingIndex = _React$useState4[0],\n setDraggingIndex = _React$useState4[1];\n var _React$useState5 = React.useState(rawValues),\n _React$useState6 = _slicedToArray(_React$useState5, 2),\n cacheValues = _React$useState6[0],\n setCacheValues = _React$useState6[1];\n var _React$useState7 = React.useState(rawValues),\n _React$useState8 = _slicedToArray(_React$useState7, 2),\n originValues = _React$useState8[0],\n setOriginValues = _React$useState8[1];\n var mouseMoveEventRef = React.useRef(null);\n var mouseUpEventRef = React.useRef(null);\n React.useLayoutEffect(function () {\n if (draggingIndex === -1) {\n setCacheValues(rawValues);\n }\n }, [rawValues, draggingIndex]);\n\n // Clean up event\n React.useEffect(function () {\n return function () {\n document.removeEventListener('mousemove', mouseMoveEventRef.current);\n document.removeEventListener('mouseup', mouseUpEventRef.current);\n document.removeEventListener('touchmove', mouseMoveEventRef.current);\n document.removeEventListener('touchend', mouseUpEventRef.current);\n };\n }, []);\n var flushValues = function flushValues(nextValues, nextValue) {\n // Perf: Only update state when value changed\n if (cacheValues.some(function (val, i) {\n return val !== nextValues[i];\n })) {\n if (nextValue !== undefined) {\n setDraggingValue(nextValue);\n }\n setCacheValues(nextValues);\n triggerChange(nextValues);\n }\n };\n var updateCacheValue = useEvent(function (valueIndex, offsetPercent) {\n // Basic point offset\n\n if (valueIndex === -1) {\n // >>>> Dragging on the track\n var startValue = originValues[0];\n var endValue = originValues[originValues.length - 1];\n var maxStartOffset = min - startValue;\n var maxEndOffset = max - endValue;\n\n // Get valid offset\n var offset = offsetPercent * (max - min);\n offset = Math.max(offset, maxStartOffset);\n offset = Math.min(offset, maxEndOffset);\n\n // Use first value to revert back of valid offset (like steps marks)\n var formatStartValue = formatValue(startValue + offset);\n offset = formatStartValue - startValue;\n var cloneCacheValues = originValues.map(function (val) {\n return val + offset;\n });\n flushValues(cloneCacheValues);\n } else {\n // >>>> Dragging on the handle\n var offsetDist = (max - min) * offsetPercent;\n\n // Always start with the valueIndex origin value\n var cloneValues = _toConsumableArray(cacheValues);\n cloneValues[valueIndex] = originValues[valueIndex];\n var next = offsetValues(cloneValues, offsetDist, valueIndex, 'dist');\n flushValues(next.values, next.value);\n }\n });\n var onStartMove = function onStartMove(e, valueIndex, startValues) {\n e.stopPropagation();\n\n // 如果是点击 track 触发的，需要传入变化后的初始值，而不能直接用 rawValues\n var initialValues = startValues || rawValues;\n var originValue = initialValues[valueIndex];\n setDraggingIndex(valueIndex);\n setDraggingValue(originValue);\n setOriginValues(initialValues);\n var _getPosition = getPosition(e),\n startX = _getPosition.pageX,\n startY = _getPosition.pageY;\n\n // Moving\n var onMouseMove = function onMouseMove(event) {\n event.preventDefault();\n var _getPosition2 = getPosition(event),\n moveX = _getPosition2.pageX,\n moveY = _getPosition2.pageY;\n var offsetX = moveX - startX;\n var offsetY = moveY - startY;\n var _containerRef$current = containerRef.current.getBoundingClientRect(),\n width = _containerRef$current.width,\n height = _containerRef$current.height;\n var offSetPercent;\n switch (direction) {\n case 'btt':\n offSetPercent = -offsetY / height;\n break;\n case 'ttb':\n offSetPercent = offsetY / height;\n break;\n case 'rtl':\n offSetPercent = -offsetX / width;\n break;\n default:\n offSetPercent = offsetX / width;\n }\n updateCacheValue(valueIndex, offSetPercent);\n };\n\n // End\n var onMouseUp = function onMouseUp(event) {\n event.preventDefault();\n document.removeEventListener('mouseup', onMouseUp);\n document.removeEventListener('mousemove', onMouseMove);\n document.removeEventListener('touchend', onMouseUp);\n document.removeEventListener('touchmove', onMouseMove);\n mouseMoveEventRef.current = null;\n mouseUpEventRef.current = null;\n setDraggingIndex(-1);\n finishChange();\n };\n document.addEventListener('mouseup', onMouseUp);\n document.addEventListener('mousemove', onMouseMove);\n document.addEventListener('touchend', onMouseUp);\n document.addEventListener('touchmove', onMouseMove);\n mouseMoveEventRef.current = onMouseMove;\n mouseUpEventRef.current = onMouseUp;\n };\n\n // Only return cache value when it mapping with rawValues\n var returnValues = React.useMemo(function () {\n var sourceValues = _toConsumableArray(rawValues).sort(function (a, b) {\n return a - b;\n });\n var targetValues = _toConsumableArray(cacheValues).sort(function (a, b) {\n return a - b;\n });\n return sourceValues.every(function (val, index) {\n return val === targetValues[index];\n }) ? cacheValues : rawValues;\n }, [rawValues, cacheValues]);\n return [draggingIndex, draggingValue, returnValues, onStartMove];\n}\nexport default useDrag;","import _objectSpread from \"@babel/runtime/helpers/esm/objectSpread2\";\nimport _defineProperty from \"@babel/runtime/helpers/esm/defineProperty\";\nimport _toConsumableArray from \"@babel/runtime/helpers/esm/toConsumableArray\";\nimport _slicedToArray from \"@babel/runtime/helpers/esm/slicedToArray\";\nimport _typeof from \"@babel/runtime/helpers/esm/typeof\";\nimport cls from 'classnames';\nimport useMergedState from \"rc-util/es/hooks/useMergedState\";\nimport isEqual from \"rc-util/es/isEqual\";\nimport warning from \"rc-util/es/warning\";\nimport * as React from 'react';\nimport Handles from \"./Handles\";\nimport Marks from \"./Marks\";\nimport Steps from \"./Steps\";\nimport Tracks from \"./Tracks\";\nimport SliderContext from \"./context\";\nimport useDrag from \"./hooks/useDrag\";\nimport useOffset from \"./hooks/useOffset\";\n\n/**\n * New:\n * - click mark to update range value\n * - handleRender\n * - Fix handle with count not correct\n * - Fix pushable not work in some case\n * - No more FindDOMNode\n * - Move all position related style into inline style\n * - Key: up is plus, down is minus\n * - fix Key with step = null not align with marks\n * - Change range should not trigger onChange\n * - keyboard support pushable\n */\n\nvar Slider = /*#__PURE__*/React.forwardRef(function (props, ref) {\n var _props$prefixCls = props.prefixCls,\n prefixCls = _props$prefixCls === void 0 ? 'rc-slider' : _props$prefixCls,\n className = props.className,\n style = props.style,\n classNames = props.classNames,\n styles = props.styles,\n _props$disabled = props.disabled,\n disabled = _props$disabled === void 0 ? false : _props$disabled,\n _props$keyboard = props.keyboard,\n keyboard = _props$keyboard === void 0 ? true : _props$keyboard,\n autoFocus = props.autoFocus,\n onFocus = props.onFocus,\n onBlur = props.onBlur,\n _props$min = props.min,\n min = _props$min === void 0 ? 0 : _props$min,\n _props$max = props.max,\n max = _props$max === void 0 ? 100 : _props$max,\n _props$step = props.step,\n step = _props$step === void 0 ? 1 : _props$step,\n value = props.value,\n defaultValue = props.defaultValue,\n range = props.range,\n count = props.count,\n onChange = props.onChange,\n onBeforeChange = props.onBeforeChange,\n onAfterChange = props.onAfterChange,\n onChangeComplete = props.onChangeComplete,\n _props$allowCross = props.allowCross,\n allowCross = _props$allowCross === void 0 ? true : _props$allowCross,\n _props$pushable = props.pushable,\n pushable = _props$pushable === void 0 ? false : _props$pushable,\n draggableTrack = props.draggableTrack,\n reverse = props.reverse,\n vertical = props.vertical,\n _props$included = props.included,\n included = _props$included === void 0 ? true : _props$included,\n startPoint = props.startPoint,\n trackStyle = props.trackStyle,\n handleStyle = props.handleStyle,\n railStyle = props.railStyle,\n dotStyle = props.dotStyle,\n activeDotStyle = props.activeDotStyle,\n marks = props.marks,\n dots = props.dots,\n handleRender = props.handleRender,\n activeHandleRender = props.activeHandleRender,\n _props$tabIndex = props.tabIndex,\n tabIndex = _props$tabIndex === void 0 ? 0 : _props$tabIndex,\n ariaLabelForHandle = props.ariaLabelForHandle,\n ariaLabelledByForHandle = props.ariaLabelledByForHandle,\n ariaValueTextFormatterForHandle = props.ariaValueTextFormatterForHandle;\n var handlesRef = React.useRef(null);\n var containerRef = React.useRef(null);\n var direction = React.useMemo(function () {\n if (vertical) {\n return reverse ? 'ttb' : 'btt';\n }\n return reverse ? 'rtl' : 'ltr';\n }, [reverse, vertical]);\n\n // ============================ Range =============================\n var mergedMin = React.useMemo(function () {\n return isFinite(min) ? min : 0;\n }, [min]);\n var mergedMax = React.useMemo(function () {\n return isFinite(max) ? max : 100;\n }, [max]);\n\n // ============================= Step =============================\n var mergedStep = React.useMemo(function () {\n return step !== null && step <= 0 ? 1 : step;\n }, [step]);\n\n // ============================= Push =============================\n var mergedPush = React.useMemo(function () {\n if (typeof pushable === 'boolean') {\n return pushable ? mergedStep : false;\n }\n return pushable >= 0 ? pushable : false;\n }, [pushable, mergedStep]);\n\n // ============================ Marks =============================\n var markList = React.useMemo(function () {\n return Object.keys(marks || {}).map(function (key) {\n var mark = marks[key];\n var markObj = {\n value: Number(key)\n };\n if (mark && _typeof(mark) === 'object' && ! /*#__PURE__*/React.isValidElement(mark) && ('label' in mark || 'style' in mark)) {\n markObj.style = mark.style;\n markObj.label = mark.label;\n } else {\n markObj.label = mark;\n }\n return markObj;\n }).filter(function (_ref) {\n var label = _ref.label;\n return label || typeof label === 'number';\n }).sort(function (a, b) {\n return a.value - b.value;\n });\n }, [marks]);\n\n // ============================ Format ============================\n var _useOffset = useOffset(mergedMin, mergedMax, mergedStep, markList, allowCross, mergedPush),\n _useOffset2 = _slicedToArray(_useOffset, 2),\n formatValue = _useOffset2[0],\n offsetValues = _useOffset2[1];\n\n // ============================ Values ============================\n var _useMergedState = useMergedState(defaultValue, {\n value: value\n }),\n _useMergedState2 = _slicedToArray(_useMergedState, 2),\n mergedValue = _useMergedState2[0],\n setValue = _useMergedState2[1];\n var rawValues = React.useMemo(function () {\n var valueList = mergedValue === null || mergedValue === undefined ? [] : Array.isArray(mergedValue) ? mergedValue : [mergedValue];\n var _valueList = _slicedToArray(valueList, 1),\n _valueList$ = _valueList[0],\n val0 = _valueList$ === void 0 ? mergedMin : _valueList$;\n var returnValues = mergedValue === null ? [] : [val0];\n\n // Format as range\n if (range) {\n returnValues = _toConsumableArray(valueList);\n\n // When count provided or value is `undefined`, we fill values\n if (count || mergedValue === undefined) {\n var pointCount = count >= 0 ? count + 1 : 2;\n returnValues = returnValues.slice(0, pointCount);\n\n // Fill with count\n while (returnValues.length < pointCount) {\n var _returnValues;\n returnValues.push((_returnValues = returnValues[returnValues.length - 1]) !== null && _returnValues !== void 0 ? _returnValues : mergedMin);\n }\n }\n returnValues.sort(function (a, b) {\n return a - b;\n });\n }\n\n // Align in range\n returnValues.forEach(function (val, index) {\n returnValues[index] = formatValue(val);\n });\n return returnValues;\n }, [mergedValue, range, mergedMin, count, formatValue]);\n\n // =========================== onChange ===========================\n var rawValuesRef = React.useRef(rawValues);\n rawValuesRef.current = rawValues;\n var getTriggerValue = function getTriggerValue(triggerValues) {\n return range ? triggerValues : triggerValues[0];\n };\n var triggerChange = function triggerChange(nextValues) {\n // Order first\n var cloneNextValues = _toConsumableArray(nextValues).sort(function (a, b) {\n return a - b;\n });\n\n // Trigger event if needed\n if (onChange && !isEqual(cloneNextValues, rawValuesRef.current, true)) {\n onChange(getTriggerValue(cloneNextValues));\n }\n\n // We set this later since it will re-render component immediately\n setValue(cloneNextValues);\n };\n var finishChange = function finishChange() {\n var finishValue = getTriggerValue(rawValuesRef.current);\n onAfterChange === null || onAfterChange === void 0 || onAfterChange(finishValue);\n warning(!onAfterChange, '[rc-slider] `onAfterChange` is deprecated. Please use `onChangeComplete` instead.');\n onChangeComplete === null || onChangeComplete === void 0 || onChangeComplete(finishValue);\n };\n var _useDrag = useDrag(containerRef, direction, rawValues, mergedMin, mergedMax, formatValue, triggerChange, finishChange, offsetValues),\n _useDrag2 = _slicedToArray(_useDrag, 4),\n draggingIndex = _useDrag2[0],\n draggingValue = _useDrag2[1],\n cacheValues = _useDrag2[2],\n onStartDrag = _useDrag2[3];\n var changeToCloseValue = function changeToCloseValue(newValue, e) {\n if (!disabled) {\n var valueIndex = 0;\n var valueDist = mergedMax - mergedMin;\n rawValues.forEach(function (val, index) {\n var dist = Math.abs(newValue - val);\n if (dist <= valueDist) {\n valueDist = dist;\n valueIndex = index;\n }\n });\n\n // Create new values\n var cloneNextValues = _toConsumableArray(rawValues);\n cloneNextValues[valueIndex] = newValue;\n\n // Fill value to match default 2\n if (range && !rawValues.length && count === undefined) {\n cloneNextValues.push(newValue);\n }\n onBeforeChange === null || onBeforeChange === void 0 || onBeforeChange(getTriggerValue(cloneNextValues));\n triggerChange(cloneNextValues);\n if (e) {\n var _document$activeEleme, _document$activeEleme2;\n (_document$activeEleme = document.activeElement) === null || _document$activeEleme === void 0 || (_document$activeEleme2 = _document$activeEleme.blur) === null || _document$activeEleme2 === void 0 || _document$activeEleme2.call(_document$activeEleme);\n handlesRef.current.focus(valueIndex);\n onStartDrag(e, valueIndex, cloneNextValues);\n }\n }\n };\n\n // ============================ Click =============================\n var onSliderMouseDown = function onSliderMouseDown(e) {\n e.preventDefault();\n var _containerRef$current = containerRef.current.getBoundingClientRect(),\n width = _containerRef$current.width,\n height = _containerRef$current.height,\n left = _containerRef$current.left,\n top = _containerRef$current.top,\n bottom = _containerRef$current.bottom,\n right = _containerRef$current.right;\n var clientX = e.clientX,\n clientY = e.clientY;\n var percent;\n switch (direction) {\n case 'btt':\n percent = (bottom - clientY) / height;\n break;\n case 'ttb':\n percent = (clientY - top) / height;\n break;\n case 'rtl':\n percent = (right - clientX) / width;\n break;\n default:\n percent = (clientX - left) / width;\n }\n var nextValue = mergedMin + percent * (mergedMax - mergedMin);\n changeToCloseValue(formatValue(nextValue), e);\n };\n\n // =========================== Keyboard ===========================\n var _React$useState = React.useState(null),\n _React$useState2 = _slicedToArray(_React$useState, 2),\n keyboardValue = _React$useState2[0],\n setKeyboardValue = _React$useState2[1];\n var onHandleOffsetChange = function onHandleOffsetChange(offset, valueIndex) {\n if (!disabled) {\n var next = offsetValues(rawValues, offset, valueIndex);\n onBeforeChange === null || onBeforeChange === void 0 || onBeforeChange(getTriggerValue(rawValues));\n triggerChange(next.values);\n setKeyboardValue(next.value);\n }\n };\n React.useEffect(function () {\n if (keyboardValue !== null) {\n var valueIndex = rawValues.indexOf(keyboardValue);\n if (valueIndex >= 0) {\n handlesRef.current.focus(valueIndex);\n }\n }\n setKeyboardValue(null);\n }, [keyboardValue]);\n\n // ============================= Drag =============================\n var mergedDraggableTrack = React.useMemo(function () {\n if (draggableTrack && mergedStep === null) {\n if (process.env.NODE_ENV !== 'production') {\n warning(false, '`draggableTrack` is not supported when `step` is `null`.');\n }\n return false;\n }\n return draggableTrack;\n }, [draggableTrack, mergedStep]);\n var onStartMove = function onStartMove(e, valueIndex) {\n onStartDrag(e, valueIndex);\n onBeforeChange === null || onBeforeChange === void 0 || onBeforeChange(getTriggerValue(rawValuesRef.current));\n };\n\n // Auto focus for updated handle\n var dragging = draggingIndex !== -1;\n React.useEffect(function () {\n if (!dragging) {\n var valueIndex = rawValues.lastIndexOf(draggingValue);\n handlesRef.current.focus(valueIndex);\n }\n }, [dragging]);\n\n // =========================== Included ===========================\n var sortedCacheValues = React.useMemo(function () {\n return _toConsumableArray(cacheValues).sort(function (a, b) {\n return a - b;\n });\n }, [cacheValues]);\n\n // Provide a range values with included [min, max]\n // Used for Track, Mark & Dot\n var _React$useMemo = React.useMemo(function () {\n if (!range) {\n return [mergedMin, sortedCacheValues[0]];\n }\n return [sortedCacheValues[0], sortedCacheValues[sortedCacheValues.length - 1]];\n }, [sortedCacheValues, range, mergedMin]),\n _React$useMemo2 = _slicedToArray(_React$useMemo, 2),\n includedStart = _React$useMemo2[0],\n includedEnd = _React$useMemo2[1];\n\n // ============================= Refs =============================\n React.useImperativeHandle(ref, function () {\n return {\n focus: function focus() {\n handlesRef.current.focus(0);\n },\n blur: function blur() {\n var _containerRef$current2;\n var _document = document,\n activeElement = _document.activeElement;\n if ((_containerRef$current2 = containerRef.current) !== null && _containerRef$current2 !== void 0 && _containerRef$current2.contains(activeElement)) {\n activeElement === null || activeElement === void 0 || activeElement.blur();\n }\n }\n };\n });\n\n // ========================== Auto Focus ==========================\n React.useEffect(function () {\n if (autoFocus) {\n handlesRef.current.focus(0);\n }\n }, []);\n\n // =========================== Context ============================\n var context = React.useMemo(function () {\n return {\n min: mergedMin,\n max: mergedMax,\n direction: direction,\n disabled: disabled,\n keyboard: keyboard,\n step: mergedStep,\n included: included,\n includedStart: includedStart,\n includedEnd: includedEnd,\n range: range,\n tabIndex: tabIndex,\n ariaLabelForHandle: ariaLabelForHandle,\n ariaLabelledByForHandle: ariaLabelledByForHandle,\n ariaValueTextFormatterForHandle: ariaValueTextFormatterForHandle,\n styles: styles || {},\n classNames: classNames || {}\n };\n }, [mergedMin, mergedMax, direction, disabled, keyboard, mergedStep, included, includedStart, includedEnd, range, tabIndex, ariaLabelForHandle, ariaLabelledByForHandle, ariaValueTextFormatterForHandle, styles, classNames]);\n\n // ============================ Render ============================\n return /*#__PURE__*/React.createElement(SliderContext.Provider, {\n value: context\n }, /*#__PURE__*/React.createElement(\"div\", {\n ref: containerRef,\n className: cls(prefixCls, className, _defineProperty(_defineProperty(_defineProperty(_defineProperty({}, \"\".concat(prefixCls, \"-disabled\"), disabled), \"\".concat(prefixCls, \"-vertical\"), vertical), \"\".concat(prefixCls, \"-horizontal\"), !vertical), \"\".concat(prefixCls, \"-with-marks\"), markList.length)),\n style: style,\n onMouseDown: onSliderMouseDown\n }, /*#__PURE__*/React.createElement(\"div\", {\n className: cls(\"\".concat(prefixCls, \"-rail\"), classNames === null || classNames === void 0 ? void 0 : classNames.rail),\n style: _objectSpread(_objectSpread({}, railStyle), styles === null || styles === void 0 ? void 0 : styles.rail)\n }), /*#__PURE__*/React.createElement(Tracks, {\n prefixCls: prefixCls,\n style: trackStyle,\n values: sortedCacheValues,\n startPoint: startPoint,\n onStartMove: mergedDraggableTrack ? onStartMove : undefined\n }), /*#__PURE__*/React.createElement(Steps, {\n prefixCls: prefixCls,\n marks: markList,\n dots: dots,\n style: dotStyle,\n activeStyle: activeDotStyle\n }), /*#__PURE__*/React.createElement(Handles, {\n ref: handlesRef,\n prefixCls: prefixCls,\n style: handleStyle,\n values: cacheValues,\n draggingIndex: draggingIndex,\n onStartMove: onStartMove,\n onOffsetChange: onHandleOffsetChange,\n onFocus: onFocus,\n onBlur: onBlur,\n handleRender: handleRender,\n activeHandleRender: activeHandleRender,\n onChangeComplete: finishChange\n }), /*#__PURE__*/React.createElement(Marks, {\n prefixCls: prefixCls,\n marks: markList,\n onClick: changeToCloseValue\n })));\n});\nif (process.env.NODE_ENV !== 'production') {\n Slider.displayName = 'Slider';\n}\nexport default Slider;","import Slider from \"./Slider\";\nexport default Slider;","import _toConsumableArray from \"@babel/runtime/helpers/esm/toConsumableArray\";\nimport * as React from 'react';\n\n/** Format the value in the range of [min, max] */\n\n/** Format value align with step */\n\n/** Format value align with step & marks */\n\nexport default function useOffset(min, max, step, markList, allowCross, pushable) {\n var formatRangeValue = React.useCallback(function (val) {\n return Math.max(min, Math.min(max, val));\n }, [min, max]);\n var formatStepValue = React.useCallback(function (val) {\n if (step !== null) {\n var stepValue = min + Math.round((formatRangeValue(val) - min) / step) * step;\n\n // Cut number in case to be like 0.30000000000000004\n var getDecimal = function getDecimal(num) {\n return (String(num).split('.')[1] || '').length;\n };\n var maxDecimal = Math.max(getDecimal(step), getDecimal(max), getDecimal(min));\n var fixedValue = Number(stepValue.toFixed(maxDecimal));\n return min <= fixedValue && fixedValue <= max ? fixedValue : null;\n }\n return null;\n }, [step, min, max, formatRangeValue]);\n var formatValue = React.useCallback(function (val) {\n var formatNextValue = formatRangeValue(val);\n\n // List align values\n var alignValues = markList.map(function (mark) {\n return mark.value;\n });\n if (step !== null) {\n alignValues.push(formatStepValue(val));\n }\n\n // min & max\n alignValues.push(min, max);\n\n // Align with marks\n var closeValue = alignValues[0];\n var closeDist = max - min;\n alignValues.forEach(function (alignValue) {\n var dist = Math.abs(formatNextValue - alignValue);\n if (dist <= closeDist) {\n closeValue = alignValue;\n closeDist = dist;\n }\n });\n return closeValue;\n }, [min, max, markList, step, formatRangeValue, formatStepValue]);\n\n // ========================== Offset ==========================\n // Single Value\n var offsetValue = function offsetValue(values, offset, valueIndex) {\n var mode = arguments.length > 3 && arguments[3] !== undefined ? arguments[3] : 'unit';\n if (typeof offset === 'number') {\n var nextValue;\n var originValue = values[valueIndex];\n\n // Only used for `dist` mode\n var targetDistValue = originValue + offset;\n\n // Compare next step value & mark value which is best match\n var potentialValues = [];\n markList.forEach(function (mark) {\n potentialValues.push(mark.value);\n });\n\n // Min & Max\n potentialValues.push(min, max);\n\n // In case origin value is align with mark but not with step\n potentialValues.push(formatStepValue(originValue));\n\n // Put offset step value also\n var sign = offset > 0 ? 1 : -1;\n if (mode === 'unit') {\n potentialValues.push(formatStepValue(originValue + sign * step));\n } else {\n potentialValues.push(formatStepValue(targetDistValue));\n }\n\n // Find close one\n potentialValues = potentialValues.filter(function (val) {\n return val !== null;\n })\n // Remove reverse value\n .filter(function (val) {\n return offset < 0 ? val <= originValue : val >= originValue;\n });\n if (mode === 'unit') {\n // `unit` mode can not contain itself\n potentialValues = potentialValues.filter(function (val) {\n return val !== originValue;\n });\n }\n var compareValue = mode === 'unit' ? originValue : targetDistValue;\n nextValue = potentialValues[0];\n var valueDist = Math.abs(nextValue - compareValue);\n potentialValues.forEach(function (potentialValue) {\n var dist = Math.abs(potentialValue - compareValue);\n if (dist < valueDist) {\n nextValue = potentialValue;\n valueDist = dist;\n }\n });\n\n // Out of range will back to range\n if (nextValue === undefined) {\n return offset < 0 ? min : max;\n }\n\n // `dist` mode\n if (mode === 'dist') {\n return nextValue;\n }\n\n // `unit` mode may need another round\n if (Math.abs(offset) > 1) {\n var cloneValues = _toConsumableArray(values);\n cloneValues[valueIndex] = nextValue;\n return offsetValue(cloneValues, offset - sign, valueIndex, mode);\n }\n return nextValue;\n } else if (offset === 'min') {\n return min;\n } else if (offset === 'max') {\n return max;\n }\n };\n\n /** Same as `offsetValue` but return `changed` mark to tell value changed */\n var offsetChangedValue = function offsetChangedValue(values, offset, valueIndex) {\n var mode = arguments.length > 3 && arguments[3] !== undefined ? arguments[3] : 'unit';\n var originValue = values[valueIndex];\n var nextValue = offsetValue(values, offset, valueIndex, mode);\n return {\n value: nextValue,\n changed: nextValue !== originValue\n };\n };\n var needPush = function needPush(dist) {\n return pushable === null && dist === 0 || typeof pushable === 'number' && dist < pushable;\n };\n\n // Values\n var offsetValues = function offsetValues(values, offset, valueIndex) {\n var mode = arguments.length > 3 && arguments[3] !== undefined ? arguments[3] : 'unit';\n var nextValues = values.map(formatValue);\n var originValue = nextValues[valueIndex];\n var nextValue = offsetValue(nextValues, offset, valueIndex, mode);\n nextValues[valueIndex] = nextValue;\n if (allowCross === false) {\n // >>>>> Allow Cross\n var pushNum = pushable || 0;\n\n // ============ AllowCross ===============\n if (valueIndex > 0 && nextValues[valueIndex - 1] !== originValue) {\n nextValues[valueIndex] = Math.max(nextValues[valueIndex], nextValues[valueIndex - 1] + pushNum);\n }\n if (valueIndex < nextValues.length - 1 && nextValues[valueIndex + 1] !== originValue) {\n nextValues[valueIndex] = Math.min(nextValues[valueIndex], nextValues[valueIndex + 1] - pushNum);\n }\n } else if (typeof pushable === 'number' || pushable === null) {\n // >>>>> Pushable\n // =============== Push ==================\n\n // >>>>>> Basic push\n // End values\n for (var i = valueIndex + 1; i < nextValues.length; i += 1) {\n var changed = true;\n while (needPush(nextValues[i] - nextValues[i - 1]) && changed) {\n var _offsetChangedValue = offsetChangedValue(nextValues, 1, i);\n nextValues[i] = _offsetChangedValue.value;\n changed = _offsetChangedValue.changed;\n }\n }\n\n // Start values\n for (var _i = valueIndex; _i > 0; _i -= 1) {\n var _changed = true;\n while (needPush(nextValues[_i] - nextValues[_i - 1]) && _changed) {\n var _offsetChangedValue2 = offsetChangedValue(nextValues, -1, _i - 1);\n nextValues[_i - 1] = _offsetChangedValue2.value;\n _changed = _offsetChangedValue2.changed;\n }\n }\n\n // >>>>> Revert back to safe push range\n // End to Start\n for (var _i2 = nextValues.length - 1; _i2 > 0; _i2 -= 1) {\n var _changed2 = true;\n while (needPush(nextValues[_i2] - nextValues[_i2 - 1]) && _changed2) {\n var _offsetChangedValue3 = offsetChangedValue(nextValues, -1, _i2 - 1);\n nextValues[_i2 - 1] = _offsetChangedValue3.value;\n _changed2 = _offsetChangedValue3.changed;\n }\n }\n\n // Start to End\n for (var _i3 = 0; _i3 < nextValues.length - 1; _i3 += 1) {\n var _changed3 = true;\n while (needPush(nextValues[_i3 + 1] - nextValues[_i3]) && _changed3) {\n var _offsetChangedValue4 = offsetChangedValue(nextValues, 1, _i3 + 1);\n nextValues[_i3 + 1] = _offsetChangedValue4.value;\n _changed3 = _offsetChangedValue4.changed;\n }\n }\n }\n return {\n value: nextValues[valueIndex],\n values: nextValues\n };\n };\n return [formatValue, offsetValues];\n}","import React, { Fragment, useState, useEffect } from \"react\";\r\n// import Cookies from \"js-cookie\";\r\nimport { Collapse } from \"react-collapse\";\r\nimport Slider from \"rc-slider\";\r\nimport \"rc-slider/assets/index.css\";\r\n\r\nfunction ShopSidebarOne(props) {\r\n const [value, setValue] = useState([]);\r\n const {\r\n currency,\r\n toggle,\r\n brandFilters,\r\n productAttributeFilters,\r\n variationAttributeFilters,\r\n secondCategoriesFilter,\r\n thirdCategoriesFilter,\r\n productAttributeValue,\r\n variationAttributeValue,\r\n secondCategory,\r\n thirdCategory,\r\n brandIds,\r\n filters,\r\n genderId,\r\n categoryGenderId,\r\n AddFilter,\r\n RemoveFilter,\r\n CleanFilter,\r\n minPrice,\r\n maxPrice,\r\n loading,\r\n range,\r\n setRange,\r\n setIsPrice,\r\n isSecondCategoryCollapsed,\r\n setIsSecondCategoryCollapsed,\r\n isThirdCategoryCollapsed,\r\n setIsThirdCategoryCollapsed,\r\n isBrandCollapsed,\r\n setIsBrandCollapsed,\r\n isPriceCollapsed,\r\n setIsPriceCollapsed,\r\n isProductAttrCollapsed,\r\n setIsProductAttrCollapsed,\r\n isVariationAttrCollapsed,\r\n setIsVariationAttrCollapsed,\r\n } = props;\r\n const staticCategories = [\r\n { CategoryId: 1, CategoryName: \"Category 1\", IsAvailable: true },\r\n { CategoryId: 2, CategoryName: \"Category 2\", IsAvailable: true },\r\n ];\r\n\r\n const onChangePriceRangeComplete = (priceValue) => {\r\n let newPrice = {\r\n min: parseFloat(priceValue[0]),\r\n max: parseFloat(priceValue[1]),\r\n };\r\n setRange(newPrice);\r\n setIsPrice(true);\r\n AddFilter(\r\n secondCategory,\r\n thirdCategory,\r\n brandIds,\r\n productAttributeValue,\r\n variationAttributeValue,\r\n filters,\r\n genderId,\r\n categoryGenderId,\r\n newPrice,\r\n true\r\n );\r\n };\r\n\r\n const handleSliderChange = (priceValue) => {\r\n let newPrice = {\r\n min: priceValue[0],\r\n max: priceValue[1],\r\n };\r\n setRange(newPrice);\r\n };\r\n const toggleSection = (setter, value) => (e) => {\r\n e.preventDefault();\r\n setter(value);\r\n };\r\n\r\n useEffect(() => {\r\n const initialCollapsedProductState = productAttributeFilters.reduce(\r\n (acc, attr) => {\r\n acc[attr.AttributeName] = true; // Start with all collapsed\r\n return acc;\r\n },\r\n {}\r\n );\r\n setIsProductAttrCollapsed(initialCollapsedProductState);\r\n const initialCollapsedState = variationAttributeFilters.reduce(\r\n (acc, attr) => {\r\n acc[attr.AttributeName] = true; // Start with all collapsed\r\n return acc;\r\n },\r\n {}\r\n );\r\n setIsVariationAttrCollapsed(initialCollapsedState);\r\n }, [\r\n variationAttributeFilters,\r\n productAttributeFilters,\r\n setIsVariationAttrCollapsed,\r\n setIsProductAttrCollapsed,\r\n ]);\r\n useEffect(() => {\r\n setValue([range.min, range.max]);\r\n }, [range]);\r\n\r\n return (\r\n No products matching your selection.
\r\n ) : (\r\n\r\n {loading\r\n ? fakeArray.map((item, index) => (\r\n
\r\n \r\n \r\n \r\n
\r\n ))\r\n : product.map((p, index) => (\r\n \r\n \r\n v.IsSelectedvariation)[0]\r\n ? p.variations.filter((v) => v.IsSelectedvariation)[0]\r\n : p.variations.filter((v) => v.IsSelected)[0]\r\n }\r\n key={index}\r\n handleButtonHover={handleButtonHover}\r\n onWishlistClick={onWishlistClick}\r\n addWishList={true}\r\n />\r\n
\r\n ))}\r\n \r\n \r\n {(parseInt(secondCategory) !== 0 ||\r\n thirdCategory.length > 0 ||\r\n productAttributeValue.length > 0 ||\r\n variationAttributeValue.length > 0 ||\r\n brandIds.length > 0 ||\r\n parseFloat(range.min) !== parseFloat(minPrice) ||\r\n parseFloat(range.max) !== parseFloat(maxPrice)) && (\r\n \r\n \r\n
\r\n \r\n
\r\n \r\n \r\n )}\r\n\r\n {thirdCategoriesFilter &&\r\n thirdCategoriesFilter.length > 0 &&\r\n !loading && (\r\n \r\n \r\n
\r\n )}\r\n\r\n {secondCategoriesFilter &&\r\n secondCategoriesFilter.length > 0 &&\r\n !loading && (\r\n \r\n \r\n Category\r\n \r\n
\r\n \r\n
\r\n \r\n {secondCategoriesFilter.map((cat, key) => {\r\n return (\r\n \r\n
\r\n );\r\n })}\r\n \r\n \r\n parseInt(secondCategory) ===\r\n parseInt(cat.CategoryId)\r\n ? RemoveFilter(\r\n cat.CategoryId,\r\n thirdCategory,\r\n brandIds,\r\n productAttributeValue,\r\n variationAttributeValue,\r\n filters,\r\n genderId,\r\n categoryGenderId,\r\n range,\r\n true,\r\n false,\r\n false,\r\n false,\r\n false,\r\n false\r\n )\r\n : AddFilter(\r\n cat.CategoryId,\r\n thirdCategory,\r\n brandIds,\r\n productAttributeValue,\r\n variationAttributeValue,\r\n filters,\r\n genderId,\r\n categoryGenderId,\r\n range,\r\n false\r\n )\r\n }\r\n disabled={!cat.IsAvailable}\r\n checked={\r\n parseInt(secondCategory) ===\r\n parseInt(cat.CategoryId)\r\n }\r\n />\r\n \r\n {cat.CategoryName}\r\n \r\n
\r\n \r\n \r\n
\r\n \r\n
\r\n \r\n \r\n )}\r\n\r\n {brandFilters && brandFilters.length > 0 && !loading && (\r\n \r\n \r\n {\r\n secondCategoriesFilter.find(\r\n (category) =>\r\n category.CategoryId === parseInt(secondCategory)\r\n )?.CategoryName\r\n }\r\n \r\n
\r\n \r\n
\r\n \r\n {thirdCategoriesFilter.map((cat, key) => (\r\n \r\n
\r\n ))}\r\n \r\n \r\n thirdCategory\r\n .map((item) => parseInt(item))\r\n .includes(cat.CategoryId)\r\n ? RemoveFilter(\r\n secondCategory,\r\n cat.CategoryId,\r\n brandIds,\r\n productAttributeValue,\r\n variationAttributeValue,\r\n filters,\r\n genderId,\r\n categoryGenderId,\r\n range,\r\n false,\r\n true,\r\n false,\r\n false,\r\n false,\r\n false\r\n )\r\n : AddFilter(\r\n secondCategory,\r\n cat.CategoryId,\r\n brandIds,\r\n productAttributeValue,\r\n variationAttributeValue,\r\n filters,\r\n genderId,\r\n categoryGenderId,\r\n range,\r\n false\r\n )\r\n }\r\n disabled={!cat.IsAvailable}\r\n checked={thirdCategory\r\n .map((item) => parseInt(item))\r\n .includes(cat.CategoryId)}\r\n />\r\n \r\n {cat.CategoryName}\r\n \r\n
\r\n \r\n \r\n Brand\r\n \r\n
\r\n \r\n
\r\n \r\n \r\n {brandFilters.map((brand, key) => (\r\n \r\n
\r\n ))}\r\n \r\n \r\n brandIds\r\n .map((item) => parseInt(item))\r\n .includes(parseInt(brand.BrandId))\r\n ? RemoveFilter(\r\n secondCategory,\r\n thirdCategory,\r\n brand.BrandId,\r\n productAttributeValue,\r\n variationAttributeValue,\r\n filters,\r\n genderId,\r\n categoryGenderId,\r\n range,\r\n false,\r\n false,\r\n true,\r\n false,\r\n false,\r\n false\r\n )\r\n : AddFilter(\r\n secondCategory,\r\n thirdCategory,\r\n brand.BrandId,\r\n productAttributeValue,\r\n variationAttributeValue,\r\n filters,\r\n genderId,\r\n categoryGenderId,\r\n range,\r\n false\r\n )\r\n }\r\n disabled={!brand.IsAvailable}\r\n checked={brandIds\r\n .map((item) => parseInt(item))\r\n .includes(brand.BrandId)}\r\n />\r\n \r\n {brand.BrandName}\r\n \r\n
\r\n \r\n \r\n setIsProductAttrCollapsed((prev) => ({\r\n ...prev,\r\n [att.AttributeName]: !prev[att.AttributeName],\r\n })),\r\n !isProductAttrCollapsed[att.AttributeName]\r\n )}\r\n >\r\n {att.AttributeName}\r\n \r\n
\r\n \r\n
\r\n \r\n \r\n {att.AttributeValues.map((attValue, key) => (\r\n \r\n
\r\n ))}\r\n \r\n \r\n productAttributeValue\r\n .map((item) => parseInt(item))\r\n .includes(attValue.AttributeValueId)\r\n ? RemoveFilter(\r\n secondCategory,\r\n thirdCategory,\r\n brandIds,\r\n attValue.AttributeValueId,\r\n variationAttributeValue,\r\n filters,\r\n genderId,\r\n categoryGenderId,\r\n range,\r\n false,\r\n false,\r\n false,\r\n false,\r\n true,\r\n false\r\n )\r\n : AddFilter(\r\n secondCategory,\r\n thirdCategory,\r\n brandIds,\r\n attValue.AttributeValueId,\r\n variationAttributeValue,\r\n filters,\r\n genderId,\r\n categoryGenderId,\r\n range,\r\n false\r\n )\r\n }\r\n disabled={!attValue.IsAvailable}\r\n checked={productAttributeValue\r\n .map((item) => parseInt(item))\r\n .includes(attValue.AttributeValueId)}\r\n />\r\n \r\n {attValue.Value}\r\n \r\n
\r\n \r\n \r\n setIsVariationAttrCollapsed((prev) => ({\r\n ...prev,\r\n [att.AttributeName]: !prev[att.AttributeName],\r\n })),\r\n !isVariationAttrCollapsed[att.AttributeName]\r\n )}\r\n >\r\n {att.AttributeName}\r\n \r\n
\r\n \r\n
\r\n \r\n \r\n \r\n ))}\r\n\r\n {!loading && (\r\n \r\n {att.AttributeValues.map((attValue, key) => (\r\n \r\n
\r\n ))}\r\n \r\n \r\n variationAttributeValue\r\n .map((item) => parseInt(item))\r\n .includes(attValue.AttributeValueId)\r\n ? RemoveFilter(\r\n secondCategory,\r\n thirdCategory,\r\n brandIds,\r\n productAttributeValue,\r\n attValue.AttributeValueId,\r\n filters,\r\n genderId,\r\n categoryGenderId,\r\n range,\r\n false,\r\n false,\r\n false,\r\n true,\r\n false,\r\n false\r\n )\r\n : AddFilter(\r\n secondCategory,\r\n thirdCategory,\r\n brandIds,\r\n productAttributeValue,\r\n attValue.AttributeValueId,\r\n filters,\r\n genderId,\r\n categoryGenderId,\r\n range,\r\n false\r\n )\r\n }\r\n disabled={!attValue.IsAvailable}\r\n checked={variationAttributeValue\r\n .map((item) => parseInt(item))\r\n .includes(attValue.AttributeValueId)}\r\n />\r\n \r\n {attValue.Value}\r\n \r\n
\r\n \r\n \r\n Price\r\n \r\n
\r\n \r\n
\r\n \r\n
\r\n \r\n {/* Add any specific price range text here */}\r\n
\r\n\r\n \r\n
\r\n \r\n
\r\n\r\n \r\n {windowSize ? (\r\n \r\n ) : (\r\n \"\"\r\n )}\r\n \r\n
\r\n\r\n \r\n {windowSize ? (\r\n \r\n ) : (\r\n \"\"\r\n )}\r\n \r\n
\r\n ) : showDiscover && !isLoading ? (\r\n \r\n
\r\n \r\n
\r\n\r\n - \r\n
- \r\n
Links \r\n- \r\n \r\n Call: +961 1 790 555\r\n \r\n
\r\n
\r\n
\r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n
\r\n - \r\n
- \r\n
Links \r\n- \r\n {!isLogged ? (\r\n
\r\n ) : (\r\n \r\n {FirstName}\r\n \r\n )}\r\n \r\n
\r\n \r\n {countryCode?.toUpperCase() === \"INT\" || !countryCode ? (\r\n
\r\n \r\n
\r\n - \r\n {menuCountries &&\r\n menuCountries.map((country, index) => {\r\n if (country.CountryCode.toUpperCase() === \"INT\") {\r\n return (\r\n
\r\n
\r\n hideBanner()}>\r\n
\r\n \r\n
\r\n {dictionary.OpenAppHeader}
\r\n \r\n Open\r\n
\r\n \r\n ) : (\r\n \"\"\r\n )}\r\n\r\n \r\n \r\n
\r\n {windowSize ? (\r\n \r\n \r\n \r\n \r\n )}\r\n\r\n
\r\n \r\n {windowSize ? (\r\n handleLogoClick()}\r\n >\r\n \r\n
\r\n ) : (\r\n \r\n \r\n
\r\n \r\n
\r\n \r\n
\r\n {pageName}
\r\n {productCount ? (\r\n \r\n {productCount} Items\r\n
\r\n ) : (\r\n \"\"\r\n )}\r\n \r\n
\r\n \r\n \r\n
\r\n \r\n {windowSize ? (\r\n
\r\n \r\n
\r\n ) : (\r\n \"\"\r\n )}\r\n \r\n \r\n \r\n \r\n );\r\n};\r\n\r\nexport default SecondHeader2;\r\n","import React, { Fragment, useEffect, useRef, useState } from \"react\";\r\nimport { isSafariBrowser, isEdgeBrowser } from \"../utils\";\r\nimport MobileMenu from \"../components/features/mobile-menu\";\r\nimport Footer from \"../components/partials/footer/Footer\";\r\nimport SecondHeader from \"../wrappers/SecondHeader\";\r\nimport SecondHeader2 from \"../wrappers/SecondHeader2\";\r\n\r\nconst SecondLayout = ({\r\n children,\r\n setIsLoading,\r\n setShowSidebar,\r\n showSidebar,\r\n pageName,\r\n className,\r\n productCount,\r\n isLoading\r\n}) => {\r\n const [windowSize, setWindowSize] = useState(window.innerWidth > 991);\r\n let scrollTop = useRef(null);\r\n function hideMobileMenu() {\r\n document.querySelector(\"body\").classList.remove(\"mmenu-active\");\r\n }\r\n\r\n useEffect(() => {\r\n if (windowSize) {\r\n scrollTop.current = document.querySelector(\"#scroll-top\");\r\n window.addEventListener(\"scroll\", scrollHandler, false);\r\n }\r\n }, []);\r\n\r\n function scrollHandler() {\r\n if (window.pageYOffset >= 400) {\r\n scrollTop.current.classList.add(\"show\");\r\n } else {\r\n scrollTop.current.classList.remove(\"show\");\r\n }\r\n }\r\n\r\n function toScrollTop() {\r\n if (isSafariBrowser() || isEdgeBrowser()) {\r\n let pos = window.pageYOffset;\r\n let timerId = setInterval(() => {\r\n if (pos <= 0) clearInterval(timerId);\r\n window.scrollBy(0, -120);\r\n pos -= 120;\r\n }, 1);\r\n } else {\r\n window.scrollTo({\r\n top: 0,\r\n behavior: \"smooth\",\r\n });\r\n }\r\n }\r\n useEffect(() => {\r\n window.scrollTo(0, 0);\r\n const handleResize = () => {\r\n setWindowSize(window.innerWidth > 991);\r\n };\r\n\r\n window.addEventListener(\"resize\", handleResize);\r\n\r\n return () => {\r\n window.removeEventListener(\"resize\", handleResize);\r\n };\r\n }, []);\r\n\r\n return (\r\n \r\n \r\n
\r\n \r\n
\r\n \r\n selectedParent === m.ParentID && m.IsSelected\r\n )}\r\n />\r\n
\r\n \r\n
\r\n\r\n \r\n {windowSize ? (\r\n \r\n ) : (\r\n \"\"\r\n )}\r\n \r\n {children}\r\n
\r\n \r\n \r\n
\r\n );\r\n};\r\n\r\nconst customStyles = {\r\n overlay: {\r\n backgroundColor: \"rgba(77,77,77,0.6)\",\r\n zIndex: \"9000\",\r\n },\r\n};\r\n\r\nModal.setAppElement(\"body\");\r\n\r\nconst ProfileLoginModal = ({\r\n setOpen,\r\n open,\r\n setIsForget,\r\n isForget,\r\n setOpenOTP,\r\n openOTP,\r\n setOpenMerge,\r\n openMerge,\r\n}) => {\r\n const navigate = useNavigate();\r\n const dictionary = useSelector((state) => state.dictionary.dictionary);\r\n const guestId = useSelector((state) => state.credential.guestId);\r\n const token = useSelector((state) => state.credential.token);\r\n const customerId = useSelector((state) => state.credential.customerId);\r\n const FirstName = useSelector((state) => state.credential.firstName);\r\n const LastName = useSelector((state) => state.credential.lastName);\r\n const customerToken = useSelector((state) => state.credential.customerToken);\r\n const email = useSelector((state) => state.credential.email);\r\n const customer = useSelector((state) => state.credential.customer);\r\n const currency = useSelector((state) => state.currency.currency);\r\n const { country } = useParams();\r\n let countryCode = country ? country : Cookies.get(\"Country\");\r\n const [disable, setDisable] = useState(false);\r\n const [showPasswordLogin, setShowPasswordLogin] = useState(false);\r\n const [showPasswordRegister, setShowPasswordRegister] = useState(false);\r\n const [showPasswordConfirm, setShowPasswordConfirm] = useState(false);\r\n const [firstName, setFirstName] = useState(\"\");\r\n const [lastName, setLastName] = useState(\"\");\r\n const [emails, setEmails] = useState(\"\");\r\n const [password, setPassword] = useState(\"\");\r\n const [confirmPassword, setConfirmPassword] = useState(\"\");\r\n const [genders, setGenders] = useState([]);\r\n const [selectedGender, setSelectedGender] = useState(0);\r\n const [isSubscribed, setIsSubscribed] = useState(false);\r\n const [isTerm, setIsTerm] = useState(false);\r\n const [isButtonDisabled, setIsButtonDisabled] = useState(false);\r\n const [timer, setTimer] = useState(0);\r\n const [forgetEmail, setForgetEmail] = useState(\"\");\r\n const [isSent, setIsSent] = useState(false);\r\n const [errorMessage, setErrorMessage] = useState(\"\");\r\n const [successMessage, setSuccessMessage] = useState(\"\");\r\n\r\n const cartlist = useSelector((state) => state.cart.cartItems);\r\n\r\n const [otp, setOtp] = useState(\"\");\r\n const [otpDeviceKey, setOtpDeviceKey] = useState(\"\");\r\n const [guest, setGuest] = useState(\"\");\r\n const [customerDetail, setCustomerDetail] = useState(0);\r\n const [data, setData] = useState({});\r\n\r\n const dispatch = useDispatch();\r\n\r\n const handleChange = (event) => {\r\n setSelectedGender(parseInt(event.target.value));\r\n };\r\n\r\n const isRegisterValid =\r\n firstName.trim() !== \"\" &&\r\n lastName.trim() !== \"\" &&\r\n emails.trim() !== \"\" &&\r\n password.trim() !== \"\";\r\n\r\n const isLoginValid = emails.trim() !== \"\" && password.trim() !== \"\";\r\n const isValidEmail = emails.includes(\".\") && emails.includes(\"@\");\r\n\r\n useEffect(() => {\r\n window.AppleID.auth.init({\r\n clientId: \"com.sheyaaka.sheyaaka.web\", // Replace with your Apple Client ID\r\n scope: \"email name\",\r\n redirectURI: Global.redirectURI, // Your redirect URI\r\n state: \"your_custom_state\",\r\n usePopup: true, // To avoid redirection\r\n });\r\n }, []);\r\n\r\n const handleAppleLogin = async () => {\r\n try {\r\n const response = await window.AppleID.auth.signIn();\r\n\r\n const { authorization, user } = response;\r\n\r\n if (authorization) {\r\n const { id_token } = authorization;\r\n\r\n // Decode the ID token\r\n const decoded = jwtDecode(id_token);\r\n\r\n setDisable(true);\r\n const referralCode = \"\";\r\n\r\n const response = await fetch(\r\n Global.API_URL + \"Customer/RegisterCustomer\",\r\n {\r\n method: \"POST\",\r\n headers: {\r\n Accept: \"application/json\",\r\n \"Content-Type\": \"application/json\",\r\n \"Access-Control-Allow-Origin\": Global.HostAPI,\r\n CountryCode: countryCode,\r\n },\r\n body: JSON.stringify({\r\n languageId: Cookies.get(\"Language\"),\r\n firstName: \"apple\",\r\n lastName: \"user\",\r\n email: decoded.email.trim().toLowerCase(),\r\n password: \"\",\r\n genderID: 3,\r\n loginTypeId: 4,\r\n guestId: guestId,\r\n isSubscribed: isSubscribed,\r\n referralCode: referralCode,\r\n idToken: id_token,\r\n deviceToken: \"\",\r\n deviceType: 0,\r\n }),\r\n }\r\n );\r\n\r\n const result = await response.json();\r\n if (!response.ok) {\r\n toast.error(result.Message, {\r\n theme: \"light\",\r\n });\r\n throw new Error(\"Something went wrong\");\r\n }\r\n\r\n if (result.Code === 1) {\r\n toast.success(result.Message, { theme: \"light\" });\r\n if (window.snaptr) {\r\n window.snaptr(\"track\", \"LOGIN\", {\r\n uuid_c1: result.customerReturn.CustomerId,\r\n user_email: result.customerReturn.Email,\r\n user_phone_number: result.customerReturn.PhoneNumber,\r\n });\r\n console.log(\"LOGIN\");\r\n }\r\n\r\n if (\r\n cartlist.cartItemsCheckout &&\r\n cartlist.cartItemsCheckout.length > 0\r\n ) {\r\n setOpen(false);\r\n setOpenMerge(true);\r\n setCustomerDetail(result.customerReturn.CustomerId);\r\n setGuest(guestId);\r\n const credentials = {\r\n isLogged: true,\r\n guestId: \"\",\r\n customerId: result.customerReturn.CustomerId,\r\n customerToken: result.JwtToken,\r\n token: result.JwtToken,\r\n firstName: result.customerReturn.FirstName,\r\n lastName: result.customerReturn.LastName,\r\n email: result.customerReturn.Email,\r\n purchasedProducts: [],\r\n customer: result.CustomerSecret,\r\n };\r\n setData(credentials);\r\n } else {\r\n const credentials = {\r\n isLogged: true,\r\n guestId: \"\",\r\n customerId: result.customerReturn.CustomerId,\r\n customerToken: result.JwtToken,\r\n token: result.JwtToken,\r\n firstName: result.customerReturn.FirstName,\r\n lastName: result.customerReturn.LastName,\r\n email: result.customerReturn.Email,\r\n purchasedProducts: [],\r\n customer: result.CustomerSecret,\r\n };\r\n\r\n dispatch(setCredential(credentials));\r\n navigate(`/${countryCode}/profile`);\r\n }\r\n } else if (result.Code === 2) {\r\n setOtpDeviceKey(result.OtpDeviceKey);\r\n closeModal();\r\n setOpenOTP(true);\r\n } else if (result.Code === -1 || result.Code === -2) {\r\n toast.error(result.Message, { theme: \"light\" });\r\n } else if (result.Code === -3) {\r\n toast.error(result.Message, { theme: \"light\" });\r\n navigate(\"/reset-password/\" + emails);\r\n } else {\r\n toast.error(result.Message, { theme: \"light\" });\r\n }\r\n setDisable(false);\r\n }\r\n } catch (error) {\r\n console.error(\"Apple Login Error:\", error);\r\n }\r\n };\r\n const Register = async (e) => {\r\n e.preventDefault();\r\n if (!isRegisterValid) {\r\n toast.error(\"Fill all required fields\", {\r\n theme: \"light\",\r\n });\r\n } else if (!isValidEmail) {\r\n toast.error(\"Enter a valid email\", {\r\n theme: \"light\",\r\n });\r\n } else if (password !== confirmPassword) {\r\n toast.error(\"Confirm password does not match the original password.\", {\r\n theme: \"light\",\r\n });\r\n } else if (!isTerm) {\r\n toast.error(\r\n \"Accept the terms and conditions to proceed with completing the registration\",\r\n {\r\n theme: \"light\",\r\n }\r\n );\r\n } else {\r\n setDisable(true);\r\n const referralCode = \"\";\r\n const respose = await fetch(\r\n Global.API_URL + \"Customer/RegisterCustomer\",\r\n {\r\n method: \"POST\",\r\n headers: {\r\n Accept: \"application/json\",\r\n \"Content-Type\": \"application/json\",\r\n \"Access-Control-Allow-Origin\": Global.HostAPI,\r\n CountryCode: countryCode,\r\n },\r\n body: JSON.stringify({\r\n languageId: Cookies.get(\"Language\"),\r\n firstName: firstName,\r\n lastName: lastName,\r\n email: emails.trim().toLowerCase(),\r\n password: password,\r\n genderID: selectedGender,\r\n loginTypeId: 1,\r\n guestId: guestId,\r\n isSubscribed: isSubscribed,\r\n referralCode: referralCode,\r\n idToken: \"\",\r\n deviceToken: \"\",\r\n deviceType: 0,\r\n }),\r\n }\r\n );\r\n const customerData = await respose.json();\r\n if (customerData.Code === 0) {\r\n toast.success(customerData.Message, {\r\n theme: \"light\",\r\n });\r\n if (window.snaptr) {\r\n window.snaptr(\"track\", \"SIGN_UP\", {\r\n sign_up_method: \"sheyaaka register\",\r\n uuid_c1: guestId,\r\n user_email: emails,\r\n user_phone_number: \"\",\r\n });\r\n console.log(\"SIGN_UP\");\r\n }\r\n if (typeof window !== \"undefined\" && window.gtag) {\r\n window.gtag(\"event\", \"sign_up\", {\r\n method: \"sheyaaka register\",\r\n });\r\n }\r\n setEmails(\"\");\r\n setPassword(\"\");\r\n setFirstName(\"\");\r\n setLastName(\"\");\r\n setConfirmPassword(\"\");\r\n setGenders(0);\r\n setIsSubscribed(false);\r\n setIsTerm(false);\r\n closeModal();\r\n } else {\r\n toast.error(customerData.Message, {\r\n theme: \"light\",\r\n });\r\n }\r\n setDisable(false);\r\n }\r\n };\r\n const closeMergeModal = async () => {\r\n dispatch(setCredential(data));\r\n dispatch(deleteAllFromCart());\r\n setOpenMerge(false);\r\n };\r\n const MergeCart = async () => {\r\n const offset = new Date().getTimezoneOffset();\r\n let CurrencyId = currency.filter(\r\n (c) =>\r\n c.CountryCode.toLocaleUpperCase() === countryCode.toLocaleUpperCase()\r\n )[0]\r\n ? currency.filter(\r\n (c) =>\r\n c.CountryCode.toLocaleUpperCase() ===\r\n countryCode.toLocaleUpperCase()\r\n )[0]?.Id\r\n : currency.filter((c) => c.CountryCode.toLocaleUpperCase() === \"INT\")[0]\r\n ?.Id;\r\n const response = await fetch(\r\n Global.API_URL +\r\n \"Cart/MergeCartRequest/Language/\" +\r\n Cookies.get(\"Language\") +\r\n \"/Currency/\" +\r\n CurrencyId +\r\n \"/Offset/\" +\r\n offset +\r\n \"/Country/\" +\r\n countryCode,\r\n {\r\n method: \"PUT\",\r\n headers: {\r\n Accept: \"application/json\",\r\n \"Content-Type\": \"application/json\",\r\n AuthorizationCustomer: token,\r\n \"Access-Control-Allow-Origin\": Global.HostAPI,\r\n CountryCode: countryCode,\r\n },\r\n body: JSON.stringify({\r\n customerId: customerDetail,\r\n guestId: guest,\r\n Offset: offset,\r\n }),\r\n }\r\n );\r\n const result = await response.json();\r\n if (result.Code === 0) {\r\n dispatch(setCredential(data));\r\n dispatch(deleteAllFromCart());\r\n let promise;\r\n let cart = dispatch(\r\n GetCustomerCart(\r\n customerDetail,\r\n Cookies.get(\"Language\"),\r\n offset,\r\n Cookies.get(\"Country\"),\r\n data.customerToken\r\n ),\r\n Cookies.get(\"Country\")\r\n );\r\n promise = Promise.resolve(cart);\r\n promise.then((value) => {\r\n if (value !== -1) {\r\n dispatch(addAllToCart(value));\r\n }\r\n });\r\n setOpenMerge(false);\r\n }\r\n };\r\n\r\n const SendEmail = async () => {\r\n setErrorMessage(\"\");\r\n setSuccessMessage(\"\");\r\n if (forgetEmail.trim() === \"\") {\r\n setErrorMessage(\"Enter Valid Email\");\r\n } else {\r\n const response = await fetch(\r\n Global.API_URL + \"Customer/SendForgetPasswordEmailURL\",\r\n {\r\n method: \"POST\",\r\n headers: {\r\n Accept: \"application/json\",\r\n \"Content-Type\": \"application/json\",\r\n \"Access-Control-Allow-Origin\": Global.HostAPI,\r\n CountryCode: countryCode,\r\n },\r\n body: JSON.stringify({\r\n forgetPasswordEmail: forgetEmail.trim().toLowerCase(),\r\n languageId: Cookies.get(\"Language\"),\r\n }),\r\n }\r\n );\r\n const result = await response.json();\r\n if (response.ok) {\r\n if (result.Code === 0) {\r\n setSuccessMessage(result.Message);\r\n setForgetEmail(\"\");\r\n } else {\r\n setErrorMessage(result.Message);\r\n setIsSent(true);\r\n setIsButtonDisabled(true);\r\n setTimer(60);\r\n }\r\n } else {\r\n if (result.Message) {\r\n setErrorMessage(result.Message);\r\n setIsSent(true);\r\n setIsButtonDisabled(true);\r\n setTimer(60);\r\n } else {\r\n setErrorMessage(result);\r\n setIsSent(true);\r\n setIsButtonDisabled(true);\r\n setTimer(60);\r\n }\r\n }\r\n }\r\n };\r\n const handleOTPChange = (otp) => setOtp(otp);\r\n\r\n const Login = async (e) => {\r\n e.preventDefault();\r\n\r\n if (!isLoginValid) {\r\n toast.error(\"Fill all required fields\", {\r\n theme: \"light\",\r\n });\r\n } else if (!isValidEmail) {\r\n toast.error(\"Enter a valid email\", {\r\n theme: \"light\",\r\n });\r\n } else {\r\n try {\r\n const response = await fetch(\r\n Global.API_URL + \"Customer/CustomerLogin\",\r\n {\r\n method: \"POST\",\r\n headers: {\r\n Accept: \"application/json\",\r\n \"Content-Type\": \"application/json\",\r\n \"Access-Control-Allow-Origin\": Global.HostAPI,\r\n CountryCode: countryCode,\r\n },\r\n body: JSON.stringify({\r\n languageId: Cookies.get(\"Language\"),\r\n email: emails.trim().toLowerCase(),\r\n password: password,\r\n }),\r\n }\r\n );\r\n const result = await response.json();\r\n\r\n if (!response.ok) {\r\n toast.error(result.Message, {\r\n theme: \"light\",\r\n });\r\n throw new Error(\"Something went wrong\");\r\n }\r\n\r\n if (result.Code === 1) {\r\n toast.success(result.Message, { theme: \"light\" });\r\n if (window.snaptr) {\r\n window.snaptr(\"track\", \"LOGIN\", {\r\n uuid_c1: result.customerReturn.CustomerId,\r\n user_email: result.customerReturn.Email,\r\n user_phone_number: result.customerReturn.PhoneNumber,\r\n });\r\n console.log(\"LOGIN\");\r\n }\r\n if (\r\n cartlist.cartItemsCheckout &&\r\n cartlist.cartItemsCheckout.length > 0\r\n ) {\r\n setOpen(false);\r\n setOpenMerge(true);\r\n setCustomerDetail(result.customerReturn.CustomerId);\r\n setGuest(guestId);\r\n const credentials = {\r\n isLogged: true,\r\n guestId: \"\",\r\n customerId: result.customerReturn.CustomerId,\r\n customerToken: result.JwtToken,\r\n token: result.JwtToken,\r\n firstName: result.customerReturn.FirstName,\r\n lastName: result.customerReturn.LastName,\r\n email: result.customerReturn.Email,\r\n purchasedProducts: [],\r\n customer: result.CustomerSecret,\r\n };\r\n setData(credentials);\r\n } else {\r\n const credentials = {\r\n isLogged: true,\r\n guestId: \"\",\r\n customerId: result.customerReturn.CustomerId,\r\n customerToken: result.JwtToken,\r\n token: result.JwtToken,\r\n firstName: result.customerReturn.FirstName,\r\n lastName: result.customerReturn.LastName,\r\n email: result.customerReturn.Email,\r\n purchasedProducts: [],\r\n customer: result.CustomerSecret,\r\n };\r\n\r\n dispatch(setCredential(credentials));\r\n navigate(`/${countryCode}/profile`);\r\n }\r\n } else if (result.Code === 2) {\r\n setOtpDeviceKey(result.OtpDeviceKey);\r\n closeModal();\r\n setOpenOTP(true);\r\n } else if (result.Code === -1 || result.Code === -2) {\r\n toast.error(result.Message, { theme: \"light\" });\r\n } else if (result.Code === -3) {\r\n toast.error(result.Message, { theme: \"light\" });\r\n navigate(\"/reset-password/\" + emails);\r\n } else {\r\n toast.error(result.Message, { theme: \"light\" });\r\n }\r\n } catch (error) {\r\n console.log(\"Something went wrong!\");\r\n }\r\n }\r\n };\r\n\r\n const onSuccess = async (response) => {\r\n console.log(\"Login Success:\", response);\r\n const userInfo = await axios.get(\r\n \"https://www.googleapis.com/oauth2/v3/userinfo\",\r\n { headers: { Authorization: `Bearer ${response.access_token} ` } }\r\n );\r\n\r\n setDisable(true);\r\n const referralCode = \"\";\r\n const respose = await fetch(Global.API_URL + \"Customer/RegisterCustomer\", {\r\n method: \"POST\",\r\n headers: {\r\n Accept: \"application/json\",\r\n \"Content-Type\": \"application/json\",\r\n \"Access-Control-Allow-Origin\": Global.HostAPI,\r\n CountryCode: countryCode,\r\n },\r\n body: JSON.stringify({\r\n languageId: Cookies.get(\"Language\"),\r\n firstName: userInfo.data.given_name,\r\n lastName: userInfo.data.family_name,\r\n email: userInfo.data.email.trim().toLowerCase(),\r\n password: \"\",\r\n genderID: 3,\r\n loginTypeId: 2,\r\n guestId: guestId,\r\n isSubscribed: isSubscribed,\r\n referralCode: referralCode,\r\n idToken: response.access_token,\r\n deviceToken: \"\",\r\n deviceType: 0,\r\n }),\r\n });\r\n const customerData = await respose.json();\r\n if (customerData.Code === 0) {\r\n dispatch(deleteAllFromCart());\r\n if (window.snaptr) {\r\n window.snaptr(\"track\", \"SIGN_UP\", {\r\n sign_up_method: \"google register\",\r\n uuid_c1: guestId,\r\n user_email: emails,\r\n user_phone_number: \"\",\r\n });\r\n console.log(\"SIGN_UP\");\r\n }\r\n if (typeof window !== \"undefined\" && window.gtag) {\r\n window.gtag(\"event\", \"sign_up\", {\r\n method: \"google register\",\r\n });\r\n }\r\n toast.success(customerData.Message, {\r\n theme: \"light\",\r\n });\r\n\r\n setEmails(\"\");\r\n setPassword(\"\");\r\n setFirstName(\"\");\r\n setLastName(\"\");\r\n setConfirmPassword(\"\");\r\n setGenders(0);\r\n setIsSubscribed(false);\r\n setIsTerm(false);\r\n closeModal();\r\n } else {\r\n toast.error(customerData.Message, {\r\n theme: \"light\",\r\n });\r\n }\r\n setDisable(false);\r\n };\r\n\r\n const onFailure = (error) => {\r\n console.log(\"Login Failed:\", error);\r\n // Handle the error\r\n };\r\n useEffect(() => {\r\n let interval = null;\r\n if (timer > 0) {\r\n interval = setInterval(() => {\r\n setTimer((prevTimer) => prevTimer - 1);\r\n }, 1000);\r\n } else if (timer === 0) {\r\n setIsButtonDisabled(false);\r\n setIsSent(false);\r\n }\r\n return () => clearInterval(interval);\r\n }, [timer]);\r\n\r\n const ValidateOTP = async () => {\r\n const response = await fetch(Global.API_URL + \"Customer/ValidateTOTP\", {\r\n method: \"POST\",\r\n headers: {\r\n Accept: \"application/json\",\r\n \"Content-Type\": \"application/json\",\r\n \"Access-Control-Allow-Origin\": Global.HostAPI,\r\n countryCode: countryCode,\r\n },\r\n body: JSON.stringify({\r\n otpDeviceKey: otpDeviceKey,\r\n languageId: Cookies.get(\"Language\"),\r\n deviceToken: \"\",\r\n deviceType: 0,\r\n sixDigitCode: otp,\r\n }),\r\n });\r\n const result = await response.json();\r\n if (response.ok) {\r\n if (result.Code === 1) {\r\n toast.success(result.Message, { theme: \"light\" });\r\n if (\r\n cartlist.cartItemsCheckout &&\r\n cartlist.cartItemsCheckout.length > 0\r\n ) {\r\n setOpen(false);\r\n setOpenMerge(true);\r\n setCustomerDetail(result.customerReturn.CustomerId);\r\n setGuest(guestId);\r\n const credentials = {\r\n isLogged: true,\r\n guestId: \"\",\r\n customerId: result.customerReturn.CustomerId,\r\n customerToken: result.JwtToken,\r\n token: result.JwtToken,\r\n firstName: result.customerReturn.FirstName,\r\n lastName: result.customerReturn.LastName,\r\n email: result.customerReturn.Email,\r\n purchasedProducts: [],\r\n customer: result.CustomerSecret,\r\n };\r\n setData(credentials);\r\n } else {\r\n const credentials = {\r\n isLogged: true,\r\n guestId: \"\",\r\n customerId: result.customerReturn.CustomerId,\r\n customerToken: result.JwtToken,\r\n token: result.JwtToken,\r\n firstName: result.customerReturn.FirstName,\r\n lastName: result.customerReturn.LastName,\r\n email: result.customerReturn.Email,\r\n purchasedProducts: [],\r\n customer: result.CustomerSecret,\r\n };\r\n\r\n dispatch(setCredential(credentials));\r\n navigate(`/${countryCode}/profile`);\r\n }\r\n }\r\n }\r\n };\r\n const ForgetOTP = async () => {\r\n closeModal();\r\n localStorage.setItem(\"acc\", otpDeviceKey);\r\n navigate(\"/\" + countryCode + \"/account-recovery\");\r\n };\r\n\r\n useEffect(() => {\r\n const fetchGender = async () => {\r\n const response = await fetch(Global.API_URL + \"Gender/GetGenders\", {\r\n method: \"GET\",\r\n headers: {\r\n Accept: \"application/json\",\r\n \"Content-Type\": \"application/json\",\r\n \"Access-Control-Allow-Origin\": Global.HostAPI,\r\n CountryCode: countryCode,\r\n },\r\n });\r\n const result = await response.json();\r\n if (response.ok) {\r\n setGenders(result);\r\n }\r\n };\r\n fetchGender();\r\n }, []);\r\n\r\n function closeModal() {\r\n setEmails(\"\");\r\n setPassword(\"\");\r\n setFirstName(\"\");\r\n setLastName(\"\");\r\n setConfirmPassword(\"\");\r\n setGenders(0);\r\n setIsSubscribed(false);\r\n setIsTerm(false);\r\n setOpen(false);\r\n }\r\n\r\n return (\r\n \r\n \r\n
\r\n \r\n \r\n \r\n \r\n )}\r\n \r\n \r\n {openOTP ? (\r\n \r\n \r\n {isForget\r\n ? \"Forgot Your Password?\"\r\n : dictionary.WelcomeToYourFashionHome}\r\n \r\n \r\n
\r\n {isForget ? (\r\n \r\n
\r\n ) : (\r\n \r\n
\r\n \r\n
\r\n \r\n
\r\n \r\n {errorMessage !== \"\" ? (\r\n
\r\n \r\n \r\n setErrorMessage(\"\")}\r\n >\r\n ×\r\n \r\n
\r\n ) : successMessage !== \"\" ? (\r\n \r\n setSuccessMessage(\"\")}\r\n >\r\n ×\r\n \r\n
\r\n ) : (\r\n \"\"\r\n )}\r\n \r\n
\r\n \r\n
\r\n \r\n {\" \"}\r\n Enter your email address and we'll send you a link\r\n to reset your password.{\" \"}\r\n
\r\n \r\n \r\n {dictionary.Email}\r\n \r\n setForgetEmail(e.target.value)}\r\n />\r\n {isSent ? (\r\n
\r\n \r\n {\" \"}\r\n Link will be sent in{\" \"}\r\n {timer} s\r\n
\r\n ) : (\r\n \"\"\r\n )}\r\n \r\n SendEmail()}\r\n >\r\n
\r\n SEND LINK
\r\n \r\n \r\n
\r\n \r\n \r\n {\r\n onSuccess(credentialResponse);\r\n }}\r\n onError={(error) => {\r\n onFailure(error);\r\n }}\r\n type=\"icon\"\r\n />\r\n \r\n
\r\n \r\n \r\n
\r\n \r\n \r\n
\r\n \r\n
\r\n \r\n \r\n
\r\n \r\n
\r\n \r\n \r\n
\r\n \r\n \r\n \r\n \r\n \r\n {dictionary.SignIn}\r\n \r\n \r\n\r\n \r\n \r\n {dictionary.ImNewHere}\r\n \r\n \r\n \r\n\r\n
\r\n \r\n\r\n \r\n \r\n
\r\n \r\n \r\n
\r\n \r\n
\r\n \r\n \r\n {dictionary.SignIn}\r\n \r\n
\r\n \r\n
\r\n \r\n \r\n {\r\n onSuccess(credentialResponse);\r\n }}\r\n onError={(error) => {\r\n onFailure(error);\r\n }}\r\n type=\"icon\"\r\n />\r\n \r\n
\r\n \r\n \r\n
\r\n \r\n
\r\n \r\n
\r\n \r\n \r\n \r\n setEmails(e.target.value.toLowerCase())\r\n }\r\n required\r\n />\r\n
\r\n \r\n
\r\n \r\n
\r\n \r\n
\r\n \r\n \r\n
\r\n \r\n \r\n setPassword(e.target.value)\r\n }\r\n required\r\n />\r\n \r\n setShowPasswordRegister(\r\n !showPasswordRegister\r\n )\r\n }\r\n >\r\n {showPasswordRegister ? (\r\n
\r\n \r\n
\r\n \r\n
\r\n \r\n \r\n
\r\n \r\n \r\n setConfirmPassword(e.target.value)\r\n }\r\n required\r\n />\r\n \r\n setShowPasswordConfirm(\r\n !showPasswordConfirm\r\n )\r\n }\r\n >\r\n {showPasswordConfirm ? (\r\n
\r\n \r\n
\r\n\r\n \r\n
\r\n \r\n
\r\n \r\n \r\n setIsSubscribed(e.target.checked)\r\n }\r\n />\r\n \r\n
\r\n \r\n
\r\n \r\n \r\n {dictionary.SignUpForNewsLetter}\r\n
\r\n\r\n {dictionary.NewsLetter}\r\n
\r\n\r\n
\r\n\r\n \r\n
\r\n \r\n
\r\n \r\n \r\n setIsTerm(e.target.checked)\r\n }\r\n />\r\n \r\n
\r\n \r\n
\r\n \r\n \r\n I Have Already Read and Agreed To\r\n All{\" \"}\r\n \r\n Terms & Conditions\r\n \r\n
\r\n\r\n of Sheyaaka and All{\" \"}\r\n \r\n Data Protection Regulations\r\n {\" \"}\r\n of Sheyaaka. You are Entitled to Revoke\r\n Any Consent Granted By You At Any Time.\r\n
\r\n\r\n \r\n {dictionary.RegisterHere}\r\n \r\n
\r\n \r\n \r\n
\r\n \r\n \r\n
\r\n \r\n \r\n {\r\n onSuccess(credentialResponse);\r\n }}\r\n onError={(error) => {\r\n onFailure(error);\r\n }}\r\n type=\"icon\"\r\n />\r\n \r\n
\r\n\r\n \r\n \r\n
\r\n \r\n ForgetOTP()}\r\n >\r\n Don't have access to your OTP?\r\n
\r\n \r\n
\r\n \r\n Verify\r\n
\r\n\r\n
\r\n \r\n Verification Code\r\n
\r\n \r\n Enter verification code\r\n
\r\n \r\n
\r\n \r\n ValidateOTP()}\r\n className=\"btn btn-primary border-radius-5 text-white text-center w-100 mb-26 cursor-pointer\"\r\n >\r\n Enter\r\n \r\n
\r\n \r\n \r\n ) : (\r\n \"\"\r\n )}\r\n {openMerge ? (\r\n \r\n
\r\n \r\n ) : (\r\n \"\"\r\n )}\r\n \r\n \r\n Merge Carts?\r\n \r\n closeMergeModal()}\r\n >\r\n ×\r\n \r\n
\r\n \r\n
\r\n Do you want to merge the cart?
\r\n\r\n closeMergeModal()}\r\n >\r\n Dismiss\r\n \r\n MergeCart()}\r\n >\r\n Merge Carts\r\n \r\n
\r\n \r\n \r\n \r\n \r\n \r\n
\r\n );\r\n })}\r\n \r\n \r\n \r\n \r\n
\r\n \r\n \r\n\r\n \r\n \r\n \r\n \r\n \r\n \r\n
\r\n );\r\n })}\r\n \r\n Welcome To Sheyaaka\r\n
\r\n\r\n Access your Bag & Wishlist on any of your devices.\r\n
\r\n \r\n {\r\n setProfile(true);\r\n setIsForget(false);\r\n }}\r\n className=\"btn btn-outline-primary d-flex justify-content-center align-items-center me-7 w-329 fs-18 py-0 mb-md-0 h-40\"\r\n >\r\n Register\r\n \r\n {\r\n setProfile(true);\r\n setIsForget(false);\r\n }}\r\n className=\"btn btn-primary d-flex justify-content-center align-items-center w-329 fs-18 py-0 mb-md-0 h-40\"\r\n >\r\n Login\r\n \r\n
\r\n {profile || openOTP || openMerge ? (\r\n \r\n
\r\n \r\n \r\n
\r\n \r\n
\r\n We Are Here for You
\r\n \r\n Delivering Safely To Your Doorstep\r\n
\r\n \r\n
\r\n \r\n \r\n
\r\n \r\n Country:{\" \"}\r\n \r\n {\r\n countries.filter(\r\n (c) =>\r\n c.CountryCode.toUpperCase() ===\r\n countryCode.toUpperCase()\r\n )[0].CountryName\r\n }\r\n \r\n
\r\n \r\n Your chosen location defines brands that will show and\r\n shopping currency.{\" \"}\r\n
\r\n \r\n
\r\n \r\n {windowSize ? (\r\n \"\"\r\n ) : (\r\n \r\n
\r\n \r\n Shopping Preference:{\" \"}\r\n \r\n {\" \"}\r\n {\r\n menu.filter(\r\n (m) =>\r\n parseInt(selectedParent) === m.ParentID &&\r\n m.IsSelected\r\n )[0]?.ParentName\r\n }\r\n \r\n
\r\n \r\n This will tailor your app experience, showing you the type of\r\n product most suited to you.{\" \"}\r\n
\r\n \r\n Choose Shopping Preference Description\r\n
\r\n \r\n {menu &&\r\n menu.map((m, firstIndex) => {\r\n return (\r\n \r\n ChangeParent(m.ParentID, m.ParentName)\r\n }\r\n >\r\n \r\n {m.ParentName}\r\n \r\n
\r\n \r\n select your country\r\n
\r\n \r\n {countries &&\r\n countries.map((m, firstIndex) => {\r\n return (\r\n ChangeCountry(m.CountryCode)}\r\n >\r\n \r\n {m.CountryName}\r\n \r\n
\r\n