\n
\n \n );\n })}\n \n \n \n );\n};\n\nexport default ProductRender;\n","import React, { useEffect, useRef, useState } from 'react';\nimport { connect } from 'react-redux';\nimport { Row, Col } from 'react-bootstrap';\nimport { StaticQuery, graphql } from 'gatsby';\nimport { toast } from 'react-toastify';\n\nimport Model from '../components/model';\nimport Loader from '../components/Loader';\nimport Layout from '../components/layout';\nimport SEO from '../components/Seo';\nimport StepList from '../components/StepList';\nimport PriceWidget from '../components/steps/PriceWidget';\nimport PrivateRoute from '../components/auth/protected';\nimport { fetchItemConfigs } from '../state/itemConfigs/thunks';\nimport {\n setItemType,\n setMaterial,\n setPolish,\n} from '../state/create/jewelry/thunks';\nimport CustomProgressBar from '../components/ProgressBar';\nimport 'react-toastify/dist/ReactToastify.css';\nimport Banner from '../components/Banner';\nimport ProductRender from '../components/ProductRender';\nimport {\n isProductChosen,\n setSelectedProduct,\n} from '../state/create/jewelry/actions';\n\nconst ModelPage = ({\n file,\n fileName,\n isLoading,\n fetchItemConfigs,\n setMaterial,\n setPolish,\n profile,\n loadProgress,\n fileDimensionError,\n model_height,\n model_width,\n model_length,\n new_order,\n selectedProduct,\n productChosen,\n quantity,\n isProductChosen,\n setSelectedProduct,\n setItemType,\n itemConfigs,\n}) => {\n const modelRef = useRef();\n const [itmConfs, setItmConf] = useState([])\n\n const fetchAllItemConfigs = async () => {\n const itemConfigss = await fetchItemConfigs();\n setItmConf(itemConfigss)\n\n const variants = itemConfigss.map((itemConfig) => itemConfig.variant);\n\n const sterlingSilver = variants.find(\n (variant) => variant.code.toLowerCase() === 'ssa1'\n );\n\n const noPolish = variants.find(\n (variant) => variant.code.toLowerCase() === 'satin polish'\n );\n\n setMaterial(productChosen ? null : sterlingSilver);\n setPolish(productChosen ? null : noPolish);\n };\n\n useEffect(() => {\n if (itmConfs.length === 0) {\n fetchAllItemConfigs();\n }\n }, [productChosen]);\n\n useEffect(() => {\n if (document) {\n document.body.classList.add('gradient');\n return () => document.body.classList.remove('gradient');\n }\n }, []);\n\n const showError = () => toast.error('That file is not supported');\n\n const query = graphql`\n query {\n wordpressWpMessage(wordpress_id: { eq: 409 }) {\n id\n title\n content\n }\n }\n `;\n\n const [productPricing, setProductPricing] = useState(null);\n const [materialPrice, setMatPrice] = useState(null);\n const [platingPrice, setPlatingPrice] = useState(null);\n const [polishPrice, setPolishPrice] = useState(null);\n const [assemblyPrice, setAssemblyPrice] = useState(null);\n const [laserEngravingPrice, setLaserEngravingPrice] = useState(null);\n const [itemPrice, setItemPrice] = useState(null);\n\n const [showQtyNotification, setShowQtyNotification] = useState(false);\n const [msgQtyNotif, setMsgQtyNotif] = useState(null);\n const [unlockDiscount, setUnlockDiscount] = useState(false);\n\n const prodDiscount = selectedProduct\n ? selectedProduct.has_discount\n ? JSON.parse(selectedProduct.discount)\n : null\n : null;\n\n let assemblyDiscount = 0;\n if (selectedProduct) {\n if (selectedProduct.has_discount) {\n for (const discount of prodDiscount) {\n if (quantity >= discount.quantity) {\n assemblyDiscount = discount.discount;\n }\n }\n }\n }\n\n const disPrice = productPricing - (assemblyDiscount / 100) * productPricing;\n\n const totalProductPrice =\n disPrice +\n materialPrice +\n platingPrice +\n polishPrice +\n assemblyPrice +\n laserEngravingPrice;\n\n useEffect(() => {\n if (!productPricing && productChosen) {\n isProductChosen(false);\n setSelectedProduct(null);\n setItemType(null);\n }\n }, [productChosen]);\n\n return (\n \n
\n ) : null}\n {fileDimensionError && !isLoading && (\n <>\n \n
\n {/* {!new_order && ( */}\n \n Your 3D Model is too small to calculate the price.\n Please check the 3D model and try again or Design It\n With Us as your design is not optimized for production.\n Please email hello@gildform.com for further assistance.{' '}\n
\n\n
\n {/* )} */}\n \n )}\n {!isLoading &&\n !fileDimensionError &&\n // !new_order &&\n model_height &&\n model_width &&\n model_length ? (\n \n Width:\n {model_width} mm\n
\n \n Height:\n {model_height} mm\n
\n \n Length:\n {model_length} mm\n
\n \n
\n ) : null}\n \n )}\n \n Width:\n {model_width} mm\n
\n \n Height:\n {model_height} mm\n
\n \n Length:\n {model_length} mm\n
\n Loading (StaticQuery)
\n }\n }}\n \n {secondaryButtons &&\n secondaryButtons.map((button, index) => (\n \n {button.title}\n \n ))}\n
\n \n {primaryButtons &&\n primaryButtons.map((button, index) => (\n \n {button.isLoading ? (\n \n ) : (\n button.title\n )}\n \n ))}\n
\n \n ) : (\n <>\n {dangerButtons &&\n dangerButtons.map((button, index) => (\n \n ))}\n {secondaryButtons &&\n secondaryButtons.map((button, index) => (\n Discount Code
\n \n {\n props.setPromoCode(e.target.value);\n }}\n />\n
\n \n {props.promoCode && (\n \n Discount code is not valid!\n
\n ) : (\n <>\n {props.restrictionCoupon ? (\n props.applyDis ? (\n \n {props.matchedCode.coupon.percent_off\n ? `${props.matchedCode.coupon.percent_off}% `\n : `${props.matchedCode.coupon.amount_off / 100}$ `}\n discount is applied!\n {props.matchedCode.coupon.percent_off == 100 && (\n
\n ) : (\n A minimum amount of $0.50 will be applied to your card.
\n )}\n \n coupon not applied: minimum of{' '}\n {props.matchedCode.restrictions.minimum_amount} order value\n was not met!\n
\n )\n ) : (\n \n {props.matchedCode.coupon.percent_off\n ? `${props.matchedCode.coupon.percent_off}% `\n : `${props.matchedCode.coupon.amount_off / 100}$ `}\n discount is applied!\n {props.matchedCode.coupon.percent_off == 100 && (\n
\n )}\n \n )}\n \n )}\n \n );\n};\n\nexport default DiscountCode;\n","import React, { useEffect } from 'react';\nimport jwtDecode from 'jwt-decode';\nimport { connect } from 'react-redux';\n\nimport { retrieveUser } from '../../state/login/thunks';\nimport { ShowLock } from '../../utils/auth0';\nimport { logout } from '../../state/login/action';\nimport { navigate } from '@reach/router';\n\nconst CheckJwt = (props) => {\n if (props.token) {\n const jwt = jwtDecode(props.token);\n const checkExpiry1 = jwt.exp < new Date() / 1000;\n // const checkExpiry2 = jwt.exp * 1000 < Date.now();\n\n if (checkExpiry1) {\n props.logout();\n ShowLock();\n }\n }\n\n useEffect(() => {\n if (window === void 0) {\n return;\n }\n // if (props.profile && props.profile.sub) {\n // props.getUser(props.profile.sub).catch((e) => {\n // if (!props.onCreate && e.status === 404) {\n // navigate(`/create`);\n // }\n // });\n // }\n }, []);\n\n return <>{props.children};\n};\n\nconst mapStateToProps = (state) => ({\n isAuthenticated: state.login.isAuthenticated,\n token: state.login.auth && state.login.auth.auth.accessToken,\n lastChecked: state.login.lastChecked,\n});\n\nconst mapDispatchToProps = (dispatch) => ({\n logout: () => dispatch(logout()),\n getUser: (userID) => dispatch(retrieveUser(userID)),\n});\n\nexport default connect(mapStateToProps, mapDispatchToProps)(CheckJwt);\n","module.exports = __webpack_public_path__ + \"static/noimage-0383a250e987fe737edbf2518f208bc7.jpg\";","import React from 'react';\n\nexport default ({ msg, format }) => (\n A minimum amount of $0.50 will be applied to your card.
\n )}\n \n \n
\n);\n","module.exports = \"data:image/png;base64,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\"","import {\n FETCHING_PRICE,\n SET_PRICE,\n RESET_PRICE,\n SET_PRICE_ASSEMBLY,\n} from '../../actionTypes';\n\nexport const fetchingPrice = () => ({\n type: FETCHING_PRICE,\n});\n\nexport const getPrice = (price) => ({\n type: SET_PRICE,\n price,\n});\n\nexport const getPriceAssembly = (price) => ({\n type: SET_PRICE_ASSEMBLY,\n price,\n});\n\nexport const resetPrice = () => ({\n type: RESET_PRICE,\n});\n","module.exports = __webpack_public_path__ + \"static/creditkey-logo-2ac01a6dffba63f9437c40ec6d4e87a4.png\";","import React from 'react';\nimport { Overlay, Tooltip } from 'react-bootstrap';\n\nconst CustomTooltip = (props) => {\n const usualTxt = `You have no permission to perform this action.\n Please talk to your admin for more details!`;\n return (\n {msg}
\n{child}
;\n });\n\n const sliderDirection = direction || 'left';\n const className = `slider ${sliderDirection}`;\n\n return {child}
;\n};\n\nexport default Slider;\n","import React, { useEffect, useRef, useState } from 'react';\nimport { Form } from 'react-bootstrap';\n\nimport CreditCardInfo from './creditcard/CreditCardModal';\nimport { getMembershipPlans } from '../utils/api';\nimport Modal from './Modal';\nimport Slider from './Slider';\nimport DiscountCode from './DiscountCode';\nimport CustomTooltip from './Tooltip';\n\nconst ChoiceCard = ({\n isSelected,\n onSelect,\n title,\n content,\n price,\n billed,\n item,\n setPlans,\n plans,\n showToggle,\n _setSelectedPlan,\n}) => {\n const def = () => false;\n const [tooltipOpen, setTooltipOpen] = useState(false);\n const membershipTarget = useRef(null);\n\n const className = `card option col-md-4 col-12 px-0 mx-1 ${\n isSelected\n ? 'selected bg-primary border-primary'\n : item.interval === 'year'\n ? 'year'\n : ''\n }`;\n\n const bodyClass = `card-body ${isSelected ? 'bg-white' : ''} `;\n\n const onChange = (selectedItem) => {\n const found = plans.find(\n (member) =>\n member.id !== selectedItem.id && member.product === selectedItem.product\n );\n const tt = plans.map((mmb) => {\n if (mmb.id === selectedItem.id) {\n return {\n ...mmb,\n showWhenToggled: false,\n toggled: mmb.interval === 'year' ? true : false,\n };\n } else if (mmb.id === found.id) {\n return {\n ...mmb,\n showWhenToggled: true,\n toggled: mmb.interval === 'year' ? true : false,\n };\n } else {\n return { ...mmb, toggled: mmb.toggled ? true : false };\n }\n });\n setPlans(tt);\n setTimeout(() => {\n _setSelectedPlan({});\n }, 300);\n };\n\n return (\n \n
\n );\n};\n\nconst getPrice = (plan) => {\n return plan.amount > 0 ? `$ ${(plan.amount / 100).toFixed(2)}` : 'Free';\n};\n\nexport default (props) => {\n const showCard = props.showCard !== void 0 ? props.showCard : true;\n const editProfile = props.editProfile !== void 0 ? props.editProfile : true;\n\n const [slide, slideNumber] = useState(0);\n const [loading, setLoading] = useState(false);\n const [loadingSubmission, isLoadingSubmission] = useState(false);\n const [isMemValid, setMemIsValid] = useState(false);\n const [plans, setPlans] = useState([]);\n const [stripe, setStripe] = useState(null);\n const [cardError, setCardError] = useState(undefined);\n const [selectedMb, setSelMb] = useState(null);\n\n const fetchMemberships = async () => {\n setLoading(true);\n const memberships = await getMembershipPlans();\n const ttt = memberships.data\n .filter((it) => Object.keys(it.metadata).length !== 0)\n .map((it) => {\n if (it.interval === 'year') {\n return {\n ...it,\n showWhenToggled: false,\n toggled: false,\n showToggle: true,\n sort: it.metadata.nickname.includes('Silver') ? 1 : 2,\n };\n } else {\n return {\n ...it,\n showWhenToggled: true,\n toggled: false,\n showToggle: it.metadata.nickname.includes('Standa') ? false : true,\n sort: it.metadata.nickname.includes('Silver')\n ? 1\n : it.metadata.nickname.includes('Gold')\n ? 2\n : 0,\n };\n }\n });\n setPlans(ttt ? ttt : []);\n setLoading(false);\n };\n\n useEffect(() => {\n if (props.show) {\n fetchMemberships();\n }\n }, [props.show, props.erpMembershipContent]);\n\n const erpContent =\n props.erpMembershipContent &&\n props.erpMembershipContent.reduce((acc, tier) => {\n acc[tier.sku] = tier;\n return acc;\n }, {});\n\n console.log('erpContent', erpContent);\n\n const setSelectedPlan = (plan) => {\n if (plan.id) {\n setMemIsValid(true);\n }\n props.set_SelectedPlan(plan);\n props.setChosen(plan);\n setSelMb(plan.metadata.nickname);\n };\n\n let back = [{ title: 'Back', handle: () => slideNumber(slide - 1) }];\n\n if (slide === 0) {\n back = [];\n }\n\n const handleNext = () => {\n if (showCard) {\n if (slide !== 1) {\n return [\n {\n title: 'Next',\n disabled: !isMemValid,\n handle: () => {\n if (isMemValid) {\n slideNumber(slide + 1);\n }\n },\n },\n ];\n }\n if (stripe) {\n return [\n {\n title: `Choose ${props.selectedPlan.metadata.nickname}`,\n disabled: !isMemValid,\n handle: async () => {\n if (!stripe) {\n return;\n }\n setCardError();\n const stripeResponse = await stripe.stripe.createToken(\n stripe.card\n );\n\n if (stripeResponse.error) {\n setCardError(stripeResponse.error.message);\n return;\n }\n isLoadingSubmission(true);\n props.submitMembership(\n stripeResponse.token.id,\n props.selectedPlan\n );\n isLoadingSubmission(false);\n slideNumber(0);\n },\n },\n ];\n }\n }\n\n return [\n editProfile\n ? {\n title:\n props.selectedPlan &&\n Object.entries(props.selectedPlan).length !== 0 ? (\n !props.loading ? (\n `Choose ${\n props.selectedPlan && props.selectedPlan.metadata\n ? props.selectedPlan.metadata.nickname\n : props.selectedPlan.nickname\n }`\n ) : (\n \n )\n ) : (\n 'Choose one'\n ),\n handle: () => {\n isLoadingSubmission(true);\n props.submitMembership('', props.selectedPlan);\n isLoadingSubmission(false);\n slideNumber(0);\n },\n disabled:\n (props.selectedPlan &&\n Object.entries(props.selectedPlan).length === 0) ||\n (props.review ? false : !props.cardInfo),\n }\n : {\n title: `Choose ${props.selectedPlan.metadata.nickname}`,\n handle: () => {\n isLoadingSubmission(true);\n props.submitMembership('', props.selectedPlan);\n isLoadingSubmission(false);\n slideNumber(0);\n },\n disabled: Object.entries(props.selectedPlan).length === 0,\n },\n ];\n };\n\n const handleClose = () => {\n props.handleClose();\n slideNumber(0);\n };\n console.log('plans', plans);\n return (\n \n {showToggle && (\n
\n \n onChange(item)}\n ref={membershipTarget}\n onMouseEnter={() => setTooltipOpen(true)}\n onMouseLeave={() => setTooltipOpen(false)}\n >\n \n \n
\n )}\n {title}
\n\n
\n \n {price === 'Free' ? `${price}` : `${price} billed every ${billed}`}\n
\n \n {!loading ? (\n <>\n {plans\n .sort((a, b) => a.sort - b.sort)\n .map((plan, index) => {\n const wpContent = erpContent && erpContent[plan.id];\n if (wpContent && plan.showWhenToggled) {\n return (\n setSelectedPlan(plan)}\n billed={plan.interval}\n key={index}\n item={plan}\n setPlans={setPlans}\n plans={plans}\n showToggle={plan.showToggle}\n _setSelectedPlan={props.set_SelectedPlan}\n />\n );\n }\n })}\n \n ) : (\n \n )}\n
\n {showCard ? (\n \n \n {cardError}\n \n )}\n
\n ) : null}\n Enter Credit Card information
\n\n You will be charged $\n {props.matchedCode\n ? props.selectedPlan\n ? Number(\n (props.selectedPlan.amount || 0) / 100 -\n (props.matchedCode.coupon.percent_off\n ? (Number(props.matchedCode.coupon.percent_off) /\n 100) *\n ((props.selectedPlan.amount || 0) / 100)\n : props.matchedCode.coupon.amount_off / 100)\n ).toFixed(2)\n : 0\n : (\n (props.selectedPlan ? props.selectedPlan.amount : 0 || 0) /\n 100\n ).toFixed(2)}\n
\n {cardError !== void 0 && (\n\n setShow(true)}\n // onMouseLeave={() => setShow(false)}\n >\n {children}\n
\n \n );\n}\n","import React, { useState, useEffect } from 'react';\nimport { connect } from 'react-redux';\nimport { Form } from 'react-bootstrap';\n\nimport Loader from '../Loader';\nimport { getShippingOptions, getShippmentRates } from '../../utils/api';\nimport { debounceCustom } from '../../utils/helpers';\n\nconst ShippingOptions = ({\n authToken,\n name,\n value,\n onChange,\n isValid,\n isInvalid,\n handleBlur,\n values,\n items,\n phone,\n addressChange,\n countryChange,\n setAddressChange,\n setCountryChange,\n shippingAddresses,\n shippingRates,\n rateFetched,\n setFetchRates,\n setRates,\n}) => {\n const [shippingOptions, setShippingOptions] = useState(null);\n\n const getAllShippingOptions = async () => {\n const data = await getShippingOptions(authToken);\n setShippingOptions(data);\n };\n\n const fetchShippmentRates = debounceCustom(async (data) => {\n setFetchRates(0);\n const res = await getShippmentRates(data, authToken);\n if (res.status === 'SUCCESS') {\n if (res.rates.length !== 0) {\n setFetchRates(1);\n }\n setRates(res.rates);\n setAddressChange(false);\n setCountryChange(false);\n } else {\n setFetchRates(2);\n setAddressChange(false);\n setCountryChange(false);\n }\n }, 100);\n\n useEffect(() => {\n setTimeout(() => {\n getAllShippingOptions();\n }, 100);\n }, []);\n\n useEffect(() => {\n if (countryChange || addressChange) {\n let debouncer = setTimeout(() => {\n let data = {\n city: shippingAddresses.city,\n address1: shippingAddresses.address,\n state: shippingAddresses.state && Number(shippingAddresses.state),\n country: shippingAddresses.country && Number(shippingAddresses.country),\n zipcode: shippingAddresses.zipcode,\n name: values.firstName + ' ' + values.lastName,\n items,\n phone: phone,\n }\n fetchShippmentRates({\n city: shippingAddresses.city,\n address1: shippingAddresses.address,\n state: shippingAddresses.state && Number(shippingAddresses.state),\n country: shippingAddresses.country && Number(shippingAddresses.country),\n zipcode: shippingAddresses.zipcode,\n name: values.firstName + ' ' + values.lastName,\n items,\n phone: phone,\n });\n }, 3500);\n\n return () => {\n clearTimeout(debouncer);\n };\n }\n }, [countryChange, addressChange]);\n\n\n if (rateFetched === 2) {\n return shippingOptions ? (\n \n {text}\n \n {\n if (priceTooltip) {\n setShowQtyNotification(false);\n } else {\n setHide(true);\n }\n }}\n />\n
\n \n \n Checking your shipping options\n \n
\n );\n }\n};\n\nconst mapStateToProps = (state) => ({\n authToken: state.login.auth && state.login.auth.auth.accessToken,\n checkout: state.checkout.shipping,\n});\n\nexport default connect(mapStateToProps)(ShippingOptions);\n","import React, { useEffect, useState } from 'react';\nimport { Form } from 'react-bootstrap';\nimport { connect } from 'react-redux';\nimport SalesTax from 'sales-tax';\nimport CountryDropdown from '../CountryDropdown';\nimport StateDropdown from '../StateDropdown';\nimport ShippingMethods from './ShippingMethods';\nimport { useSearchDebounce } from './ShippingInfo';\n\nconst ShippingInfoForm = ({\n values,\n onChange,\n handleChange,\n setShippingValues,\n setValues,\n handleBlur,\n errors,\n touched,\n shipping,\n updateSalesTax,\n cart,\n setFieldValue,\n shippoId,\n setShippoId,\n setShippingRate,\n setShippoMethod,\n setShippoToken,\n setShippoCarrier,\n setShippoEstimatedDelivery,\n cartItems,\n phone,\n shippingRates,\n rateFetched,\n setFetchRates,\n setRates,\n profile,\n type,\n shipTo,\n}) => {\n const [addressChange, setAddressChange] = useState(false);\n const [countryChange, setCountryChange] = useState(false);\n const [shippingAddresses, setShippingAddress] = useState({\n address: null,\n city: null,\n zipcode: null,\n state: null,\n country: null,\n });\n\n const isValid = (fieldName) => {\n return !errors[fieldName] && touched[fieldName];\n };\n const isInvalid = (fieldName) => {\n return errors[fieldName] && touched[fieldName];\n };\n\n const addressInput = useSearchDebounce(shippingAddresses.address, 500);\n const cityInput = useSearchDebounce(shippingAddresses.city, 500);\n\n useEffect(() => {\n setShippingAddress({\n ...shippingAddresses,\n address: addressInput,\n });\n setShippingValues({ ...values, address: addressInput });\n }, [addressInput]);\n useEffect(() => {\n setShippingAddress({\n ...shippingAddresses,\n city: cityInput,\n });\n setShippingValues({ ...values, city: cityInput });\n setTimeout(() => {\n setAddressChange(true);\n }, [2800]);\n }, [cityInput]);\n \n\n useEffect(() => {\n if (Object.keys(shipping).length === 0) {\n setValues({\n firstName: profile.firstName,\n lastName: profile.lastName,\n email: profile.email,\n country: profile.address.country,\n state: profile.address.state,\n address: `${profile.address.address1} ${profile.address.address2 ? `,${profile.address.address2}` : ''\n }`,\n city: profile.address.city,\n zipcode: profile.address.zipcode,\n phone: profile.phone,\n });\n } else {\n setValues({ ...values, ...shipping });\n }\n }, [shipping]);\n\n useEffect(() => {\n setShippingValues(values);\n setShippingAddress({\n address: values.address,\n city: values.city,\n zipcode: values.zipcode,\n state: values.state,\n country: values.country,\n });\n }, [values]);\n\n const shippingAddress =\n profile.address.address1 + ', ' + profile.address.address2;\n\n useEffect(() => {\n if (shipTo === 'shipToMe') {\n onChange('firstName', profile.firstName);\n onChange('lastName', profile.lastName);\n onChange('email', profile.email);\n onChange('country', profile.address.country);\n onChange('address', shippingAddress);\n onChange('city', profile.address.city);\n onChange('state', profile.address.state);\n onChange('zipcode', profile.address.zipcode);\n onChange('phone', profile.phone);\n } else {\n onChange('billing_firstName', profile.firstName);\n onChange('billing_lastName', profile.lastName);\n onChange('billing_email', profile.email);\n onChange('billing_country', profile.address.country);\n onChange('billing_address', shippingAddress);\n onChange('billing_city', profile.address.city);\n onChange('billing_state', profile.address.state);\n onChange('billing_zipcode', profile.address.zipcode);\n onChange('billing_phone', profile.phone);\n onChange('firstName', '');\n onChange('lastName', '');\n onChange('email', '');\n onChange('country', undefined);\n onChange('address', '');\n onChange('city', '');\n onChange('state', undefined);\n onChange('zipcode', '');\n onChange('phone', '');\n }\n }, [shipTo]);\n const st = {\n height: '2.3rem',\n };\n\n return (\n \n );\n};\n\nconst mapStateToProps = (state) => ({\n shipping: state.checkout.shipping,\n profile: state.login.auth.profile,\n});\n\nexport default connect(mapStateToProps)(ShippingInfoForm);\n","import React, { useEffect, useState } from 'react';\nimport { connect } from 'react-redux';\n\nimport ShippingInfoForm from './ShippingInfoForm';\n\nexport const ConvertProfileToIntial = (profile) => {\n if (!profile) {\n return {\n state: 'AL',\n };\n }\n if (!profile.address) {\n return {\n state: 'AL',\n };\n }\n return {\n name: profile.name,\n email: profile.email,\n street: `${profile.address.street1} #${profile.address.street2}`,\n city: profile.address.city,\n zipcode: profile.address.zipcode,\n state: profile.address.state,\n country: profile.address.country,\n phone: profile.phone,\n };\n};\n\nexport function useSearchDebounce(value, milliSeconds) {\n const [debouncedValue, setDebouncedValue] = useState(value);\n\n useEffect(() => {\n const handler = setTimeout(() => {\n setDebouncedValue(value);\n }, milliSeconds);\n\n return () => {\n clearTimeout(handler);\n };\n }, [value, milliSeconds]);\n\n return debouncedValue;\n}\n\nconst ShippingInfo = ({\n onChange,\n shippingInfo,\n setIsValid,\n shipping,\n setValues,\n profile,\n touched,\n errors,\n values,\n setFieldValue,\n handleChange,\n handleBlur,\n cart,\n updateSalesTax,\n setShippingValues,\n setShippingRate,\n setShippoMethod,\n shippingRatePrice,\n shippoId,\n setShippoId,\n phone,\n shippingRates,\n rateFetched,\n setFetchRates,\n setRates,\n setShippoToken,\n setShippoCarrier,\n setShippoEstimatedDelivery,\n shipTo,\n setShipTo,\n ...props\n}) => {\n return (\n <>\n \n setShipTo('shipToMe')}\n >\n Ship To Me\n \n setShipTo('shipToCustomer')}\n >\n Ship To Customer\n \n
\n {shipTo === 'shipToMe' ? (\n \n \n Billing Address\n \n
\n \n \n Shipping Address\n \n
\n \n )}\n \n );\n};\n\nconst mapStateToProps = (state) => ({\n shipping: state.checkout.shipping,\n profile: state.login.auth.profile,\n});\n\nexport default connect(mapStateToProps)(ShippingInfo);\n","import React, { useEffect, useRef, useState } from 'react';\nimport { useSelector } from 'react-redux';\nimport {\n brandForgeTextComplete,\n getCurrentMonthUserBrandForgeMessages,\n} from '../utils/api';\nimport {\n clickHandler,\n errMessageBrandforge,\n formatDate,\n} from '../utils/helpers';\nimport CustomTooltip from './CustomTooltip';\nimport Prompts from './Prompts';\n\nexport const useAutosizeTextArea = (textAreaRef, value) => {\n useEffect(() => {\n if (textAreaRef) {\n textAreaRef.style.height = '36px';\n const scrollHeight = textAreaRef.scrollHeight;\n textAreaRef.style.height = scrollHeight + 'px';\n }\n }, [textAreaRef, value]);\n};\n\nexport const PopUpChat = (props) => {\n const [chatopen, setChatopen] = useState(false);\n const [msg, setMsg] = useState(null);\n const [messages, setMessages] = useState([\n {\n id: 0,\n ai_text: `Hi there, I am BRANDFORGE™, Gildform's AI-powered assistant designed to help you build and grow your brand from concept to production and beyond.\\nHow can I help?`,\n user_text: null,\n },\n ]);\n const [msgLoader, setMsgLoader] = useState(false);\n const [errMsg, setErrMsg] = useState(false);\n const [msgsLength, setMsgsLength] = useState(0);\n const [openPrompts, setOpenPrompts] = useState(false);\n\n const chatBoxRef = useRef(null);\n const textAreaRef = useRef(null);\n\n useAutosizeTextArea(textAreaRef.current, msg);\n\n const profile = useSelector(\n (state) => state.login.auth && state.login.auth.profile\n );\n\n const isAuthenticated = useSelector(\n (state) => state.login && state.login.isAuthenticated\n );\n\n const toggle = () => {\n setChatopen(!chatopen);\n };\n\n const handleSend = async () => {\n setOpenPrompts(false);\n setMsg(null);\n let messageErr = {\n user_text: null,\n name: `${profile.firstName} ${profile.lastName}`,\n userId: profile.sub,\n error: true,\n };\n messages.push({\n ai_text: null,\n user_text: msg,\n name: `${profile.firstName} ${profile.lastName}`,\n userId: profile.sub,\n createdAt: formatDate(new Date(), true),\n });\n setMsgLoader(true);\n const data = {\n text: msg ? msg : '',\n userId: profile.sub,\n name: `${profile.firstName} ${profile.lastName}`,\n };\n const res = await brandForgeTextComplete(data);\n if (res.status === 200) {\n const dd = await res.json();\n setMsgsLength(msgsLength + 1);\n messages.pop();\n if (dd.brandForge) {\n setMessages([...messages, dd.brandForge]);\n }\n if (profile.membership.name === 'Standard') {\n if (messages.length + 1 >= 10) {\n setErrMsg(true);\n setMessages((prevState) => [\n ...prevState,\n {\n ...messageErr,\n ai_text: `\n \n \n
\n ) : null;\n};\n\nexport default PopUpChat;\n","import React, { useEffect, useState } from 'react';\nimport { getGildformStatuses } from '../utils/api';\n\nfunction Prompts(props) {\n const [selectedPrompt, setSelectedPompt] = useState(null);\n const [prompts, setPrompts] = useState([]);\n\n const getPrompts = async () => {\n const res = await getGildformStatuses(13);\n setPrompts(res.settings ? res.settings : []);\n };\n\n useEffect(() => {\n if (props.openPrompts && prompts.length === 0) {\n getPrompts();\n }\n }, [props.openPrompts]);\n\n return (\n \n
\n \n BrandForge Chat\n \n \n \n
\n \n {messages.map((msg, i) => (\n
\n \n {msg.user_text && (\n
\n ))}\n {msgLoader && (\n \n
\n )}\n {msg.ai_text && (\n {msg.user_text}
\n {msg.createdAt && (\n\n {formatDate(new Date(msg.createdAt), true)}\n
\n )}\n \n {msg.error ? (\n clickHandler(e, props.openMemberModal)}\n />\n ) : (\n
\n )}\n {msg.ai_text}
\n )}\n\n \n \n \n
\n )}\n \n
\n \n setMsg(e.target.value)}\n placeholder='Ask BrandForge...'\n ref={textAreaRef}\n rows={1}\n value={msg ? msg : ''}\n disabled={msgLoader || errMsg || disableSend}\n onKeyDown={(e) => {\n if (e.key === 'Enter') {\n if (msg && !errMsg && !disableSend) {\n handleSend();\n }\n }\n }}\n />\n \n \n \n
\n \n By using BrandForge™, you agree to our full disclaimer regarding the\n accuracy, applicability, and limitations of the AI assistant's\n advice, which can be found{' '}\n \n here\n \n .\n
\n \n
\n \n BrandForge\n 
\n
\n {\n props.setOpenPrompts(!props.openPrompts);\n if (!props.openPrompts) {\n setSelectedPompt(null);\n }\n }}\n >\n {props.openPrompts ? 'Hide prompts' : 'Show prompts'}\n
\n \n {props.openPrompts ? (\n \n ) : (\n \n )}\n
\n \n
\n \n \n );\n}\n\nexport default Prompts;\n","import React, { useState } from 'react';\nimport { graphql, useStaticQuery } from 'gatsby';\nimport { Container, Row } from 'react-bootstrap';\nimport { Link } from '@reach/router';\nimport gildformLogoBlack from '../images/gildformlogo-black.png';\nimport gildformLogo from '../images/logo.png';\nimport { isToggleOpen, setOpenToggle } from '../utils/helpers';\nimport WindoWidth from './WindowWidth';\n\nconst ActualLink = ({\n internal_link,\n link_text,\n external_link,\n link_column,\n idz,\n}) => {\n if (internal_link) {\n const linkParts = internal_link.split('/');\n const pageSlug = linkParts[linkParts.length - 1];\n const pageCategory = linkParts[linkParts.length - 2];\n if (pageCategory === 'designer') {\n return (\n \n {link_text}\n \n );\n }\n\n return (\n \n {link_text}\n \n );\n }\n\n return (\n \n {link_column.title === 'Social Media' && (\n \n {prompts\n .filter((it) => it.code === '1')\n .map((prompt, index) => (\n {\n setSelectedPompt(prompt);\n props.setMsg(prompt.value);\n }}\n >\n {prompt.value}\n
\n ))}\n \n
\n \n 
\n 
\n
\n \n
\n \n {rebrandFooterData.acf.link_columns_rebrand.map((item, index) => {\n return (\n
\n );\n })}\n \n \n 992 ? '' : `#${item.title.split(' ')[0]}`\n }\n role='button'\n aria-expanded='false'\n aria-controls='link1'\n onClick={() => {\n setOpenToggle(\n { id: index, toggle: !toggle.toggle },\n testToggle,\n setTestToggle\n );\n }}\n >\n {item.title}\n {isToggleOpen(index, testToggle) ? (\n \n ) : (\n \n )}\n
\n \n
\n \n {item.links.map((link) => (\n
\n \n
\n Copyright © {new Date().getFullYear()} Gildform\n
\n \n
\n ) : (\n \n )}\n \n {selectedProduct\n ? `${selectedProduct.name} ${item.material.name}`\n : item.itemType.name}\n
\n \n{item.description}
\n- \n {cart.items.map((item, ndx) => (\n
\n \n
\n );\n }}\n />\n );\n};\n\nconst mapStateToProps = (state) => ({\n creditOrder: state.checkout.creditOrder ? state.checkout.creditOrder : null,\n token: state.login.auth && state.login.auth.auth.accessToken,\n});\n\nconst mapDispatchToProps = (dispatch) => ({\n setPaymentMethod: (data) => dispatch(setPaymentMethod(data)),\n setCreditOrder: (data) => dispatch(setCreditOrder(data)),\n});\n\nexport default connect(mapStateToProps, mapDispatchToProps)(ShoppingCartStep);\n","import React, { useEffect, useState } from 'react';\nimport { Link, navigate } from 'gatsby';\nimport { Row, Col, Button } from 'react-bootstrap';\nimport { connect } from 'react-redux';\nimport { toast } from 'react-toastify';\n// import ck from 'creditkey-js';\n\nimport Cart from './CartContainer';\nimport CheckoutInfo from '../../utils/schemas/shippingSchema';\nimport ShoppingCartStep from './ShoppingCartStep';\nimport Payment from '../creditcard/CreditCardModal';\nimport Modal from '../../components/Modal';\nimport ShippingInfo, { ConvertProfileToIntial } from './ShippingInfo';\nimport {\n updateShippingInfo,\n shouldHideCart,\n shouldShowCart,\n setPaymentMethod,\n setCreditOrder,\n charging,\n charged,\n} from '../../state/checkout/actions';\nimport {\n clearCart,\n setTax,\n setShippingOption,\n showOfferCart as showOfferCartAction,\n hideOfferCart as hideOfferCartAction,\n setOrderCheckoutSuccessful as setOrderCheckoutSuccessfulAction,\n setOffersPurchased as setOffersPurchasedAction,\n setInitialOffers as setInitialOffersAction,\n} from '../../state/shoppingCart/actions';\nimport // addProductToCart as addProductToCartAction,\n '../../state/shoppingCart/thunks';\nimport { checkout } from '../../state/checkout/thunks';\n\nimport 'react-toastify/dist/ReactToastify.css';\nimport { addNewCard, updateBilling } from '../../state/login/thunks';\nimport CreditKey from '../creditcard/creditKey';\nimport {\n isProductChosen,\n openCreditCardCheckout,\n} from '../../state/create/jewelry/actions';\nimport {\n checkoutCart,\n checkoutOfferCart,\n getPromotionCodes,\n getShippmentRates,\n getUserOffers,\n uploadLaserEngravingImages,\n} from '../../utils/api';\nimport { isEmptyObj, assemblySubPrice } from '../../utils/helpers';\nimport noImage from '../../images/noimage.jpg';\n\nconst CREDIT_KEY = process.env.GATSBY_CREDIT_KEY;\nconst CREDIT_TOKEN = process.env.GATSBY_CREDIT_SECRET;\nconst CREDIT_KEY_URL = process.env.GATSBY_CREDIT_KEY_API_URL;\n\nconst FullCheckout = (props) => {\n const [stripe, setStripe] = useState(null);\n const [step, setStepState] = useState(0);\n const [payment, setPaymentOption] = useState('Default');\n const [shippingValues, setShippingValues] = useState(null);\n const [shipTo, setShipTo] = useState('shipToMe');\n\n const [isCardModalOpen, openCardModal] = useState(false);\n const [cardInfoLoad, setCardInfoLoad] = useState(false);\n const [cardErrors, setCardErrors] = useState(undefined);\n const [defaultCard, setDefaultCard] = useState(false);\n const [shippingRatePrice, setShippingRate] = useState(null);\n const [rateFetched, setFetchRates] = useState(1);\n\n const [shippoMethod, setShippoMethod] = useState(null);\n const [shippoId, setShippoId] = useState(null);\n const [shippoServiceToken, setShippoToken] = useState(null);\n const [shippoCarrier, setShippoCarrier] = useState(null);\n const [shippoEstimatedDelivery, setShippoEstimatedDelivery] = useState(null);\n\n const [shippingRates, setRates] = useState(null);\n\n const [promoCodes, setPromoCodes] = useState([]);\n const [promoCode, setPromoCode] = useState(null);\n\n const [offers, setOffers] = useState([]);\n const [timers, setTimers] = useState({});\n const [isTimeLimitReached, setTimeLimitReached] = useState({});\n const [isSubmittingOfferPayment, setIsSubmittingOfferPayment] = useState({\n id: null,\n isSubmitting: false,\n });\n\n const paymentOptions = ['Default', 'Credit-Key'];\n\n const [shouldShowCart, setState] = [\n props.shouldShowCart,\n (newState) => {\n if (newState === false) {\n return props.hideCart();\n }\n return props.showCart();\n },\n ];\n\n function matchPromoCode(givenCode, codes) {\n console.log('givenCode.trim() :>> ', givenCode.trim());\n console.log('codes :>> ', codes);\n return codes.find((cd) => cd.code.trim() == givenCode.trim());\n }\n\n const fetchPromoCodes = async () => {\n const res = await getPromotionCodes();\n setPromoCodes(res.data);\n };\n\n const fetchCustomerOffers = async () => {\n const res = await getUserOffers(15);\n if (res) {\n const filteredOffers = res.settings.filter((offer) => {\n const customers = offer.customers ? JSON.parse(offer.customers) : [];\n const memberships = offer.membership\n ? JSON.parse(offer.membership)\n : [];\n\n if (offer.customers || offer.membership) {\n const isApplicableToCustomer =\n customers.length > 0\n ? customers.find(\n (customer) =>\n customer.id === (props.profile && props.profile.erp_id)\n )\n : false;\n\n const isApplicableToMembership =\n memberships.length > 0\n ? memberships.find(\n (membership) =>\n membership.name ===\n (props.profile && props.profile.membership.name)\n )\n : false;\n\n return isApplicableToCustomer || isApplicableToMembership;\n } else {\n return true;\n }\n });\n\n const newArr = filteredOffers.map((item) => {\n return {\n id: item.id,\n name: item.name,\n description: item.description,\n membership: item.membership,\n image: item.type,\n price: item.value,\n stripe_payment_id: item.extra_info,\n time_limit: Number(item.code) * 60,\n customers: item.customers,\n createdAt: item.createdAt,\n updatedAt: item.updatedAt,\n };\n });\n\n const newTimers = {};\n newArr.forEach((offer) => {\n newTimers[offer.id] = Number(offer.time_limit);\n });\n setTimers(newTimers);\n props.setInitialOffers(newArr);\n setOffers(newArr);\n }\n };\n\n useEffect(() => {\n if (Number(step) === 2) {\n fetchCustomerOffers();\n }\n return () => {\n Object.values(timers).forEach((timer) => clearInterval(timer));\n };\n }, [props.orderCheckoutSuccessful, step]);\n\n useEffect(() => {\n if (Number(step) === 3) {\n Object.keys(timers).forEach((offerId) => {\n if (Number(timers[offerId]) === 0 && !isTimeLimitReached[offerId]) {\n setTimeLimitReached((prevIsTimeLimitReached) => ({\n ...prevIsTimeLimitReached,\n [offerId]: true,\n }));\n }\n });\n }\n }, [timers, step]);\n\n useEffect(() => {\n if (!isEmptyObj(timers) && props.shouldShowOfferCart) {\n const timer = setInterval(() => {\n setTimers((prevTimers) => {\n const updatedTimers = { ...prevTimers };\n Object.keys(updatedTimers).forEach((offerId) => {\n updatedTimers[offerId] = Math.max(updatedTimers[offerId] - 1, 0);\n });\n return updatedTimers;\n });\n }, 1000);\n\n if (Object.values(timers).every((val) => Number(val) === 0)) {\n clearInterval(timer);\n return;\n }\n\n return () => {\n clearInterval(timer);\n };\n }\n });\n\n useEffect(() => {\n if (promoCodes.length === 0 && Number(step) === 1) {\n fetchPromoCodes();\n }\n }, [step]);\n\n useEffect(() => {\n if (props.checkout && Number(step) === 1) {\n if (props.checkout.isCharging) {\n props.setCharged();\n }\n }\n }, [props.checkout, step]);\n\n const matchedCode =\n promoCode &&\n matchPromoCode(\n promoCode,\n promoCodes.filter((cd) => cd.coupon.name.includes('Production'))\n );\n\n const collectCardInfo = async () => {\n setCardInfoLoad(true);\n setCardErrors(undefined);\n const stripeResponse = await stripe.stripe.createToken(stripe.card);\n if (stripeResponse.error) {\n setCardErrors(stripeResponse.error);\n return;\n }\n const tok = stripeResponse.token.id;\n await props.updateBilling(\n props.profile.subUser ? props.profile.admin_id : props.profile.id,\n tok\n );\n setCardInfoLoad(false);\n openCardModal(false);\n props.setOpenCreditCard(false);\n };\n\n const PaymentDetailsCard = (payment) => {\n switch (payment) {\n case 'Default':\n return props.profile && props.profile.cardInfo ? (\n {cardErrors.message}
}\n \n\n Please enter your credit card information!\n
\n \n {\n openCardModal(true);\n props.setOpenCreditCard(true);\n }}\n >\n Enter Credit Card info\n \n
\n \n );\n // case 'Credit-Key':\n // return (\n // \n
\n );\n }\n return Steps[step];\n };\n\n const showOrHideOfferCart = (showCart) => {\n if (showCart) {\n props.showOfferCart();\n } else {\n props.hideOfferCart();\n props.clearCart();\n props.setOrderCheckoutSuccessful(false);\n setDefaultCard(false);\n // setOfferCartStep(1);\n }\n };\n\n const showOfferCart = () => {\n const buttonDisableTitleAndClassName = (item) => {\n const itemPurchased =\n props.purchasedOffers &&\n props.purchasedOffers.length > 0 &&\n props.purchasedOffers.find((prod) => prod.id === item.id);\n if (\n isSubmittingOfferPayment.id === item.id &&\n isSubmittingOfferPayment.isSubmitting\n ) {\n return {\n className: 'checkout',\n disabled: true,\n title: ,\n };\n } else {\n if (itemPurchased) {\n return { className: 'checkout', disabled: true, title: 'Added' };\n } else {\n return {\n className: 'checkout add-prod',\n disabled: false,\n title: '+ Add',\n };\n }\n }\n };\n\n return (\n step === 3 && (\n \n \n
\n |
\n \n
\n \n {\n if (props.checkout) {\n if (props.checkout.isCharging) {\n props.setCharged();\n }\n }\n props.hideCart();\n }}\n >\n Get Started\n \n \n
\n
\n Looks like there is nothing in your cart
\n \nUpload an STL file below to start creating your piece
\n \n\n {/* {offerCartStep === 1 ? ( */}\n <>\n
\n \n \n
\n |
\n \n {props.initialOffers.map((prod, index) => (\n \n
\n Check out some of our offers
\n \n\n {isTimeLimitReached[prod.id] ? (\n \n Offer Expired\n \n ) : (\n \n Expires in: {Math.floor(timers[prod.id] / 60)}:\n {(timers[prod.id] % 60).toString().padStart(2, '0')}\n \n )}\n
\n \n \n {prod.description}\n
\n \n {prod.image ? (\n \n 
\n )}\n
\n \n \n {prod.name}\n
\n \n \n {`$${prod.price}`}\n
\n \n {\n submitOfferProductPayment(prod);\n }}\n >\n {buttonDisableTitleAndClassName(prod).title}\n \n
\n \n ))}\n \n \n\n \n {\n props.hideOfferCart();\n props.setOrderCheckoutSuccessful(false);\n props.setInitialOffers([]);\n navigate('/order-confirmation/thankyou');\n }}\n >\n No, I don't want these offers\n \n
\n \n \n )\n );\n };\n\n const showCartCondition = shouldShowCart || props.shouldShowOfferCart;\n\n return (\n \n
\n {wpData && wpData.length > 0 && (\n \n Content loading \n
\n ) : (\n <>\n {wpData && wpData.length > 0 ? (\n <>\n {wpData.map((wp, idx) => {\n return (\n \n ‣ There are{' '}\n {wpData && wpData.length} new updates you should check out!\n
\n )}\n {wpLoading ? (\n \n <>\n
\n );\n })}\n \n ) : (\n \n \n 🎉\n \n {wp.acf && wp.acf.feature_title}\n
\n \n 
\n
\n \n {wp.acf && wp.acf.feature_description\n ? removeTags(wp.acf.feature_description)\n : ''}\n
\n \n No updates!
\n )}\n \n )}\n \n \n );\n};\n\nexport default WhatsNew;\n","import React, { useEffect, useState } from 'react';\nimport { Link } from 'gatsby';\nimport PropTypes from 'prop-types';\nimport { connect } from 'react-redux';\nimport { useStaticQuery, graphql } from 'gatsby';\n\nimport CartDisplay from './cart';\nimport Login from './header/Login';\nimport Profile from './header/Profile';\nimport Signup from './header/Signup';\nimport WhatsNew from './WhatsNew';\nimport newFeature from '../images/new_feat.png';\n\nconst getNavInfo = (data) => {\n if (data.allWordpressWpApiMenusMenusItems.edges.length <= 0) {\n return [];\n }\n return data.allWordpressWpApiMenusMenusItems.edges[0].node.items;\n};\n\nconst renderNavLink = (component) => {\n if (component.type === 'custom') {\n return (\n \n {component.title}\n \n );\n }\n return (\n \n {component.title}\n \n );\n};\n\nconst Header = ({\n light_header,\n backgroundImage,\n sit_on_top,\n onboarding,\n noAnswers,\n siteTitle,\n}) => {\n const data = useStaticQuery(graphql`\n query {\n allWordpressWpApiMenusMenusItems(filter: { slug: { eq: \"nav-bar\" } }) {\n edges {\n node {\n slug\n name\n items {\n title\n url\n object_slug\n type\n }\n }\n }\n }\n }\n `);\n\n // const headerData = [\n // {\n // object_slug: 'learn',\n // title: 'Learn',\n // type: 'custom',\n // url: 'https://academy.gildform.com',\n // },\n // {\n // object_slug: 'our-story',\n // title: 'Our Story',\n // type: 'post_type',\n // url: 'https://content.gildform.com/archives/marketing_page/our-story',\n // },\n // {\n // object_slug: 'why-gildform',\n // title: 'Why Gildform',\n // type: 'custom',\n // url: '#',\n // },\n // {\n // object_slug: 'blog',\n // title: 'Blog',\n // type: 'custom',\n // url: 'http://blog.gildform.com',\n // },\n // {\n // object_slug: 'help-center',\n // title: 'Help Center',\n // type: 'custom',\n // url: 'https://support.gildform.com/',\n // },\n // ];\n\n const [width, setWidth] = useState();\n useEffect(() => {\n if (window) {\n setWidth(window.innerWidth);\n }\n }, []);\n\n const isPhoneScreen = width < 768;\n const isTabletScreen = width > 768 && width < 992;\n const navbarType = light_header ? 'navbar-dark' : 'navbar-light';\n const hasBackgroundImg = backgroundImage ? 'bg-nav' : '';\n const sitOnTop = sit_on_top ? 'sit-on-top' : '';\n const navbarclass = `navbar navbar-expand-lg ${navbarType} ${hasBackgroundImg} ${sitOnTop}`;\n const logo = light_header ? '/images/logo_white.png' : '/images/logo.svg';\n const logoClass = light_header ? 'navbar-brand light' : 'navbar-brand';\n const backgroundImageUrl = `url(${backgroundImage})`;\n const styleHeader = () => {\n if (onboarding) {\n return { backgroundColor: 'rgba(124, 98, 98, .97)', zIndex: 4 };\n } else if (noAnswers) {\n if (isPhoneScreen) {\n return { zIndex: 4, top: '60px' };\n } else if (isTabletScreen) {\n return { zIndex: 4, top: '38px' };\n } else {\n return { zIndex: 4, top: '30px' };\n }\n } else {\n return { zIndex: 4 };\n }\n };\n\n const [openNewFeat, setOpenNewFeature] = useState(false);\n const [newFeats, setNewFeats] = useState(null);\n\n return (\n \n {\n setTimeout(() => {\n setOpenNewFeature(true);\n }, 400);\n }}\n className='new-feat-icon'\n >\n {newFeats && (\n \n {newFeats}\n \n )}\n \n 
\n \n
\n \n
\n );\n};\n\nexport default Banner;\n","module.exports = \"data:image/png;base64,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\"","import React from 'react';\nvar TabContext = React.createContext(null);\nexport default TabContext;","import _extends from \"@babel/runtime/helpers/esm/extends\";\nimport _inheritsLoose from \"@babel/runtime/helpers/esm/inheritsLoose\";\nimport React from 'react';\nimport uncontrollable from 'uncontrollable';\nimport TabContext from './TabContext';\nimport SelectableContext from './SelectableContext';\n\nvar TabContainer =\n/*#__PURE__*/\nfunction (_React$Component) {\n _inheritsLoose(TabContainer, _React$Component);\n\n function TabContainer() {\n var _this;\n\n for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {\n args[_key] = arguments[_key];\n }\n\n _this = _React$Component.call.apply(_React$Component, [this].concat(args)) || this;\n\n _this.getControlledId = function (key) {\n return _this.getKey(key, 'tabpane');\n };\n\n _this.getControllerId = function (key) {\n return _this.getKey(key, 'tab');\n };\n\n _this.state = {\n tabContext: {\n onSelect: _this.props.onSelect,\n activeKey: _this.props.activeKey,\n transition: _this.props.transition,\n mountOnEnter: _this.props.mountOnEnter,\n unmountOnExit: _this.props.unmountOnExit,\n getControlledId: _this.getControlledId,\n getControllerId: _this.getControllerId\n }\n };\n return _this;\n }\n\n TabContainer.getDerivedStateFromProps = function getDerivedStateFromProps(_ref, prevState) {\n var activeKey = _ref.activeKey,\n mountOnEnter = _ref.mountOnEnter,\n unmountOnExit = _ref.unmountOnExit,\n transition = _ref.transition;\n return {\n tabContext: _extends({}, prevState.tabContext, {\n activeKey: activeKey,\n mountOnEnter: mountOnEnter,\n unmountOnExit: unmountOnExit,\n transition: transition\n })\n };\n };\n\n var _proto = TabContainer.prototype;\n\n _proto.getKey = function getKey(key, type) {\n var _this$props = this.props,\n generateChildId = _this$props.generateChildId,\n id = _this$props.id;\n if (generateChildId) return generateChildId(key, type);\n return id ? id + \"-\" + type + \"-\" + key : null;\n };\n\n _proto.render = function render() {\n var _this$props2 = this.props,\n children = _this$props2.children,\n onSelect = _this$props2.onSelect;\n return React.createElement(TabContext.Provider, {\n value: this.state.tabContext\n }, React.createElement(SelectableContext.Provider, {\n value: onSelect\n }, children));\n };\n\n return TabContainer;\n}(React.Component);\n\nexport default uncontrollable(TabContainer, {\n activeKey: 'onSelect'\n});","import _extends from \"@babel/runtime/helpers/esm/extends\";\nimport _objectWithoutPropertiesLoose from \"@babel/runtime/helpers/esm/objectWithoutPropertiesLoose\";\nimport _inheritsLoose from \"@babel/runtime/helpers/esm/inheritsLoose\";\nimport classNames from 'classnames';\nimport React from 'react';\nimport { createBootstrapComponent } from './ThemeProvider';\n\nvar TabContent =\n/*#__PURE__*/\nfunction (_React$Component) {\n _inheritsLoose(TabContent, _React$Component);\n\n function TabContent() {\n return _React$Component.apply(this, arguments) || this;\n }\n\n var _proto = TabContent.prototype;\n\n _proto.render = function render() {\n var _this$props = this.props,\n bsPrefix = _this$props.bsPrefix,\n Component = _this$props.as,\n className = _this$props.className,\n props = _objectWithoutPropertiesLoose(_this$props, [\"bsPrefix\", \"as\", \"className\"]);\n\n return React.createElement(Component, _extends({}, props, {\n className: classNames(className, bsPrefix)\n }));\n };\n\n return TabContent;\n}(React.Component);\n\nTabContent.defaultProps = {\n as: 'div'\n};\nexport default createBootstrapComponent(TabContent, 'tab-content');","import _extends from \"@babel/runtime/helpers/esm/extends\";\nimport _objectWithoutPropertiesLoose from \"@babel/runtime/helpers/esm/objectWithoutPropertiesLoose\";\nimport classNames from 'classnames';\nimport React, { useContext } from 'react';\nimport { useBootstrapPrefix } from './ThemeProvider';\nimport TabContext from './TabContext';\nimport SelectableContext, { makeEventKey } from './SelectableContext';\nimport Fade from './Fade';\n\nfunction useTabContext(props) {\n var context = useContext(TabContext);\n if (!context) return props;\n\n var activeKey = context.activeKey,\n getControlledId = context.getControlledId,\n getControllerId = context.getControllerId,\n rest = _objectWithoutPropertiesLoose(context, [\"activeKey\", \"getControlledId\", \"getControllerId\"]);\n\n var shouldTransition = props.transition !== false && rest.transition !== false;\n var key = makeEventKey(props.eventKey);\n return _extends({}, props, {\n active: props.active == null && key != null ? makeEventKey(activeKey) === key : props.active,\n id: getControlledId(props.eventKey),\n 'aria-labelledby': getControllerId(props.eventKey),\n transition: shouldTransition && (props.transition || rest.transition || Fade),\n mountOnEnter: props.mountOnEnter != null ? props.mountOnEnter : rest.mountOnEnter,\n unmountOnExit: props.unmountOnExit != null ? props.unmountOnExit : rest.unmountOnExit\n });\n}\n\nvar TabPane = React.forwardRef(function (props, ref) {\n var _useTabContext = useTabContext(props),\n bsPrefix = _useTabContext.bsPrefix,\n className = _useTabContext.className,\n active = _useTabContext.active,\n onEnter = _useTabContext.onEnter,\n onEntering = _useTabContext.onEntering,\n onEntered = _useTabContext.onEntered,\n onExit = _useTabContext.onExit,\n onExiting = _useTabContext.onExiting,\n onExited = _useTabContext.onExited,\n mountOnEnter = _useTabContext.mountOnEnter,\n unmountOnExit = _useTabContext.unmountOnExit,\n Transition = _useTabContext.transition,\n _useTabContext$as = _useTabContext.as,\n Component = _useTabContext$as === void 0 ? 'div' : _useTabContext$as,\n _ = _useTabContext.eventKey,\n rest = _objectWithoutPropertiesLoose(_useTabContext, [\"bsPrefix\", \"className\", \"active\", \"onEnter\", \"onEntering\", \"onEntered\", \"onExit\", \"onExiting\", \"onExited\", \"mountOnEnter\", \"unmountOnExit\", \"transition\", \"as\", \"eventKey\"]);\n\n var prefix = useBootstrapPrefix(bsPrefix, 'tab-pane');\n if (!active && unmountOnExit) return null;\n var pane = React.createElement(Component, _extends({}, rest, {\n ref: ref,\n role: \"tabpanel\",\n \"aria-hidden\": !active,\n className: classNames(className, prefix, {\n active: active\n })\n }));\n if (Transition) pane = React.createElement(Transition, {\n in: active,\n onEnter: onEnter,\n onEntering: onEntering,\n onEntered: onEntered,\n onExit: onExit,\n onExiting: onExiting,\n onExited: onExited,\n mountOnEnter: mountOnEnter,\n unmountOnExit: mountOnEnter\n }, pane); // We provide an empty the TabContext so `\n
\n \n
\n Looks like you haven't completed your profile.
\n \n {' '}\n Click here to finish!\n \n