\n Import #{id}: {name}\n
\n \n {url}\n \n{comments}
\n\n {muni\n ? t('glossary.tree_inventory.one')\n : t('pages.datasets.community_map')}\n
\n{`${location_count} ${t('pages.datasets.locations')}`}
\n\n \n
\n{license}
\n\n {prepend} \n {\n e.key === 'Enter' && onEnter?.(e)\n }}\n type=\"text\"\n placeholder={placeholder ?? ''}\n ref={ref}\n {...props}\n />\n {icon}\n {append} \n
\n ),\n)\nInput.displayName = 'Input'\n\nconst StyledInput = styled(Input)`\n height: 46px;\n display: flex;\n justify-content: space-between;\n align-items: center;\n border-radius: 0.375em;\n border: 1px solid ${validatedColor()};\n box-sizing: border-box;\n padding: 0 20px;\n padding-left: ${(props) => (props.prepend ? '5px' : 'default')};\n\n input {\n color: ${({ theme }) => theme.secondaryText};\n font-size: 1rem;\n font-family: ${({ theme }) => theme.fonts};\n padding: 0;\n border: none;\n display: block;\n width: 100%;\n outline: none;\n height: 44px;\n padding-left: ${(props) => (props.prepend ? '10px' : '0')};\n\n &::placeholder {\n color: ${({ theme }) => theme.tertiaryText};\n }\n }\n\n &:focus-within {\n box-shadow: 0 0 0 1pt rgb(0, 95, 204);\n box-shadow: 0 0 0 1pt -webkit-focus-ring-color;\n }\n\n svg {\n height: 28px;\n width: auto;\n pointer-events: none;\n }\n`\n\nexport default StyledInput\n","import ReactDataTable from 'react-data-table-component'\nimport Skeleton from 'react-loading-skeleton'\nimport styled from 'styled-components/macro'\n\nconst LOADER_ROWS = 10\n\nconst LoaderWrapper = styled.div`\n width: 100%;\n pointer-events: none;\n\n span {\n width: 100%;\n\n .react-loading-skeleton {\n display: block;\n width: 100%;\n }\n }\n\n .rdt {\n &_TableRow {\n display: flex;\n padding: 16px 0;\n border-bottom: 1px solid rgba(0, 0, 0, 0.12);\n }\n\n &_TableCell {\n flex: 1;\n padding: 0 16px;\n }\n }\n`\nconst TableLoader = ({ columns }) => (\n \n {new Array(columns.length).fill(\n
,\n )}\n \n
,\n )}\n {t('pages.data.intro')}
\n\n \n locations.csv.bz2\n \n\n \n \n
\n \n types.csv.bz2\n \n
{t('pages.datasets.imported_datasets')}
\n{t('pages.datasets.types_of_data')}
\n{t('pages.datasets.table_info')}
\n\n \n {year}\n
\n \n \n
\n {title} \n {author && <> {t('glossary.by_author', { author: author })}}\n {embed_html && (\n \n )}\n {photo_url &&
\n \n {outlet} \n
\n {year}
\n- \n {pressData[year].map((data) => (\n
\n
\n ))}\n \n
\n \n {renderHTML(t('pages.about.ff_disclaimer_html'))}\n
\n{t('pages.about.donate')}
\n\n {t('pages.about.give_us_money')}\n
\n
\n
{t('pages.about.write')}
\n\n {renderHTML(t('pages.about.contact_us_html'))}\n
\n{t('pages.about.translate')}
\n\n {renderHTML(t('pages.about.translate_for_us_html'))}\n
\n{t('pages.about.about_the_site')}
\n{t('pages.about.celebration')}
\n\n {renderHTML(\n t('pages.about.more_about_html', {\n types: typesCount,\n locations: locationsCount,\n }),\n )}\n
\n{renderHTML(t('pages.about.join_us_html'))}
\n{t('pages.about.staff')}
\n\n ![\"\"](\"https://fallingfruit.org/ethan_welty.jpg\")
\n
\n \n \n Executive Director\n
\n Ethan Welty\n
\n ethan@fallingfruit.org\n
\n Zürich, Switzerland\n
\n
\n {renderHTML(t('pages.about.ethan_welty_bio_html'))}\n
{t('pages.about.directors')}
\n\n ![\"\"](\"https://fallingfruit.org/jeff_wanner.jpg\")
\n
\n \n \n President\n
\n Jeff Wanner\n
\n jeff@fallingfruit.org\n
\n Boulder, Colorado, USA\n
\n
\n {renderHTML(t('pages.about.jeff_wanner_bio_html'))}\n
\n ![\"\"](\"https://fallingfruit.org/craig_durkin.jpg\")
\n
\n \n \n Craig Durkin\n
\n Atlanta, Georgia, USA\n
\n
\n {renderHTML(t('pages.about.craig_durkin_bio_html'))}\n
\n ![\"\"](\"https://fallingfruit.org/emily_sigman.jpg\")
\n
\n \n \n Emily Sigman\n
\n New Haven, Connecticut, USA\n
\n
\n {renderHTML(t('pages.about.emily_sigman_bio_html'))}\n
{t('pages.about.advisors')}
\n\n ![\"\"](\"https://fallingfruit.org/alan_gibson.jpg\")
\n
\n \n \n Alan Gibson\n
\n Southampton, United Kingdom\n
\n
\n {renderHTML(t('pages.about.alan_gibson_bio_html'))}\n
\n ![\"\"](\"https://fallingfruit.org/ana_carolina_de_lima.jpg\")
\n
\n \n \n Ana Carolina de Lima\n
\n Silver City, New Mexico, USA\n
\n
\n {renderHTML(t('pages.about.ana_carolina_bio_html'))}\n
\n ![\"\"](\"https://fallingfruit.org/caleb_phillips.jpg\")
\n
\n \n \n Caleb Phillips\n
\n Boulder, Colorado, USA\n
\n
\n {renderHTML(t('pages.about.caleb_phillips_bio_html'))}\n
\n ![\"\"](\"https://fallingfruit.org/cristina_rubke.jpg\")
\n
\n \n \n Cristina Rubke\n
\n San Francisco, California, USA\n
\n
\n {renderHTML(t('pages.about.cristina_rubke_bio_html'))}\n
\n ![\"\"](\"https://fallingfruit.org/david_craft.jpg\")
\n
\n \n \n David Craft\n
\n Cambridge, Massachusetts, USA\n
\n
\n {renderHTML(t('pages.about.david_craft_bio_html'))}\n
\n ![\"\"](\"https://fallingfruit.org/tristram_stuart.jpg\")
\n
\n\n \n \n Tristram Stuart\n
\n United Kingdom\n
\n
\n {renderHTML(t('pages.about.tristram_stuart_bio_html'))}\n
{t('pages.about.translators')}
\n\n\n \n Amit Baum (עמית באום)\n {' '}\n – עִברִית\n
\n Ana Carolina de Lima – Português\n
\n Daniela Marini – Español\n
\n David Katzin – עִברִית\n
\n Ethan Welty – Français, Español\n
\n Heimen Stoffels – Nederlands\n
\n Jadalnia Warszawa – Polski\n
\n Karolina Hansen - Polski\n
\n Kira Dell – Português, Español\n
\n Laura Clabé – Français\n
\n Liana Welty – Español\n
\n Lola Ortiz – Español\n
\n Maria Noel Silvera – Español\n
\n Maria Rosa Puig – Español\n
\n Michela Pasquali – Italiano\n
\n Monica Breval Listán – Español\n
\n Mylène Jacquemart – Deutsch, Italiano\n
\n Parmenter Welty – Español\n
\n Raven Lyn – Português\n
\n Salomé Martin – Français\n
\n Sifis Diamantidis - Ελληνικά\n
\n Thomaz Brandão Teixeira – Português\n
\n Tim Conze – Svenska\n
\n Timna Raz – עִברִית\n
\n Tống Thái Vương - Tiếng Việt\n
\n
{t('pages.about.closing_remarks')}
\n{renderHTML(t('pages.about.closing_remarks_para1_html'))}
\n\n Falling Fruit\n\n
\n 535 S 44th St, Boulder, CO 80305, USA\n
\n EIN: 46-5363428\n
{renderHTML(t('pages.about.closing_remarks_para2_html'))}
\n{renderHTML(t('pages.about.closing_remarks_para3_html'))}
\n{t('pages.sharing.grow_pick_and_distribute')}
\n\n \n {period.activities.map((activity, index) => (\n \n {['added', 'edited', 'visited'].map((interactionType) => {\n const locations = activity[interactionType]\n return locations.length > 0 ? (\n \n ))}\n \n
\n )\n}\n\nexport default ChangesPeriod\n","import { useEffect, useRef } from 'react'\nimport { useTranslation } from 'react-i18next'\nimport Skeleton from 'react-loading-skeleton'\nimport { useDispatch, useSelector } from 'react-redux'\nimport styled from 'styled-components'\n\nimport {\n fetchMoreLocationChanges,\n setAnchorElementId,\n} from '../../redux/activitySlice'\nimport { transformActivityData } from '../../utils/transformActivityData'\nimport { PageScrollWrapper, PageTemplate } from '../about/PageTemplate'\nimport ChangesPeriod from './ChangesPeriod'\n\nconst SkeletonWrapper = styled.div`\n margin-bottom: 16px;\n`\n\nconst SkeletonGroup = styled.div`\n margin-bottom: 20px;\n`\n\nconst SkeletonLoader = ({ count = 3 }) => (\n {formatPeriodName(period.daysAgo, t)}
\n\n
{t('pages.changes.recent_changes')}
\n {locationChanges.length > 0 &&\n groupedData.map((period) => (\n\n {entries}\n {provided.placeholder}\n
\n )}\n {label}
\n \n {left}\n {label}\n
\n {right && {right}
}\n {t('users.edit_account')}
\n\n {user ? (\n <>\n\n
{t('users.resend_confirmation_instructions')}
\n{t('users.sign_in')}
\n{t('users.send_password_instructions')}
\n{t('users.change_password')}
\n{t('glossary.sign_up')}
\n{formatClusterLabel(count)}
\n{t('users.profile.title', { name })}
\n {bio && (\n\n {bio}\n
\n\n \n
\n\n
\n)\n\nconst StyledDropdown = styled(Dropdown)`\n display: flex;\n\n .button {\n color: ${({ theme }) => theme.secondaryText};\n border: none;\n padding: 19px 31px;\n cursor: default;\n\n &.active {\n color: ${({ theme }) => theme.orange};\n background-color: ${({ theme }) => theme.navBackground};\n\n ::before {\n content: '';\n width: 100%;\n position: absolute;\n background-color: ${({ theme }) => theme.orange};\n height: 3px;\n bottom: 0;\n left: 0;\n }\n }\n }\n\n &:hover .content {\n display: flex;\n flex-direction: column;\n }\n\n .content {\n display: none;\n position: absolute;\n background-color: ${({ theme }) => theme.background};\n border-radius: 0 0 0.375em 0.375em;\n overflow: hidden;\n box-shadow: rgba(0, 0, 0, 0.05) 0 15px 15px;\n text-align: center;\n top: 56px;\n width: 100%;\n\n a,\n button {\n color: ${({ theme }) => theme.secondaryText};\n padding: 12px 16px;\n text-decoration: none;\n display: block;\n }\n\n .active::before {\n display: none;\n }\n }\n`\n\nconst LogoLink = styled(Link)`\n display: block;\n height: 100%;\n padding: 10px 2em 10px 10px;\n box-sizing: border-box;\n`\n\nconst SignupButton = styled(Button)`\n svg {\n width: 1em;\n }\n\n display: block;\n border-radius: 0.375em;\n border: none;\n font-size: 100%;\n font-family: inherit;\n cursor: pointer;\n background-color: ${({ theme }) => theme.orange};\n color: ${({ theme }) => theme.background};\n`\n\nconst StyledSocialButtons = styled(SocialButtons)`\n margin: 0 5px;\n display: flex;\n\n a {\n color: ${({ theme }) => theme.text};\n position: relative;\n display: inline-block;\n padding: 12px 0;\n\n &:hover::before {\n content: '';\n width: 100%;\n position: absolute;\n background-color: #ffa41b;\n height: 3px;\n bottom: 0;\n left: 0;\n }\n }\n\n svg {\n height: 32px;\n margin: 0 2px;\n }\n`\n\nconst UserMenu = () => {\n const { t } = useTranslation()\n const user = useSelector((state) => state.auth.user)\n const dispatch = useDispatch()\n const handleLogout = () => {\n dispatch(logout())\n }\n const isAccountPage = useRouteMatch('/users/edit') !== null\n\n return (\n \n {label}
\n {children}
\n \n \n {user ? (\n \n \n \n {t('glossary.account')}\n \n \n {t('glossary.logout')}\n \n \n \n ) : (\n \n \n \n \n \n \n \n \n {t('glossary.sign_up')} \n \n \n \n )}\n \n
\n )\n}\n\nconst MainMenu = ({ className }) => {\n const { t } = useTranslation()\n const isAboutPage =\n matchPath(useLocation().pathname, {\n path: aboutRoutes.map((route) => route.props.path).flat(),\n }) !== null\n\n return (\n \n \n \n \n {t('glossary.map')}\n \n \n \n \n {t('glossary.activity')}\n \n \n \n \n \n {t('layouts.application.menu.the_project')}\n \n \n {t('layouts.application.menu.the_data')}\n \n \n {t('layouts.application.menu.sharing_the_harvest')}\n \n \n {t('layouts.application.menu.in_the_press')}\n \n \n \n \n \n \n
\n )\n}\n\n// TODO: Clean up file structure (i.e. logo_white.svg) from ./public\nconst Header = () => {\n const [isMobileMenuOpen, setIsMobileMenuOpen] = useState(false)\n const user = useSelector((state) => state.auth.user)\n\n return (\n \n
\n ![\"Falling](\"/logo_orange.svg\"){kind=logo}
\n {title}
\n\n\n <>\n \n \n \n \n {streetViewOpen ? (\n \n \n \n ) : (\n \n \n \n )}\n {(locationData.import_id || locationData.author) && (\n \n {locationData.import_id ? : \n )}\n \n \n \n \n
\n )\n}\nexport default EntryOverview\n","export const INITIAL_REVIEW_VALUES = {\n review: {\n photos: [],\n comment: '',\n observed_on: '',\n fruiting: null,\n quality_rating: '0',\n yield_rating: '0',\n },\n}\n\nexport const INITIAL_LOCATION_VALUES = {\n types: [],\n description: '',\n access: null,\n season_start: null,\n season_stop: null,\n ...INITIAL_REVIEW_VALUES,\n}\n","export const isEmptyReview = (review) => {\n if (!review) {\n return true\n }\n\n const r = formToReview(review)\n return (\n !r.comment &&\n r.quality_rating === null &&\n r.fruiting === null &&\n r.yield_rating === null &&\n r.photo_ids.length === 0\n )\n}\n\nconst validateReviewStep = (review) => {\n const r = formToReview(review)\n if (r.fruiting !== null && !r.observed_on) {\n return {\n review: { observed_on: true },\n }\n }\n\n return null\n}\n\nconst validatePhotosUploaded = (review) => {\n if (!isEveryPhotoUploaded(review.photos)) {\n return {\n review: { photos: true },\n }\n }\n\n return null\n}\n\nexport const validateReview = (review) => ({\n ...validatePhotosUploaded(review),\n ...validateReviewStep(review),\n})\n\nexport const formToReview = (review) => {\n const formattedReview = {\n ...review,\n comment: review.comment || null,\n observed_on: review.observed_on || null,\n fruiting: review.fruiting || null,\n quality_rating:\n review.quality_rating === '0' ? null : Number(review.quality_rating) - 1,\n yield_rating:\n review.yield_rating === '0' ? null : Number(review.yield_rating) - 1,\n photo_ids: review.photos.map((photo) => photo.id),\n }\n delete formattedReview.photos\n return formattedReview\n}\n\nexport const reviewToForm = ({\n comment,\n photos,\n observed_on,\n fruiting,\n yield_rating,\n quality_rating,\n}) => ({\n comment: comment ?? '',\n photos: photos.map((photo) => ({\n id: photo.id,\n name: `My Photo ${photo.created_at.split('T')[0]}`,\n image: photo.thumb,\n isNew: false,\n })),\n observed_on: observed_on ?? '',\n fruiting: fruiting,\n yield_rating: yield_rating === null ? '0' : String(yield_rating + 1),\n quality_rating: quality_rating === null ? '0' : String(quality_rating + 1),\n})\n\nconst isEveryPhotoUploaded = (photos) =>\n photos.every((photo) => !photo.isUploading)\n\nexport const validateLocation = ({ review, ...location }) => {\n const errors = {}\n if (location.types.length === 0) {\n errors.types = true\n }\n\n if (!isEmptyReview(review)) {\n Object.assign(errors, validateReview(review))\n }\n\n return errors\n}\n\nexport const formToLocation = ({\n types,\n description,\n season_start,\n season_stop,\n access,\n unverified,\n position: { lat, lng },\n}) => ({\n type_ids: types.map(({ value }) => value),\n description,\n season_start: season_start ?? null,\n season_stop: season_stop ?? null,\n access: access ?? null,\n unverified,\n lat,\n lng,\n})\n\nexport const locationToForm = (\n { type_ids, description, season_start, season_stop, access, unverified },\n typesAccess,\n) => ({\n types: type_ids?.map((id) => {\n const type = typesAccess.getType(id)\n return {\n ...type,\n value: id,\n }\n }),\n description,\n season_start,\n season_stop,\n access,\n unverified,\n})\n\nexport const isTooClose = (location, existingLocations, editingId) => {\n /*\n * display-based threshold where a dot half-overlaps another at the max zoom level\n * Given the (2 x pi x Earth radius) / (256 pixels x 2^zoom) = 0.0373 meters / pixel ratio of the Web Mercator projection at zoom level 22,\n * and a pixel half-width of 8 pixels, that is a threshold of 0.3 m\n * i.e. xDiff < 0.3 && yDiff < 0.3 (for Web Mercator x, y coordinates)\n * or roughly latDiff < 0.27e-5 && lngDiff < 0.27e-5\n */\n if (!location || !existingLocations || existingLocations.length === 0) {\n return false\n }\n\n return existingLocations.some((existingLocation) => {\n if (editingId && editingId === existingLocation.id) {\n return false\n } else {\n const latDiff = Math.abs(existingLocation.lat - location.lat)\n const lngDiff = Math.abs(existingLocation.lng - location.lng)\n return latDiff < 0.27e-5 && lngDiff < 0.27e-5\n }\n })\n}\n","import styled from 'styled-components/macro'\n\nconst SectionHeading = styled.h5`\n display: block;\n color: ${({ theme }) => theme.tertiaryText};\n font-weight: bold;\n margin: 20px 5px 10px 0;\n`\n\nexport default SectionHeading\n","import styled from 'styled-components/macro'\n\nexport const ProgressButtons = styled.div`\n margin-top: 16px;\n margin-bottom: 16px;\n text-align: center;\n\n button {\n width: 110px;\n\n &:not(:last-child) {\n margin-right: 12px;\n }\n }\n`\n\nexport const StyledForm = styled.div`\n box-sizing: border-box;\n width: 100%;\n padding: 0 10px;\n overflow: auto;\n\n @media ${({ theme }) => theme.device.desktop} {\n height: 100%;\n }\n\n @media ${({ theme }) => theme.device.mobile} {\n padding: 8px 27px 20px;\n margin-top: 80px;\n\n textarea {\n height: 100px;\n\n @media (max-device-height: 600px) {\n height: 50px;\n }\n }\n }\n`\n","import { Form, Formik } from 'formik'\nimport { darken } from 'polished'\nimport { useTranslation } from 'react-i18next'\nimport { useDispatch, useSelector } from 'react-redux'\nimport styled from 'styled-components/macro'\n\nimport { INITIAL_REVIEW_VALUES } from '../../constants/form'\nimport {\n addNewReview,\n deleteLocationReview,\n editExistingReview,\n} from '../../redux/locationSlice'\nimport { formToReview, validateReview } from '../../utils/form'\nimport { useAppHistory } from '../../utils/useAppHistory'\nimport { useIsDesktop } from '../../utils/useBreakpoint'\nimport { FormRatingWrapper } from '../auth/AuthWrappers'\nimport Button from '../ui/Button'\nimport LabeledRow from '../ui/LabeledRow'\nimport { Optional } from '../ui/LabelTag'\nimport SectionHeading from '../ui/SectionHeading'\nimport {\n DateInput,\n PhotoUploader,\n RatingInput,\n Select,\n Textarea,\n} from './FormikWrappers'\nimport { ProgressButtons, StyledForm } from './FormLayout'\nimport { useInvisibleRecaptcha } from './useInvisibleRecaptcha'\n\nconst DeleteButton = styled(Button)`\n background-color: ${({ theme }) => theme.invalid};\n border-color: ${({ theme }) => theme.invalid};\n\n @media ${({ theme }) => theme.device.desktop} {\n :hover:enabled {\n background: ${({ theme }) => darken(0.1, theme.invalid)};\n border-color: ${({ theme }) => darken(0.1, theme.invalid)};\n }\n }\n`\n\nexport const ReviewStep = ({ standalone, hasHeading = true }) => {\n const { t } = useTranslation()\n const fruitingOptions = [\n { label: t('locations.infowindow.fruiting.0'), value: 0 },\n { label: t('locations.infowindow.fruiting.1'), value: 1 },\n { label: t('locations.infowindow.fruiting.2'), value: 2 },\n ]\n\n return (\n <>\n {hasHeading && (\n // eslint-disable-next-line jsx-a11y/anchor-is-valid\n \n {locationData.description}
\n\n\n {locationData.address ??\n `${locationData.lat.toFixed(6)}, ${locationData.lng.toFixed(\n 6,\n )}`}\n
\nGoogle Maps
\nGoogle Street View
\n \n )}\n {hasSeasonality(locationData) && (\n\n {locationData.no_season ||\n (locationData.season_start === 0 &&\n locationData.season_stop === 11)\n ? t('locations.overview.season.year_round')\n : t('locations.overview.season.in_season', {\n start:\n locationData.season_start != null\n ? formatMonth(\n locationData.season_start,\n i18n.language,\n )\n : '?',\n stop:\n locationData.season_stop != null\n ? formatMonth(locationData.season_stop, i18n.language)\n : '?',\n })}\n
\n\n {locationData.author && locationData.import_id ? (\n t('locations.overview.imported_from', {\n name: locationData.author,\n })\n ) : (\n <>\n {t('locations.overview.added_by', { name: '' })}{' '}\n {locationData.user_id ? (\n \n {locationData.author}\n \n ) : (\n locationData.author\n )}\n \n )}\n {locationData.import_id && (\n <>\n {locationData.author && ' ('}\n \n #{locationData.import_id}\n \n {locationData.author && ')'}\n \n )}\n
\n\n \n
\n\n
\n {review.comment}\n
{t('glossary.review.other')}
\n\n {reviews.map((review) => {\n const onReviewImageClick = (imageIndex) =>\n onImageClick(\n reviewsWithPhotos.findIndex((r) => r.id === review.id),\n imageIndex,\n )\n if (review.user_id === user?.id) {\n return (\n history.push(`/reviews/${review.id}/edit`)}\n editable\n />\n )\n } else {\n return (\n
\n {isDesktop && \n \n \n \n \n {isLoading &&
\n )\n}\n\nexport default EntryDesktop\n","import { ChevronRight } from '@styled-icons/boxicons-regular'\nimport { Cog } from '@styled-icons/boxicons-solid'\nimport { useTranslation } from 'react-i18next'\nimport styled from 'styled-components/macro'\n\nimport { theme } from '../ui/GlobalStyle'\n\nconst StyledSettingsButton = styled.button`\n cursor: pointer;\n padding: 5px 0;\n border: none;\n border-top: 1px solid ${({ theme }) => theme.secondaryBackground};\n position: sticky;\n bottom: 0;\n left: 0;\n right: 0;\n width: 100%;\n min-height: 3.5em;\n background: ${({ theme }) => theme.background};\n display: flex;\n flex-direction: row;\n align-items: center;\n font-size: 14px;\n`\n\nconst PrimaryText = styled.div`\n font-weight: bold;\n font-family: ${({ theme }) => theme.fonts};\n color: ${({ theme }) => theme.headerText};\n`\n\nconst SettingsCircleIcon = styled(Cog)`\n margin-left: 1.5em;\n margin-right: 1em;\n width: 1.75em;\n`\n\nexport const ChevronIcon = styled.div`\n flex: 1 1 0;\n display: flex;\n justify-content: right;\n align-items: right;\n margin-right: 1em;\n`\n\nconst SettingsButton = ({ onClick }) => {\n const { t } = useTranslation()\n return (\n \n {onBack &&
\n {title}
\n{t('layouts.loading')}
\n ) : (\n review && (\n \n x.value}\n fromFormikValue={(x) =>\n languageOptionsDropdown.find((o) => o.value === x)\n }\n />\n
\n \n
\n \n {showRemoveButton && index !== 0 && (\n \n \n
\n )}\n \n )\n}\n\nconst NamesFieldArray = () => {\n const { t } = useTranslation()\n return (\n \n
\n \n )\n}\n\nexport { AddTypeModal }\n","import { useFormikContext } from 'formik'\nimport { uniqBy } from 'lodash'\nimport React, { useCallback, useMemo, useState } from 'react'\nimport { useTranslation } from 'react-i18next'\nimport { useDispatch, useSelector } from 'react-redux'\n\nimport { openAddTypeModal } from '../../redux/typeSlice'\nimport { tokenizeQuery } from '../../utils/tokenize'\nimport { TypeName } from '../ui/TypeName'\nimport { AddTypeModal } from './AddTypeModal'\nimport { CreatableSelect } from './FormikWrappers'\n\nexport const matchFromTokenStart = (candidate, input) => {\n if (!input || candidate.data.__isNew__) {\n return true\n } else {\n return candidate.data.searchReference.indexOf(tokenizeQuery(input)) > -1\n }\n}\n\nconst TypesSelect = () => {\n const { typesAccess } = useSelector((state) => state.type)\n const { values, validateForm, setFieldValue } = useFormikContext()\n const { t } = useTranslation()\n const dispatch = useDispatch()\n\n const typeOptions = useMemo(() => typesAccess.asMenuEntries(), [typesAccess])\n const [newTypeInput, setNewTypeInput] = useState('')\n\n const handleNewType = useCallback(\n (newTypeOption) => {\n const updatedTypes = uniqBy(\n [...(values.types || []), newTypeOption],\n 'value',\n )\n setFieldValue('types', updatedTypes)\n validateForm()\n },\n [values.types, setFieldValue, validateForm],\n )\n\n const handleCreateOption = useCallback(\n (inputValue) => {\n setNewTypeInput(inputValue)\n dispatch(openAddTypeModal())\n },\n [dispatch],\n )\n\n return (\n <>\n \n {t('new_type.form.pending_notice')}\n
\n\n {t('new_type.add_type_label')} \n {option.label}\n
\n ) : (\n \n {lat && lng ? `${lat.toFixed(6)}, ${lng.toFixed(6)}` : ''}\n
\n{t('layouts.loading')}
\n ) : (\n {label}
\n {children}\n{t('menu.settings')}
}\n{t('pages.settings.data')}
\n\n {[\n {\n field: 'showLabels',\n label: t('pages.settings.labels'),\n },\n ].map(({ field, label }) => (\n{t('glossary.map')}
\n\nOpenStreetMap
\n\n{t('pages.settings.regional')}
\n\n{t('glossary.about')}
\n\n {new Array(32).fill(null).map((_, idx) => (\n
\n \n {t('glossary.type.other')} \n setSearchValueDebounced(e.target.value)}\n placeholder={t('glossary.type.one')}\n />\n \n dispatch(setShowOnlyOnMap(checked))}\n style={{ display: 'inline-block', marginRight: '5px' }}\n />\n {\n const newSelection = [...new Set([...types, ...visibleTypeIds])]\n dispatch(selectionChanged(newSelection))\n }}\n onDeselectAllClick={() => {\n const remainingSelection = types.filter(\n (typeId) => !visibleTypeIds.some((t) => t === typeId),\n )\n dispatch(selectionChanged(remainingSelection))\n }}\n />\n \n {typesAccess.isEmpty ? (\n \n dispatch(selectionChanged(selectedTypes))\n }\n selectTree={selectTree}\n />\n )}\n
\n\n \n {drawerDisabled && (\n {\n event.stopPropagation()\n dispatch(reenableAndPartiallyClosePaneDrawer())\n }}\n icon={ {\n event.stopPropagation()\n history.push(`/locations/${locationId}/edit`)\n }}\n icon={
\n {text}
\n