\r\n
\r\n );\r\n};\r\n\r\nexport default Auth;\r\n","import React from 'react';\r\nimport Svg, { Path } from 'svgs';\r\n\r\nconst Favorite = ({ size, fill }) => {\r\n return (\r\n \r\n );\r\n};\r\n\r\nexport default Favorite;\r\n","import React from 'react';\r\nimport Svg, { G, Rect } from 'svgs';\r\n\r\nconst Menu = ({ size, fill }) => {\r\n return (\r\n \r\n );\r\n};\r\n\r\nexport default Menu;\r\n","import React from 'react';\r\nimport Svg, { Path } from 'svgs';\r\n\r\nconst Close = ({ size, fill }) => {\r\n return (\r\n \r\n );\r\n};\r\n\r\nexport default Close;\r\n","import React, { useState } from 'react';\r\n\r\nconst HoverNavMenu = ({ label, children }) => {\r\n const [isHovering, setHovering] = useState(false);\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 The World Egg & Sperm Bank took such good care of our donor. It was important to us that she understood we wanted\r\n the best for her.\r\n
\r\n- Janet & Mark
\r\n\r\n
\r\n \r\n \r\n
\r\n {children}
\r\n \r\n setHovering(true)} onMouseLeave={() => setHovering(false)}>\r\n {label}\r\n {isHovering ?
\r\n );\r\n};\r\n\r\nexport default HoverNavMenu;\r\n","import React, { useEffect, useState } from 'react';\r\nimport { shallowEqual, useSelector } from 'react-redux';\r\nimport { Link, NavLink, useHistory, useLocation } from 'react-router-dom';\r\nimport store from 'store2';\r\nimport cn from 'classnames';\r\n\r\nimport TwebLogoWhiteHorizontal from '../../common/components/logo/logo-horizontal-white';\r\nimport Favorite from '../../common/components/icons/favorite';\r\nimport MobileMenu from '../../common/components/icons/menu';\r\nimport Close from '../../common/components/icons/close';\r\nimport HoverNavMenu from '../../common/components/HoverNavMenu';\r\n\r\nimport { getChangePasswordUrl, getEmailSettingsUrl } from '../../common/utils/oidc-url-builders';\r\n\r\nconst Main = ({ children }) => {\r\n const [deleted, loggedIn, favorites] = useSelector(\r\n ({ user }) => [user.getIn(['data', 'deleted']), user.get('loggedIn'), user.getIn(['data', 'favorites'])],\r\n shallowEqual\r\n );\r\n const history = useHistory();\r\n const location = useLocation();\r\n\r\n useEffect(() => {\r\n const loginPath = store.get('loginPath');\r\n const loginSearch = store.get('loginSearch');\r\n\r\n if (loginPath || loginSearch) {\r\n store.remove('loginPath');\r\n store.remove('loginSearch');\r\n\r\n if (location.pathname !== '/contact') {\r\n history.replace(`${loginPath}${loginSearch}`);\r\n }\r\n }\r\n }, [history, location, loggedIn]);\r\n\r\n let favoritesString = Math.min(99, favorites).toString();\r\n\r\n if (favorites > 99) {\r\n favoritesString += '+';\r\n }\r\n\r\n const isMobile = useSelector(({ browser }) => browser.lessThan.large);\r\n const [mobileNavExpanded, setMobileNavExpanded] = useState(false);\r\n\r\n return (\r\n {children}
: null}\r\n \r\n
\r\n );\r\n};\r\n\r\nexport default Main;\r\n","import React from 'react';\r\nimport Svg, { G, Path } from 'svgs';\r\n\r\nconst Email = ({ fill, size }) => {\r\n return (\r\n \r\n );\r\n};\r\n\r\nexport default Email;\r\n","import React from 'react';\r\nimport Svg, { G, Path } from 'svgs';\r\n\r\nconst Phone = ({ fill, size }) => {\r\n return (\r\n \r\n );\r\n};\r\n\r\nexport default Phone;\r\n","import React from 'react';\r\nimport Email from '../../common/components/icons/email';\r\nimport Phone from '../../common/components/icons/phone';\r\nimport { colors } from '../../app-theme';\r\n\r\nconst ContactInformation = ({ headerText }) => {\r\n return (\r\n \r\n
\r\n\r\n \r\n
\r\n \r\n
\r\n {(!isMobile || mobileNavExpanded) && (\r\n \r\n )}\r\n \r\n \r\n
\r\n {isMobile && (\r\n setMobileNavExpanded(!mobileNavExpanded)}>\r\n {mobileNavExpanded ?
\r\n )}\r\n \r\n
\r\n\r\n {/* Footer */}\r\n {children}
\r\n \r\n Copyright © 2024 The World Egg & Sperm Bank, All Rights Reserved.\r\n
\r\n \r\n {headerText ? (\r\n \r\n You don't need an appointment to talk to us.\r\n
\r\n )}\r\n \r\n
\r\n );\r\n};\r\n\r\nexport default ContactInformation;\r\n","import React from 'react';\r\nimport { useSelector, shallowEqual } from 'react-redux';\r\n\r\nimport config from '../../config';\r\nimport Button from '../../common/components/buttons/button';\r\n\r\nconst ScheduleAppointment = ({ donorId }) => {\r\n const [firstName, lastName, email] = useSelector(\r\n ({ user }) => [\r\n user.getIn(['data', 'profile', 'firstName']),\r\n user.getIn(['data', 'profile', 'lastName']),\r\n user.getIn(['data', 'email']),\r\n ],\r\n shallowEqual\r\n );\r\n\r\n /*\r\n Calendly Event Invitee Questions:\r\n a1: Phone Number\r\n a2: Please share anything that will help prepare for our meeting.\r\n */\r\n const calendlyCustomAnswers = {\r\n a1: '',\r\n a2: donorId ? `I'd like to make an inquiry about Donor #${donorId}` : '',\r\n };\r\n\r\n return (\r\n {headerText}
\r\n ) : (\r\n\r\n You don't need an appointment to talk to us.\r\n
\r\n Give us a call or send an email!\r\n
\r\n )}\r\n \r\n Hours of Operation
\r\n\r\n
\r\n \r\n
\r\n \r\n
\r\n \r\n
\r\n Monday – Friday
\r\n 7AM – 4PM
\r\n \r\n
\r\n );\r\n};\r\n\r\nexport default ScheduleAppointment;\r\n","import React, { forwardRef } from 'react';\r\nimport PropTypes from 'prop-types';\r\nimport { useField } from 'formik';\r\n\r\nimport InputScaffold from './InputScaffold';\r\n\r\nconst Input = forwardRef(({ children, className, disabled, label, placeholder, rounded, type, ...props }, ref) => {\r\n const [field, meta] = useField({ disabled, ...props });\r\n\r\n return (\r\n Chat with us on your schedule
\r\n\r\n If you are searching for your donor and need assistance, have questions, or are ready to reserve your donor,\r\n schedule a time to talk with one of our experienced, caring client representatives.\r\n
\r\n\r\n {config.calendly.eventTypes.map(eventType => (\r\n {\r\n window.Calendly.initPopupWidget({\r\n url: `${config.calendly.baseUrl}${eventType.link}`,\r\n prefill: {\r\n email,\r\n firstName,\r\n lastName,\r\n name: firstName && lastName ? `${firstName} ${lastName}` : null,\r\n customAnswers: calendlyCustomAnswers,\r\n },\r\n });\r\n }}\r\n >\r\n {eventType.name}\r\n \r\n ))}\r\n
\r\n \r\n {isShowingSuccessMessage ? (\r\n {\r\n dispatch(sendContactUsMessage(values)).then(res => {\r\n if (res.response.ok) {\r\n resetForm();\r\n setShowingSuccessMessage(true);\r\n }\r\n });\r\n }}\r\n >\r\n {({ isSubmitting }) =>\r\n isSubmitting ? (\r\n
\r\n );\r\n};\r\n\r\nContactUsForm.defaultProps = {\r\n closeButtonText: 'Close window',\r\n};\r\n\r\nexport default ContactUsForm;\r\n","import client from '../client';\r\n\r\nexport const SEND_CONTACT_US_MESSAGE = 'SEND_CONTACT_US_MESSAGE';\r\nexport const SEND_CONTACT_US_MESSAGE_SUCCESS = 'SEND_CONTACT_US_MESSAGE_SUCCESS';\r\n\r\nexport const sendContactUsMessage = values => ({\r\n type: SEND_CONTACT_US_MESSAGE,\r\n promise: client.post('contact-us', values),\r\n});\r\n","import React from 'react';\r\nimport Svg, { G, Path, Circle } from 'svgs';\r\n\r\nconst Calendar = ({ size, fill }) => {\r\n return (\r\n \r\n );\r\n};\r\n\r\nexport default Calendar;\r\n","import React, { useState } from 'react';\r\nimport { Link } from 'react-router-dom';\r\nimport { useSelector } from 'react-redux';\r\nimport { Modal } from 'synfrastructure';\r\nimport cn from 'classnames';\r\n\r\nimport ContactInformation from './ContactInformation';\r\nimport ScheduleAppointment from './ScheduleAppointment';\r\nimport ContactUsForm from './ContactUsForm';\r\n\r\nimport Close from '../../common/components/icons/close';\r\nimport LeftArrow from '../../common/components/icons/left-arrow';\r\nimport Calendar from '../../common/components/icons/calendar';\r\nimport Button from '../../common/components/buttons/button';\r\nimport { colors } from '../../app-theme';\r\n\r\nconst Contact = () => {\r\n const [contactUsModalVisible, setContactUsModalVisible] = useState(false);\r\n const deleted = useSelector(({ user }) => user.getIn(['data', 'deleted']));\r\n const recipientId = useSelector(({ user }) => user.getIn(['data', 'legacy_user_id']));\r\n const isMobile = useSelector(({ browser }) => browser.lessThan.large);\r\n\r\n return (\r\n \r\n
\r\n ) : (\r\n \r\n
\r\n Message Sent!
\r\n\r\n Your message has been sent and a Client Representative will be in touch with you soon!\r\n
\r\n\r\n {closeButtonText}\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 Contact;\r\n","import React from 'react';\r\nimport { Link } from 'react-router-dom';\r\n\r\nconst Deleted = () => (\r\n Contact Us
\r\n\r\n setContactUsModalVisible(false)} isVisible={contactUsModalVisible} />\r\n
\r\n \r\n {!deleted && (\r\n \r\n \r\n
\r\n )}\r\n \r\n Your recipient ID: {recipientId}\r\n
\r\n )}\r\n Contact The World Egg & Sperm Bank
\r\n\r\n
\r\n \r\n
\r\n \r\n {\r\n setContactUsModalVisible(true);\r\n }}\r\n >\r\n Contact Us\r\n \r\n
\r\n \r\n {!deleted && (\r\n
\r\n \r\n
\r\n )}\r\n Schedule Appointment
\r\n\r\n
\r\n \r\n
\r\n);\r\n\r\nexport default Deleted;\r\n","import React from 'react';\r\nimport Svg, { Path } from 'svgs';\r\n\r\nconst Favorite = ({ size, fill }) => {\r\n return (\r\n \r\n );\r\n};\r\n\r\nexport default Favorite;\r\n","import { Iterable, fromJS } from 'immutable';\r\n\r\nexport const newQuery = query => {\r\n const newQuery = new URLSearchParams();\r\n\r\n const queryMap = query.toJS ? query : fromJS(query);\r\n\r\n queryMap.forEach((param, key) => {\r\n if (Iterable.isIterable(param)) {\r\n param.forEach(value => newQuery.append(key, value));\r\n } else {\r\n newQuery.append(key, param);\r\n }\r\n });\r\n\r\n return newQuery;\r\n};\r\n","import { useCallback, useEffect, useMemo, useRef } from 'react';\r\nimport { useHistory, useLocation } from 'react-router-dom';\r\nimport { fromJS, List, Map } from 'immutable';\r\n\r\nimport { newQuery } from './query-helpers';\r\nimport config from '../../config';\r\n\r\n// Taken from https://usehooks.com/useEventListener/\r\nexport const useEventListener = (eventName, handler, element = window) => {\r\n const savedHandler = useRef();\r\n\r\n useEffect(() => {\r\n savedHandler.current = handler;\r\n }, [handler]);\r\n\r\n useEffect(() => {\r\n const isSupported = element && element.addEventListener;\r\n if (!isSupported) return;\r\n\r\n const eventListener = event => savedHandler.current(event);\r\n\r\n element.addEventListener(eventName, eventListener);\r\n\r\n return () => {\r\n element.removeEventListener(eventName, eventListener);\r\n };\r\n }, [eventName, element]);\r\n};\r\n\r\nexport const usePhotos = donor => {\r\n return useMemo(() => {\r\n const primary = donor.get('primary_photo');\r\n const largeThumb = donor.get('primary_photo_large_thumb');\r\n const thumb = donor.get('primary_photo_thumb');\r\n let photos = donor\r\n .get('photos', new List())\r\n .sortBy(photo => photo.get('sequence'))\r\n .map(\r\n photo =>\r\n new Map({\r\n full: `${config.cdnUrl}/${photo.get('key')}`,\r\n id: photo.get('photo_id'),\r\n primary: photo.get('primary'),\r\n thumb: `${config.cdnUrl}/${photo.get('thumb_key')}`,\r\n largeThumb: `${config.cdnUrl}/${photo.get('large_thumb_key')}`,\r\n })\r\n );\r\n\r\n if (!photos.size) {\r\n photos = photos.push(\r\n new Map({\r\n full: `${config.cdnUrl}/static/images/placeholder-egg.png`,\r\n id: 'placeholder',\r\n primary: false,\r\n thumb: `${config.cdnUrl}/static/images/placeholder-egg-thumb.png`,\r\n })\r\n );\r\n }\r\n\r\n return {\r\n primary: {\r\n full: primary ? `${config.cdnUrl}/${primary}` : `${config.cdnUrl}/static/images/placeholder-egg.png`,\r\n large: largeThumb ? `${config.cdnUrl}/${largeThumb}` : `${config.cdnUrl}/static/images/placeholder-egg.png`,\r\n index: photos.findIndex(photo => photo.get('primary')),\r\n largePlaceholder: `${config.cdnUrl}/static/images/placeholder-egg.png`,\r\n smallPlaceholder: `${config.cdnUrl}/static/images/placeholder-egg-thumb.png`,\r\n thumb: thumb ? `${config.cdnUrl}/${thumb}` : `${config.cdnUrl}/static/images/placeholder-egg-thumb.png`,\r\n },\r\n photos,\r\n };\r\n }, [donor]);\r\n};\r\n\r\nexport const useQuery = initialSearch => {\r\n const history = useHistory();\r\n const { search } = useLocation();\r\n\r\n const setQuery = useCallback(\r\n (query, options = {}, mode = 'push') => {\r\n const search = newQuery(query);\r\n\r\n history[mode]({ ...options, search: `?${search}` });\r\n },\r\n [history]\r\n );\r\n\r\n const searchString = search || initialSearch;\r\n\r\n return useMemo(() => {\r\n const query = new URLSearchParams(searchString);\r\n\r\n const values = {};\r\n\r\n for (const [key, value] of query.entries()) {\r\n if (values[key]) {\r\n if (Array.isArray(values[key])) {\r\n values[key].push(value);\r\n } else {\r\n values[key] = [values[key], value];\r\n }\r\n } else {\r\n values[key] = value;\r\n }\r\n }\r\n\r\n return [fromJS(values), setQuery];\r\n }, [searchString, setQuery]);\r\n};\r\n","import React, { useState } from 'react';\r\nimport { useDispatch, useSelector } from 'react-redux';\r\n\r\nimport Favorite from '../../common/components/icons/favorite';\r\nimport FavoriteOutline from '../../common/components/icons/favorite-o';\r\nimport { useQuery } from '../../common/utils/hooks';\r\n\r\nimport { deleteFavorite, postFavorite } from '../../redux/donor-actions';\r\n\r\nconst DonorFavorite = ({ donorId, favorited }) => {\r\n const dispatch = useDispatch();\r\n const [query, setQuery] = useQuery();\r\n const [favoriteDisabled, setFavoriteDisabled] = useState(false);\r\n const loggedIn = useSelector(({ user }) => user.get('loggedIn'));\r\n\r\n return (\r\n This account has been deactivated. Contact support to reactivate this account.
\r\n\r\n \r\n Logout\r\n \r\n setHovering(true)} onMouseLeave={() => setHovering(false)}>\r\n {isHovering ? (\r\n
\r\n );\r\n};\r\n\r\nOptionTypeIcon.propTypes = {\r\n color: PropTypes.string,\r\n size: PropTypes.number,\r\n showName: PropTypes.bool,\r\n type: PropTypes.oneOf(['premium', 'baby-bundle', 'family-bundle','banked-custom-choice']).isRequired,\r\n};\r\nexport default OptionTypeIcon;\r\n","import React, { Fragment, useMemo } from 'react';\r\nimport cn from 'classnames';\r\n\r\nimport DonorFavorite from './DonorFavorite';\r\nimport Search from '../../common/components/icons/search';\r\nimport { usePhotos, useQuery } from '../../common/utils/hooks';\r\nimport OptionTypeIcon from '../../common/components/OptionTypeIcon';\r\n\r\nimport { colors } from '../../app-theme';\r\n\r\nconst DonorCard = ({ donor }) => {\r\n const donorData = useMemo(() => donor.toJS(), [donor]);\r\n\r\n const [query, setQuery] = useQuery();\r\n\r\n const {\r\n primary: { full, largePlaceholder },\r\n } = usePhotos(donor);\r\n\r\n const photoAlt = full.replace(/\\.[^.]*$/, '.jpg');\r\n\r\n return (\r\n \r\n
\r\n ) : null}\r\n \r\n
\r\n {OPTION_TYPES[type].description}
\r\n \r\n
\r\n \r\n );\r\n};\r\n\r\nexport default DonorCard;\r\n","import React, { useMemo } from 'react';\r\n\r\nimport DonorFavorite from './DonorFavorite';\r\n\r\nimport Search from '../../common/components/icons/search';\r\nimport { usePhotos, useQuery } from '../../common/utils/hooks';\r\nimport { colors } from '../../app-theme';\r\n\r\nimport OptionTypeIcon from '../../common/components/OptionTypeIcon';\r\n\r\nconst getBloodTypeText = (bloodType, bloodTypeRh) => {\r\n if (bloodType === 'Unknown') {\r\n return 'Blood Type Unknown';\r\n } else if (bloodTypeRh === 'Unknown') {\r\n return `Blood Type ${bloodType}`;\r\n } else {\r\n return `Blood Type ${bloodType} ${bloodTypeRh}`;\r\n }\r\n};\r\n\r\nconst DonorListItem = ({ donor }) => {\r\n const [query, setQuery] = useQuery();\r\n const donorData = useMemo(() => donor.toJS(), [donor]);\r\n\r\n const {\r\n primary: { smallPlacholder, thumb },\r\n } = usePhotos(donor);\r\n\r\n return (\r\n \r\n {donorData.active && (\r\n \r\n {donorData.coming_soon && coming soon}\r\n \r\n )}\r\n {!donorData.active && inactive}\r\n
\r\n\r\n \r\n {donorData.ethnicity && (\r\n
\r\n\r\n \r\n
\r\n )}\r\n\r\n \r\n
\r\n {donorData.ethnicity}
\r\n race
\r\n \r\n
\r\n\r\n \r\n
\r\n\r\n {donorData.eye_color && (\r\n {donorData.hair_color}
\r\n hair color
\r\n \r\n
\r\n )}\r\n {donorData.eye_color}
\r\n eye color
\r\n \r\n
\r\n\r\n \r\n
\r\n {donorData.height}
\r\n height
\r\n \r\n
\r\n\r\n {donorData.education_level_public && (\r\n \r\n
\r\n {donorData.blood_type}
\r\n blood type
\r\n \r\n
\r\n {donorData.blood_type_rh}
\r\n rh factor
\r\n \r\n
\r\n )}\r\n \r\n
\r\n {donorData.education_level_public}
\r\n education level
\r\n \r\n {donorData.banked_eggs && (\r\n
\r\n\r\n \r\n
\r\n )}\r\n {donorData.is_baby_bundle && (\r\n \r\n
\r\n )}\r\n {donorData.is_family_bundle && (\r\n \r\n
\r\n )}\r\n {donorData.is_banked_custom_choice && (\r\n \r\n
\r\n )}\r\n {donorData.active && (\r\n \r\n
\r\n )}\r\n \r\n ID: {donorData.donor_id}\r\n
\r\n setQuery(query.set('profileId', donorData.donor_id))}>\r\n
\r\n );\r\n};\r\n\r\nexport default DonorListItem;\r\n","import React from 'react';\r\nimport { useSelector } from 'react-redux';\r\n\r\nimport Loading from '../../common/components/Loading';\r\nimport { useQuery } from '../../common/utils/hooks';\r\n\r\nconst DonorLoadMoreButton = ({ buttonText, from }) => {\r\n const loading = useSelector(({ donors: { list } }) => list.get('loading'));\r\n const [query, setQuery] = useQuery();\r\n\r\n return (\r\n \r\n \r\n {donorData.coming_soon && coming soon}\r\n {!donorData.active && inactive}\r\n
\r\n \r\n
\r\n \r\n
\r\n\r\n ID: {donorData.donor_id}
\r\n\r\n {donorData.ethnicity &&
\r\n {donorData.ethnicity}
}\r\n {donorData.eye_color && {donorData.eye_color} Eyes}\r\n {donorData.hair_color && {donorData.hair_color} Hair}\r\n {donorData.height && {donorData.height}}\r\n {donorData.weight_and_units && {donorData.weight_and_units}}\r\n {donorData.blood_type && {getBloodTypeText(donorData.blood_type, donorData.blood_type_rh)}}\r\n\r\n {donorData.banked_eggs && (\r\n
\r\n \r\n
\r\n )}\r\n {donorData.is_baby_bundle && (\r\n \r\n
\r\n )}\r\n {donorData.is_family_bundle && (\r\n \r\n
\r\n )}\r\n {donorData.is_banked_custom_choice && (\r\n \r\n
\r\n )}\r\n {donorData.active && (\r\n \r\n
\r\n )}\r\n \r\n {loading &&
\r\n );\r\n};\r\n\r\nDonorLoadMoreButton.defaultProps = {\r\n buttonText: 'Load More Results',\r\n};\r\n\r\nexport default DonorLoadMoreButton;\r\n","import React from 'react';\r\nimport Svg, { Path } from 'svgs';\r\n\r\nconst GridView = ({ size, fill }) => {\r\n return (\r\n \r\n );\r\n};\r\n\r\nexport default GridView;\r\n","import React from 'react';\r\nimport Svg, { Circle, Rect } from 'svgs';\r\n\r\nconst ListView = ({ size, fill }) => {\r\n return (\r\n \r\n );\r\n};\r\n\r\nexport default ListView;\r\n","import React from 'react';\r\nimport { Link, NavLink, useLocation } from 'react-router-dom';\r\n\r\nimport { newQuery } from '../../common/utils/query-helpers';\r\nimport { useQuery } from '../../common/utils/hooks';\r\nimport GridView from '../../common/components/icons/grid-view';\r\nimport ListView from '../../common/components/icons/list-view';\r\nimport { colors } from '../../app-theme';\r\n\r\nconst DonorNav = () => {\r\n const location = useLocation();\r\n const [query] = useQuery();\r\n const { mode, option } = query.toJS();\r\n\r\n return (\r\n \r\n );\r\n};\r\n\r\nexport default DonorNav;\r\n","import React from 'react';\r\nimport Svg, { Path, Defs, Mask, Use, G } from 'svgs';\r\n\r\nconst TwebLogoEgg = ({ width, height }) => {\r\n return (\r\n \r\n );\r\n};\r\n\r\nexport default TwebLogoEgg;\r\n","import React, { Component } from 'react';\r\nimport PropTypes from 'prop-types';\r\nimport classNames from 'classnames';\r\n\r\nclass TextButton extends Component {\r\n static propTypes = {\r\n onClick: PropTypes.func,\r\n disabled: PropTypes.bool,\r\n destructive: PropTypes.bool,\r\n className: PropTypes.string,\r\n };\r\n\r\n render() {\r\n const { className, children, destructive, onClick, ...passthrough } = this.props;\r\n\r\n return (\r\n \r\n );\r\n }\r\n}\r\n\r\nexport default TextButton;\r\n","import React from 'react';\r\nimport { useHistory } from 'react-router-dom';\r\nimport { pickBy } from 'lodash';\r\n\r\nimport { useQuery } from '../../common/utils/hooks';\r\nimport TwebLogoEgg from '../../common/components/logo/logo-colored-egg';\r\nimport TextButton from '../../common/components/buttons/text-button';\r\nimport Button from '../../common/components/buttons/button';\r\n\r\nconst DonorNoResults = () => {\r\n const history = useHistory();\r\n const [query, setQuery] = useQuery();\r\n\r\n return (\r\n \r\n setQuery(pickBy({ mode: query.get('mode'), option: query.get('option') }))}>\r\n Clear All Filters\r\n \r\n
\r\n );\r\n};\r\n\r\nexport default DonorNoResults;\r\n","import React from 'react';\r\nimport { Form, Formik } from 'formik';\r\nimport { useSelector } from 'react-redux';\r\n\r\nimport Input from '../../common/forms/Input';\r\nimport { useQuery } from '../../common/utils/hooks';\r\nimport Button from '../../common/components/buttons/button';\r\n\r\nconst DonorSearchButton = () => {\r\n const [query, setQuery] = useQuery();\r\n\r\n const loading = useSelector(({ donors: { list } }) => list.get('loading'));\r\n\r\n return (\r\n \r\n
\r\n No Matches Found
\r\n\r\n Keeping your search criteria to a minimum will allow for a wider selection of donors\r\n
\r\n \r\n\r\n {\r\n if (donor_id) {\r\n setQuery(query.set('id', donor_id).delete('from'));\r\n } else {\r\n setQuery(query.delete('id').delete('from'));\r\n }\r\n }}\r\n >\r\n {({ setFieldValue }) => (\r\n \r\n )}\r\n \r\n
\r\n );\r\n};\r\n\r\nexport default DonorSearchButton;\r\n","import React from 'react';\r\n\r\nimport ContactInformation from '../Contact/ContactInformation';\r\nimport ContactUsForm from '../Contact/ContactUsForm';\r\nimport ScheduleAppointment from '../Contact/ScheduleAppointment';\r\n\r\nconst DonorProfileContactUs = ({ closeButtonText, donorId, isVisible, onClose }) => {\r\n return (\r\n \r\n
\r\n );\r\n};\r\n\r\nexport default DonorProfileContactUs;\r\n","import React, { useState, useEffect } from 'react';\r\nimport { Modal } from 'synfrastructure';\r\nimport { useSelector, useDispatch } from 'react-redux';\r\n\r\nimport DonorProfileContactUs from './DonorProfileContactUs';\r\nimport { getRecipientById } from '../../redux/recipient-actions';\r\n\r\nimport Close from '../../common/components/icons/close';\r\n\r\nconst DonorListContactUsButton = () => {\r\n const dispatch = useDispatch();\r\n const [contactUsModalVisible, setContactUsModalVisible] = useState(false);\r\n const recipientId = useSelector(({ user }) => user.getIn(['data', 'legacy_user_id']));\r\n const recipient = useSelector(({ recipient }) => recipient);\r\n const [showCuratedForYouMessage, setShowCuratedForYouMessage] = useState(true);\r\n\r\n ///\r\n /// Find the current recipient (if there is one) - and show/hide the country selections accordingly\r\n ///\r\n useEffect(() => {\r\n if (recipientId) {\r\n ///\r\n /// We only want to execute this if we don't already have a recipient\r\n ///\r\n if (!recipient.Id) {\r\n dispatch(getRecipientById(recipientId));\r\n }\r\n ///\r\n /// Hide the country selections if the recipient has a country of residence, but show them otherwise\r\n ///\r\n setShowCuratedForYouMessage(['US', 'AU', 'CA','UK'].includes(recipient.CountryCode));\r\n }\r\n else {\r\n ///\r\n /// If there is no recipient Id then this is an anonymous search, so don't hide the country selections\r\n ///\r\n setShowCuratedForYouMessage(false);\r\n }\r\n }, [dispatch, recipientId, recipient]);\r\n\r\n return (\r\n \r\n
\r\n Contact The World Egg & Sperm Bank
\r\n\r\n
\r\n \r\n
\r\n
\r\n \r\n
Schedule Appointment
\r\n\r\n
\r\n \r\n Your recipient ID: {recipientId}\r\n {showCuratedForYouMessage &&
\r\n )}\r\n \r\n \r\n );\r\n};\r\n\r\nexport default DonorListContactUsButton;\r\n","import React, { useEffect, useRef, useState } from 'react';\r\nimport { shallowEqual, useDispatch, useSelector } from 'react-redux';\r\nimport cn from 'classnames';\r\nimport store from 'store2';\r\n\r\nimport DonorCard from './DonorCard';\r\nimport DonorListItem from './DonorListItem';\r\nimport DonorLoadMoreButton from './DonorLoadMoreButton';\r\nimport DonorNav from './DonorNav';\r\nimport DonorNoResults from './DonorNoResults';\r\nimport DonorSearchButton from './DonorSearchButton';\r\nimport DonorListContactUsButton from './DonorListContactUsButton';\r\nimport Loading from '../../common/components/Loading';\r\nimport { useQuery } from '../../common/utils/hooks';\r\nimport { searchDonors } from '../../redux/donor-actions';\r\nimport { getRecipientById } from '../../redux/recipient-actions';\r\n\r\nconst PAGE_SIZE = 18;\r\n\r\nconst DonorList = () => {\r\n const storedSearch = store.get('loginSearch');\r\n const dispatch = useDispatch();\r\n const [query, setQuery] = useQuery(storedSearch);\r\n const { mode } = query.toJS();\r\n const profileId = useRef(query.get('profileId'));\r\n const [lastQuery, setLastQuery] = useState(null);\r\n\r\n const recipient = useSelector(({ recipient }) => recipient);\r\n const [recipientId, loggedIn] = useSelector(\r\n ({ user }) => [user.getIn(['data', 'deleted']), user.get('loggedIn')],\r\n shallowEqual\r\n );\r\n\r\n const [recipientFound, setRecipientFound] = useState(false);\r\n\r\n ///\r\n /// Find the current recipient (if there is one) - and change the available_in selection accordingly\r\n ///\r\n useEffect(() => {\r\n if (loggedIn) {\r\n ///\r\n /// We only want to execute this if we don't already have a recipient\r\n ///\r\n if (!recipientFound) {\r\n dispatch(getRecipientById(recipientId));\r\n }\r\n\r\n setupAvailableInFilterForRecipient();\r\n }\r\n else {\r\n setRecipientFound(false);\r\n }\r\n\r\n ///\r\n /// Look to see if there is a recipient logged in - and if they have a defined country of residence\r\n ///\r\n /// If they do - and there is a filter for \"available_in\" then overwrite it. If no current filter\r\n /// then add one for this recipient's country of residence.\r\n ///\r\n function setupAvailableInFilterForRecipient() {\r\n if (!recipientFound) {\r\n if (recipient.Id) {\r\n setRecipientFound(true);\r\n console.log(recipient);\r\n if (recipient.Id && ['US', 'AU', 'CA', 'UK'].includes(recipient.CountryCode)) {\r\n console.log('Setting recipient');\r\n\r\n let countries = query.get('available_in');\r\n\r\n if (countries) {\r\n setQuery(query.delete('available_in'));\r\n }\r\n setQuery(query.set('available_in', recipient.CountryCode));\r\n }\r\n }\r\n }\r\n }\r\n }, [dispatch, query, recipientId, setQuery, recipient, loggedIn, recipientFound]);\r\n\r\n useEffect(() => {\r\n\r\n if (profileId.current === query.get('profileId')) {\r\n ///\r\n /// Only run the search if the current query is different from the previous one - this prevents double searches when the recpient county-specific\r\n /// filter is set programatically.\r\n ///\r\n if (JSON.stringify(lastQuery) !== JSON.stringify(query))\r\n {\r\n console.log('Searching ....');\r\n setLastQuery(query); \r\n dispatch(searchDonors(query, PAGE_SIZE));\r\n }\r\n } \r\n }, [dispatch, query, setQuery, recipient, recipientId, loggedIn, recipientFound, lastQuery]);\r\n\r\n\r\n useEffect(() => {\r\n profileId.current = query.get('profileId');\r\n console.log(profileId.current);\r\n }, [profileId, query]);\r\n\r\n const [donors, firstPage, lastPage, loaded, total] = useSelector(\r\n ({ donors: { list } }) => [\r\n list.get('data'),\r\n list.get('firstPage'),\r\n list.get('lastPage'),\r\n list.get('loaded'),\r\n list.get('total'),\r\n ],\r\n shallowEqual\r\n );\r\n\r\n let DonorComponent = DonorCard;\r\n\r\n if (mode === 'list') {\r\n DonorComponent = DonorListItem;\r\n }\r\n\r\n return (\r\n The donors you are viewing are specifically available in your country and fully comply with your countries laws, regulations and policies.
}\r\n \r\n \r\n {donors.map(donor => (\r\n
\r\n )}\r\n {loaded && !total && \r\n
\r\n \r\n
\r\n Donor Search
\r\n\r\n
\r\n )}\r\n {total > donors.size && \r\n
\r\n );\r\n};\r\n\r\nexport default DonorTraitSelectorOptionsList;\r\n","import React, { Children, cloneElement, useRef, useState, useMemo } from 'react';\r\nimport Fuse from 'fuse.js';\r\nimport Close from '../../common/components/icons/close';\r\nimport { colors } from '../../app-theme';\r\n\r\nconst DonorTraitSelectorSearchableList = ({ onClear, values, trait, expanded, children, close }) => {\r\n const [searchTerm, setSearchTerm] = useState('');\r\n\r\n const fuse = useRef(\r\n new Fuse(children, {\r\n threshold: 0.3,\r\n distance: 2,\r\n keys: ['props.label'],\r\n })\r\n );\r\n\r\n const childrenToDisplay = useMemo(() => (searchTerm.trim() ? fuse.current.search(searchTerm) : children), [\r\n searchTerm,\r\n children,\r\n ]);\r\n\r\n const elements = Children.map(childrenToDisplay, child => cloneElement(child, { trait, values }));\r\n\r\n return (\r\n \r\n
\r\n {elements}\r\n \r\n Select {labelFunc(values.size, plural)}\r\n {values.size > 0 && (\r\n \r\n Clear All\r\n \r\n )}\r\n
\r\n \r\n
\r\n \r\n
\r\n );\r\n};\r\n\r\nexport default DonorTraitSelectorSearchableList;\r\n","import React, { Children, useCallback, useRef, useState } from 'react';\r\nimport { Iterable, List } from 'immutable';\r\nimport PropTypes from 'prop-types';\r\nimport cn from 'classnames';\r\nimport isFunction from 'lodash/isFunction';\r\n\r\nimport { useEventListener, useQuery } from '../../common/utils/hooks';\r\nimport CheckCircle from '../../common/components/icons/check-circle';\r\nimport { colors } from '../../app-theme';\r\nimport ChevronRight from '../../common/components/icons/chevron-right';\r\nimport DonorTraitSelectorOptionsList from './DonorTraitSelectorOptionsList';\r\nimport DonorTraitSelectorSearchableList from './DonorTraitSelectorSearchableList';\r\n\r\nconst DonorTraitSelector = ({ children, className, isSearchable, label, noneSelectedLabel, plural, trait }) => {\r\n const wrapperRef = useRef(null);\r\n const [query, setQuery] = useQuery();\r\n const [expanded, setExpanded] = useState();\r\n\r\n const handler = useCallback(\r\n e => {\r\n if (!wrapperRef.current.contains(e.target)) {\r\n setExpanded(false);\r\n }\r\n },\r\n [setExpanded]\r\n );\r\n\r\n useEventListener('mousedown', handler, document);\r\n\r\n let values = query.get(trait, new List());\r\n\r\n if (!Iterable.isIterable(values)) {\r\n values = new List([values]);\r\n }\r\n\r\n const options = Children.map(children, ({ props: { label, value } }) => ({ label, value }));\r\n\r\n const allSelected = values.size === options.length;\r\n\r\n const labelFunc = (size, pluralize) => {\r\n let value = isFunction(label) ? label() : label;\r\n\r\n if (pluralize) {\r\n value += '(s)';\r\n }\r\n\r\n return value;\r\n };\r\n\r\n const ListComponent = isSearchable ? DonorTraitSelectorSearchableList : DonorTraitSelectorOptionsList;\r\n\r\n return (\r\n \r\n
\r\n {elements}\r\n \r\n
\r\n \r\n {\r\n e.stopPropagation();\r\n e.nativeEvent.stopImmediatePropagation();\r\n }}\r\n value={searchTerm}\r\n onChange={e => {\r\n setSearchTerm(e.currentTarget.value);\r\n }}\r\n />\r\n {values.size > 0 && (\r\n \r\n Clear All\r\n \r\n )}\r\n
\r\n \r\n
\r\n setExpanded(!expanded)}>\r\n setQuery(query.delete(trait).delete('from'))}\r\n plural={plural}\r\n trait={trait}\r\n values={values}\r\n close={() => setExpanded(false)}\r\n />\r\n
\r\n );\r\n};\r\n\r\nDonorTraitSelector.defaultProps = { noneSelectedLabel: 'Any', plural: false };\r\n\r\nexport default DonorTraitSelector;\r\n\r\nexport const DonorTrait = ({ children, label, trait, value, values }) => {\r\n const [query, setQuery] = useQuery();\r\n\r\n const selected = values.includes(value);\r\n\r\n return (\r\n \r\n
\r\n 2 && !allSelected && 'trait-selector__value-small')}>\r\n {(values.size === 0 || allSelected) && noneSelectedLabel}\r\n {!allSelected &&\r\n values\r\n .take(3)\r\n .map(value => options.find(option => option.value === value).label)\r\n .join(', ')}\r\n {values.size > 3 && !allSelected && `, ${values.size - 3} more`}\r\n
\r\n \r\n {labelFunc(values.size)}{' '}\r\n {values.size > 0 && (\r\n \r\n (\r\n {\r\n e.stopPropagation();\r\n e.nativeEvent.stopImmediatePropagation();\r\n setQuery(query.delete(trait).delete('from'));\r\n }}\r\n >\r\n Clear All\r\n \r\n )\r\n \r\n )}\r\n
\r\n \r\n
\r\n setExpanded(!expanded)}>\r\n
\r\n \r\n );\r\n};\r\n\r\nexport default DonorHeightSlider;\r\n","import React from 'react';\r\nimport Svg, { Path } from 'svgs';\r\n\r\nconst Plus = ({ fill, size }) => {\r\n return (\r\n \r\n );\r\n};\r\n\r\nexport default Plus;\r\n","import React from 'react';\r\nimport Svg, { Path } from 'svgs';\r\n\r\nconst Minus = ({ fill, size }) => {\r\n return (\r\n \r\n );\r\n};\r\n\r\nexport default Minus;\r\n","import React from 'react';\r\nimport Svg, { G, Path, Circle } from 'svgs';\r\n\r\nconst InfoCircle = ({ size, fill }) => {\r\n return (\r\n \r\n );\r\n};\r\n\r\nexport default InfoCircle;\r\n","export default {\r\n 853: 'African American',\r\n 854: 'Alsace',\r\n 855: 'Argentinean',\r\n 856: 'Armenian',\r\n 857: 'Austrian',\r\n 858: 'Belgian',\r\n 859: 'Bolivian',\r\n 860: 'Brazilian',\r\n 861: 'Bulgarian',\r\n 862: 'Canadian',\r\n 863: 'Chilean',\r\n 864: 'Chinese',\r\n 865: 'Colombian',\r\n 866: 'Costa Rican',\r\n 867: 'Creole',\r\n 868: 'Croatian',\r\n 869: 'Czech',\r\n 870: 'Danish',\r\n 871: 'Dutch',\r\n 872: 'East Indian',\r\n 873: 'Ecuadorian',\r\n 874: 'Egyptian',\r\n 875: 'English',\r\n 876: 'Ethiopian',\r\n 877: 'Filipino',\r\n 878: 'Finnish',\r\n 879: 'French',\r\n 880: 'French-Canadian',\r\n 881: 'German',\r\n 882: 'Greek',\r\n 883: 'Guatemalan',\r\n 884: 'Honduran',\r\n 885: 'Hungarian',\r\n 886: 'Icelandic',\r\n 887: 'Iranian',\r\n 888: 'Irish',\r\n 889: 'Israeli',\r\n 890: 'Italian',\r\n 891: 'Jamaican',\r\n 892: 'Japanese',\r\n 893: 'Jewish',\r\n 894: 'Korean',\r\n 895: 'Lebanese',\r\n 896: 'Mexican',\r\n 897: 'Moroccan',\r\n 898: 'Native American',\r\n 899: 'Nicaraguan',\r\n 900: 'Norwegian',\r\n 901: 'Pacific Islander',\r\n 902: 'Pakistani',\r\n 903: 'Palestinian',\r\n 904: 'Panamanian',\r\n 905: 'Paraguayan',\r\n 906: 'Persian',\r\n 907: 'Polish',\r\n 908: 'Portuguese',\r\n 909: 'Puerto Rican',\r\n 910: 'Romanian',\r\n 911: 'Russian',\r\n 912: 'Scandinavian',\r\n 913: 'Scottish',\r\n 914: 'Slavic',\r\n 915: 'Slovakian',\r\n 916: 'South African',\r\n 917: 'Spanish',\r\n 918: 'Swedish',\r\n 919: 'Swiss',\r\n 920: 'Taiwanese',\r\n 921: 'Thai',\r\n 922: 'Turkish',\r\n 923: 'Ukrainian',\r\n 924: 'Uruguayan',\r\n 925: 'Venezuelan',\r\n 926: 'Vietnamese',\r\n 927: 'Welsh',\r\n 928: 'Yugoslavian',\r\n 929: 'Zairian',\r\n 5150: 'A',\r\n 5155: 'AB',\r\n 5160: 'B',\r\n 5165: 'O',\r\n 5100: 'Positive',\r\n 5105: 'Negative',\r\n 1228: 'In US',\r\n '-1228': 'Outside US',\r\n 33: 'Black',\r\n 34: 'Blue',\r\n 37: 'Brown',\r\n 35: 'Green',\r\n 36: 'Hazel',\r\n 38: 'Black',\r\n 39: 'Blonde',\r\n 40: 'Brown',\r\n 41: 'Red',\r\n 46: 'Average',\r\n 44: 'Curly',\r\n 42: 'Straight',\r\n 47: 'Thick',\r\n 45: 'Thin',\r\n 43: 'Wavy',\r\n premium: 'Premium Banked',\r\n 'baby-bundle': 'Baby Bundle',\r\n 'family-bundle': 'Family Bundle',\r\n 840: 'Asian',\r\n 841: 'Black',\r\n 843: 'Caucasian',\r\n 844: 'East Indian',\r\n 842: 'Hawaiian',\r\n 849: 'Hispanic',\r\n 850: 'Middle Eastern',\r\n 851: 'Native American',\r\n 693: '4\\' 08\"',\r\n 694: '4\\' 09\"',\r\n 695: '4\\' 10\"',\r\n 696: '4\\' 11\"',\r\n 697: '5\\' 00\"',\r\n 698: '5\\' 01\"',\r\n 699: '5\\' 02\"',\r\n 700: '5\\' 03\"',\r\n 701: '5\\' 04\"',\r\n 702: '5\\' 05\"',\r\n 703: '5\\' 06\"',\r\n 704: '5\\' 07\"',\r\n 705: '5\\' 08\"',\r\n 706: '5\\' 09\"',\r\n 707: '5\\' 10\"',\r\n 708: '5\\' 11\"',\r\n 709: '6\\' 00\"',\r\n 710: '6\\' 01\"',\r\n 711: '6\\' 02\"',\r\n 712: '6\\' 03\"',\r\n 713: '6\\' 04\"',\r\n 762: 'In US',\r\n 761: 'Outside US',\r\n};\r\n","import React, { useState, useEffect, useCallback } from 'react';\r\nimport { useDispatch, useSelector } from 'react-redux';\r\nimport { Modal } from 'synfrastructure';\r\n\r\nimport DonorTraitSelector, { DonorTrait } from './DonorTraitSelector';\r\nimport DonorHeightSlider from './DonorHeightSlider';\r\nimport { useQuery } from '../../common/utils/hooks';\r\nimport Close from '../../common/components/icons/close';\r\nimport Plus from '../../common/components/icons/plus';\r\nimport Minus from '../../common/components/icons/minus';\r\nimport { colors } from '../../app-theme';\r\n\r\nimport { setShowOptionTypesModal } from '../../redux/ui-actions';\r\nimport Button from '../../common/components/buttons/button';\r\nimport InfoCircle from '../../common/components/icons/info-circle';\r\nimport BabyBundle from '../../common/components/icons/baby-bundle';\r\nimport FamilyBundle from '../../common/components/icons/family-bundle';\r\nimport PremiumBanked from '../../common/components/icons/premium-banked';\r\nimport lookups from '../../common/utils/lookups';\r\nimport BankedCustomChoice from '../../common/components/icons/banked-custom-choice';\r\nimport { getRecipientById } from '../../redux/recipient-actions';\r\n\r\nconst DonorTraits = () => {\r\n const dispatch = useDispatch();\r\n const [query, setQuery] = useQuery();\r\n const [characteristicsExpanded, setCharacteristicsExpanded] = useState(true);\r\n const [characteristicsShowMore, setCharacteristicsShowMore] = useState(\r\n query.has('hair_texture') ||\r\n query.has('min_height') ||\r\n query.has('max_height') ||\r\n query.has('blood_type') ||\r\n query.has('blood_type_rh')\r\n );\r\n const [eggAvailabilityExpanded, setEggAvailabilityExpanded] = useState(true);\r\n const [eggAvailabilityShowMore, setEggAvailabilityShowMore] = useState(\r\n query.has('option_type') || query.has('ancestry')\r\n );\r\n const showOptionTypesModal = useSelector(({ ui }) => ui.get('showOptionTypesModal'));\r\n const isMobile = useSelector(({ browser }) => browser.lessThan.medium);\r\n const [editingFilters, setEditingFilters] = useState(false);\r\n const [lookupFilters, setLookupFilters] = useState([]);\r\n\r\n const [hideCountries, setHideCountries] = useState(true);\r\n const recipient = useSelector(({ recipient }) => recipient);\r\n const recipientId = useSelector(({ user }) => user.getIn(['data', 'legacy_user_id']));\r\n\r\n const clearFilters = useCallback(() => {\r\n const newQuery = query\r\n .delete('from')\r\n .delete('race')\r\n .delete('eye_color')\r\n .delete('hair_color')\r\n .delete('hair_texture')\r\n .delete('min_height')\r\n .delete('max_height')\r\n .delete('blood_type')\r\n .delete('blood_type_rh')\r\n .delete('option_type')\r\n .delete('ancestry');\r\n if (!recipient) {\r\n query.delete('available_in')\r\n }\r\n setQuery(newQuery);\r\n setEditingFilters(true);\r\n }, [query, setQuery, setEditingFilters, recipient]);\r\n\r\n ///\r\n /// Find the current recipient (if there is one) - and show/hide the country selections accordingly\r\n ///\r\n useEffect(() => {\r\n if (recipientId) {\r\n ///\r\n /// We only want to execute this if we don't already have a recipient\r\n ///\r\n if (!recipient.Id) {\r\n dispatch(getRecipientById(recipientId));\r\n }\r\n\r\n ///\r\n /// Hide the country selections if the recipient has a country of residence, but show them otherwise\r\n ///\r\n setHideCountries(['US', 'AU', 'CA','UK'].includes(recipient.CountryCode));\r\n }\r\n else {\r\n ///\r\n /// If there is no recipient Id then this is an anonymous search, so don't hide the country selections\r\n ///\r\n setHideCountries(false);\r\n }\r\n }, [dispatch, recipientId, recipient, query, setQuery]);\r\n\r\n useEffect(() => {\r\n\r\n let currentFilters = query\r\n .delete('option')\r\n .delete('max_height')\r\n .delete('min_height')\r\n .toList()\r\n .toJS()\r\n .reduce((traits, trait) => traits.concat(Array.isArray(trait) ? trait : [trait]), [])\r\n .map(t => lookups[t])\r\n .filter(Boolean);\r\n\r\n const maxHeight = query.get('max_height');\r\n const minHeight = query.get('min_height');\r\n\r\n if (maxHeight && minHeight) {\r\n currentFilters.push(`${lookups[minHeight]} to ${lookups[maxHeight]}`);\r\n } else if (maxHeight) {\r\n currentFilters.push(`< ${lookups[maxHeight]}`);\r\n } else if (minHeight) {\r\n currentFilters.push(`> ${lookups[minHeight]}`);\r\n }\r\n\r\n setLookupFilters(currentFilters);\r\n }, [query, setLookupFilters]);\r\n\r\n return (\r\n \r\n
\r\n \r\n {min === MIN && max === MAX && 'Any'}\r\n {min !== MIN && OPTIONS.find(({ value }) => value === min).label}\r\n {min !== MIN && max !== MAX && ' to '}\r\n {max !== MAX && OPTIONS.find(({ value }) => value === max).label}\r\n
\r\n \r\n {label}{' '}\r\n {(min !== MIN || max !== MAX) && (\r\n \r\n (\r\n {\r\n e.stopPropagation();\r\n e.nativeEvent.stopImmediatePropagation();\r\n\r\n setQuery(\r\n query\r\n .delete('min_height')\r\n .delete('max_height')\r\n .delete('from')\r\n );\r\n }}\r\n >\r\n Clear All\r\n \r\n )\r\n \r\n )}\r\n
\r\n \r\n
\r\n \r\n {\r\n e.stopPropagation();\r\n e.nativeEvent.stopImmediatePropagation();\r\n }}\r\n >\r\n {\r\n setMin(min);\r\n setMax(max);\r\n }}\r\n onChangeCommitted={(e, [min, max]) => {\r\n let newQuery = query\r\n .delete('min_height')\r\n .delete('max_height')\r\n .delete('from');\r\n\r\n if (max < MAX) {\r\n newQuery = newQuery.set('max_height', max);\r\n }\r\n\r\n if (min > MIN) {\r\n newQuery = newQuery.set('min_height', min);\r\n }\r\n\r\n setQuery(newQuery);\r\n }}\r\n orientation=\"vertical\"\r\n value={[min, max]}\r\n valueLabelDisplay=\"on\"\r\n valueLabelFormat={val => OPTIONS.find(({ value }) => value === val).label}\r\n />\r\n
\r\n \r\n
\r\n \r\n Select {label}\r\n {(min !== MIN || max !== MAX) && (\r\n \r\n setQuery(\r\n query\r\n .delete('min_height')\r\n .delete('max_height')\r\n .delete('from')\r\n )\r\n }\r\n >\r\n Clear All\r\n \r\n )}\r\n
\r\n \r\n
\r\n \r\n \r\n Clear Filters\r\n \r\n )}\r\n\r\n \r\n \r\n
\r\n
\r\n );\r\n};\r\n\r\nexport default DonorTraits;\r\n","import React from 'react';\r\nimport Svg, { Path } from 'svgs';\r\n\r\nconst ChevronLeft = ({ size, fill }) => {\r\n return (\r\n \r\n );\r\n};\r\n\r\nexport default ChevronLeft;\r\n","import React, { useCallback } from 'react';\r\nimport { shallowEqual, useDispatch, useSelector } from 'react-redux';\r\nimport cn from 'classnames';\r\n\r\nimport ChevronLeft from '../../common/components/icons/chevron-left';\r\nimport ChevronRight from '../../common/components/icons/chevron-right';\r\nimport LeftArrow from '../../common/components/icons/left-arrow';\r\nimport { useEventListener, usePhotos } from '../../common/utils/hooks';\r\nimport { setLightboxPhotoId } from '../../redux/ui-actions';\r\nimport Button from '../../common/components/buttons/button';\r\n\r\nconst DonorPhotosLightboxModal = () => {\r\n const dispatch = useDispatch();\r\n const [donor, photoId] = useSelector(\r\n ({ donors: { profile }, ui }) => [profile.get('data'), ui.get('lightboxPhotoId')],\r\n shallowEqual\r\n );\r\n const { photos } = usePhotos(donor);\r\n\r\n const entry = photos.findEntry(photo => photo.get('id') === photoId);\r\n\r\n let nextId;\r\n let prevId;\r\n let index;\r\n let current;\r\n\r\n if (entry) {\r\n [index, current] = entry;\r\n nextId = photos.get(index + 1 === photos.size ? 0 : index + 1).get('id');\r\n prevId = photos.get(index - 1).get('id');\r\n }\r\n\r\n const handler = useCallback(\r\n e => {\r\n if (e.key === 'ArrowLeft' && prevId) {\r\n dispatch(setLightboxPhotoId(prevId));\r\n } else if (e.key === 'ArrowRight' && nextId) {\r\n dispatch(setLightboxPhotoId(nextId));\r\n }\r\n },\r\n [dispatch, nextId, prevId]\r\n );\r\n useEventListener('keydown', handler, document);\r\n\r\n if (!entry) {\r\n return null;\r\n }\r\n\r\n return (\r\n Select Traits
\r\n\r\n {isMobile && lookupFilters.length > 0 && (\r\n\r\n Filtered by: {lookupFilters.slice(0, 5).join(', ')}\r\n {lookupFilters.length > 5 && ', etc...'}\r\n
\r\n )}\r\n\r\n {(!isMobile || editingFilters) && (\r\n <>\r\n\r\n Use the following options to filter donors based on your preferences. Keeping your search criteria to a\r\n minimum will allow a wider selection of donors\r\n
\r\n\r\n {lookupFilters.length > 0 && (\r\n\r\n setCharacteristicsExpanded(!characteristicsExpanded)}>\r\n Characteristics\r\n \r\n {!characteristicsExpanded ? (\r\n
\r\n {characteristicsExpanded && (\r\n <>\r\n \r\n \r\n \r\n \r\n \r\n \r\n {characteristicsShowMore && (\r\n \r\n \r\n )}\r\n {characteristicsShowMore && \r\n \r\n )}\r\n {characteristicsShowMore && (\r\n \r\n \r\n )}\r\n {!characteristicsShowMore && (\r\n setCharacteristicsShowMore(true)}>\r\n More Options\r\n \r\n )}\r\n {characteristicsShowMore && (\r\n setCharacteristicsShowMore(false)}>\r\n Less Options\r\n \r\n )}\r\n \r\n )}\r\n
\r\n\r\n setCharacteristicsExpanded(!characteristicsExpanded)}>\r\n Characteristics\r\n \r\n {!characteristicsExpanded ? (\r\n
\r\n {characteristicsExpanded && (\r\n <>\r\n \r\n setEggAvailabilityExpanded(!eggAvailabilityExpanded)}>\r\n {!hideCountries && Egg Availability & Type}\r\n {hideCountries && Egg Type}\r\n \r\n {!eggAvailabilityExpanded ? (\r\n
\r\n {eggAvailabilityExpanded && (\r\n <>\r\n {!hideCountries && \r\n \r\n }\r\n {eggAvailabilityShowMore && (\r\n <>\r\n (\r\n \r\n Option Type{' '}\r\n {!Boolean(size) && (\r\n \r\n (\r\n {\r\n e.stopPropagation();\r\n e.nativeEvent.stopImmediatePropagation();\r\n dispatch(setShowOptionTypesModal(true));\r\n }}\r\n >\r\n What's this?\r\n \r\n )\r\n \r\n )}\r\n \r\n )}\r\n trait=\"option_type\"\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 {isMobile && (\r\n setEggAvailabilityExpanded(!eggAvailabilityExpanded)}>\r\n {!hideCountries && Egg Availability & Type}\r\n {hideCountries && Egg Type}\r\n \r\n {!eggAvailabilityExpanded ? (\r\n
\r\n {eggAvailabilityExpanded && (\r\n <>\r\n {!hideCountries && \r\n {lookupFilters.length === 0 && (\r\n <>\r\n {!editingFilters && (\r\n \r\n )}\r\n {editingFilters && (\r\n \r\n )}\r\n \r\n )}\r\n {lookupFilters.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
\r\n \r\n
\r\n \r\n
\r\n
\r\n \r\n \r\n
\r\n \r\n These donors have already been screened, stimulated, and eggs retrieved and frozen. Select your eggs and we\r\n ship them directly to your clinic for warming, fertilization, and transfer.\r\n
\r\n\r\n
\r\n \r\n Create a custom cohort of 6 from lots of 1 - 5 eggs remaining from our premium donors at a reduced rate.\r\n
\r\n\r\n
\r\n \r\n In this process, you select a Fresh Custom Choice™ egg donor and we begin a fresh cycle consisting of screening, stimulating, and retrieving her eggs.\r\n You will have your partner’s or donor sperm shipped directly to us for fertilization of fresh donor eggs and the resulting embryos will\r\n be frozen and shipped to your clinic.\r\n
\r\n\r\n
\r\n \r\n With the Frozen Custom Choice ™ Embryo Option, you select an egg donor that already has eggs frozen in the bank. We thaw and fertilize the eggs\r\n using donor sperm from The World Egg and Sperm Bank or using your partner’s sperm or the donor sperm you ship to us. Once the donor eggs are fertilized,\r\n the resulting embryos will be vitrified and shipped to your clinic to use in your treatment.\r\n
\r\n\r\n
\r\n );\r\n};\r\n\r\nexport default DonorPhotosLightboxModal;\r\n","import React from 'react';\r\nimport Svg, { Path } from 'svgs';\r\n\r\nconst ChevronUp = ({ size, fill }) => {\r\n return (\r\n \r\n );\r\n};\r\n\r\nexport default ChevronUp;\r\n","import React from 'react';\r\nimport Svg, { Path } from 'svgs';\r\n\r\nconst ChevronDown = ({ size, fill }) => {\r\n return (\r\n \r\n );\r\n};\r\n\r\nexport default ChevronDown;\r\n","import React, { Fragment, useMemo, useState } from 'react';\r\nimport { Map } from 'immutable';\r\n\r\nimport ChevronUp from '../../common/components/icons/chevron-up';\r\nimport ChevronDown from '../../common/components/icons/chevron-down';\r\nimport { colors } from '../../app-theme';\r\n\r\nconst DonorProfileOverview = ({ family }) => {\r\n const [grandparentsExpanded, setGrandparentsExpanded] = useState(true);\r\n const [parentsExpanded, setParentsExpanded] = useState(true);\r\n const [siblingsExpanded, setSiblingsExpanded] = useState(true);\r\n\r\n const [parents, siblings, grandparents] = useMemo(\r\n () => [\r\n [\r\n family\r\n .find(\r\n relation => relation.get('relationship_to_donor') === 'Father',\r\n null,\r\n new Map({ relationship_to_donor: 'Father' })\r\n )\r\n .toJS(),\r\n family\r\n .find(\r\n relation => relation.get('relationship_to_donor') === 'Mother',\r\n null,\r\n new Map({ relationship_to_donor: 'Mother' })\r\n )\r\n .toJS(),\r\n ],\r\n family.filter(relation => relation.get('relationship_to_donor').includes('Sibling')).toJS(),\r\n [\r\n family\r\n .find(\r\n relation => relation.get('relationship_to_donor') === 'Maternal Grand Mother',\r\n null,\r\n new Map({ relationship_to_donor: 'Maternal Grand Mother' })\r\n )\r\n .toJS(),\r\n family\r\n .find(\r\n relation => relation.get('relationship_to_donor') === 'Paternal Grand Mother',\r\n null,\r\n new Map({ relationship_to_donor: 'Paternal Grand Mother' })\r\n )\r\n .toJS(),\r\n family\r\n .find(\r\n relation => relation.get('relationship_to_donor') === 'Maternal Grand Father',\r\n null,\r\n new Map({ relationship_to_donor: 'Maternal Grand Father' })\r\n )\r\n .toJS(),\r\n family\r\n .find(\r\n relation => relation.get('relationship_to_donor') === 'Paternal Grand Father',\r\n null,\r\n new Map({ relationship_to_donor: 'Paternal Grand Father' })\r\n )\r\n .toJS(),\r\n ],\r\n ],\r\n [family]\r\n );\r\n\r\n const hasGrandparents = grandparents.some(grandparent => grandparent.family_member_id);\r\n const hasParents = parents.some(parent => parent.family_member_id);\r\n\r\n return (\r\n \r\n
\r\n dispatch(setLightboxPhotoId(prevId))}>\r\n
\r\n \r\n })
\r\n
\r\n dispatch(setLightboxPhotoId(nextId))}>\r\n
\r\n \r\n \r\n
\r\n \r\n {photos\r\n .map(photo => (\r\n {\r\n target.onerror = null;\r\n target.src = photo.get('thumb').replace(/\\.[^.]*$/, '.jpg');\r\n }}\r\n alt={`Donor ${donor.get('donor_id')}`}\r\n onClick={() => dispatch(setLightboxPhotoId(photo.get('id')))}\r\n className={cn({ current: photo.get('id') === current.get('id') })}\r\n />\r\n ))\r\n .toJS()}\r\n
\r\n \r\n {hasParents && (\r\n \r\n setParentsExpanded(!parentsExpanded)}>\r\n Parents\r\n {parentsExpanded ? (\r\n
\r\n {!parentsExpanded &&
}\r\n {parentsExpanded && \r\n )}\r\n {hasGrandparents && (\r\n \r\n setGrandparentsExpanded(!grandparentsExpanded)}>\r\n Grandparents\r\n {grandparentsExpanded ? (\r\n
\r\n {!grandparentsExpanded &&
}\r\n {grandparentsExpanded && \r\n )}\r\n {Boolean(siblings.length) && (\r\n \r\n setSiblingsExpanded(!siblingsExpanded)}>\r\n Siblings\r\n {siblingsExpanded ? (\r\n
\r\n {siblingsExpanded && \r\n )}\r\n
\r\n );\r\n};\r\n\r\nconst FamilyMembersTable = ({ familyMembers }) => (\r\n setParentsExpanded(!parentsExpanded)}>\r\n Parents\r\n {parentsExpanded ? (\r\n
\r\n {!parentsExpanded && }\r\n {parentsExpanded &&
setGrandparentsExpanded(!grandparentsExpanded)}>\r\n Grandparents\r\n {grandparentsExpanded ? (\r\n
\r\n {!grandparentsExpanded && }\r\n {grandparentsExpanded &&
setSiblingsExpanded(!siblingsExpanded)}>\r\n Siblings\r\n {siblingsExpanded ? (\r\n
\r\n {siblingsExpanded && | Relation | \r\n {familyMembers.map(({ relationship_to_donor, family_member_id }) => (\r\n\r\n {relationship_to_donor}\r\n | \r\n ))}\r\n
|---|---|
| Age | \r\n {familyMembers.map(({ age, relationship_to_donor }) => (\r\n{age || 'N/A'} | \r\n ))}\r\n
| Age at Death / Cause of Death | \r\n {familyMembers.map(({ age_at_death, relationship_to_donor }) => (\r\n{age_at_death || 'N/A'} | \r\n ))}\r\n
| Height | \r\n {familyMembers.map(({ height, relationship_to_donor }) => (\r\n{height || 'N/A'} | \r\n ))}\r\n
| Weight | \r\n {familyMembers.map(({ weight_and_units, relationship_to_donor }) => (\r\n{weight_and_units || 'N/A'} | \r\n ))}\r\n
| Race | \r\n {familyMembers.map(({ ethnicity, relationship_to_donor }) => (\r\n{ethnicity || 'N/A'} | \r\n ))}\r\n
| Eye Color | \r\n {familyMembers.map(({ eye_color, relationship_to_donor }) => (\r\n{eye_color || 'N/A'} | \r\n ))}\r\n
| Hair Color | \r\n {familyMembers.map(({ hair_color, relationship_to_donor }) => (\r\n{hair_color || 'N/A'} | \r\n ))}\r\n
| Skin Type | \r\n {familyMembers.map(({ skin_type, relationship_to_donor }) => (\r\n{skin_type || 'N/A'} | \r\n ))}\r\n
| Skills | \r\n {familyMembers.map(({ skills, relationship_to_donor }) => (\r\n{skills || 'N/A'} | \r\n ))}\r\n
| Occupation | \r\n {familyMembers.map(({ occupation, relationship_to_donor }) => (\r\n{occupation || 'N/A'} | \r\n ))}\r\n
| Education | \r\n {familyMembers.map(({ education_level, relationship_to_donor }) => (\r\n{education_level || 'N/A'} | \r\n ))}\r\n
\r\n
\r\n );\r\n};\r\n\r\nexport default DonorProfileGeneticReport;\r\n","import React from 'react';\r\nimport Svg, { Path } from 'svgs';\r\n\r\nconst Bulb = ({ size, fill }) => {\r\n return (\r\n \r\n );\r\n};\r\n\r\nexport default Bulb;\r\n","import React, { useMemo } from 'react';\r\n\r\nconst DonorProfileMedicalHistoryRow = ({ familyMember, issue, issues, label }) => {\r\n const familyMembers = useMemo(() => {\r\n let matches = issues\r\n .filter(medicalIssue => medicalIssue.get('question_text') === issue)\r\n .filter(medicalIssue => medicalIssue.get('answer') === 'Yes')\r\n // @TODO What are the \"No\" family members supposed to represent?\r\n .filter(medicalIssue => medicalIssue.get('family_member') !== 'No')\r\n .sortBy(medicalIssue => medicalIssue.get('family_member_id'));\r\n\r\n if (familyMember === 'parents') {\r\n matches = matches.filter(medicalIssue => ['Mother', 'Father'].includes(medicalIssue.get('family_member')));\r\n } else if (familyMember === 'grandparents') {\r\n matches = matches.filter(medicalIssue => medicalIssue.get('family_memmber') === 'Grand Parent');\r\n } else if (familyMember === 'donor') {\r\n matches = matches.filter(medicalIssue => medicalIssue.get('family_member') === 'You');\r\n }\r\n\r\n matches = matches.map(medicalIssue => {\r\n if (medicalIssue.get('family_member') === 'You') {\r\n medicalIssue = medicalIssue.set('family_member', 'Donor');\r\n }\r\n\r\n return medicalIssue;\r\n });\r\n\r\n return matches;\r\n }, [familyMember, issue, issues]);\r\n\r\n return (\r\n \r\n
\r\n \r\n
\r\n \r\n View this donor's genetic screening results covering more than 10,000 genetic traits.\r\n
\r\n\r\n IMPORTANT: Even though testing results may be negative, this should not be interpreted that the\r\n tissue is free from any genetic condition or that this donor is an appropriate match for the sperm contributor.\r\n Genetic counseling is recommended and available through Genescreen or your physician. Original reports are\r\n available to your physician or genetic counselor. These results must be reviewed by your physician.\r\n
\r\n\r\n This donor was tested for a panel of diseases using a combination of sequencing, targeted genotyping and copy\r\n number analysis. Please note that negative results reduce but do not eliminate the possibility that this\r\n individual is a carrier for one or more of the disorders tested. For specific detection rates and residual risk\r\n by ethnicity, please go to{' '}\r\n \r\n http://go.sema4.com/residualrisk\r\n \r\n . With individuals of mixed ethnicity, it is recommended to use the highest residual risk estimate. Only\r\n variants determined to be pathogenic or likely pathogenic are reported in this carrier screening test.\r\n
\r\n\r\n {reports.map((report, i) => (\r\n {\r\n const res = await client.get(`donors/${donorId}/document/${report.document_id}/download-token`);\r\n const { token } = await res.json();\r\n\r\n const reportWindow = window.open();\r\n reportWindow.opener = null;\r\n reportWindow.location = `${config.apiUrl}/donors/${donorId}/document/${report.document_id}?token=${token}`;\r\n }}\r\n >\r\n {reports.length > 1 ? `Genetic Report ${i + 1}` : 'View & Download Report'}\r\n \r\n ))}\r\n
\r\n \r\n setExpanded(!expanded)}>\r\n {heading}\r\n {expanded ? (\r\n
\r\n {!expanded &&
}\r\n {expanded && (\r\n\r\n \r\n \r\n
\r\n
\r\n \r\n )}\r\n
\r\n );\r\n};\r\n\r\nDonorProfileMedicalHistoryTable.propTypes = {\r\n defaultExpanded: PropTypes.bool,\r\n heading: PropTypes.node.isRequired,\r\n};\r\n\r\nDonorProfileMedicalHistoryTable.defaultProps = {\r\n defaultExpanded: false,\r\n};\r\n\r\nexport default DonorProfileMedicalHistoryTable;\r\n","import React from 'react';\r\n\r\nimport Bulb from '../../common/components/icons/bulb-o';\r\nimport DonorProfileMedicalHistoryRow from './DonorProfileMedicalHistoryRow';\r\nimport DonorProfileMedicalHistoryTable from './DonorProfileMedicalHistoryTable';\r\nimport { colors } from '../../app-theme';\r\n\r\nconst DonorProfileMedicalHistory = ({ issues }) => {\r\n return (\r\n setExpanded(!expanded)}>\r\n {heading}\r\n {expanded ? (\r\n
\r\n {!expanded && }\r\n {expanded && (\r\n
\r\n setFamilyMember('all')}\r\n >\r\n All\r\n \r\n setFamilyMember('donor')}\r\n >\r\n Donor\r\n \r\n setFamilyMember('parents')}\r\n >\r\n Parents\r\n \r\n setFamilyMember('grandparents')}\r\n >\r\n Grandparents\r\n \r\n
\r\n | Medical Condition | \r\nWho | \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 GI Cancer (esophagus, stomach, intestine, colon, more)}\r\n />\r\n \r\n\r\n \r\n \r\n
\r\n );\r\n};\r\n\r\nexport default DonorProfileMedicalHistory;\r\n","import React, { useMemo, useState } from 'react';\r\nimport cn from 'classnames';\r\nimport ChevronUp from '../../common/components/icons/chevron-up';\r\nimport ChevronDown from '../../common/components/icons/chevron-down';\r\nimport { colors } from '../../app-theme';\r\n\r\nconst DonorProfileOverview = ({ donor }) => {\r\n const [backgroundExpanded, setBackgroundExpanded] = useState(true);\r\n const [characteristicsExpanded, setCharacteristicsExpanded] = useState(true);\r\n const [currentTab, setCurrentTab] = useState('talents');\r\n const [descriptionExpanded, setDescriptionExpanded] = useState(true);\r\n\r\n const donorData = useMemo(() => donor.toJS(), [donor]);\r\n\r\n const getDonorGpa = () => {\r\n const gpa = donorData.college_gpa || donorData.school_gpa;\r\n switch(gpa) {\r\n case 5:\r\n return '<3.0';\r\n case 6:\r\n return '3.0-3.5';\r\n case 7:\r\n return '3.5-4.0';\r\n case 8:\r\n return '>4.0';\r\n case null:\r\n return 'N/A';\r\n default:\r\n return gpa;\r\n };\r\n };\r\n const donorGpa = getDonorGpa();\r\n\r\n return (\r\n Donor and Family Medical History
\r\n\r\n
\r\n\r\n \r\n setCharacteristicsExpanded(!characteristicsExpanded)}>\r\n Characteristics\r\n {characteristicsExpanded ? (\r\n
\r\n {!characteristicsExpanded &&
}\r\n {characteristicsExpanded && (\r\n setBackgroundExpanded(!backgroundExpanded)}>\r\n Donor Background\r\n {backgroundExpanded ? (\r\n
\r\n {!backgroundExpanded &&
}\r\n {backgroundExpanded && (\r\n setDescriptionExpanded(!descriptionExpanded)}>\r\n Donor Description\r\n {descriptionExpanded ? (\r\n
\r\n {descriptionExpanded && (\r\n
\r\n );\r\n};\r\n\r\nexport default DonorProfileOverview;\r\n","import React from 'react';\r\nimport Svg, { G, Circle, Path } from 'svgs';\r\n\r\nconst Image = ({ size, fill }) => {\r\n return (\r\n \r\n );\r\n};\r\n\r\nexport default Image;\r\n","import React, { useEffect, useState } from 'react';\r\nimport { useDispatch } from 'react-redux';\r\n\r\nimport { usePhotos } from '../../common/utils/hooks';\r\nimport { setLightboxPhotoId } from '../../redux/ui-actions';\r\nimport DonorFavorite from './DonorFavorite';\r\nimport Image from '../../common/components/icons/image';\r\n\r\nconst DonorProfilePhotos = ({ donor }) => {\r\n const dispatch = useDispatch();\r\n const {\r\n photos,\r\n primary: { index: primaryIndex },\r\n } = usePhotos(donor);\r\n const [index, setIndex] = useState(0);\r\n\r\n useEffect(() => {\r\n setIndex(primaryIndex);\r\n }, [primaryIndex]);\r\n\r\n return (\r\n setCharacteristicsExpanded(!characteristicsExpanded)}>\r\n Characteristics\r\n {characteristicsExpanded ? (\r\n
\r\n {!characteristicsExpanded && }\r\n {characteristicsExpanded && (\r\n
\r\n
\r\n )}\r\n - \r\n
- \r\n Eye Color\r\n{donorData.eye_color || 'N/A'}\r\n \r\n
- \r\n Hair Color\r\n{donorData.hair_color || 'N/A'}\r\n \r\n
- \r\n Hair Texture\r\n\r\n {donorData.hair_texture.length ? donorData.hair_texture.join(', ') : 'N/A'}\r\n\r\n \r\n
- \r\n Skin Type\r\n{donorData.skin_type || 'N/A'}\r\n \r\n
- \r\n
- \r\n Height\r\n{donorData.height || 'N/A'}\r\n \r\n
- \r\n Weight\r\n{donorData.weight_and_units || 'N/A'}\r\n \r\n
- \r\n Body Type\r\n{donorData.body_type || 'N/A'}\r\n \r\n
- \r\n Blood Type\r\n{donorData.blood_type || 'N/A'}\r\n \r\n
- \r\n
- \r\n Race\r\n{donorData.ethnicity || 'N/A'}\r\n \r\n
- \r\n Mother's Ancestry\r\n\r\n {donorData.ancestry_mother.length ? donorData.ancestry_mother.join(', ') : 'N/A'}\r\n\r\n \r\n
- \r\n Father's Ancestry\r\n\r\n {donorData.ancestry_father.length ? donorData.ancestry_father.join(', ') : 'N/A'}\r\n\r\n \r\n
- \r\n Rh Factor\r\n{donorData.blood_type_rh || 'N/A'}\r\n \r\n
setBackgroundExpanded(!backgroundExpanded)}>\r\n Donor Background\r\n {backgroundExpanded ? (\r\n
\r\n {!backgroundExpanded && }\r\n {backgroundExpanded && (\r\n
\r\n
\r\n )}\r\n - \r\n
- \r\n State/Province\r\n{donorData.state_or_province || 'N/A'}\r\n \r\n
- \r\n Country\r\n{donorData.country || 'N/A'}\r\n \r\n
- \r\n
- \r\n Education Level\r\n{donorData.education_level_public || 'N/A'}\r\n \r\n
- \r\n School GPA\r\n\r\n { donorGpa }\r\n\r\n \r\n
- \r\n
- \r\n Occupation\r\n{donorData.occupation || 'N/A'}\r\n \r\n
- \r\n SAT / ACT\r\n\r\n {donorData.sat || 'N/A'} / {donorData.act || 'N/A'}\r\n\r\n \r\n
setDescriptionExpanded(!descriptionExpanded)}>\r\n Donor Description\r\n {descriptionExpanded ? (\r\n
\r\n {descriptionExpanded && (\r\n \r\n \r\n
\r\n )}\r\n \r\n
\r\n {currentTab.charAt(0).toUpperCase() + currentTab.slice(1)}
\r\n{donorData[currentTab] || 'N/A'}
\r\n\r\n
\r\n );\r\n};\r\n\r\nexport default DonorProfilePhotos;\r\n","import React, { useState, useEffect } from 'react';\r\nimport { useDispatch, useSelector, shallowEqual } from 'react-redux';\r\nimport { editFavorite, editFavoriteReset } from '../../redux/donor-actions';\r\nimport TextButton from '../../common/components/buttons/text-button';\r\n\r\nconst DonorProfileNotes = ({ favorite }) => {\r\n const [notes, setNotes] = useState(favorite.notes);\r\n const dispatch = useDispatch();\r\n\r\n useEffect(() => {\r\n return () => dispatch(editFavoriteReset());\r\n }, [dispatch]);\r\n\r\n const [saving, saved] = useSelector(\r\n ({ donors: { editFavoriteApiRequest } }) => [\r\n editFavoriteApiRequest.get('saving'),\r\n editFavoriteApiRequest.get('saved'),\r\n ],\r\n shallowEqual\r\n );\r\n\r\n let saveButtonText = 'Save';\r\n if (saving) {\r\n saveButtonText = 'Saving...';\r\n } else if (saved) {\r\n saveButtonText = 'Saved!';\r\n }\r\n\r\n return (\r\n \r\n dispatch(setLightboxPhotoId(photos.getIn([index, 'id'])))}\r\n />\r\n
\r\n dispatch(setLightboxPhotoId(photos.getIn([index, 'id'])))}>\r\n
\r\n \r\n {photos\r\n .take(4)\r\n .map((photo, i) => (\r\n {\r\n target.onerror = null;\r\n target.src = photo.get('thumb').replace(/\\.[^.]*$/, '.jpg');\r\n }}\r\n alt={`Donor ${donor.get('donor_id')}`}\r\n onClick={() => dispatch(setLightboxPhotoId(photo.get('id')))}\r\n />\r\n ))\r\n .toJS()}\r\n
\r\n \r\n {\r\n if (saved) {\r\n dispatch(editFavoriteReset());\r\n }\r\n setNotes(e.currentTarget.value.slice(0, 1000));\r\n }}\r\n />\r\n {\r\n dispatch(editFavorite(favorite.id, notes));\r\n }}\r\n disabled={saving}\r\n className=\"donor-profile__text-button\"\r\n >\r\n {saveButtonText}\r\n \r\n
\r\n );\r\n};\r\n\r\nexport default DonorProfileNotes;\r\n","import React, { useMemo } from 'react';\r\nimport { Canvas, Document, Font, Image, Link, Page, StyleSheet, Text, View } from '@react-pdf/renderer';\r\nimport { usePhotos } from '../../common/utils/hooks';\r\nimport WhiteLogo from '../../common/images/TWESB_White.png';\r\nimport { colors } from '../../app-theme';\r\n\r\nFont.register({\r\n family: 'Roboto Slab',\r\n fonts: [\r\n { src: 'https://fonts.gstatic.com/s/robotoslab/v11/BngbUXZYTXPIvIBgJJSb6s3BzlRRfKOFbvjojISmb2RlV9Su1cai.woff' },\r\n {\r\n src: 'https://fonts.gstatic.com/s/robotoslab/v11/BngbUXZYTXPIvIBgJJSb6s3BzlRRfKOFbvjoa4Omb2RlV9Su1cai.woff',\r\n fontWeight: 700,\r\n },\r\n ],\r\n});\r\nFont.register({\r\n family: 'Muli',\r\n fonts: [\r\n { src: 'https://fonts.gstatic.com/s/muli/v20/7Aulp_0qiz-aVz7u3PJLcUMYOFnOkEk30e6fwniDtzM.woff' },\r\n { src: 'https://fonts.gstatic.com/s/muli/v20/7Aulp_0qiz-aVz7u3PJLcUMYOFlOl0k30e6fwniDtzM.woff', fontWeight: 700 },\r\n ],\r\n});\r\n\r\nconst styles = StyleSheet.create({\r\n footer: {\r\n bottom: 24,\r\n position: 'absolute',\r\n left: 24,\r\n },\r\n header: {\r\n alignItems: 'center',\r\n flexDirection: 'row',\r\n justifyContent: 'space-between',\r\n width: '100%',\r\n backgroundColor: colors.brandPurple,\r\n fontSize: 14,\r\n padding:5,\r\n marginTop:5,\r\n marginBottom:5\r\n },\r\n heading: {\r\n color: '#ffffff',\r\n fontFamily: 'Roboto Slab',\r\n },\r\n imageSmall: { height: 110, marginBottom: 6, marginRight: 6, width: 110 },\r\n page: {\r\n flexDirection: 'column',\r\n padding: 24,\r\n paddingBottom: 62,\r\n },\r\n sectionHeading: {\r\n fontFamily: 'Muli',\r\n color: '#652365',\r\n fontSize: 12,\r\n marginBottom: 12,\r\n fontWeight: 700,\r\n },\r\n table: { flexDirection: 'row', flexWrap: 'wrap' },\r\n tableCell: { boxSizing: 'border-box', flexGrow: 1 },\r\n tableCell2Col: { width: '50%', marginBottom: 12 },\r\n tableCell3Col: { width: '33.33%', marginBottom: 12 },\r\n text: {\r\n fontFamily: 'Muli',\r\n fontSize: 8,\r\n },\r\n flexTable: { display: 'table', width: 'auto' },\r\n tableRow: { margin: 'auto', flexDirection: 'row' },\r\n});\r\n\r\nconst Footer = () => (\r\n Notes
\r\n\r\n
\r\n
\r\n
\r\n
\r\n
\r\n
\r\n
\r\n );\r\n }\r\n\r\n return (\r\n \r\n
\r\n );\r\n};\r\n\r\nexport default DonorProfileModal;\r\n","import React from 'react';\r\nimport Svg, { Path } from 'svgs';\r\n\r\nconst RightArrow = ({ size, fill }) => {\r\n return (\r\n \r\n );\r\n};\r\n\r\nexport default RightArrow;\r\n","import React, { useEffect } from 'react';\r\nimport { Link, useHistory, useLocation } from 'react-router-dom';\r\nimport { shallowEqual, useDispatch, useSelector } from 'react-redux';\r\nimport store from 'store2';\r\n\r\nimport Button from '../../common/components/buttons/button';\r\nimport Loading from '../../common/components/Loading';\r\nimport RightArrow from '../../common/components/icons/right-arrow';\r\nimport TwebLogoWhiteHorizontal from '../../common/components/logo/logo-horizontal-white';\r\nimport { usePhotos, useQuery } from '../../common/utils/hooks';\r\n\r\nimport { getDonorProfile } from '../../redux/donor-actions';\r\n\r\nconst LoginModal = () => {\r\n const dispatch = useDispatch();\r\n const history = useHistory();\r\n const location = useLocation();\r\n const [query] = useQuery();\r\n\r\n const [donor, loaded, loading] = useSelector(\r\n ({ donors: { profile } }) => [profile.get('data'), profile.get('loaded'), profile.get('loading')],\r\n shallowEqual\r\n );\r\n\r\n useEffect(() => {\r\n if (query.get('profileId')) {\r\n dispatch(getDonorProfile(query.get('profileId')));\r\n }\r\n }, [dispatch, query]);\r\n\r\n const {\r\n primary: { full, largePlaceholder },\r\n } = usePhotos(donor);\r\n\r\n if (!loaded || loading || !query.get('profileId')) {\r\n return \r\n
\r\n \r\n
\r\n {donorData.favorited ? \r\n Contact us for more information or to move forward with this donor.\r\n
\r\n \r\n\r\n
\r\n \r\n {\r\n setGeneratingPdf(true);\r\n const blob = await pdf(
\r\n \r\n
\r\n Donor ID: {donorData.donor_id}
\r\n\r\n {donorData.banked_eggs && (\r\n
\r\n \r\n
\r\n )}\r\n {donorData.is_baby_bundle && (\r\n \r\n
\r\n )}\r\n {donorData.is_family_bundle && (\r\n \r\n
\r\n )}\r\n {donorData.is_banked_custom_choice && (\r\n \r\n
\r\n )} \r\n \r\n \r\n
\r\n \r\n {currentTab === 'overview' &&
\r\n \r\n
\r\n \r\n Questions or need help?{' '}\r\n setShowingContactUs(true)}>\r\n Contact Us\r\n \r\n .\r\n
\r\n\r\n
\r\n );\r\n};\r\n\r\nexport default LoginModal;\r\n","import React, { useEffect, useState } from 'react';\r\nimport { useDispatch, useSelector } from 'react-redux';\r\nimport { Modal } from 'synfrastructure';\r\n\r\nimport DonorList from './DonorList';\r\nimport DonorTraits from './DonorTraits';\r\nimport DonorProfileContactUs from './DonorProfileContactUs';\r\nimport DonorPhotosLightboxModal from './DonorPhotosLightboxModal';\r\nimport DonorProfileModal from './DonorProfileModal';\r\nimport LoginModal from './LoginModal';\r\n\r\nimport { setLightboxPhotoId } from '../../redux/ui-actions';\r\nimport Close from '../../common/components/icons/close';\r\nimport LeftArrow from '../../common/components/icons/left-arrow';\r\nimport { useQuery } from '../../common/utils/hooks';\r\n\r\nconst Donors = () => {\r\n const [isShowingContactUs, setShowingContactUs] = useState(false);\r\n const [profileId, setProfileId] = useState(null);\r\n const [query, setQuery] = useQuery();\r\n const dispatch = useDispatch();\r\n const lightboxPhotoId = useSelector(({ ui }) => ui.get('lightboxPhotoId'));\r\n const loggedIn = useSelector(({ user }) => user.get('loggedIn'));\r\n\r\n useEffect(() => setProfileId(query.get('profileId')), [query]);\r\n useEffect(() => setShowingContactUs(false), [profileId]);\r\n\r\n return (\r\n \r\n
\r\n \r\n \r\n
\r\n ID: {query.get('profileId')}
\r\n \r\n
\r\n \r\n {\r\n store.set('loginPath', location.pathname);\r\n store.set('loginSearch', location.search);\r\n history.push('/login');\r\n }}\r\n className=\"margin-bottom__s\"\r\n >\r\n Log In
\r\n One step away from finding your perfect donor.
\r\n\r\n In order to see more information about donors and save them to your personalized list, you need to sign in or\r\n register for an account.\r\n
\r\n\r\n Don't have an account? Create an account\r\n
\r\n\r\n \r\n {!isShowingContactUs && setShowingContactUs(false)}\r\n />\r\n )}\r\n {!isShowingContactUs && \r\n \r\n
\r\n );\r\n};\r\n\r\nexport default Donors;\r\n","import React from 'react';\r\nimport { useHistory } from 'react-router-dom';\r\n\r\nimport Button from '../../common/components/buttons/button';\r\nimport TwebLogoEgg from '../../common/components/logo/logo-colored-egg';\r\n\r\nconst FavoritesNoResults = () => {\r\n const history = useHistory();\r\n\r\n return (\r\n \r\n
\r\n );\r\n};\r\n\r\nexport default FavoritesNoResults;\r\n","import React, { useEffect } from 'react';\r\nimport { shallowEqual, useDispatch, useSelector } from 'react-redux';\r\nimport cn from 'classnames';\r\n\r\nimport DonorCard from '../Donors/DonorCard';\r\nimport DonorListItem from '../Donors/DonorListItem';\r\nimport DonorLoadMoreButton from '../Donors/DonorLoadMoreButton';\r\nimport FavoritesNoResults from './FavoritesNoResults';\r\nimport Loading from '../../common/components/Loading';\r\nimport { useQuery } from '../../common/utils/hooks';\r\nimport { getFavorites } from '../../redux/donor-actions';\r\n\r\nconst PAGE_SIZE = 150;\r\n\r\nconst FavoritesList = () => {\r\n const dispatch = useDispatch();\r\n const [query] = useQuery();\r\n const { from, mode } = query.toJS();\r\n\r\n useEffect(() => {\r\n dispatch(getFavorites(query, PAGE_SIZE));\r\n }, [dispatch, query]);\r\n\r\n const [donors, firstPage, loaded, total] = useSelector(\r\n ({ donors: { list } }) => [list.get('data'), list.get('firstPage'), list.get('loaded'), list.get('total')],\r\n shallowEqual\r\n );\r\n\r\n let DonorComponent = DonorCard;\r\n\r\n if (mode === 'list') {\r\n DonorComponent = DonorListItem;\r\n }\r\n\r\n return (\r\n \r\n
\r\n No Favorites Yet
\r\nClick the heart on your favorite donors to save them here
\r\n \r\n\r\n \r\n {donors.map(donor => (\r\n
\r\n )}\r\n {loaded && !total && My Favorites
\r\n {loaded && total > 0 && (\r\n\r\n Showing {total} donor{total > 1 && 's'}\r\n
\r\n )}\r\n {firstPage > 0 &&\r\n
\r\n )}\r\n {total > donors.size && \r\n \r\n {!isShowingContactUs && setShowingContactUs(false)}\r\n />\r\n )}\r\n {!isShowingContactUs && \r\n
\r\n );\r\n};\r\n\r\nexport default Favorites;\r\n","export const getValidationErrors = messages => {\r\n const errors = {};\r\n\r\n for (const { message, key } of messages) {\r\n errors[key.join('.')] = message;\r\n }\r\n\r\n return errors;\r\n};\r\n","\r\nexport async function getCountriesList() {\r\n return [\r\n { CountryCode: 'US', Name: 'United States' },\r\n { CountryCode: 'AF', Name: 'Afghanistan' },\r\n { CountryCode: 'AL', Name: 'Albania' },\r\n { CountryCode: 'DZ', Name: 'Algeria' },\r\n { CountryCode: 'AS', Name: 'American Samoa' },\r\n { CountryCode: 'AD', Name: 'Andorra' },\r\n { CountryCode: 'AO', Name: 'Angola' },\r\n { CountryCode: 'AI', Name: 'Anguilla' },\r\n { CountryCode: 'AQ', Name: 'Antarctica' },\r\n { CountryCode: 'AG', Name: 'Antigua and Barbuda' },\r\n { CountryCode: 'AR', Name: 'Argentina' },\r\n { CountryCode: 'AM', Name: 'Armenia' },\r\n { CountryCode: 'AW', Name: 'Aruba' },\r\n { CountryCode: 'AU', Name: 'Australia' },\r\n { CountryCode: 'AT', Name: 'Austria' },\r\n { CountryCode: 'AZ', Name: 'Azerbaijan' },\r\n { CountryCode: 'BS', Name: 'Bahamas' },\r\n { CountryCode: 'BH', Name: 'Bahrain' },\r\n { CountryCode: 'BD', Name: 'Bangladesh' },\r\n { CountryCode: 'BB', Name: 'Barbados' },\r\n { CountryCode: 'BY', Name: 'Belarus' },\r\n { CountryCode: 'BE', Name: 'Belgium' },\r\n { CountryCode: 'BZ', Name: 'Belize' },\r\n { CountryCode: 'BJ', Name: 'Benin' },\r\n { CountryCode: 'BM', Name: 'Bermuda' },\r\n { CountryCode: 'BT', Name: 'Bhutan' },\r\n { CountryCode: 'BO', Name: 'Bolivia' },\r\n { CountryCode: 'BA', Name: 'Bosnia and Herzegovina' },\r\n { CountryCode: 'BW', Name: 'Botswana' },\r\n { CountryCode: 'BR', Name: 'Brazil' },\r\n { CountryCode: 'IO', Name: 'British Indian Ocean Territory' },\r\n { CountryCode: 'VG', Name: 'British Virgin Islands' },\r\n { CountryCode: 'BN', Name: 'Brunei' },\r\n { CountryCode: 'BG', Name: 'Bulgaria' },\r\n { CountryCode: 'BF', Name: 'Burkina Faso' },\r\n { CountryCode: 'BI', Name: 'Burundi' },\r\n { CountryCode: 'KH', Name: 'Cambodia' },\r\n { CountryCode: 'CM', Name: 'Cameroon' },\r\n { CountryCode: 'CA', Name: 'Canada' },\r\n { CountryCode: 'CV', Name: 'Cape Verde' },\r\n { CountryCode: 'KY', Name: 'Cayman Islands' },\r\n { CountryCode: 'CF', Name: 'Central African Republic' },\r\n { CountryCode: 'TD', Name: 'Chad' },\r\n { CountryCode: 'CL', Name: 'Chile' },\r\n { CountryCode: 'CN', Name: 'China' },\r\n { CountryCode: 'CX', Name: 'Christmas Island' },\r\n { CountryCode: 'CC', Name: 'Cocos Islands' },\r\n { CountryCode: 'CO', Name: 'Colombia' },\r\n { CountryCode: 'KM', Name: 'Comoros' },\r\n { CountryCode: 'CK', Name: 'Cook Islands' },\r\n { CountryCode: 'CR', Name: 'Costa Rica' },\r\n { CountryCode: 'HR', Name: 'Croatia' },\r\n { CountryCode: 'CU', Name: 'Cuba' },\r\n { CountryCode: 'CW', Name: 'Curacao' },\r\n { CountryCode: 'CY', Name: 'Cyprus' },\r\n { CountryCode: 'CZ', Name: 'Czech Republic' },\r\n { CountryCode: 'CD', Name: 'Democratic Republic of the Congo' },\r\n { CountryCode: 'DK', Name: 'Denmark' },\r\n { CountryCode: 'DJ', Name: 'Djibouti' },\r\n { CountryCode: 'DM', Name: 'Dominica' },\r\n { CountryCode: 'DO', Name: 'Dominican Republic' },\r\n { CountryCode: 'TL', Name: 'East Timor' },\r\n { CountryCode: 'EC', Name: 'Ecuador' },\r\n { CountryCode: 'EG', Name: 'Egypt' },\r\n { CountryCode: 'SV', Name: 'El Salvador' },\r\n { CountryCode: 'GQ', Name: 'Equatorial Guinea' },\r\n { CountryCode: 'ER', Name: 'Eritrea' },\r\n { CountryCode: 'EE', Name: 'Estonia' },\r\n { CountryCode: 'ET', Name: 'Ethiopia' },\r\n { CountryCode: 'FK', Name: 'Falkland Islands' },\r\n { CountryCode: 'FO', Name: 'Faroe Islands' },\r\n { CountryCode: 'FJ', Name: 'Fiji' },\r\n { CountryCode: 'FI', Name: 'Finland' },\r\n { CountryCode: 'FR', Name: 'France' },\r\n { CountryCode: 'PF', Name: 'French Polynesia' },\r\n { CountryCode: 'GA', Name: 'Gabon' },\r\n { CountryCode: 'GM', Name: 'Gambia' },\r\n { CountryCode: 'GE', Name: 'Georgia' },\r\n { CountryCode: 'DE', Name: 'Germany' },\r\n { CountryCode: 'GH', Name: 'Ghana' },\r\n { CountryCode: 'GI', Name: 'Gibraltar' },\r\n { CountryCode: 'GR', Name: 'Greece' },\r\n { CountryCode: 'GL', Name: 'Greenland' },\r\n { CountryCode: 'GD', Name: 'Grenada' },\r\n { CountryCode: 'GU', Name: 'Guam' },\r\n { CountryCode: 'GT', Name: 'Guatemala' },\r\n { CountryCode: 'GG', Name: 'Guernsey' },\r\n { CountryCode: 'GN', Name: 'Guinea' },\r\n { CountryCode: 'GW', Name: 'Guinea-Bissau' },\r\n { CountryCode: 'GY', Name: 'Guyana' },\r\n { CountryCode: 'HT', Name: 'Haiti' },\r\n { CountryCode: 'HN', Name: 'Honduras' },\r\n { CountryCode: 'HK', Name: 'Hong Kong' },\r\n { CountryCode: 'HU', Name: 'Hungary' },\r\n { CountryCode: 'IS', Name: 'Iceland' },\r\n { CountryCode: 'IN', Name: 'India' },\r\n { CountryCode: 'ID', Name: 'Indonesia' },\r\n { CountryCode: 'IR', Name: 'Iran' },\r\n { CountryCode: 'IQ', Name: 'Iraq' },\r\n { CountryCode: 'IE', Name: 'Ireland' },\r\n { CountryCode: 'IM', Name: 'Isle of Man' },\r\n { CountryCode: 'IL', Name: 'Israel' },\r\n { CountryCode: 'IT', Name: 'Italy' },\r\n { CountryCode: 'CI', Name: 'Ivory Coast' },\r\n { CountryCode: 'JM', Name: 'Jamaica' },\r\n { CountryCode: 'JP', Name: 'Japan' },\r\n { CountryCode: 'JE', Name: 'Jersey' },\r\n { CountryCode: 'JO', Name: 'Jordan' },\r\n { CountryCode: 'KZ', Name: 'Kazakhstan' },\r\n { CountryCode: 'KE', Name: 'Kenya' },\r\n { CountryCode: 'KI', Name: 'Kiribati' },\r\n { CountryCode: 'XK', Name: 'Kosovo' },\r\n { CountryCode: 'KW', Name: 'Kuwait' },\r\n { CountryCode: 'KG', Name: 'Kyrgyzstan' },\r\n { CountryCode: 'LA', Name: 'Laos' },\r\n { CountryCode: 'LV', Name: 'Latvia' },\r\n { CountryCode: 'LB', Name: 'Lebanon' },\r\n { CountryCode: 'LS', Name: 'Lesotho' },\r\n { CountryCode: 'LR', Name: 'Liberia' },\r\n { CountryCode: 'LY', Name: 'Libya' },\r\n { CountryCode: 'LI', Name: 'Liechtenstein' },\r\n { CountryCode: 'LT', Name: 'Lithuania' },\r\n { CountryCode: 'LU', Name: 'Luxembourg' },\r\n { CountryCode: 'MO', Name: 'Macau' },\r\n { CountryCode: 'MK', Name: 'Macedonia' },\r\n { CountryCode: 'MG', Name: 'Madagascar' },\r\n { CountryCode: 'MW', Name: 'Malawi' },\r\n { CountryCode: 'MY', Name: 'Malaysia' },\r\n { CountryCode: 'MV', Name: 'Maldives' },\r\n { CountryCode: 'ML', Name: 'Mali' },\r\n { CountryCode: 'MT', Name: 'Malta' },\r\n { CountryCode: 'MH', Name: 'Marshall Islands' },\r\n { CountryCode: 'MR', Name: 'Mauritania' },\r\n { CountryCode: 'MU', Name: 'Mauritius' },\r\n { CountryCode: 'YT', Name: 'Mayotte' },\r\n { CountryCode: 'MX', Name: 'Mexico' },\r\n { CountryCode: 'FM', Name: 'Micronesia' },\r\n { CountryCode: 'MD', Name: 'Moldova' },\r\n { CountryCode: 'MC', Name: 'Monaco' },\r\n { CountryCode: 'MN', Name: 'Mongolia' },\r\n { CountryCode: 'ME', Name: 'Montenegro' },\r\n { CountryCode: 'MS', Name: 'Montserrat' },\r\n { CountryCode: 'MA', Name: 'Morocco' },\r\n { CountryCode: 'MZ', Name: 'Mozambique' },\r\n { CountryCode: 'MM', Name: 'Myanmar' },\r\n { CountryCode: 'NA', Name: 'Namibia' },\r\n { CountryCode: 'NR', Name: 'Nauru' },\r\n { CountryCode: 'NP', Name: 'Nepal' },\r\n { CountryCode: 'NL', Name: 'Netherlands' },\r\n { CountryCode: 'AN', Name: 'Netherlands Antilles' },\r\n { CountryCode: 'NC', Name: 'New Caledonia' },\r\n { CountryCode: 'NZ', Name: 'New Zealand' },\r\n { CountryCode: 'NI', Name: 'Nicaragua' },\r\n { CountryCode: 'NE', Name: 'Niger' },\r\n { CountryCode: 'NG', Name: 'Nigeria' },\r\n { CountryCode: 'NU', Name: 'Niue' },\r\n { CountryCode: 'KP', Name: 'North Korea' },\r\n { CountryCode: 'MP', Name: 'Northern Mariana Islands' },\r\n { CountryCode: 'NO', Name: 'Norway' },\r\n { CountryCode: 'OM', Name: 'Oman' },\r\n { CountryCode: 'PK', Name: 'Pakistan' },\r\n { CountryCode: 'PW', Name: 'Palau' },\r\n { CountryCode: 'PS', Name: 'Palestine' },\r\n { CountryCode: 'PA', Name: 'Panama' },\r\n { CountryCode: 'PG', Name: 'Papua New Guinea' },\r\n { CountryCode: 'PY', Name: 'Paraguay' },\r\n { CountryCode: 'PE', Name: 'Peru' },\r\n { CountryCode: 'PH', Name: 'Philippines' },\r\n { CountryCode: 'PN', Name: 'Pitcairn' },\r\n { CountryCode: 'PL', Name: 'Poland' },\r\n { CountryCode: 'PT', Name: 'Portugal' },\r\n { CountryCode: 'PR', Name: 'Puerto Rico' },\r\n { CountryCode: 'QA', Name: 'Qatar' },\r\n { CountryCode: 'CG', Name: 'Republic of the Congo' },\r\n { CountryCode: 'RE', Name: 'Reunion' },\r\n { CountryCode: 'RO', Name: 'Romania' },\r\n { CountryCode: 'RU', Name: 'Russia' },\r\n { CountryCode: 'RW', Name: 'Rwanda' },\r\n { CountryCode: 'BL', Name: 'Saint Barthelemy' },\r\n { CountryCode: 'SH', Name: 'Saint Helena' },\r\n { CountryCode: 'KN', Name: 'Saint Kitts and Nevis' },\r\n { CountryCode: 'LC', Name: 'Saint Lucia' },\r\n { CountryCode: 'MF', Name: 'Saint Martin' },\r\n { CountryCode: 'PM', Name: 'Saint Pierre and Miquelon' },\r\n { CountryCode: 'VC', Name: 'Saint Vincent and the Grenadines' },\r\n { CountryCode: 'WS', Name: 'Samoa' },\r\n { CountryCode: 'SM', Name: 'San Marino' },\r\n { CountryCode: 'ST', Name: 'Sao Tome and Principe' },\r\n { CountryCode: 'SA', Name: 'Saudi Arabia' },\r\n { CountryCode: 'SN', Name: 'Senegal' },\r\n { CountryCode: 'RS', Name: 'Serbia' },\r\n { CountryCode: 'SC', Name: 'Seychelles' },\r\n { CountryCode: 'SL', Name: 'Sierra Leone' },\r\n { CountryCode: 'SG', Name: 'Singapore' },\r\n { CountryCode: 'SX', Name: 'Sint Maarten' },\r\n { CountryCode: 'SK', Name: 'Slovakia' },\r\n { CountryCode: 'SI', Name: 'Slovenia' },\r\n { CountryCode: 'SB', Name: 'Solomon Islands' },\r\n { CountryCode: 'SO', Name: 'Somalia' },\r\n { CountryCode: 'ZA', Name: 'South Africa' },\r\n { CountryCode: 'KR', Name: 'South Korea' },\r\n { CountryCode: 'SS', Name: 'South Sudan' },\r\n { CountryCode: 'ES', Name: 'Spain' },\r\n { CountryCode: 'LK', Name: 'Sri Lanka' },\r\n { CountryCode: 'SD', Name: 'Sudan' },\r\n { CountryCode: 'SR', Name: 'Suriname' },\r\n { CountryCode: 'SJ', Name: 'Svalbard and Jan Mayen' },\r\n { CountryCode: 'SZ', Name: 'Swaziland' },\r\n { CountryCode: 'SE', Name: 'Sweden' },\r\n { CountryCode: 'CH', Name: 'Switzerland' },\r\n { CountryCode: 'SY', Name: 'Syria' },\r\n { CountryCode: 'TW', Name: 'Taiwan' },\r\n { CountryCode: 'TJ', Name: 'Tajikistan' },\r\n { CountryCode: 'TZ', Name: 'Tanzania' },\r\n { CountryCode: 'TH', Name: 'Thailand' },\r\n { CountryCode: 'TG', Name: 'Togo' },\r\n { CountryCode: 'TK', Name: 'Tokelau' },\r\n { CountryCode: 'TO', Name: 'Tonga' },\r\n { CountryCode: 'TT', Name: 'Trinidad and Tobago' },\r\n { CountryCode: 'TN', Name: 'Tunisia' },\r\n { CountryCode: 'TR', Name: 'Turkey' },\r\n { CountryCode: 'TM', Name: 'Turkmenistan' },\r\n { CountryCode: 'TC', Name: 'Turks and Caicos Islands' },\r\n { CountryCode: 'TV', Name: 'Tuvalu' },\r\n { CountryCode: 'VI', Name: 'U.S. Virgin Islands' },\r\n { CountryCode: 'UG', Name: 'Uganda' },\r\n { CountryCode: 'UA', Name: 'Ukraine' },\r\n { CountryCode: 'AE', Name: 'United Arab Emirates' },\r\n { CountryCode: 'GB', Name: 'United Kingdom' },\r\n { CountryCode: 'UY', Name: 'Uruguay' },\r\n { CountryCode: 'UZ', Name: 'Uzbekistan' },\r\n { CountryCode: 'VU', Name: 'Vanuatu' },\r\n { CountryCode: 'VA', Name: 'Vatican' },\r\n { CountryCode: 'VE', Name: 'Venezuela' },\r\n { CountryCode: 'VN', Name: 'Vietnam' },\r\n { CountryCode: 'WF', Name: 'Wallis and Futuna' },\r\n { CountryCode: 'EH', Name: 'Western Sahara' },\r\n { CountryCode: 'YE', Name: 'Yemen' },\r\n { CountryCode: 'ZM', Name: 'Zambia' },\r\n { CountryCode: 'ZW', Name: 'Zimbabwe' }\r\n ];\r\n}\r\n\r\nexport async function getStatesList(countryCode) {\r\n const allRegions = [\r\n { CountryCode: 'CN', StateCode: 'AB ', Name: 'Alberta' },\r\n { CountryCode: 'AU', StateCode: 'ACT', Name: 'Australian Capital Territory' },\r\n { CountryCode: 'US', StateCode: 'AK ', Name: 'Alaska' },\r\n { CountryCode: 'US', StateCode: 'AL ', Name: 'Alabama' },\r\n { CountryCode: 'US', StateCode: 'AR ', Name: 'Arkansas' },\r\n { CountryCode: 'US', StateCode: 'AS ', Name: 'American Samoa' },\r\n { CountryCode: 'US', StateCode: 'AZ ', Name: 'Arizona' },\r\n { CountryCode: 'CA', StateCode: 'BC ', Name: 'British Columbia' },\r\n { CountryCode: 'US', StateCode: 'CA ', Name: 'California' },\r\n { CountryCode: 'US', StateCode: 'CO ', Name: 'Colorado' },\r\n { CountryCode: 'US', StateCode: 'CT ', Name: 'Connecticut' },\r\n { CountryCode: 'US', StateCode: 'DC ', Name: 'District of Columbia' },\r\n { CountryCode: 'US', StateCode: 'DE ', Name: 'Delaware' },\r\n { CountryCode: 'US', StateCode: 'FL ', Name: 'Florida' },\r\n { CountryCode: 'US', StateCode: 'GA ', Name: 'Georgia' },\r\n { CountryCode: 'US', StateCode: 'GU ', Name: 'Guam' },\r\n { CountryCode: 'US', StateCode: 'HI ', Name: 'Hawaii' },\r\n { CountryCode: 'US', StateCode: 'IA ', Name: 'Iowa' },\r\n { CountryCode: 'US', StateCode: 'ID ', Name: 'Idaho' },\r\n { CountryCode: 'US', StateCode: 'IL ', Name: 'Illinois' },\r\n { CountryCode: 'US', StateCode: 'IN ', Name: 'Indiana' },\r\n { CountryCode: 'US', StateCode: 'KS ', Name: 'Kansas' },\r\n { CountryCode: 'US', StateCode: 'KY ', Name: 'Kentucky' },\r\n { CountryCode: 'US', StateCode: 'LA ', Name: 'Louisiana' },\r\n { CountryCode: 'US', StateCode: 'MA ', Name: 'Massachusetts' },\r\n { CountryCode: 'CA', StateCode: 'MB ', Name: 'Manitoba' },\r\n { CountryCode: 'US', StateCode: 'MD ', Name: 'Maryland' },\r\n { CountryCode: 'US', StateCode: 'ME ', Name: 'Maine' },\r\n { CountryCode: 'US', StateCode: 'MI ', Name: 'Michigan' },\r\n { CountryCode: 'US', StateCode: 'MN ', Name: 'Minnesota' },\r\n { CountryCode: 'US', StateCode: 'MO ', Name: 'Missouri' },\r\n { CountryCode: 'US', StateCode: 'MP ', Name: 'Northern Mariana Islands' },\r\n { CountryCode: 'US', StateCode: 'MS ', Name: 'Mississippi' },\r\n { CountryCode: 'US', StateCode: 'MT ', Name: 'Montana' },\r\n { CountryCode: 'CA', StateCode: 'NB ', Name: 'New Brunswick' },\r\n { CountryCode: 'US', StateCode: 'NC ', Name: 'North Carolina' },\r\n { CountryCode: 'US', StateCode: 'ND ', Name: 'North Dakota' },\r\n { CountryCode: 'US', StateCode: 'NE ', Name: 'Nebraska' },\r\n { CountryCode: 'US', StateCode: 'NH ', Name: 'New Hampshire' },\r\n { CountryCode: 'US', StateCode: 'NJ ', Name: 'New Jersey' },\r\n { CountryCode: 'CA', StateCode: 'NL ', Name: 'Newfoundland and Labrador' },\r\n { CountryCode: 'US', StateCode: 'NM ', Name: 'New Mexico' },\r\n { CountryCode: 'CA', StateCode: 'NS ', Name: 'Nova Scotia' },\r\n { CountryCode: 'AU', StateCode: 'NSW', Name: 'New South Wales' },\r\n { CountryCode: 'AU', StateCode: 'NT ', Name: 'Nothern Territory' },\r\n { CountryCode: 'CA', StateCode: 'NU ', Name: 'Nunavut' },\r\n { CountryCode: 'US', StateCode: 'NV ', Name: 'Nevada' },\r\n { CountryCode: 'US', StateCode: 'NY ', Name: 'New York' },\r\n { CountryCode: 'US', StateCode: 'OH ', Name: 'Ohio' },\r\n { CountryCode: 'US', StateCode: 'OK ', Name: 'Oklahoma' },\r\n { CountryCode: 'CA', StateCode: 'ON ', Name: 'Ontario' },\r\n { CountryCode: 'US', StateCode: 'OR ', Name: 'Oregon' },\r\n { CountryCode: 'US', StateCode: 'PA ', Name: 'Pennsylvania' },\r\n { CountryCode: 'CA', StateCode: 'PE ', Name: 'Prince Edward Island' },\r\n { CountryCode: 'US', StateCode: 'PR ', Name: 'Puerto Rico' },\r\n { CountryCode: 'CA', StateCode: 'PW ', Name: 'Palau' },\r\n { CountryCode: 'CA', StateCode: 'QC ', Name: 'Québec' },\r\n { CountryCode: 'AU', StateCode: 'QLD', Name: 'Queensland' },\r\n { CountryCode: 'US', StateCode: 'RI ', Name: 'Rhode Island' },\r\n { CountryCode: 'AU', StateCode: 'SA ', Name: 'South Australia' },\r\n { CountryCode: 'US', StateCode: 'SC ', Name: 'South Carolina' },\r\n { CountryCode: 'US', StateCode: 'SD ', Name: 'South Dakota' },\r\n { CountryCode: 'CA', StateCode: 'SK ', Name: 'Saskatchewan' },\r\n { CountryCode: 'AU', StateCode: 'TAS', Name: 'Tasmania' },\r\n { CountryCode: 'US', StateCode: 'TN ', Name: 'Tennessee' },\r\n { CountryCode: 'US', StateCode: 'TX ', Name: 'Texas' },\r\n { CountryCode: 'US', StateCode: 'UT ', Name: 'Utah' },\r\n { CountryCode: 'US', StateCode: 'VA ', Name: 'Virginia' },\r\n { CountryCode: 'US', StateCode: 'VI ', Name: 'Virgin Islands' },\r\n { CountryCode: 'AU', StateCode: 'VIC', Name: 'Victoria' },\r\n { CountryCode: 'US', StateCode: 'VT ', Name: 'Vermont' },\r\n { CountryCode: 'US', StateCode: 'WA ', Name: 'Washington' },\r\n { CountryCode: 'AU', StateCode: 'WAU', Name: 'Western Australia' },\r\n { CountryCode: 'US', StateCode: 'WI ', Name: 'Wisconsin' },\r\n { CountryCode: 'US', StateCode: 'WV ', Name: 'West Virginia' },\r\n { CountryCode: 'US', StateCode: 'WY ', Name: 'Wyoming' },\r\n { CountryCode: 'CA', StateCode: 'YT ', Name: 'Yukon Territory' }\r\n ];\r\n const countrySpecificRegions = allRegions.filter(r => r.CountryCode === countryCode);\r\n return countrySpecificRegions;\r\n}","import React, { useState, useEffect, useRef } from 'react';\r\nimport { Form, Formik, Field, ErrorMessage } from 'formik';\r\nimport { useDispatch } from 'react-redux';\r\nimport * as Yup from 'yup';\r\n\r\nimport Input from '../../common/forms/Input';\r\nimport { getValidationErrors } from '../../common/utils/form-helpers';\r\n\r\nimport { registerUser } from '../../redux/user-actions';\r\nimport { spacing, typography, colors } from '../../app-theme';\r\nimport Button from '../../common/components/buttons/button';\r\n\r\nimport helpImage from '../../common/images/Help-02-32.png';\r\nimport { getCountriesList, getStatesList } from '../../common/utils/countries-and-states'\r\n\r\nconst SCHEMA = Yup.object().shape({\r\n firstName: Yup.string()\r\n .trim()\r\n .max(64, 'Name must be 64 characters or less')\r\n .required('Please enter your first name'),\r\n lastName: Yup.string()\r\n .trim()\r\n .max(64, 'Name must be 64 characters or less')\r\n .required('Please enter your last name'),\r\n email: Yup.string()\r\n .trim()\r\n .email()\r\n .required('Please enter your email'),\r\n password: Yup.string()\r\n .min(8, 'Password must be at least 8 characters')\r\n .required('Please enter a password'),\r\n\r\n ///\r\n /// Validate that the user selected an option for contact permission\r\n ///\r\n mayWeContactYou: Yup.string().required('Please tell us if we may contact you'),\r\n\r\n ///\r\n /// Validate that the user provided a contact telephone # - but only if they agreed to contact\r\n ///\r\n contactPhoneNumber: Yup.string()\r\n .when(\"mayWeContactYou\", {\r\n is: \"True\",\r\n then: Yup.string().required('Please enter your contact telephone #'),\r\n otherwise: Yup.string()\r\n }),\r\n\r\n ///\r\n /// Validate that the user selected a country of residence\r\n ///\r\n country: Yup.string().required('Please select a country'),\r\n\r\n ///\r\n /// Validate that the user provided a state of residence - but only if they have selected one of the countries where we track states. \r\n ///\r\n state: Yup.string()\r\n .when('country', (country, schema) => {\r\n if (country === 'US' || country === 'AU' || country === 'CA') return schema.required('Please select a state/territory');\r\n }),\r\n\r\n ///\r\n /// Validate that the user provided a province/country or region - but only if they have selected one of the countries where we do NOT track states. \r\n ///\r\n province: Yup.string()\r\n .when('country', (country, schema) => {\r\n if (country !== 'US' && country !== 'AU' && country !== 'CA') return schema.required('Please enter a province/county or region');\r\n })\r\n\r\n});\r\n\r\nexport default ({ onSuccess }) => {\r\n const [showPassword, setShowPassword] = useState(false);\r\n const [showContactPhoneNumber, setShowContactPhoneNumber] = useState(false);\r\n const [showState, setShowState] = useState(false);\r\n const [countries, setCountries] = useState([]);\r\n const [states, setStates] = useState([]);\r\n\r\n const dispatch = useDispatch();\r\n const formikRef = useRef();\r\n ///\r\n /// Fetch list of contries (and generate country Select options) when the page is loaded\r\n ///\r\n useEffect(() => {\r\n async function getCountries() {\r\n try {\r\n const countriesData = await getCountriesList();\r\n const countriesHtml = countriesData.map((countriesData) => {\r\n return (\r\n \r\n );\r\n })\r\n setCountries(countriesHtml);\r\n } catch (error) {\r\n console.log(error);\r\n }\r\n }\r\n getCountries();\r\n\r\n }, []);\r\n\r\n ///\r\n /// Reveal/hide the contact telephone # based on whether or not the recipient agrees to be contacted\r\n ///\r\n const showHideContactNumber = (e) => {\r\n setShowContactPhoneNumber(e.target.value);\r\n };\r\n\r\n ///\r\n /// When the country of residence is changed, refresh the list of possible states.\r\n ///\r\n const countryChanged = (e) => {\r\n getStates(e.target.value);\r\n }\r\n\r\n ///\r\n /// Fetch a list of states/provinces/territories for the selected country, generate the State selection options, and reveal/hide the stateal drop down\r\n ///\r\n async function getStates(countryCode) {\r\n let statesData = await getStatesList(countryCode);\r\n let hasStates = (statesData !== null && statesData.length > 0);\r\n let statesHtml = [];\r\n\r\n if (hasStates) {\r\n statesHtml = statesData.map((statesData) => {\r\n return (\r\n \r\n );\r\n });\r\n }\r\n\r\n setStates(statesHtml);\r\n setShowState(hasStates);\r\n }\r\n\r\n return (\r\n \r\n \r\n
\r\n \r\n Your recipient ID: {recipientId}\r\n
\r\n )}\r\n \r\n
\r\n );\r\n};\r\n\r\nconst styles = {\r\n h2: {\r\n ...typography.displayL,\r\n marginBottom: spacing.u4,\r\n },\r\n h3: {\r\n ...typography.displayS,\r\n marginBottom: spacing.u4,\r\n fontWeight: typography.regular,\r\n },\r\n h4: {\r\n ...typography.displayS,\r\n marginBottom: spacing.u1,\r\n },\r\n};\r\n\r\nexport default Register;\r\n","import React, { useState, useEffect } from 'react';\r\nimport { useDispatch, useSelector } from 'react-redux';\r\nimport { useParams } from 'react-router';\r\n\r\nimport { typography, spacing } from '../../app-theme';\r\nimport { getRecipientByIdAndEmail, unsubscribe } from '../../redux/recipient-actions';\r\n\r\nconst Unsubscribe = () => {\r\n const [unsubscribing, setUnsubscribing] = useState(true);\r\n const [unsubscribeSuccessfull, setUnsubscribeSuccessfull] = useState(false);\r\n const [recipientOK, setRecipientOK] = useState(false);\r\n const [emailAddress, setEmailAddress] = useState('');\r\n\r\n const queryParameters = useParams();\r\n const recipientId = queryParameters.recipientId;\r\n const emailAddressParam = decodeURIComponent(queryParameters.email);\r\n const recipient = useSelector(({ recipient }) => recipient);\r\n\r\n const dispatch = useDispatch();\r\n\r\n ///\r\n /// Find the current recipient and verify that the e-mail address provided matches the recipient's e-mail address\r\n ///\r\n useEffect(() => {\r\n\r\n if (recipientId) {\r\n ///\r\n /// We only want to execute this if we don't already have a recipient\r\n ///\r\n if (!recipient.Id) {\r\n dispatch(getRecipientByIdAndEmail(recipientId, emailAddressParam));\r\n }\r\n\r\n if (recipient.Id === parseInt(recipientId)) {\r\n if (recipient.Email.toLowerCase() === emailAddressParam.toLowerCase()) {\r\n setRecipientOK(true);\r\n setEmailAddress(recipient.Email);\r\n }\r\n }\r\n }\r\n }, [dispatch, recipientId, recipient, emailAddress, emailAddressParam]);\r\n\r\n\r\n if ('%REACT_APP_ENV%' === 'production') {\r\n var dataLayer = window.dataLayer = window.dataLayer || [];\r\n function gtag() {\r\n dataLayer.push(arguments);\r\n }\r\n gtag('config', 'AW-851385468');\r\n gtag('event', 'conversion', { 'send_to': 'AW-851385468/7vdsCK-bn5QDEPy4_JUD' });\r\n }\r\n\r\n return (\r\n \r\n setRegistrationSuccessfull(true)} />}\r\n {registrationSuccessfull && (\r\n
\r\n One step away from finding your perfect donor.
\r\n\r\n Already have an account? Sign in\r\n
\r\n {!registrationSuccessfull &&\r\n
\r\n )}\r\n Almost there!
\r\nVerify your account by clicking the link in the email we just sent you.
\r\n\r\n
\r\n );\r\n};\r\n\r\nconst styles = {\r\n h2: {\r\n ...typography.displayL,\r\n marginBottom: spacing.u4,\r\n },\r\n h3: {\r\n ...typography.displayS,\r\n marginBottom: spacing.u4,\r\n fontWeight: typography.regular,\r\n },\r\n h4: {\r\n ...typography.displayS,\r\n marginBottom: spacing.u1,\r\n },\r\n};\r\n\r\nexport default Unsubscribe;\r\n","import React, { Component } from 'react';\r\nimport { Redirect, Route, Switch, withRouter } from 'react-router-dom';\r\nimport { connect } from 'react-redux';\r\n\r\nimport StyleGuidePage from './style-guide/StyleGuidePage';\r\nimport Login from './common/auth/Login';\r\nimport Logout from './common/auth/Logout';\r\nimport ErrorBoundary from './common/components/ErrorBoundary';\r\nimport ForceReloadPrompt from './common/components/ForceReloadPrompt';\r\nimport NotFound from './common/components/NotFound';\r\nimport LayoutRoute from './common/components/LayoutRoute';\r\n\r\nimport { getUser } from './redux/user-actions';\r\n\r\n// Layouts\r\nimport Auth from './layouts/Auth';\r\nimport Main from './layouts/Main';\r\n\r\n// Views\r\nimport Contact from './views/Contact';\r\nimport Deleted from './views/Deleted';\r\nimport Donors from './views/Donors';\r\nimport Favorites from './views/Favorites';\r\nimport Register from './views/Register';\r\nimport Unsubscribe from './views/Unsubscribe';\r\n\r\nclass App extends Component {\r\n constructor(props) {\r\n super(props);\r\n\r\n this.state = {};\r\n }\r\n\r\n static getDerivedStateFromProps = ({ user }) => ({\r\n deleted: user.getIn(['data', 'deleted']),\r\n loaded: user.get('loaded'),\r\n loggedIn: user.get('loggedIn'),\r\n user: user.get('data'),\r\n });\r\n\r\n componentDidMount() {\r\n const { getUser } = this.props;\r\n const { loaded, loggedIn } = this.state;\r\n\r\n\r\n\r\n if (!loaded && loggedIn) {\r\n getUser();\r\n }\r\n }\r\n\r\n render() {\r\n const { shouldUpdate } = this.props;\r\n const { deleted, loggedIn } = this.state;\r\n\r\n if (shouldUpdate) {\r\n return (\r\n \r\n {unsubscribing && recipientOK && (\r\n
\r\n \r\n
\r\n \r\n
\r\n )\r\n }\r\n {!recipientOK && (\r\n Unsubscribe
\r\nTo stop receiving information from The World Egg & Sperm Bank at {emailAddress}, please\r\n click the Unsubscribe button, below.
\r\n\r\n \r\n
\r\n
\r\n
\r\n
\r\n )}\r\n {!unsubscribing && !unsubscribeSuccessfull && (\r\n Unsubscribe Errror
\r\n\r\n Unfortunately, we could not find a recipient with the id # provided in the Url and/or the e-mail address\r\n provided in the Url does not match the e-mail address\r\n of the specified user.\r\n
\r\n\r\n
\r\n We are unable to stop notifications being sent without a valid recipient and matching e-mail address.\r\n
\r\n\r\n
\r\n
\r\n )}\r\n {!unsubscribing && unsubscribeSuccessfull && (\r\n Unsubscribe Errror
\r\n\r\n Unfortunately, we are unable to stop notifications being sent to this e-mail address at this time. Please try again later.\r\n
\r\n\r\n
\r\n
\r\n )}\r\n Confirmed
\r\n\r\n You will no longer receive e-mail notifications from the World Egg & Sperm Bank.\r\n
\r\n\r\n
If you change your mind, please send us a message at
\r\n
\r\n