- \n
- {i18n('charity_donation_process_step1')} \n\n
- {i18n(`charity_donation_process_step2_${countryCode}`)} \n\n
- {i18n('charity_donation_process_step3')} \n\n
- {i18n('charity_donation_process_step4')} \n\n
- {i18n('charity_donation_process_step5')} \n\n {isCountryCodeUS && (\n
- {i18n('charity_donation_process_step6')} \n )}\n
\n \n \n {this.props.showHeader && (\n {\n if (e.key === ENTER_KEY) {\n this.handleClose()\n }\n }}\n />\n )}\n \n )}\n
\n {showProgressBar && (\n {this.props.leftHeader}
\n {this.props.centerHeader}
\n {this.props.showClose && (\n \n
\n )}\n \n
\n )}\n {this.props.children}\n \n {this.props.showIcon && }\n \n \n \n )\n }\n}\n\nexport default cssModules(Modal, styles, { allowMultiple: true })\n","import React from 'react'\nimport PropTypes from 'prop-types'\nimport cssModules from 'react-css-modules'\nimport styles from './back_button.less'\nimport { ArrowLeftIcon } from '@paypalcorp/pp-react'\nimport { KEY_PRESS_EVENTS } from 'shared/shared_consts'\n\nconst { ENTER_KEY } = KEY_PRESS_EVENTS\n\nclass BackButton extends React.Component {\n static propTypes = {\n onClick: PropTypes.func,\n }\n\n render() {\n return (\n \n
\n )\n }\n}\n\nexport default cssModules(IconCircle, styles)\n","import React from 'react'\nimport PropTypes from 'prop-types'\nimport cssModules from 'react-css-modules'\nimport IconCircle from 'components/common/icon_circle'\nimport styles from './flat_progress.less'\nimport { formatPercent, formatMoney } from 'client/griffin'\nimport { ProgressMeter, HeadingText, CaptionText } from '@paypalcorp/pp-react'\nimport { getI18n } from 'client/i18n'\n\nconst i18n = getI18n('components/common/flat_progress')\n\nclass FlatProgress extends React.Component {\n static propTypes = {\n currencyCode: PropTypes.string,\n totalAmount: PropTypes.number,\n goalAmount: PropTypes.value,\n showPercentage: PropTypes.bool,\n showProgress: PropTypes.bool,\n compact: PropTypes.bool,\n title: PropTypes.string,\n titleIcon: PropTypes.element,\n displayTotalAmount: PropTypes.bool,\n }\n\n static defaultProps = {\n titleIcon: '',\n showPercentage: true,\n showProgress: true,\n displayTotalAmount: false,\n }\n\n render() {\n const percentage = formatPercent(\n this.props.totalAmount / this.props.goalAmount\n )\n\n const removeTrailingZeros = number => {\n return Number.isInteger(number)\n }\n\n const amountOrPercentage = this.props.displayTotalAmount\n ? formatMoney(this.props.currencyCode, this.props.totalAmount, {\n removeTrailingZeros,\n })\n : percentage\n\n const amountOrPercentageContentKey = this.props.displayTotalAmount\n ? 'amount_of_goal'\n : 'raised_amount_goal'\n\n return (\n \n
\n )\n }\n}\n\nexport default cssModules(FlatProgress, styles, { allowMultiple: true })\n","import React from 'react'\nimport PropTypes from 'prop-types'\nimport cssModules from 'react-css-modules'\nimport styles from './alert.less'\n\nconst TYPES = ['help', 'warning', 'critical', 'success']\n\nclass Alert extends React.Component {\n static propTypes = {\n type: PropTypes.oneOf(TYPES),\n children: PropTypes.any,\n }\n\n render() {\n return (\n \n {this.props.title ? (\n \n {this.props.titleIcon} {this.props.title}\n \n ) : (\n \n {formatMoney(this.props.currencyCode, this.props.totalAmount)}\n \n )}\n
\n {this.props.showProgress ? (\n \n
\n )\n )}\n {this.props.showPercentage && this.props.showProgress ? (\n \n
\n \n \n {amountOrPercentage}\n \n \n {i18n(amountOrPercentageContentKey, {\n amount: formatMoney(\n this.props.currencyCode,\n this.props.goalAmount,\n {\n removeTrailingZeros,\n }\n ),\n })}\n \n
\n ) : (\n ''\n )}\n \n
\n )\n }\n}\n\nexport default cssModules(Alert, styles)\n","import React from 'react'\nimport PropTypes from 'prop-types'\nimport cssModules from 'react-css-modules'\nimport styles from './no_currency_alert.less'\nimport { getI18n } from 'client/i18n'\nimport Alert from 'components/common/alert'\n\nconst i18n = getI18n('components/no_currency_alert')\n\nclass NoCurrencyAlert extends React.Component {\n static propTypes = {\n currency: PropTypes.string,\n paypalDomain: PropTypes.string,\n }\n\n render() {\n const currency = this.props.currency\n const currencyUrl = `https://${\n this.props.paypalDomain\n }/il/cgi-bin/webscr?cmd=_profile-currencies`\n\n return (\n {this.props.children}
\n\n {!leftAlignFlag ? (\n \n {i18n('donations')}\n \n ) : null}\n
\n )\n }\n}\n\nexport default cssModules(campaign_balance, styles)\n","import CampaignBalance from './campaign_balance'\nimport { connect } from 'react-redux'\nimport { getCampaignSelector } from 'redux/selectors/campaign'\n\nconst mapStateToProps = (state, props) => {\n const campaign = getCampaignSelector(state, props)\n\n return {\n pledge: campaign.pledge,\n currencyCode: campaign.currency,\n withdraw: campaign.current_value - campaign.moneybox_amount,\n moneyboxAmount: campaign.moneybox_amount,\n netAmount: campaign.net_amount,\n }\n}\n\nconst mapDispatchToProps = dispatch => {\n return {}\n}\n\nexport default connect(\n mapStateToProps,\n mapDispatchToProps\n)(CampaignBalance)\n","import React from 'react'\nimport PropTypes from 'prop-types'\nimport ReactCSSTransitionGroup from 'react-transition-group/CSSTransitionGroup'\nimport cssModules from 'react-css-modules'\nimport styles from './reveal.less'\n\nconst DURATION = 300\n\nclass RevealTransition extends React.Component {\n static propTypes = {\n children: PropTypes.any,\n }\n\n render() {\n const transitionNames = {\n enter: styles['reveal-enter'],\n enterActive: styles['reveal-enter-active'],\n leave: styles['reveal-leave'],\n leaveActive: styles['reveal-leave-active'],\n }\n\n return (\n \n {!leftAlignFlag ? (\n
\n \n
\n ) : null}\n \n {i18n('amount_received')} \n
\n \n \n {formatMoney(currencyCode, netAmount, {\n removeTrailingZeros,\n })}\n \n
\n \n {leftAlignFlag ? (\n <>\n
\n \n {i18n('available')} \n
\n \n \n {formatMoney(currencyCode, moneyboxAmount, {\n removeTrailingZeros,\n })}\n \n
\n \n ) : (\n <>\n \n {i18n('available')} \n
\n \n \n {formatMoney(currencyCode, moneyboxAmount, {\n removeTrailingZeros,\n })}\n \n
\n \n )}\n \n {leftAlignFlag ? (\n <>\n
\n \n {i18n('pledge_by')} \n
\n \n \n {formatMoney(currencyCode, pledge, {\n removeTrailingZeros,\n })}\n \n
\n \n ) : (\n <>\n \n {i18n('pledge_by')} \n
\n \n \n {formatMoney(currencyCode, pledge, {\n removeTrailingZeros,\n })}\n \n
\n \n )}\n \n {this.props.title} {`(${this.props.contributions.length})`}\n
\n )}\n \n \n {formatDate(element.date, 'MMMd')}\n \n
\n )\n } else {\n return this.props.rowElement(element, element.id)\n }\n })}\n {this.props.bottomElement}\n {this.props.contributions.length < this.props.totalTxnsCount && (\n <>\n \n \n {i18n('show_more_action')}\n \n
\n \n )}\n {noAvatarElement}
\n }\n}\n\nexport default cssModules(Avatar, styles, { allowMultiple: true })\n","import { WALLET_SETTINGS_SERV_FAIL } from '../shared_consts'\n\nexport function getInitials(fullName) {\n // TODO: l10n?\n if (fullName == null || fullName.length < 1) {\n return ''\n }\n\n const splitName = fullName.split(/ +/g).filter(e => e)\n const firstName = splitName.length > 0 ? splitName[0] : null\n const lastName = splitName.length > 1 ? splitName[splitName.length - 1] : null\n return (\n (firstName ? firstName[0].toUpperCase() : '') +\n (lastName ? lastName[0].toUpperCase() : '')\n )\n}\n\nexport function getDisplayName(\n full_name = '',\n businessNamesMappedToIds = {},\n id = ''\n) {\n if (businessNamesMappedToIds[id]) {\n return businessNamesMappedToIds[id] === WALLET_SETTINGS_SERV_FAIL\n ? ' '\n : businessNamesMappedToIds[id]\n }\n return full_name\n}\n","import Avatar from './avatar'\nimport { connect } from 'react-redux'\n\nimport { getInitials } from 'shared/helpers/name_helpers'\nimport { getCampaignSelector } from 'redux/selectors/campaign'\n\nconst mapStateToProps = (state, props) => {\n const campaign = getCampaignSelector(state, props)\n const campaignOwner = campaign.owner\n const initials = props.showInitials\n ? getInitials(campaignOwner.full_name)\n : null\n\n return {\n imageUrl: campaignOwner.profile_photo,\n initials,\n }\n}\n\nconst mapDispatchToProps = dispatch => {\n return {}\n}\n\nexport default connect(\n mapStateToProps,\n mapDispatchToProps\n)(Avatar)\n","// NOTE: when `maxRows` is 1, this component is buggy in FireFox and always shows \"Show More\".\n\nimport React from 'react'\nimport PropTypes from 'prop-types'\nimport cssModules from 'react-css-modules'\nimport styles from './expandable_paragraph.less'\nimport { getI18n } from 'client/i18n'\nimport { HeadingText, BodyText, Link } from '@paypalcorp/pp-react'\n\nconst TEXT_LINE_HEIGHT = 1.6\nconst LIGHT_TEXT_LINE_HEIGHT = 1.5\nconst TEXT_FONT_SIZE = 15\nconst LIGHT_TEXT_FONT_SIZE = 13\nconst i18n = getI18n('components/expandable_paragraph')\n\nclass ExpandableParagraph extends React.Component {\n static propTypes = {\n titleText: PropTypes.string,\n children: PropTypes.node,\n maxRows: PropTypes.number,\n lightText: PropTypes.bool,\n lightLink: PropTypes.bool,\n }\n\n static defaultProps = { maxRows: 3 }\n state = { open: false }\n\n updateHeight = () => {\n this.setState({ height: this.detailsText.scrollHeight })\n }\n\n componentDidMount() {\n this.updateHeight()\n window.addEventListener('resize', this.handleResize)\n }\n\n componentWillUnmount() {\n window.removeEventListener('resize', this.handleResize)\n }\n\n handleResize = () => {\n this.updateHeight()\n }\n\n onShowMore = () => {\n this.setState({ open: !this.state.open })\n }\n\n render() {\n // these are hard-coded and not derived from the CSS since the manual height set after mounting is counting on `scrollHeight`\n // which will only be set if this is hard-coded here.\n let lineHeight = TEXT_LINE_HEIGHT // in em\n let fontSize = TEXT_FONT_SIZE // in px\n let lightTextStyleName = 'details-text'\n let lightLinkStyleName = 'more-link'\n\n if (this.props.lightText) {\n lineHeight = LIGHT_TEXT_LINE_HEIGHT\n fontSize = LIGHT_TEXT_FONT_SIZE\n lightTextStyleName = 'details-text-light'\n }\n\n if (this.props.lightLink) {\n lightLinkStyleName = 'more-link-light'\n }\n\n let detailsClass = ''\n let buttonText = ''\n let detailsStyle = {}\n let detailsTextStyle = { lineHeight, fontSize }\n let showMoreButton = false\n if (this.state.height) {\n if (this.state.height > this.props.maxRows * lineHeight * fontSize) {\n showMoreButton = true\n detailsClass = 'details'\n buttonText = i18n('show_more')\n detailsStyle = {\n height: `${this.props.maxRows * lineHeight * fontSize}px`,\n }\n\n if (this.state.open) {\n // overflow\n detailsClass = 'details-open'\n buttonText = i18n('show_less')\n detailsStyle = { height: this.state.height + 'px' }\n }\n\n detailsTextStyle = Object.assign(\n this.state.open ? {} : { WebkitLineClamp: this.props.maxRows },\n detailsTextStyle\n )\n } else {\n // no overflow\n detailsClass = 'details-open'\n }\n }\n\n return (\n \n {this.props.titleText && (\n \n {this.props.titleText} \n \n )}\n \n {buttonText}\n \n )}\n
\n {showMoreButton && (\n \n {\n this.detailsText = detailsText\n }}\n style={detailsTextStyle}\n >\n {this.props.children} \n
\n {showMoreButton && (\n \n
\n \n \n {amountSign}\n {formatMoney(this.props.currency, this.props.net_amount)}\n \n
\n \n \n {subjectName}\n \n \n {activityType}\n {this.props.pending ? (\n \n {' \\u2022 '}\n {i18nActivity('activity.pending')}\n \n ) : (\n ''\n )}\n \n {this.props.note && (\n \n {this.props.note} \n \n )}\n
\n \n \n {i18n('crowdfunding_activity.title')}\n {`(${this.props.activitiesCount})`}\n \n
\n )\n }\n}\n\nexport default cssModules(CrowdfundingActivity, styles, {\n allowMultiple: true,\n})\n","import React from 'react'\nimport PropTypes from 'prop-types'\nimport cssModules from 'react-css-modules'\nimport styles from './organizer_update_detail.less'\nimport { glimpseRoute } from 'lib/route_utils'\nimport { Link as RouterLink } from 'react-router'\nimport {\n BodyText,\n HeadingText,\n CaptionText,\n Button,\n Row,\n} from '@paypalcorp/pp-react'\nimport { Message } from '@paypalcorp/worldready-react'\nimport clsx from 'clsx'\nimport { daysUntilToday } from 'shared/helpers/datetime_helpers'\nimport { trackFPTI } from 'lib/fpti_utils'\nimport { formatDateMediumShort } from 'client/griffin'\n\nexport class OrganizerUpdateDetail extends React.Component {\n static propTypes = {\n organizerUpdateRow: PropTypes.object.isRequired,\n postUpdateUrl: PropTypes.string.isRequired,\n enableEditButton: PropTypes.bool,\n truncateSubject: PropTypes.bool,\n truncateDescription: PropTypes.bool,\n isDonerView: PropTypes.bool,\n campaign: PropTypes.object,\n eventName: PropTypes.string,\n updateState: PropTypes.string,\n shown: PropTypes.string,\n }\n render() {\n const {\n organizerUpdateRow,\n postUpdateUrl,\n enableEditButton,\n truncateDescription,\n truncateSubject,\n isDonerView,\n campaign,\n eventName,\n updateState,\n } = this.props\n // const time_created = \"2022-11-20T06:26:30.000Z\"\n const days = Math.abs(\n daysUntilToday(new Date(organizerUpdateRow.time_created))\n )\n const key = days === 0 || days === 1 ? `days_ago_${days}` : 'days_ago_other'\n if (enableEditButton || isDonerView) {\n const isDonerEventName = isDonerView\n ? 'dw_giving_donor_update_detail_screen_shown'\n : eventName\n trackFPTI(\n campaign,\n 'impression',\n isDonerEventName,\n '',\n '',\n '',\n updateState\n )\n }\n return (\n \n (\n {\n this.handleFPTI(activityItem.credit_txn_id)\n }}\n >\n
\n \n \n \n {organizerUpdateRow.text}\n \n {organizerUpdateRow.edited && (\n \n \n {\n trackFPTI(\n campaign,\n 'click',\n 'dw_giving_update_detail_edit_pressed'\n )\n }}\n >\n
\n )}\n
\n )\n }\n}\n\nexport default cssModules(OrganizerUpdateDetail, styles, {\n allowMultiple: true,\n})\n","import React from 'react'\nimport PropTypes from 'prop-types'\nimport cssModules from 'react-css-modules'\nimport styles from './update_row.less'\nimport { glimpseRoute } from 'lib/route_utils'\nimport { Card, Link } from '@paypalcorp/pp-react'\nimport { Link as RouterLink } from 'react-router'\nimport OrganizerUpdateDetail from 'components/glimpses/edit_glimpse/organizer_update_detail/organizer_update_detail'\nimport { trackFPTI } from 'lib/fpti_utils'\nimport { get } from 'lodash'\n\nclass UpdateRow extends React.Component {\n static propTypes = {\n organizerUpdate: PropTypes.Array.isRequired,\n postUpdateUrl: PropTypes.string,\n charity: PropTypes.object,\n campaignId: PropTypes.string,\n eventName: PropTypes.string,\n updateState: PropTypes.string,\n showLatest: PropTypes.boolean,\n truncateDescription: PropTypes.boolean,\n truncateSubject: PropTypes.boolean,\n isDonerView: PropTypes.boolean,\n campaign: PropTypes.object,\n count: PropTypes.number,\n }\n\n render() {\n const {\n organizerUpdate,\n postUpdateUrl,\n showLatest,\n truncateDescription,\n truncateSubject,\n isDonerView,\n updateState,\n eventName,\n campaign,\n count,\n } = this.props\n\n let organizerUpdateList = get(organizerUpdate, 'items', [])\n if (showLatest && organizerUpdateList.length) {\n organizerUpdateList = [organizerUpdateList[0]]\n }\n return (\n <>\n {organizerUpdateList.map((row, index) => (\n \n \n {organizerUpdateRow.subject}\n \n \n {days <= 28 ? (\n
\n \n \n \n {organizerUpdatesCount > 0 && (\n <>\n {\n trackFPTI(\n campaign,\n 'click',\n 'dw_giving_manage_fundraiser_post_update_button_pressed',\n '',\n '',\n '',\n updateState\n )\n }}\n >\n
\n {organizerUpdatesCount > 0 ? (\n \n {\n trackFPTI(\n campaign,\n 'click',\n 'dw_giving_manage_fundraiser_post_update_button_pressed',\n '',\n '',\n '',\n updateState\n )\n }}\n />\n
\n \n )}\n \n \n \n {\n trackFPTI(\n campaign,\n 'click',\n 'dw_giving_manage_fundraiser_post_update_button_pressed',\n '',\n '',\n '',\n updateState\n )\n }}\n >\n
\n )}\n {organizerUpdatesCount > 1 && (\n \n {\n trackFPTI(\n campaign,\n 'click',\n 'dw_giving_manage_fundraiser_show_previous_update_pressed',\n '',\n '',\n '',\n updateState\n )\n }}\n >\n
\n )}\n \n )\n }\n}\n\nexport default cssModules(CrowdfundingActivity, styles)\n","import { getJSONFromScript } from 'lib/server_params'\n\nimport { SCRIPT_IDS } from 'shared/shared_consts'\n\nexport function getStore() {\n return getJSONFromScript(SCRIPT_IDS.STORE)\n}\n","import { useContext } from 'react'\nimport { getStore } from 'lib/store'\nimport { DateTimeFormat, MessageFormat } from '@paypalcorp/worldready'\nimport { Context as WorldReadyContext } from '@paypalcorp/worldready-react'\n\n/**\n * Get user's timeZone from Store\n *\n * @returns {string}\n */\nfunction getTimeZone() {\n return getStore().locality.timezone\n}\n\n/**\n * Receives the localization context,\n * the a date string or instance and extra options if required\n * and returns a formated date based on the default style or\n * provided options\n *\n * @param {Object} worldReady\n * @param {date|string} value\n * @param {Object} options\n * @returns {string}\n */\nfunction formatDate(worldReady, value, options) {\n const date = value instanceof Date ? value : new Date(value)\n return new DateTimeFormat(worldReady, {\n style: 'date-medium',\n timeZone: getTimeZone(),\n ...options,\n }).format(date)\n}\n\n/**\n * Receives the worldReady localization context contentId, formatOptions\n * and returns a formatted/localized string\n *\n * @param {Object} worldReady\n * @param {string} contentId\n * @param {Object} formatOptions\n * @returns {string}\n */\nfunction formatMessage(worldReady, contentId, formatOptions) {\n return new MessageFormat(worldReady, { id: contentId }).format(formatOptions)\n}\n\n/**\n * Custom hook to avoid the use of the HOC injectWorldReady in every component\n *\n * @returns {Object} Depends on the called function\n */\nfunction useIntl() {\n const worldReady = useContext(WorldReadyContext)\n\n return {\n formatDate: (value, options) => {\n return formatDate(worldReady, value, options)\n },\n formatMessage: ({ contentId, formatOptions }) => {\n return formatMessage(worldReady, contentId, formatOptions)\n },\n }\n}\n\nexport { useIntl, formatDate, formatMessage }\n","import React from 'react'\nimport { useIntl } from 'intl'\nimport PropTypes from 'prop-types'\nimport cssModules from 'react-css-modules'\nimport { Message } from '@paypalcorp/worldready-react'\nimport styles from '../../crowdfunding_campaign_header.less'\nimport { Col, Badge, ClockIcon } from '@paypalcorp/pp-react'\nimport { daysFromToday } from 'shared/helpers/datetime_helpers'\n\nconst DaysComponent = ({ endDate, canChipIn }) => {\n const { formatDate } = useIntl()\n const days = daysFromToday(new Date(endDate))\n\n const badgeType = canChipIn ? 'warning' : 'neutral'\n const badgeContentId = canChipIn\n ? 'components.crowdfunding_campaign_header.end_in'\n : 'components.donate_button.expired'\n\n return (\n \n {!hasCurrencyBalance && (\n
\n )\n }\n}\n\nexport default withRouter(cssModules(Manage, styles))\n","import Manage from './manage_cf'\nimport { connect } from 'react-redux'\nimport { getCampaignSelector } from 'redux/selectors/campaign'\nimport { push } from 'react-router-redux'\nimport { glimpseRoute } from 'lib/route_utils'\nimport { createDNWTransaction } from 'client/redux/modules/dnw_transaction'\nimport { TOAST_NOTIFICATIONS } from 'shared/shared_consts'\nimport { get } from 'lodash'\n\nconst mapStateToProps = (state, props) => {\n const campaign = getCampaignSelector(state, props)\n const canChipInAndCanDonate = campaign.can_chip_in && campaign.can_donate\n const canDonateGNC =\n Boolean(campaign.charity) &&\n canChipInAndCanDonate &&\n Boolean(campaign.is_owner) &&\n state.flags.dnw_payment\n const canPledge =\n (campaign.is_owner && campaign.can_chip_in) || canChipInAndCanDonate\n\n return {\n canDonateGNC: canDonateGNC,\n canPledge: canPledge,\n charity: campaign.charity,\n currencyCode: campaign.currency,\n currentValue: campaign.current_value + campaign.pledge,\n goal: campaign.goal,\n hasChippedIn: campaign.current_value > 0,\n hasCurrencyBalance: campaign.has_currency_balance,\n hasMoneybox: campaign.moneybox_amount > 0,\n isDNWPayment: state.flags.dnw_payment,\n isOrganizerUpdatesEnabled: state.flags.isOrganizerUpdatesEnabled,\n activitiesCount: get(\n campaign,\n 'transactionSummary.total_number_of_transactions',\n 0\n ),\n showUpdateSuccess:\n state.toast_notification[TOAST_NOTIFICATIONS.EDIT_SUCCESS],\n paypalDomain: state.geo.paypalDomain,\n organizerUpdate: campaign.organizerUpdate,\n cdnHost: state.geo.cdnHost,\n campaign: campaign,\n }\n}\n\nconst mapDispatchToProps = (dispatch, { campaignId }) => {\n const transferCampaignUrl = `c/${campaignId}/edit/transfer`\n return {\n onTransfer() {\n dispatch(push({ pathname: glimpseRoute('pools', transferCampaignUrl) }))\n },\n onDonate(id) {\n dispatch(\n createDNWTransaction({\n campaignId: id,\n hasFullPageDonationRedirect: true,\n })\n )\n },\n }\n}\n\nexport default connect(\n mapStateToProps,\n mapDispatchToProps\n)(Manage)\n","import React from 'react'\nimport PropTypes from 'prop-types'\nimport cssModules from 'react-css-modules'\nimport { getI18n } from 'client/i18n'\nimport { formatMoney } from 'client/griffin'\nimport styles from './activity.less'\nimport {\n CompletedActivityList,\n PendingContributionsList,\n} from 'components/contributions_list/owner_activity_list'\nimport ActivityRow from 'components/contributions_list/rows/activity_row'\nimport { withRouter } from 'react-router'\nimport { connect } from 'react-redux'\nimport { getCampaignSelector } from 'redux/selectors/campaign'\n\nconst i18n = getI18n('components/edit_glimpse/activity')\n\nclass Activity extends React.Component {\n static propTypes = {\n campaignId: PropTypes.string,\n moneyBoxAmount: PropTypes.number,\n moneyBoxCurrency: PropTypes.string,\n }\n\n render() {\n const balance = formatMoney(\n this.props.moneyBoxCurrency,\n this.props.moneyBoxAmount\n )\n\n return (\n \n \n \n \n {i18n('edit_fundraiser')}\n \n \n \n {\n if (e.key === ENTER_KEY) {\n this.handleFPTI()\n }\n }}\n tabIndex={0}\n >\n \n {i18n('show_fundraiser')}\n \n \n \n \n \n {i18n('share')}\n \n \n \n {hasChippedIn &&\n !isCharity && (\n {\n if (e.key === ENTER_KEY) {\n this.handleTransferClick()\n }\n }}\n styleName=\"manage-link\"\n tabIndex={0}\n >\n \n {i18n('transfer_link')}\n \n \n \n )}\n {canPledge &&\n !isCharity && (\n \n \n {i18n('pledge')}\n \n \n \n )}\n {canDonateGNC && (\n \n \n {i18n('donate')}\n \n \n \n )}\n
\n
\n {!isCharity && (\n \n
\n \n
\n )}\n {isOrganizerUpdatesEnabled && (\n \n
\n )\n }\n}\n\nexport default connect((state, ownProps) => {\n const campaign = getCampaignSelector(state, ownProps)\n return {\n moneyBoxAmount: campaign.moneybox_amount,\n moneyBoxCurrency: campaign.currency,\n }\n})(withRouter(cssModules(Activity, styles)))\n","import React from 'react'\nimport PropTypes from 'prop-types'\nimport { Avatar, CaptionText } from '@paypalcorp/pp-react'\nimport cssModules from 'react-css-modules'\nimport styles from './charity_card.less'\n\nclass CharityCard extends React.Component {\n static propTypes = {\n charity: PropTypes.object,\n }\n render() {\n const { charity } = this.props\n return (\n {i18n('activity.title')}
\n {i18n('activity.balance', { balance })}
\n \n (\n
\n \n (\n
\n \n
\n )\n }\n}\n\nexport default cssModules(CharityCard, styles)\n","import { DateInput, Calendar } from '@paypalcorp/pp-react'\nimport React, { useState, useEffect } from 'react'\nimport PropTypes from 'prop-types'\nimport { endOfDay } from 'shared/helpers/datetime_helpers'\n\nDateInputBox.propTypes = {\n onBlur: PropTypes.func,\n disabled: PropTypes.boolean,\n initialValue: PropTypes.string,\n timeZone: PropTypes.string,\n errorText: PropTypes.any,\n label: PropTypes.string,\n dataNemo: PropTypes.string,\n isCalenderEnable: PropTypes.boolean,\n id: PropTypes.string,\n name: PropTypes.string,\n useEndOfDay: PropTypes.boolean,\n}\n\nfunction DateInputBox(props) {\n const [selectedDate, setSelectedDate] = useState(props.initialValue)\n const [isCalendarVisible, setCalenderVisible] = useState()\n\n const handleBlur = evt => {\n document.getElementById('formContent').style.overflow = 'hidden'\n props.onBlur(selectedDate)\n }\n\n const handleSelection = date => {\n setCalenderVisible(false)\n\n if (props.useEndOfDay) {\n setSelectedDate(endOfDay(date))\n } else {\n setSelectedDate(date)\n }\n }\n const handleFocus = e => {\n //To Do - Need to find better solution\n document.getElementById('formContent').style.overflow = 'visible'\n }\n\n useEffect(\n () => {\n props.onBlur(selectedDate)\n },\n [selectedDate]\n )\n\n const calendarElm = (\n \n {charity.name} \n
\n \n \n {({ getRootProps, getInputProps }) => (\n \n \n {this.props.children}\n \n
\n \n )}\n \n \n )\n }\n}\n\nexport default cssModules(ImageUploadField, styles, { allowMultiple: true })\n","import React from 'react'\nimport PropTypes from 'prop-types'\nimport {\n Row,\n Col,\n ZoomInIcon,\n ZoomOutIcon,\n RefreshIcon,\n DeleteIcon,\n} from '@paypalcorp/pp-react'\nimport ReactCropper from 'react-cropper'\nimport cssModules from 'react-css-modules'\nimport styles from './cropper.less'\nimport 'cropperjs/dist/cropper.css'\n\nconst CLOCKWISE = 'clockwise'\nconst ROTATE_DEGREE = 90\nconst ADJUST_ZOOM_VALUE = 0.1\n\nfunction Cropper(props) {\n const { imgSrc } = props\n const [cropper, setCropper] = React.useState(null)\n const [image, setImage] = React.useState(imgSrc)\n const [zoom, setZoom] = React.useState(props.initialZoom)\n const [rotate, setRotate] = React.useState(props.initialRotate)\n\n React.useEffect(\n () => {\n setImage(image)\n },\n [image]\n )\n\n const updateData = updatedCropper => {\n const value = updatedCropper?.getCroppedCanvas?.()?.toDataURL?.()\n if (value) {\n props.updateImageData(value)\n }\n }\n\n const handleRotate = direction => {\n const value =\n direction === CLOCKWISE ? rotate + ROTATE_DEGREE : rotate - ROTATE_DEGREE\n setRotate(value)\n cropper.rotateTo(value)\n updateData(cropper)\n }\n\n const handleZoomIn = () => {\n const value = zoom <= 0.3 ? 0.4 : zoom + ADJUST_ZOOM_VALUE\n cropper.zoomTo(value)\n updateData(cropper)\n }\n\n const handleZoomOut = () => {\n const value = zoom <= 0.3 ? zoom : zoom - ADJUST_ZOOM_VALUE\n cropper.zoomTo(value)\n updateData(cropper)\n }\n\n return (\n \n \n handleZoomIn()} />\n handleZoomOut()} />\n handleRotate('clockwise')} />\n \n
\n \n {image && (\n {\n setCropper(instance)\n }}\n ready={instance => {\n updateData(instance.currentTarget.cropper)\n }}\n cropend={event => updateData(event.currentTarget.cropper)}\n zoom={event => {\n updateData(event.currentTarget.cropper)\n setZoom(event.detail.ratio)\n }}\n guides={true}\n dragMode=\"move\"\n {...props.cropperProps}\n />\n )}\n
\n
\n )\n}\n\nCropper.propTypes = {\n initialZoom: PropTypes.number,\n initialRotate: PropTypes.number,\n mime: PropTypes.string,\n quality: PropTypes.number,\n file: PropTypes.object,\n cropperProps: PropTypes.object,\n croppedCanvasProps: PropTypes.object,\n onDiscard: PropTypes.func,\n onCompleted: PropTypes.func,\n imgSrc: PropTypes.string,\n updateImageData: PropTypes.func,\n onImageRemove: PropTypes.func,\n}\n\nCropper.defaultProps = {\n initialZoom: 0,\n initialRotate: 0,\n mime: null,\n quality: 70,\n cropperProps: {},\n croppedCanvasProps: {},\n onDiscard: () => {},\n onCompleted: () => {},\n}\n\nexport default cssModules(Cropper, styles)\n","import React from 'react'\nimport PropTypes from 'prop-types'\nimport cssModules from 'react-css-modules'\nimport styles from './crowdfunding_image_adjust.less'\nimport Cropper from 'components/common/cropper'\n\nclass CrowdFundingImageAdjust extends React.Component {\n static propTypes = {\n imageUrl: PropTypes.string.isRequired,\n onImageChange: PropTypes.func,\n onImageRemove: PropTypes.func,\n }\n\n render() {\n return (\n \n
\n )\n }\n}\n\nexport default cssModules(CrowdFundingImageAdjust, styles)\n","import React from 'react'\nimport PropTypes from 'prop-types'\nimport cssModules from 'react-css-modules'\nimport styles from './strip.less'\n\nimport { DEFAULT_GRADIENT_COLOR } from 'shared/shared_consts'\n\nclass Strip extends React.Component {\n static propTypes = {\n stripRef: PropTypes.func,\n isResponsive: PropTypes.bool,\n isFullscreen: PropTypes.bool,\n staticHeight: PropTypes.number,\n backgroundImage: PropTypes.string,\n backgroundPan: PropTypes.number,\n gradientColor: PropTypes.string,\n customStyle: PropTypes.object,\n customStyleInput: PropTypes.bool,\n }\n\n static defaultProps = {\n gradientColor: DEFAULT_GRADIENT_COLOR,\n }\n\n render() {\n let styleNames = []\n const responsiveStyle =\n this.props.isFullscreen && this.props.isResponsive\n ? 'responsive-fullscreen'\n : 'responsive'\n styleNames.push(this.props.isResponsive ? responsiveStyle : 'static')\n let customStyle = this.props.customStyle || {}\n if (this.props.backgroundImage) {\n customStyle.backgroundImage = `url(${this.props.backgroundImage})`\n customStyle.backgroundPosition = `50% ${this.props.backgroundPan}%`\n styleNames.push('strip-with-image')\n if (this.props.customStyleInput) {\n styleNames.push('strip-image')\n }\n } else {\n customStyle = {\n height: this.props.staticHeight || '100%',\n }\n styleNames.push(\n `strip-${this.props.gradientColor || DEFAULT_GRADIENT_COLOR}`\n )\n styleNames.push('strip-image')\n }\n\n return (\n \n
\n \n this.props.onImageChange({ url })}\n />\n
\n \n {this.props.children}\n {\n this.input = input\n }}\n onChange={this.handleFileSelect}\n />\n
\n )\n }\n}\n\nexport default ImageFileField\n","import React from 'react'\nimport PropTypes from 'prop-types'\nimport cssModules from 'react-css-modules'\nimport styles from './crowdfunding_image_preview.less'\nimport Hammer from 'react-hammerjs'\nimport Strip from 'components/strip'\nimport { CaptionText, Button } from '@paypalcorp/pp-react'\nimport ImageFileField from 'components/common/image_file_field'\nimport { getI18n } from 'client/i18n'\nimport { inverseLerp } from 'shared/helpers/math_helpers'\nimport { COVER_IMAGE_MAX_TOTAL_SIZE } from 'shared/shared_consts'\n\nexport const DEFAULT_RELATIVE_PAN = 50\n\nconst i18n = getI18n('components/crowdfunding_image_preview')\n\nclass CrowdFundingImagePreview extends React.Component {\n static propTypes = {\n imageUrl: PropTypes.string.isRequired,\n pan: PropTypes.number,\n onPanChange: PropTypes.func,\n onImageChange: PropTypes.func,\n onImageLoad: PropTypes.func,\n onImageRemove: PropTypes.func,\n }\n\n state = {\n pan: this.props.pan,\n imageUrl: this.props.imageUrl,\n }\n\n componentDidMount() {\n this.refreshImageSize()\n }\n\n refreshImageSize = () => {\n let image = new Image()\n image.addEventListener('load', () => {\n this.imageWidth = image.width\n this.imageHeight = image.height\n this.previewWidth = this.strip.offsetWidth\n this.previewHeight = this.strip.offsetHeight\n this.previewZoom = this.previewWidth / this.imageWidth\n })\n image.src = this.state.imageUrl\n }\n\n handleImageChangeIntent = e => {\n e.preventDefault()\n this.imageInput.handleOpenFileDialog()\n }\n\n handleImageChange = val => {\n this.setState(\n {\n pan: DEFAULT_RELATIVE_PAN,\n imageUrl: val.url,\n },\n () => {\n this.refreshImageSize()\n }\n )\n this.props.onImageChange(val)\n }\n\n handlePanStart = () => {\n this.panStart = this.lastAbsolutePan || 0\n }\n\n handlePan = evt => {\n let remainingHeight =\n (this.previewZoom * this.imageHeight - this.previewHeight) / 2\n let absolutePan = this.panStart + evt.deltaY\n absolutePan = Math.min(\n Math.max(-remainingHeight, absolutePan),\n remainingHeight\n )\n let relativePan = Math.round(\n inverseLerp(remainingHeight, -remainingHeight, absolutePan) * 100\n )\n this.lastAbsolutePan = absolutePan\n this.setState({ pan: relativePan })\n }\n\n handlePanEnd = () => {\n this.props.onPanChange(this.state.pan)\n }\n\n render() {\n // TODO Figure out a way to do this in scalable way.\n const customStyle = {\n height: '201px',\n }\n\n return (\n \n \n {i18n('drag_image')}\n \n {\n this.imageInput = imageInput\n }}\n onImageLoad={this.props.onImageLoad}\n restrictedTotalSize={COVER_IMAGE_MAX_TOTAL_SIZE}\n onChange={this.handleImageChange}\n />\n
\n \n )\n }\n}\n\nexport default cssModules(CrowdFundingImagePreview, styles)\n","import React from 'react'\nimport PropTypes from 'prop-types'\nimport cssModules from 'react-css-modules'\nimport {\n Alert,\n BodyText,\n Button,\n CaptionText,\n HeadingText,\n PictureIcon,\n} from '@paypalcorp/pp-react'\nimport styles from './crowdfunding_cover_image.less'\nimport CrossFadeTransition from 'components/common/transitions/cross_fade'\nimport ImageUploadField from 'components/common/image_upload_field'\nimport { trackClick } from 'lib/fpti_analytics'\nimport { getI18n } from 'client/i18n'\nimport CrowdFundingImageAdjust from '../crowdfunding_image_adjust'\nimport CrowdFundingImagePreview from 'components/crowdfunding_image_preview'\nimport {\n COVER_IMAGE_MAX_TOTAL_SIZE,\n COVER_IMAGE_UPLOAD_ERRORS,\n} from 'shared/shared_consts'\n\nconst {\n FILE_INVALID_TYPE,\n FILE_TOO_LARGE,\n FILE_TOO_SMALL,\n TOO_MANY_FILES,\n} = COVER_IMAGE_UPLOAD_ERRORS\nconst DEFAULT_PAN = 50\nconst i18n = getI18n('components/pages/crowdfunding/crowdfunding_cover_image')\n\nclass CrowdFundingCoverImage extends React.Component {\n static propTypes = {\n fields: PropTypes.object.isRequired,\n showDoneButton: PropTypes.bool,\n showTitle: PropTypes.bool,\n showPreviewComponent: PropTypes.bool,\n }\n\n state = {\n isLoading: false,\n uploadError: null,\n }\n\n constructor(props) {\n super(props)\n this.child = React.createRef()\n }\n\n handleImageRemove = e => {\n e.preventDefault()\n const {\n fields: { backgroundImage, backgroundImageFilename, backgroundPan },\n } = this.props\n this.setState({ uploadError: null })\n trackClick({\n clickName: 'dw_giving_edit_fundraiser_remove_photo_pressed',\n data: {\n event_name: 'dw_giving_edit_fundraiser_remove_photo_pressed',\n },\n })\n\n backgroundPan.onChange(DEFAULT_PAN)\n backgroundImage.onChange(undefined)\n backgroundImageFilename.onChange(undefined)\n }\n\n handleImageChange = val => {\n const {\n fields: { backgroundImage, backgroundImageFilename, backgroundPan },\n } = this.props\n this.setState({ uploadError: null })\n trackClick({\n clickName: 'dw_giving_edit_fundraiser_change_photo_pressed',\n data: {\n event_name: 'dw_giving_edit_fundraiser_change_photo_pressed',\n },\n })\n\n backgroundPan.onChange(DEFAULT_PAN)\n backgroundImage.onChange(val.url)\n backgroundImageFilename.onChange(val.name || backgroundImageFilename.value)\n }\n\n handleImageLoad = isLoading => {\n this.setState({ isLoading })\n }\n\n imageUploadClick = () => {\n this.child.current.openFileDialog()\n }\n\n handleImageUploadError = imageLoadError => {\n this.setState({ uploadError: imageLoadError })\n }\n\n mapErrorToContent = (errorCode = FILE_INVALID_TYPE) => {\n const errorCodeMapping = {}\n\n errorCodeMapping[FILE_INVALID_TYPE] = 'file_invalid_type'\n errorCodeMapping[FILE_TOO_LARGE] = 'file_too_large'\n errorCodeMapping[FILE_TOO_SMALL] = 'file_too_small'\n errorCodeMapping[TOO_MANY_FILES] = 'too_many_files'\n return errorCodeMapping[errorCode]\n }\n\n getErrorMessage = errorCode => {\n const key = this.mapErrorToContent(this.state.uploadError.code)\n return i18n(key)\n }\n\n render() {\n const {\n fields: { backgroundImage = {}, backgroundPan },\n showDoneButton,\n showTitle,\n showPreviewComponent,\n } = this.props\n\n return (\n \n {\n this.strip = strip\n }}\n />\n
\n \n \n {i18n('change_image')}\n \n \n {i18n('remove_image')}\n \n
\n \n {showTitle && (\n \n {i18n('title_cf')}\n \n )}\n \n {backgroundImage.value ? (\n
\n ) : (\n \n \n {/* To manage older version from cf edit */}\n {showPreviewComponent ? (\n
\n \n \n \n {i18n('upload_tip')} \n {this.state.uploadError ? (\n \n {this.getErrorMessage(this.state.uploadError.code)}\n \n ) : null}\n
\n \n )}\n {showDoneButton && (\n \n \n {i18n('upload')}\n \n
\n \n \n
\n )\n } catch (error) {\n return \n {this.props.showHeader && (\n \n {this.props.showHeader &&\n !headerContent && \n {this.props.children}\n \n \n {this.props.showFooter &&
\n \n )\n }\n}\n\nexport default cssModules(CrowdfundingPage, styles, { allowMultiple: true })\n","import CrowdfundingPage from './crowdfunding_page'\nimport { connect } from 'react-redux'\nimport { fromVeniceSelector } from 'redux/selectors/venice'\nimport {\n getAllowEntryBannerSelector,\n isMoneyPoolSelector,\n} from 'redux/selectors/campaign'\n\nconst mapStateToProps = (state, { campaignId, showHeader, showFooter }) => {\n const fromVenice = fromVeniceSelector()(state)\n if (fromVenice) {\n showHeader = false\n showFooter = false\n }\n const isMoneyPool = isMoneyPoolSelector(state, { campaignId })\n\n return {\n isMoneyPool,\n showHeader,\n showFooter,\n isLoggedIn: state.login_info && state.login_info.logged_in,\n allowEntryBanner: getAllowEntryBannerSelector(state, { campaignId }),\n paypalDomain: state.geo.paypalDomain,\n banner: state.personalizationStudio.banner,\n }\n}\nexport default connect(mapStateToProps)(CrowdfundingPage)\n","import React from 'react'\nimport PropTypes from 'prop-types'\nimport { getI18n } from 'client/i18n'\nimport ExpandableParagraph from 'components/common/expandable_paragraph'\nimport Linkify from 'react-linkify'\nimport cssModules from 'react-css-modules'\nimport styles from './campaign_details.less'\nimport { Avatar, Col, Row, CaptionText } from '@paypalcorp/pp-react'\n\nconst i18n = getI18n('components/campaign_details')\nconst i18nCharity = getI18n('components/crowdfunding_charity_detail_view')\nconst MAX_ROWS = 200\nconst DEFAULT_ROWS = 3\n\nclass CampaignDetails extends React.Component {\n static propTypes = {\n details: PropTypes.string,\n tab_layout: PropTypes.bool,\n profileImage: PropTypes.string,\n initials: PropTypes.string,\n isCharity: PropTypes.bool,\n charity: PropTypes.any,\n isPreview: PropTypes.bool,\n ownerName: PropTypes.string,\n }\n static defaultProps = {\n tab_layout: false,\n }\n render() {\n if (!this.props.details) {\n return null\n }\n let title\n if (this.props.isCharity) {\n title = i18nCharity('about_fundraiser')\n } else {\n title = this.props.tab_layout ? '' : i18n('title')\n }\n const titleStrong = this.props.isCharity\n const maxRows = this.props.tab_layout ? MAX_ROWS : DEFAULT_ROWS\n\n return (\n \n
\n \n \n \n \n \n \n
\n {this.props.isCharity && (\n {this.props.details}
\n \n \n \n \n \n
\n )}\n \n {this.props.charity.description}\n
\n \n \n {formatMoney(this.props.currency, this.props.amount)}\n \n )}\n {this.props.note &&\n !this.props.removeExistingCommentFlag && (\n
\n )\n }\n}\n\nexport default cssModules(PublicContributionRow, styles, {\n allowMultiple: true,\n})\n","import React from 'react'\nimport PropTypes from 'prop-types'\nimport { connect } from 'react-redux'\nimport ContributionsList from './contributions_list'\nimport { publicContributionsListSelector } from 'redux/selectors/contributions'\nimport { getCampaignSelector } from 'redux/selectors/campaign'\nimport cssModules from 'react-css-modules'\nimport styles from './public_contributions_list.less'\nimport ChipInButton from '../pages/campaign/chip_in_button'\nimport { daysFromToday } from 'shared/helpers/datetime_helpers'\nimport { getI18n } from 'client/i18n'\nimport { formatMoney, getFullName } from 'client/griffin'\nimport PublicContributionRow from './rows/public_contribution_row'\nimport {\n POOLS_CAMPAIGN_TYPES,\n CONTRIBUTION_TRANSACTIONS_PER_PAGE,\n} from 'shared/shared_consts'\nimport { get } from 'lodash'\n\nconst { CROWD_FUNDING } = POOLS_CAMPAIGN_TYPES\nconst i18n = getI18n('components/txns_list')\n\nclass UnboundPublicContributionsList extends React.Component {\n static propTypes = {\n campaignId: PropTypes.string.isRequired,\n contributions: PropTypes.array,\n txnsPerPage: PropTypes.number.isRequired,\n totalTxnsCount: PropTypes.number.isRequired,\n txnCount: PropTypes.number,\n goalRemaining: PropTypes.number,\n daysRemaining: PropTypes.number,\n currency: PropTypes.string.isRequired,\n ownerId: PropTypes.string.isRequired,\n ownerName: PropTypes.string.isRequired,\n canChipIn: PropTypes.bool.isRequired,\n preview: PropTypes.bool,\n onChipInClick: PropTypes.func,\n hideChipIn: PropTypes.bool,\n pledge: PropTypes.number,\n campaignType: PropTypes.string.isRequired,\n removeExistingCommentFlag: PropTypes.bool,\n }\n\n static defaultProps = {\n txnCount: 0,\n hideChipIn: false,\n }\n\n formattedAttention = () => {\n let stringId\n if (this.props.goalRemaining) {\n if (this.props.daysRemaining) {\n stringId = 'attention_goal_and_days_{days}'\n } else {\n stringId = 'attention_goal_only'\n }\n } else if (this.props.daysRemaining) {\n stringId = 'attention_days_only_{days}'\n }\n return stringId\n ? i18n(stringId, {\n amount: formatMoney(this.props.currency, this.props.goalRemaining, {\n removeTrailingZeros: true,\n }),\n days: this.props.daysRemaining,\n })\n : ''\n }\n\n shouldShowCallToChipIn = () => {\n return this.props.hideChipIn\n ? false\n : this.props.canChipIn && this.props.goalRemaining > 0\n }\n\n shouldSkipRenderingList = () => {\n return !this.shouldShowCallToChipIn() && !this.props.contributions\n }\n\n addPledgeToContributionList = () => {\n let contributionArray = this.props.contributions\n ? [...this.props.contributions]\n : []\n contributionArray.unshift({\n amount: this.props.pledge,\n anonymous: false,\n campaign_id: this.props.campaignId,\n contributor_id: this.props.ownerId,\n contributor_name: this.props.ownerName,\n contributor_photo: undefined,\n currency: this.props.currency,\n date: '',\n isPledge: true,\n })\n return contributionArray\n }\n\n render() {\n if (this.shouldSkipRenderingList()) return null\n let contributionList = this.props.contributions\n ? [...this.props.contributions]\n : null\n if (this.props.campaignType === CROWD_FUNDING && this.props.pledge) {\n contributionList = this.addPledgeToContributionList()\n }\n\n const ChipInCTA =\n this.shouldShowCallToChipIn() &&\n cssModules(\n ({ name, attentionMessage }) => (\n \n
\n {this.props.preview ? (\n \n
\n ) : (\n \n
\n
\n \n {contributorName}\n \n \n {this.formattedDate()}\n \n
\n )}\n {this.props.amount != null && (\n \n {this.props.note} \n
\n )}\n \n
\n ),\n styles\n )\n\n return (\n \n
\n \n
\n \n {i18n('help_organizer', { name })}\n
\n {attentionMessage}
\n \n
\n \n
\n )\n } else {\n return (\n \n {\n trackFPTI(\n campaign,\n 'click',\n 'dw_giving_detail_updates_tab_show_previous_pressed',\n '',\n '',\n '',\n updateState\n )\n }}\n >\n
\n \n \n \n
\n )\n }\n }\n\n render() {\n const {\n campaignId,\n organizerUpdate,\n campaign,\n isOrganizerUpdatesEnabled,\n } = this.props\n const postUpdateUrl = `c/${campaignId}/postupdate`\n const organizerUpdateItem = _get(organizerUpdate, 'items', [])\n let contributionCount = _get(this.props, 'contributionsCount', 0)\n if (this.props.pledge > 0) {\n contributionCount = contributionCount + 1\n }\n const updateState = organizerUpdateState(organizerUpdate)\n trackFPTI(campaign, 'impression', 'dw_giving_detail_about_tab_shown')\n trackFPTI(\n campaign,\n 'impression',\n 'dw_giving_detail_updates_tab_shown',\n '',\n '',\n '',\n updateState\n )\n return (\n \n
\n )\n })\n }\n\n showRemainingInDetail() {\n return (this.props.format || this.defaultFormat).map((cdItem, index) => {\n return (\n \n \n {`${this.state[cdItem]} `}\n {i18n('days')}\n \n
\n \n {index > 0 ? (\n \n {this.separator}\n \n ) : null}\n\n
\n )\n })\n }\n\n renderComponents() {\n return this.state.isShowingDetail\n ? this.showRemainingInDetail()\n : this.showRemainingInDays()\n }\n\n clearCountDowns() {\n if (this.intervalId) {\n clearInterval(this.intervalId)\n }\n }\n\n componentWillMount() {\n // initiate the countdown to run every min after roll over seconds.\n if (this.updateSeconds) {\n return this.startCountDown()\n }\n\n setTimeout(() => this.startCountDown(60), this.state.seconds * 1000)\n }\n\n componentWillUnmount() {\n this.clearCountDowns()\n }\n\n render() {\n return (\n \n \n {`${this.getTimeFormat(cdItem)}`}\n \n
\n {this.props.i18n2('clipboard')}
\n )}\n {!this.state.isCopied && (\n {i18n('email')}
}\n \n )\n}\n\nexport const TwitterSharing = props => {\n displayComponent(props.showTwitter)\n\n return (\n {i18n('twitter')}
}\n \n )\n}\n\nexport const FacebookSharing = props => {\n displayComponent(props.showFacebook)\n\n return (\n {i18n('facebook')}
}\n \n )\n}\n\nexport const MessengerSharing = props => {\n displayComponent(props.showMessenger)\n\n return (\n {i18n('messenger')}
}\n \n )\n}\n\nexport const WhatsAppSharing = props => {\n displayComponent(props.showWhatsApp)\n\n return (\n {i18n('whatsapp')}
}\n \n )\n}\n\nexport const SmsSharing = props => {\n displayComponent(props.showSms)\n\n return (\n {i18n('sms')}
}\n \n )\n}\n\nexport const ClipboardSharing = props => {\n return (\n - {generateOptions(props)}
\n
\n )\n }\n}\n\nexport default cssModules(CopyBox, styles)\n","import React from 'react'\nimport PropTypes from 'prop-types'\nimport cssModules from 'react-css-modules'\nimport styles from './share_campaign_compact.less'\nimport { getI18n } from 'client/i18n'\nimport CopyBox from 'components/common/copy_box'\nimport 'node_modules/@paypalcorp/pp-vx/dist/components/icons/icons.css'\nimport {\n EmailSharing,\n TwitterSharing,\n FacebookSharing,\n MessengerSharing,\n WhatsAppSharing,\n SmsSharing,\n} from 'components/common/share_buttons'\n\nconst i18n = getI18n('components/share_campaign_compact')\n\nclass ShareCampaignCompact extends React.Component {\n static propTypes = {\n shareUrl: PropTypes.string.isRequired,\n displayUrl: PropTypes.string.isRequired,\n shareable: PropTypes.bool.isRequired,\n appId: PropTypes.number.isRequired,\n\n onClickOverride: PropTypes.func,\n\n showFacebook: PropTypes.bool,\n showMessenger: PropTypes.bool,\n showTwitter: PropTypes.bool,\n showWhatsApp: PropTypes.bool,\n showEmail: PropTypes.bool,\n showSms: PropTypes.bool,\n showSubtext: PropTypes.bool,\n emailBody: PropTypes.string,\n emailSubject: PropTypes.string,\n isMobile: PropTypes.bool,\n charity: PropTypes.object,\n }\n\n static defaultProps = {\n shareable: true,\n showFacebook: true,\n showMessenger: true,\n showTwitter: true,\n showWhatsApp: true,\n showEmail: true,\n showSms: true,\n showSubtext: false,\n isMobile: false,\n }\n\n render() {\n let shareText = this.props.displayUrl\n if (!this.props.shareable) {\n shareText = i18n('link_placeholder')\n }\n\n return (\n \n \n {this.props.enabled && (\n \n {\n this.copyLink = copyLink\n }}\n >\n {i18n('copy')}\n \n \n {this.state.showTooltip && (\n \n )}\n
\n {i18n('copied')}
\n )}\n \n \n
\n )\n }\n}\n\nexport default cssModules(ShareCampaignCompact, styles)\n","import ShareCampaign from './share_campaign_compact'\nimport { connect } from 'react-redux'\nimport { getShareProps } from 'lib/share'\n\nconst mapStateToProps = (state, ownProps) => {\n return getShareProps(state, ownProps)\n}\n\nconst mapDispatchToProps = dispatch => {\n return {}\n}\n\nexport default connect(\n mapStateToProps,\n mapDispatchToProps\n)(ShareCampaign)\n","import React from 'react'\n\nimport PropTypes from 'prop-types'\nimport cssModules from 'react-css-modules'\nimport styles from './report_link.less'\nimport { getI18n } from 'client/i18n'\nimport { trackClick } from 'lib/fpti_analytics'\nimport { POOLS_CAMPAIGN_TYPES } from 'shared/shared_consts'\nimport { CaptionText, Link } from '@paypalcorp/pp-react'\n\nconst i18n = getI18n('components/report_link')\nconst { CROWD_FUNDING } = POOLS_CAMPAIGN_TYPES\n\nclass ReportLink extends React.Component {\n static propTypes = {\n currentUserCountryCode: PropTypes.string,\n campaignId: PropTypes.string,\n campaignType: PropTypes.string,\n paypalDomain: PropTypes.string,\n charity: PropTypes.object,\n }\n\n static defaultProps = {\n currentUserCountryCode: 'US',\n }\n\n getReportPoolLink = (country = 'US') => {\n return `https://${\n this.props.paypalDomain\n }/${country}/smarthelp/contact-us?email=paypalme`\n }\n\n handleReportPoolClick = () => {\n trackClick({\n clickName: 'report_pool_pressed',\n data: {\n event_name: 'dw_giving_view_fundraiser_report_pressed',\n flow: this.props.charity\n ? 'GENEROSITY_NETWORK_CHARITIES'\n : 'GENEROSITY_NETWORK',\n },\n })\n }\n\n render() {\n const { currentUserCountryCode } = this.props\n\n return (\n \n
\n \n
\n \n \n \n \n {step1.text}\n \n \n \n \n \n {step3.text}\n \n \n
\n
\n \n
\n ) : (\n \n \n {i18n('charity_donating_to_paypal_title')}\n \n
\n )\n }\n\n const renderButton = () => {\n return (\n \n {renderBig(steps)} \n {renderSmall(steps)} \n \n
\n
\n )\n}\n","import React from 'react'\nimport cssModules from 'react-css-modules'\nimport { PropTypes } from 'prop-types'\nimport styles from './charity_details_modal.less'\nimport { Sheet, HeadingText, BodyText, Row } from '@paypalcorp/pp-react'\nimport { getI18n } from 'client/i18n'\n\nconst i18n = getI18n('components/crowdfunding_charity_detail_view')\nconst US = 'US'\n\nclass CharityDetailsModal extends React.Component {\n static propTypes = {\n onGivingFundTermsModalClose: PropTypes.function,\n showGivingFundTermsModal: PropTypes.bool,\n countryCode: PropTypes.string,\n cdnHost: PropTypes.string,\n }\n\n constructor(props) {\n super(props)\n }\n\n render() {\n const { countryCode, cdnHost } = this.props\n const IconUrl = `https://${cdnHost}/images/Cause/hub/ic_blueheart.svg`\n const isCountryCodeUS = countryCode === US\n\n return (\n \n {renderButton()}\n
\n \n {icon}
\n\n const ICON_NAME = iconType === WARNING ? 'empty-warning' : 'empty-critical'\n const ICON_URL = `https://${getCdnHostName()}/paypal-ui/illustrations/focused/svg/${ICON_NAME}.svg`\n const isShowingImage = iconType === WARNING || iconType === ERROR\n\n const iconClass = (() => {\n switch (iconType) {\n case WARNING:\n return ICON_URL\n case ERROR:\n return ICON_URL\n default:\n return ''\n }\n })()\n\n return isShowingImage ? (\n \n {this.renderIcon()}\n \n {this.props.title}\n \n \n {this.props.subtitle}\n \n {this.props.showButton && (\n \n {this.props.backButton ? i18n('back') : i18n('try_again')}\n \n )}\n {this.props.extraContent}\n
\n )\n }\n}\n\nexport default withRouter(cssModules(StandardError, styles))\n","import * as React from 'react'\nimport PropTypes from 'prop-types'\n\nimport cssModules from 'react-css-modules'\nimport { Button, Sheet } from '@paypalcorp/pp-react'\nimport StandardError from 'components/common/standard_error'\nimport styles from './payments_token_sheet.less'\nimport { getI18n } from 'client/i18n'\n\nconst i18nErrors = getI18n('errors/errors')\nconst i18n = getI18n('components/common/campaign_eligibility')\nconst i18nBack = getI18n('components/back_button')\nconst DONATION_TOKEN_MERCHANT_UNABLE_RECEIVE_MONEY =\n 'DONATION_TOKEN_MERCHANT_UNABLE_RECEIVE_MONEY'\n\nclass PaymentsTokenSheet extends React.Component {\n static propTypes = {\n hostName: PropTypes.string,\n isOpen: PropTypes.bool,\n onClose: PropTypes.function,\n paymentsTokenError: PropTypes.string,\n subTitle: PropTypes.string,\n title: PropTypes.string,\n }\n\n constructor(props) {\n super(props)\n this.handleClose = this.handleClose.bind(this)\n }\n\n handleClose() {\n this.props.onClose()\n location.reload(true)\n }\n\n render() {\n const { isOpen, paymentsTokenError, hostName } = this.props\n\n const isDonationTokenMerchantUnableReceiveMoney =\n paymentsTokenError === DONATION_TOKEN_MERCHANT_UNABLE_RECEIVE_MONEY\n\n return (\n <>\n {isOpen && (\n \n {isDonationTokenMerchantUnableReceiveMoney ? (\n \n {i18nErrors('cta_error_1')}\n \n }\n />\n ) : (\n \n {i18nBack('back')}\n \n }\n />\n )}\n
\n \n )}\n \n )\n }\n}\nexport default cssModules(PaymentsTokenSheet, styles)\n","import { GNC_DISCLAIMERS } from 'shared/shared_consts'\n\nconst COUNTRY_CODES = {\n US: 'US',\n GB: 'GB',\n AU: 'AU',\n CA: 'CA',\n}\n\nexport const getDisclaimerVariables = ({ countryCode, isGnc }) => {\n if (isGnc) {\n switch (countryCode) {\n case COUNTRY_CODES.AU:\n return GNC_DISCLAIMERS.AU\n case COUNTRY_CODES.CA:\n return GNC_DISCLAIMERS.CA\n case COUNTRY_CODES.GB:\n return GNC_DISCLAIMERS.GB\n case COUNTRY_CODES.US:\n return GNC_DISCLAIMERS.US\n default:\n return {}\n }\n }\n}\n","import React from 'react'\nimport ReactDOM from 'react-dom'\nimport PropTypes from 'prop-types'\nimport _get from 'lodash/get'\nimport cssModules from 'react-css-modules'\nimport { Link } from 'react-router'\nimport { glimpseRoute } from 'lib/route_utils'\nimport CrowdFundingPage from 'components/crowdfunding_page'\nimport CrowdFundingCampaignHeader from 'components/crowdfunding_campaign_header'\nimport CrowdFundingTabLayout from 'components/crowdfunding_tab_layout'\nimport styles from './crowdfunding_detail_view.less'\nimport {\n HeadingText,\n Button,\n BodyText,\n Container,\n LoadingSpinner,\n ArrowLeftIcon,\n Link as PPLink,\n CaptionText,\n Elevation,\n CalendarIcon,\n GoalsIcon,\n} from '@paypalcorp/pp-react'\nimport clsx from 'clsx'\n\nimport Strip from 'components/strip'\nimport FlatProgress from 'components/common/flat_progress'\nimport CountDown from 'components/common/count_down'\nimport ShareButton from 'components/common/share_button'\nimport DonateButton from 'components/pages/crowdfunding/donate_button'\nimport ShareCampaign from 'components/common/share_campaign_compact'\nimport ReportLink from 'components/pages/campaign/report_link'\nimport ModalAnimations from 'components/common/transitions/modal_animations'\nimport PpgfInset from 'components/common/ppgf_inset'\nimport CharityDetailsModal from 'components/common/charity_details_modal'\nimport { formatDate } from 'client/griffin'\nimport { trackClick, trackImpression } from 'lib/fpti_analytics'\nimport PaymentsTokenSheet from '../common/payments_token_sheet/payments_token_sheet'\nimport { getDisclaimerVariables } from 'shared/helpers/helperDisclaimer'\nimport { hasPPGFIntegrationIdentifier } from 'lib/campaign'\nimport PublicContributionsList from 'components/contributions_list/public_contributions_list'\nimport { Message } from '@paypalcorp/worldready-react'\nimport { getI18n } from 'client/i18n'\n\nconst i18n = getI18n('components/crowdfunding_detail_view')\nconst i18n2 = getI18n('components/donate_button')\nconst i18nCharity = getI18n('components/crowdfunding_charity_detail_view')\n\nconst PageSpinner = () => {\n return (\n \n
\n )\n}\nconst CanDonateOrChipInProptypes = {\n endDate: PropTypes.string,\n canDonate: PropTypes.bool,\n canChipIn: PropTypes.bool,\n}\n\nconst CanDonateOrChipIn = ({ endDate, canDonate, canChipIn }) => {\n const formattedEndDate = formatDate(endDate)\n\n if (!canDonate) {\n return (\n \n \n {i18n2('limit-reached')}\n {` ${formattedEndDate}`}\n \n
\n )\n } else if (!canChipIn) {\n return (\n \n \n {i18n2('expired', { date: formattedEndDate })}\n \n
\n )\n }\n if (canChipIn) {\n return (\n \n {i18n('expires')} \n
\n )\n }\n return null\n}\nCanDonateOrChipIn.propTypes = CanDonateOrChipInProptypes\n\nclass CrowdfundingDetailView extends React.Component {\n static propTypes = {\n paymentsTokenError: PropTypes.string,\n campaign: PropTypes.Object,\n campaignId: PropTypes.string,\n clearDNWTransactionError: PropTypes.func,\n setIsLoading: PropTypes.func,\n countryCode: PropTypes.string,\n defaultCategoryCover: PropTypes.string,\n geo: PropTypes.Object,\n glimpse: PropTypes.element,\n isEdit: PropTypes.bool,\n isLoadingDNWTransaction: PropTypes.bool,\n isMobile: PropTypes.bool,\n preview: PropTypes.bool,\n reversed: PropTypes.string,\n secondary: PropTypes.string,\n small: PropTypes.string,\n hostName: PropTypes.string,\n hasMarketplaceTreatment: PropTypes.bool,\n isOrganizerUpdatesEnabled: PropTypes.bool,\n }\n\n constructor(props) {\n super(props)\n this.state = { showGivingFundTermsModal: false }\n this.modalRoot = document.getElementById('modal-root')\n }\n\n invokeGivingFundTermsModal = e => {\n e.preventDefault()\n this.setState({\n showGivingFundTermsModal: true,\n })\n this.trackFPTI('click', 'dw_giving_detail_giving_fund_info_pressed')\n this.trackFPTI('impression', 'dw_giving_paypal_fund_info_screen_shown')\n }\n\n onGivingFundTermsModalClose = () => {\n this.setState({\n showGivingFundTermsModal: false,\n })\n this.trackFPTI('click', 'dw_giving_paypal_fund_info_close_pressed')\n }\n\n trackFPTI = (eventType, event) => {\n const charity = this.props.campaign && this.props.campaign.charity\n const fptiPayload = {\n event_name: event,\n flow:\n charity && charity.name\n ? 'GENEROSITY_NETWORK_CHARITIES'\n : 'GENEROSITY_NETWORK',\n charityname: charity && charity.name,\n crid: charity && charity.nonprofit_id,\n }\n if (eventType === 'impression') {\n trackImpression(fptiPayload)\n } else {\n trackClick({\n clickName: event,\n data: fptiPayload,\n })\n }\n }\n\n renderReportingLink = (isPreview, is_owner, id, isGnc = false) => (\n \n {!isPreview && !is_owner &&
\n )\n\n handleClickFindMore = event => {\n const { charity } = this.props.campaign\n const CLICK_NAME = 'dw_giving_detail_find_more_fundraisers_pressed'\n trackClick({\n clickName: CLICK_NAME,\n data: {\n event_name: CLICK_NAME,\n flow:\n charity && charity.name\n ? 'GENEROSITY_NETWORK_CHARITIES'\n : 'GENEROSITY_NETWORK',\n charityname: charity && charity.name,\n crid: charity && charity.nonprofit_id,\n },\n })\n }\n\n render() {\n let {\n background_image,\n background_pan,\n currency,\n current_value = 0,\n end_date,\n goal,\n id,\n is_owner,\n pledge = 0,\n charity,\n can_chip_in: canChipIn,\n can_donate: canDonate,\n transactionSummary,\n } = this.props.campaign\n const {\n isLoadingDNWTransaction,\n isEdit = false,\n paymentsTokenError,\n clearDNWTransactionError,\n setIsLoading,\n hostName,\n countryCode,\n hasMarketplaceTreatment,\n isOrganizerUpdatesEnabled,\n } = this.props\n let isCharity = !!charity && charity.name\n const isPPGFCharity = hasPPGFIntegrationIdentifier(countryCode) && isCharity\n const customStyle = {\n height: '100%',\n }\n const isPreview = id === '__new_campaign__' || isEdit\n const showHeader = !isPreview\n const { isMobile } = this.props\n const showFindMoreLink = hasMarketplaceTreatment && showHeader\n let contributionCount = _get(\n transactionSummary,\n 'total_number_of_contributions',\n 0\n )\n if (pledge > 0) {\n contributionCount = contributionCount + 1\n }\n\n return (\n \n {isLoadingDNWTransaction && {\n setIsLoading(true)\n clearDNWTransactionError()\n }}\n paymentsTokenError={paymentsTokenError}\n hostName={hostName}\n />\n {ReactDOM.createPortal(\n {this.props.glimpse} ,\n this.modalRoot\n )}\n \n \n \n {isPPGFCharity && (\n \n \n \n\n {this.state.showGivingFundTermsModal && (\n \n )}\n {charity &&\n isMobile &&\n this.renderReportingLink(isPreview, is_owner, id, true)}\n \n
\n )\n }\n}\n\nexport default cssModules(CrowdfundingDetailView, styles, {\n allowMultiple: true,\n})\n","import { connect } from 'react-redux'\n\nimport CrowdfundingDetailView from 'components/crowdfunding_detail_view'\nimport { getNewCampaignSelector } from 'redux/selectors/campaign'\nimport { getCategoryDefaultCover, getMainCategory } from 'client/lib/category'\nimport { getStagingHostName } from '@paypalcorp/instance-location'\n\nconst mapStateToProps = (state, ownProps) => {\n const campaign = ownProps.isEdit\n ? ownProps.editedCampaign\n : getNewCampaignSelector(state, ownProps)\n const mainCategory = getMainCategory(campaign.category)\n const defaultCategoryCover = getCategoryDefaultCover(state, mainCategory)\n const countryCode = campaign.countryCode || state.country.country_code // create flow doesnt have countryCode set\n const hostName = [state.deployEnv.isDev, state.deployEnv.isStage].includes(\n true\n )\n ? getStagingHostName()\n : state.geo.paypalDomain\n return {\n campaign,\n countryCode,\n defaultCategoryCover,\n edit: ownProps.isEdit,\n geo: state.geo,\n hostName,\n }\n}\n\nexport default connect(mapStateToProps)(CrowdfundingDetailView)\n","import React from 'react'\nimport PropTypes from 'prop-types'\nimport cssModules from 'react-css-modules'\nimport styles from './standard_dialog.less'\nimport * as dialogStyles from './../dialog/dialog.less'\nimport { Link } from 'react-router'\nimport { glimpseRoute } from 'lib/route_utils'\nimport { Dialog, Button, HeadingText, BodyText } from '@paypalcorp/pp-react'\n\nclass StandardDialog extends React.Component {\n static propTypes = {\n title: PropTypes.string,\n subtitle: PropTypes.string,\n okButtonTitle: PropTypes.string,\n closeButtonTitle: PropTypes.string,\n onOk: PropTypes.func,\n onClose: PropTypes.func,\n onQuit: PropTypes.func,\n isDelete: PropTypes.bool,\n size: PropTypes.string,\n }\n\n render() {\n let propsToTransfer = { ...this.props }\n delete propsToTransfer.styles\n return (\n \n {showFindMoreLink && (\n
\n \n
\n \n \n \n
\n \n \n this.trackFPTI(\n 'click',\n 'dw_giving_view_fundraiser_manage_pressed'\n )\n }\n styleName=\"manage-button\"\n data-nemo=\"manage\"\n >\n {i18n('manage')}\n \n ) : (\n
\n \n
\n )}\n {!isPreview &&\n isMobile && (\n \n
\n )}\n \n
\n {isOrganizerUpdatesEnabled && (\n \n \n \n
\n )}\n \n {!isPreview &&\n !isMobile && (\n
\n \n {i18n('social_share_heading')} \n
\n )}\n {(!isMobile || (isMobile && !charity)) &&\n this.renderReportingLink(isPreview, is_owner, id)}\n \n \n {this.props.title}\n \n {this.props.subtitle} \n {this.props.okButtonTitle &&\n !this.props.isDelete && (\n \n {this.props.okButtonTitle}\n \n )}\n {this.props.okButtonTitle &&\n this.props.isDelete && (\n \n {this.props.okButtonTitle}\n \n )}\n \n {this.props.closeButtonTitle}\n \n
\n \n )\n }\n}\n\nexport default cssModules(StandardDialog, styles)\n","import React from 'react'\nimport PropTypes from 'prop-types'\n\n// This is a React HoC which adds all kinds of utils (as props) that are relevant for a redux-form component\n// Should be wrapped by the redux-form HoC, e.g.:\n// reduxForm(...)(formUtils(MyForm))\nconst formUtils = Component => {\n return class extends React.Component {\n static propTypes = {\n errors: PropTypes.any.isRequired,\n fields: PropTypes.object.isRequired,\n }\n\n anyInactiveFieldsTouchedWithError = () => {\n const { fields, errors } = this.props\n for (const field in fields) {\n if (\n fields[field].touched &&\n errors[field] &&\n errors[field].length &&\n !fields[field].active\n ) {\n return true\n }\n }\n return false\n }\n\n static displayName = `formUtils(${Component.displayName ||\n Component.name ||\n '???'})`\n\n render() {\n const newProps = {\n ...this.props,\n anyInactiveFieldsTouchedWithError: this.anyInactiveFieldsTouchedWithError(),\n }\n return \n {!isCrowdfunding &&
\n )\n }\n}\n\nexport default cssModules(Pledge, styles)\n","import Pledge from './pledge'\nimport { reduxForm } from 'redux-form'\nimport { updateRemotely } from 'redux/modules/campaign'\nimport { getCampaignSelector } from 'redux/selectors/campaign'\nimport { CROWD_FUNDING } from 'shared/shared_consts'\n\nconst mapStateToProps = (state, props) => {\n const campaign = getCampaignSelector(state, props)\n const isCrowdfunding = campaign.campaign_type === CROWD_FUNDING\n\n return {\n currency: campaign.currency,\n maxAmount: campaign.max_amount,\n campaignType: campaign.campaign_type,\n initialValues: {\n pledge: campaign.pledge || 0,\n },\n minAmount: state.flags.min_amount_donation,\n isCrowdfunding: isCrowdfunding,\n campaignTitle: campaign.title,\n }\n}\n\nconst mapDispatchToProps = (dispatch, { campaignId }) => {\n return {\n onPledge(fields) {\n return dispatch(\n updateRemotely(campaignId, { pledge: fields.pledge || 0 })\n )\n },\n }\n}\n\nexport default reduxForm(\n {\n form: 'pledge',\n fields: ['pledge'],\n destroyOnUnmount: false,\n touchOnChange: false,\n touchOnBlur: true,\n },\n mapStateToProps,\n mapDispatchToProps\n)(Pledge)\n","import React from 'react'\nimport PropTypes from 'prop-types'\nimport cssModules from 'react-css-modules'\nimport styles from './../pledge.less'\nimport { getI18n } from 'client/i18n'\nimport { Button, HeadingText } from '@paypalcorp/pp-react'\nimport { formatMoney } from 'client/griffin'\nimport { Link as RouterLink } from 'react-router'\nimport { trackClick } from 'lib/fpti_analytics'\n\nconst i18n = getI18n('components/edit_glimpse/pledge_success')\n\nconst propTypes = {\n location: PropTypes.object,\n router: PropTypes.object,\n geo: PropTypes.object,\n campaignId: PropTypes.string,\n}\nconst PledgeSuccess = props => {\n const nextPathname = '/pools'\n const { params } = props.location.state\n const { currency, campaignTitle, pledge } = params || {}\n const formattedPledgeAmount = formatMoney(currency, pledge)\n const { cdnHost } = props.geo\n\n if (!params) {\n return null\n }\n return (\n {i18n('title')}
}\n \n \n \n {i18n('success_title', {\n pledge: formattedPledgeAmount,\n campaignTitle: campaignTitle,\n })}\n \n {\n trackClick({\n clickName: 'dw_giving_pledge_confirmation_dismiss_pressed',\n data: {\n event_name: 'dw_giving_pledge_confirmation_dismiss_pressed',\n dismiss_method: 'quit',\n },\n })\n }}\n >\n {i18n('done_button')}\n \n
\n )\n}\n\nPledgeSuccess.propTypes = propTypes\n\nexport default cssModules(PledgeSuccess, styles)\n","import { connect } from 'react-redux'\nimport PledgeSuccess from './pledge_success'\n\nexport default connect(state => ({\n geo: state.geo,\n}))(PledgeSuccess)\n","import { USER_AGREEMENT_LINK_COUNTRIES } from 'shared/shared_consts'\n\nexport function getMoneyPoolTNCLink(paypalDomain, countryCode) {\n const base_url = `https://${paypalDomain}/${countryCode}/webapps/mpp/ua/`\n if (USER_AGREEMENT_LINK_COUNTRIES.indexOf(countryCode) > -1) {\n return `${base_url}useragreement-full`\n } else {\n return `${base_url}moneypool-tnc`\n }\n}\n","import React from 'react'\nimport PropTypes from 'prop-types'\nimport Modal from 'components/common/modal'\nimport StandardError from 'components/common/standard_error'\nimport { getI18n } from 'client/i18n'\nimport { exitGlimpse } from 'lib/glimpse'\nimport { getMoneyPoolTNCLink } from 'lib/global'\nimport { routerShape } from 'react-router/lib/PropTypes'\nimport { Button } from '@paypalcorp/pp-react'\nimport { glimpseRoute } from 'lib/route_utils'\nimport { Link } from 'react-router'\nimport JsxParser from 'react-jsx-parser'\nimport { baseUrl } from 'shared/campaign_url'\n\nconst i18n = getI18n('components/pages/create/create')\n\nclass CountryBlocked extends React.Component {\n static propTypes = {\n countryName: PropTypes.string,\n countryCode: PropTypes.string,\n showClose: PropTypes.bool,\n router: routerShape.isRequired,\n money_pool_creation_blocked: PropTypes.bool,\n crowdfunding_enabled: PropTypes.bool,\n paypalDomain: PropTypes.string,\n }\n\n static defaultProps = {\n showClose: false,\n }\n\n handleClose = () => {\n exitGlimpse('send', this.props.router)\n }\n\n render() {\n const {\n money_pool_creation_blocked,\n crowdfunding_enabled,\n paypalDomain,\n countryCode,\n } = this.props\n let titleJSX = i18n('moneypool_blocked_title', {\n tc_link: getMoneyPoolTNCLink(paypalDomain, countryCode),\n })\n\n const title = money_pool_creation_blocked ? (\n \n this.handleAnalyticsEvent(flow)}\n className=\"vx_btn vx_btn-block vx_btn-secondary\"\n styleName=\"go-to-account-button\"\n >\n {ctaInfo.label}\n \n
\n \n
\n )\n }\n}\n\nexport default cssModules(ShareCampaignTextarea, styles, {\n allowMultiple: true,\n})\n","import ShareCampaign from './share_campaign_textarea'\nimport { connect } from 'react-redux'\nimport { getShareProps } from 'lib/share'\n\nconst mapStateToProps = (state, ownProps) => {\n return getShareProps(state, ownProps)\n}\n\nconst mapDispatchToProps = dispatch => {\n return {}\n}\n\nexport default connect(\n mapStateToProps,\n mapDispatchToProps\n)(ShareCampaign)\n","import React from 'react'\nimport { Link, ChatIcon } from '@paypalcorp/pp-react'\nimport PropTypes from 'prop-types'\nimport styles from './feedback_link.less'\nimport { getI18n } from 'client/i18n'\n\nexport const I18N_CONTEXT = 'components/pages/crowdfunding/pool_share'\nconst i18n = getI18n(I18N_CONTEXT)\n\nconst propTypes = {\n activeFeedbackName: PropTypes.string,\n reloadQualtrics: PropTypes.function,\n uniqueFeedbackName: PropTypes.string,\n}\n\nconst FeedbackLink = ({\n activeFeedbackName,\n reloadQualtrics,\n uniqueFeedbackName,\n}) => {\n const handleClick = e => {\n e.preventDefault()\n reloadQualtrics(uniqueFeedbackName)\n }\n\n // activeFeedback is called once on page load, to manually trigger call for\n // survey but it will only open when qualtrics config allows which is currently\n // set to 10%\n React.useEffect(() => {\n reloadQualtrics(activeFeedbackName)\n }, [])\n\n return (\n \n
\n \n {\n this.copyLink = copyLink\n }}\n onClick={this.copyValidation}\n title=\"copy\"\n >\n \n {this.state.showTooltip && (\n
\n {i18n('copy')}
\n )}\n {i18n('copied')}
\n )}\n \n \n
\n )\n}\n\nFeedbackLink.propTypes = propTypes\nexport default FeedbackLink\n","import React from 'react'\nimport PropTypes from 'prop-types'\nimport { get } from 'lodash'\nimport cssModules from 'react-css-modules'\nimport styles from './crowdfunding_share.less'\nimport { getI18n } from 'client/i18n'\nimport StandardError from 'components/common/standard_error'\nimport CrossFadeTransition from 'components/common/transitions/cross_fade'\nimport {\n CIP_ELIGIBILITY_CODES,\n COUNTRY_NOT_SUPPORTED,\n QUALTRICS_GN_CREATION_ACTIVE_FEEDBACKLINK,\n QUALTRICS_GN_CREATION_FEEDBACKLINK,\n QUALTRICS_GNC_CREATION_ACTIVE_FEEDBACKLINK,\n QUALTRICS_GNC_CREATION_FEEDBACKLINK,\n UNDER_REVIEW_ERROR,\n} from 'shared/shared_consts'\nimport { NEW_CAMPAIGN_ID } from 'redux/modules/campaign'\nimport { sendEnsightenEvent } from 'lib/ensighten_analytics'\nimport { getDexterReturnUrl } from 'lib/create_campaign_eligibility'\nimport ShareCampaignTextarea from 'components/common/share_campaign_textarea'\nimport { BodyText, Button, HeadingText } from '@paypalcorp/pp-react'\nimport CampaignEligibility from 'components/common/campaign_eligibility'\nimport { dexterURL, decodeCampaignId } from 'shared/campaign_url'\nimport { trackImpression, trackEventNameClick } from 'lib/fpti_analytics'\nimport FeedbackLink from 'components/feedback_link'\n\nexport const I18N_CONTEXT = 'components/pages/crowdfunding/pool_share'\nconst i18n = getI18n(I18N_CONTEXT)\nclass CrowdfundingShare extends React.Component {\n static propTypes = {\n onPublish: PropTypes.func.isRequired,\n operatingRemotely: PropTypes.bool,\n campaignId: PropTypes.string,\n poolUrl: PropTypes.string.isRequired,\n creationError: PropTypes.object,\n shareDescription: PropTypes.string,\n params: PropTypes.object,\n charity: PropTypes.object,\n paypalDomain: PropTypes.string,\n route: PropTypes.object,\n enable_ces_link: PropTypes.bool,\n cdnHost: PropTypes.string,\n }\n\n campaignCreated = ({ campaignId }) => {\n return campaignId !== NEW_CAMPAIGN_ID\n }\n\n componentDidMount() {\n const { operatingRemotely, creationError } = this.props\n\n // Checking if the campaign has already been created so that we don't create it twice.\n // This can happen when going back from the share page to here.\n if (\n !operatingRemotely &&\n !creationError &&\n !this.campaignCreated(this.props)\n ) {\n this.props.onPublish()\n }\n }\n\n UNSAFE_componentWillReceiveProps = newProps => {\n if (this.campaignCreated(newProps) && !this.campaignCreated(this.props)) {\n sendEnsightenEvent('MoneyPoolFin')\n }\n }\n\n render() {\n let Component\n const {\n creationError,\n charity,\n enable_ces_link,\n paypalDomain,\n route,\n } = this.props\n const hideLogo = get(this.props, 'params.hideLogo', false)\n const hideButton = get(this.props, 'params.hideButton', false)\n const isPublishPath = route && route.path === 'publish'\n const isShowingCESLink = isPublishPath && enable_ces_link\n\n if (creationError) {\n if (!CIP_ELIGIBILITY_CODES.hasOwnProperty(creationError.error)) {\n trackImpression({\n error_desc: creationError.error || 'CREATE_ERROR',\n error_code: 500,\n event_type: 'ac',\n flow: charity ? 'GENEROSITY_NETWORK_CHARITIES' : 'GENEROSITY_NETWORK',\n event_name: 'dw_giving_failed_customer_interaction_occurred',\n screen: 'publish',\n })\n }\n\n if (creationError.error === UNDER_REVIEW_ERROR) {\n Component = (\n \n {!hideLogo && (\n \n {i18n('share_title')}\n \n {i18n('share_your_page')} \n \n trackEventNameClick({\n event_name: 'dw_giving_fundraiser_publish_view_pressed',\n charity_name: charity && charity.name,\n npid: charity && charity.nonprofit_id,\n campaignId: decodeCampaignId(this.props.campaignId),\n flow:\n charity && charity.name\n ? 'GENEROSITY_NETWORK_CHARITIES'\n : 'GENEROSITY_NETWORK',\n })\n }\n >\n {i18n('see_my_story')}\n \n )}\n {isShowingCESLink && (\n
\n )\n } else {\n // assume operatingRemotely\n trackImpression({\n pageName: 'create:spinner',\n flow:\n charity && charity.name\n ? 'GENEROSITY_NETWORK_CHARITIES'\n : 'GENEROSITY_NETWORK',\n })\n Component = (\n \n
\n )}\n\n \n
\n {!hideButton && (\n \n \n
\n )\n }\n\n return {i18n('creating')}
\n \n {this.props.showAmount && (\n \n {i18n('transfer_review.to')}\n \n {i18n(toCFPBStringId('transfer_review.balance'))} \n \n {i18n('transfer_review.from')}\n \n {this.props.title} \n
\n )\n }\n}\n\nexport default cssModules(TransferReviewBox, styles)\n","import TransferReviewBox from './transfer_review_box'\nimport { connect } from 'react-redux'\nimport { getCampaignSelector } from 'redux/selectors/campaign'\n\nconst mapStateToProps = (state, props) => {\n const campaign = getCampaignSelector(state, props)\n return {\n title: campaign.title,\n currency: campaign.currency,\n amount: props.amount || campaign.moneybox_amount,\n }\n}\n\nexport default connect(mapStateToProps)(TransferReviewBox)\n","import React from 'react'\nimport PropTypes from 'prop-types'\nimport cssModules from 'react-css-modules'\nimport { getI18n } from 'client/i18n'\nimport TransferReviewBox from '../transfer_review_box'\nimport StandardError from 'components/common/standard_error'\nimport styles from './delete_review.less'\n\nconst i18n = getI18n('components/edit_glimpse/edit_delete')\n\nclass DeleteReview extends React.Component {\n static propTypes = {\n campaignId: PropTypes.string.isRequired,\n moneyBoxAmount: PropTypes.number,\n onDelete: PropTypes.func.isRequired,\n error: PropTypes.any,\n }\n\n componentDidMount() {\n if (!this.props.moneyBoxAmount) {\n this.props.onDelete()\n }\n }\n\n render() {\n if (this.props.error) {\n return (\n \n \n {i18n('transfer_review.amount')}\n \n \n {formatMoney(this.props.currency, this.props.amount)}\n \n
\n )}\n \n \n {i18n('review_delete_action')}\n \n
\n )\n }\n}\n\nexport default cssModules(DeleteReview, styles)\n","import DeleteReview from './delete_review'\nimport { connect } from 'react-redux'\nimport { deleteRemotely } from 'redux/modules/campaign'\nimport { hubPageUrl } from 'lib/campaign_url'\nimport { getCampaignSelector } from 'redux/selectors/campaign'\nimport preventNavigation from 'components/common/prevent_navigation'\nimport { show } from 'redux/modules/toast_notification'\n\nconst mapStateToProps = (state, props) => {\n const campaign = getCampaignSelector(state, props)\n return {\n operatingRemotely: campaign.operatingRemotely,\n moneyBoxAmount: campaign.money_box_amount,\n error: campaign.err,\n }\n}\n\nconst mapDispatchToProps = (dispatch, { campaignId }) => {\n return {\n onDelete() {\n return dispatch(deleteRemotely(campaignId)).then(() => {\n location.href = hubPageUrl()\n })\n },\n showAlert(toastId) {\n dispatch(show(toastId))\n },\n }\n}\n\nexport default connect(\n mapStateToProps,\n mapDispatchToProps\n)(preventNavigation(DeleteReview, props => props.operatingRemotely))\n","import React from 'react'\nimport PropTypes from 'prop-types'\nimport cssModules from 'react-css-modules'\nimport { getI18n } from 'client/i18n'\nimport styles from './transfer.less'\nimport { formatMoney, getDefaultCurrencyCode } from 'client/griffin'\nimport CurrencyInputBox from 'components/common/currency_input'\nimport TransferReviewBox from '../transfer_review_box'\nimport { MIN_TRANSFER_AMOUNT } from 'shared/shared_consts'\nimport { trackClick } from 'lib/fpti_analytics'\nimport { getFormError } from 'lib/validators'\nimport { BodyText, Button, HeadingText, Link } from '@paypalcorp/pp-react'\n\nconst i18n = getI18n('components/edit_glimpse/transfer')\n\nclass Transfer extends React.Component {\n static propTypes = {\n campaignId: PropTypes.string.isRequired,\n campaignName: PropTypes.string.isRequired,\n moneyboxAmount: PropTypes.number.isRequired,\n currency: PropTypes.string.isRequired,\n fields: PropTypes.object.isRequired,\n anyInactiveFieldsTouchedWithError: PropTypes.bool,\n onTransferAll: PropTypes.func,\n handleSubmit: PropTypes.func.isRequired,\n shouldAutoFocus: PropTypes.bool,\n onTransfer: PropTypes.func.isRequired,\n countryCode: PropTypes.string.isRequired,\n isCrowdfunding: PropTypes.bool,\n }\n\n state = {\n transferAll: false,\n }\n\n handleTransferAllClick = () => {\n this.props.onTransferAll(this.props.moneyboxAmount)\n this.setState({ transferAll: true })\n }\n\n handleTransfer = fields => {\n trackClick({\n clickName: 'dw_giving_fundraiser_transfer_confirm_pressed',\n data: {\n event_name: 'dw_giving_fundraiser_transfer_confirm_pressed',\n },\n })\n this.props.onTransfer(fields.transferAmount)\n }\n\n render() {\n const {\n fields: { transferAmount },\n anyInactiveFieldsTouchedWithError,\n isCrowdfunding,\n } = this.props\n\n return (\n \n )\n }\n}\n\nexport default cssModules(Transfer, styles)\n","import Transfer from './transfer'\nimport { getCampaignSelector } from 'redux/selectors/campaign'\nimport { reduxForm, change } from 'redux-form'\nimport formUtils from 'lib/form_utils'\nimport { glimpseRoute } from 'lib/route_utils'\nimport { push } from 'react-router-redux'\nimport { required, atMost, combine } from 'lib/validators'\nimport { getI18n } from 'client/i18n'\nimport { withdrawRemotely } from 'redux/modules/campaign'\nimport { CROWD_FUNDING } from 'shared/shared_consts'\n\nconst i18n = getI18n('components/edit_glimpse/transfer')\n\nconst mapStateToProps = (state, props) => {\n const campaign = getCampaignSelector(state, props)\n const isCrowdfunding = campaign.campaign_type === CROWD_FUNDING\n return {\n shouldAutoFocus: props.router.params.action !== 'POP',\n campaignName: campaign.title,\n currency: campaign.currency,\n moneyboxAmount: campaign.moneybox_amount,\n countryCode: state.country.country_code,\n isCrowdfunding: isCrowdfunding,\n validate: combine(\n required('transferAmount', i18n('amount_required')),\n atMost(\n 'transferAmount',\n campaign.moneybox_amount,\n i18n('amount_too_much')\n )\n ),\n }\n}\n\nconst mapDispatchToProps = (dispatch, { campaignId }) => {\n return {\n onTransferAll(amount) {\n dispatch(\n change('transfer', 'transferAmount', amount && amount.toString())\n )\n },\n onSubmit(formValues) {\n dispatch(push({ pathname: glimpseRoute('edit', 'transfer/review') }))\n },\n onTransfer(amount) {\n dispatch(withdrawRemotely(campaignId, amount))\n .then(() => {\n dispatch(\n push({ pathname: glimpseRoute('edit', 'transfer/complete') })\n )\n })\n .catch(() => {\n dispatch(\n push({ pathname: glimpseRoute('edit', 'transfer/complete') })\n )\n })\n },\n }\n}\n\nexport default reduxForm(\n {\n form: 'transfer',\n destroyOnUnmount: false,\n fields: ['transferAmount'],\n },\n mapStateToProps,\n mapDispatchToProps\n)(formUtils(Transfer))\n","import React from 'react'\nimport PropTypes from 'prop-types'\nimport cssModules from 'react-css-modules'\nimport { getI18n } from 'client/i18n'\nimport styles from './transfer_complete.less'\nimport { formatMoney } from 'client/griffin'\nimport StandardError from 'components/common/standard_error'\nimport { toCFPBStringId } from 'client/lib/cfpb'\nimport { trackClick } from 'lib/fpti_analytics'\nimport { isStage, isDev } from 'client/lib/deploy_env'\nimport { BodyText, Button, HeadingText } from '@paypalcorp/pp-react'\n\nconst i18n = getI18n('components/edit_glimpse/transfer')\n\nclass TransferComplete extends React.Component {\n static propTypes = {\n title: PropTypes.string.isRequired,\n amount: PropTypes.number,\n currency: PropTypes.string.isRequired,\n transferError: PropTypes.any,\n onDone: PropTypes.func.isRequired,\n fromVenice: PropTypes.bool.isRequired,\n paypalDomain: PropTypes.string,\n cdnHost: PropTypes.string.isRequired,\n }\n\n shouldComponentUpdate(nextProps, nextState) {\n // since the form this relies on might be destroyed while this transitions, we don't want to re-render if amount is non-existent.\n return nextProps.amount != null\n }\n\n handleFPTI = e => {\n trackClick({\n clickName: 'dw_giving_fundraiser_transfer_success_withdraw_pressed',\n data: {\n event_name: 'dw_giving_fundraiser_transfer_success_withdraw_pressed',\n },\n })\n }\n\n render() {\n const hostName =\n isDev() || isStage() ? location.hostname : this.props.paypalDomain\n if (this.props.transferError) {\n return {i18n('review_title')}
\n \n \n {i18n(toCFPBStringId('complete_title'), {\n amount: formatMoney(this.props.currency, this.props.amount),\n title: this.props.title,\n })}\n \n \n {i18n(toCFPBStringId('complete_sub_title'))}\n \n
\n )\n }\n}\n\nexport default cssModules(TransferComplete, styles)\n","import TransferComplete from './transfer_complete'\nimport { connect } from 'react-redux'\n\nimport { getValues } from 'redux-form'\nimport { getCampaignSelector } from 'redux/selectors/campaign'\nimport { inflateUserTxns } from 'redux/modules/user_txns'\nimport { go } from 'react-router-redux'\n\nconst mapStateToProps = (state, props) => {\n const formValues = getValues(state.form.transfer)\n const campaign = getCampaignSelector(state, props)\n return {\n title: campaign.title,\n currency: campaign.currency,\n amount: formValues && formValues.transferAmount,\n transferError: campaign.err,\n paypalDomain: state.geo.paypalDomain,\n cdnHost: state.geo.cdnHost,\n }\n}\n\nconst mapDispatchToProps = (dispatch, { campaignId }) => {\n return {\n onDone() {\n dispatch(inflateUserTxns(campaignId))\n // 1 - back to transfer review\n // 2 - back to transfer form\n // 3 - back to manage page\n dispatch(go(-3))\n },\n }\n}\n\nexport default connect(\n mapStateToProps,\n mapDispatchToProps\n)(TransferComplete)\n","export function isCampaignOwner(store, campaignId) {\n const state = store.getState()\n return (\n state.campaign &&\n state.campaign[campaignId] &&\n state.campaign[campaignId].is_owner\n )\n}\n","import EditGlimpse from 'components/glimpses/edit_glimpse'\nimport ManageCrowdfunding from 'components/glimpses/edit_glimpse/manage_cf'\nimport Activity from 'components/glimpses/edit_glimpse/activity'\nimport EditMainCrowdfunding from 'components/glimpses/edit_glimpse/edit_main_cf'\nimport EditError from 'components/glimpses/edit_glimpse/edit_error'\nimport Pledge from 'components/glimpses/chip_in_glimpse/pledge'\nimport PledgeSuccess from 'components/glimpses/chip_in_glimpse/pledge/pledge_success'\nimport CrowdfundingShare from 'components/pages/crowdfunding/crowdfunding_share'\nimport DeleteReview from 'components/glimpses/edit_glimpse/delete_review'\nimport Transfer from 'components/glimpses/edit_glimpse/transfer'\nimport TransferComplete from 'components/glimpses/edit_glimpse/transfer_complete'\n\nimport { sendEnsightenEvent } from 'lib/ensighten_analytics'\n\nimport { trackEnter, trackChange, firstInGlimpse } from 'lib/glimpse'\nimport {\n getStepName,\n glimpselessRoute,\n assignActionToRouterParams,\n assertNoDeepLink,\n} from 'lib/route_utils'\nimport { isCampaignOwner } from 'lib/is_owner'\nimport { NEW_CAMPAIGN_ID } from 'redux/modules/campaign'\nimport { getCampaignSelector } from 'redux/selectors/campaign'\nimport { destroy } from 'redux-form'\nimport { fromVeniceSelector } from 'redux/selectors/venice'\nimport { POOLS_CAMPAIGN_TYPES, INVALID_IMAGE } from 'shared/shared_consts'\n\nconst LAST_TRANSFER_STEP = 'complete'\nconst INITIAL_STEP = 'manage'\nconst INITIAL_STEP_IN_PREVIEW = undefined\nconst { CROWD_FUNDING } = POOLS_CAMPAIGN_TYPES\n\nexport default (store, history) => ({\n path: 'edit',\n component: { glimpse: EditGlimpse },\n indexRoute: {\n getComponent(nextState, callback) {\n let campaign = getCampaignSelector(store.getState(), {\n campaignId: nextState.params.campaignId,\n })\n\n if (campaign.campaign_type === CROWD_FUNDING) {\n return callback(null, EditMainCrowdfunding)\n }\n },\n },\n onEnter(nextState, replace) {\n const campaignId = nextState.params.campaignId\n const inPreview = campaignId === NEW_CAMPAIGN_ID\n if (isCampaignOwner(store, campaignId) || inPreview) {\n trackEnter('edit', nextState, replace)\n nextState.params.hideBack = true\n const stepName = getStepName('edit', nextState.routes)\n if (stepName !== 'transfer') {\n // Only support deep linking into edit flow is the user is coming from Venice\n const isVeniceUser = true || fromVeniceSelector()(store.getState())\n if (!isVeniceUser) {\n assertNoDeepLink(\n 'edit',\n inPreview ? INITIAL_STEP_IN_PREVIEW : INITIAL_STEP,\n nextState,\n replace\n )\n }\n }\n } else {\n replace(glimpselessRoute('edit'))\n }\n },\n onChange(prevState, nextState, replace) {\n trackChange('edit', prevState, nextState, replace)\n nextState.params.hideBack = firstInGlimpse('edit')\n },\n childRoutes: [\n {\n path: 'manage',\n getComponent(nextState, callback) {\n let campaign = getCampaignSelector(store.getState(), {\n campaignId: nextState.params.campaignId,\n })\n\n if (campaign.campaign_type === CROWD_FUNDING) {\n return callback(null, ManageCrowdfunding)\n }\n },\n },\n { path: 'manage/activity', component: Activity },\n { path: 'delete/review', component: DeleteReview },\n {\n path: 'error',\n component: EditError,\n },\n {\n path: ':part/error',\n component: EditError,\n onEnter(nextState) {\n let campaign = getCampaignSelector(store.getState(), {\n campaignId: nextState.params.campaignId,\n })\n if (campaign.err && campaign.err.error === INVALID_IMAGE) {\n nextState.params.hideBack = true\n }\n },\n },\n {\n path: 'transfer',\n indexRoute: {\n component: Transfer,\n onEnter(nextState) {\n if (\n nextState.location.action !== 'POP' ||\n !nextState.params.prevStep\n ) {\n sendEnsightenEvent('MoneyPoolWithdrawStart')\n }\n },\n },\n childRoutes: [\n {\n path: 'complete',\n component: TransferComplete,\n onEnter(nextState) {\n sendEnsightenEvent('MoneyPoolWithdrawFin')\n },\n },\n ],\n onChange(prevState, nextState) {\n assignActionToRouterParams(nextState)\n nextState.params.hideBack =\n getStepName('transfer', nextState.routes) === LAST_TRANSFER_STEP\n },\n onLeave() {\n store.dispatch(destroy('transfer'))\n },\n },\n {\n path: 'pledge',\n indexRoute: {\n component: Pledge,\n onEnter(nextState, replace) {\n sendEnsightenEvent('MoneyPoolPledgeStart')\n },\n },\n childRoutes: [\n {\n path: 'complete',\n component: PledgeSuccess,\n onEnter(nextState, replace) {\n nextState.params.hideBack = true\n const { params } = nextState.location.state\n if (!params) {\n location.href = GLOBAL_CONSTS.REQUEST_URI\n }\n },\n },\n ],\n },\n {\n path: 'share',\n component: CrowdfundingShare,\n onEnter(nextState, replace) {\n nextState.params.hideLogo = true\n nextState.params.hideButton = true\n },\n },\n ],\n})\n","import React, { useState } from 'react'\nimport PropTypes from 'prop-types'\nimport cssModules from 'react-css-modules'\nimport { DeleteIcon, Button } from '@paypalcorp/pp-react'\nimport styles from './delete_update_activity.less'\nimport { getI18n } from '../../../../i18n'\nimport StandardDialog from '../../../common/standard_dialog/standard_dialog'\nimport { trackFPTI } from 'lib/fpti_utils'\n\nconst i18n = getI18n('components/edit_glimpse/post_update')\n\nexport const DeleteUpdateActivity = ({\n campaignId,\n id,\n deleteOrganizerActivity,\n onClose,\n campaign,\n}) => {\n const [showDeleteDialog, setDeleteDailog] = useState(false)\n const handledeleteDialogClose = () => {\n trackFPTI(\n campaign,\n 'click',\n 'dw_giving_delete_update_dismiss_pressed',\n 'close'\n )\n setDeleteDailog(false)\n }\n const handleQuit = () => {\n trackFPTI(\n campaign,\n 'click',\n 'dw_giving_delete_update_keep_pressed',\n 'close'\n )\n setDeleteDailog(false)\n }\n const handleDeleteOk = e => {\n e.preventDefault()\n setDeleteDailog(false)\n trackFPTI(campaign, 'click', 'dw_giving_delete_update_confirm_pressed')\n deleteOrganizerActivity(campaignId, id)\n .then(() => {\n trackFPTI(campaign, 'ac', 'dw_giving_delete_update_success_occurred')\n onClose()\n })\n .catch(() => null)\n }\n return (\n \n \n {i18n('withdraw_to_bank')}\n \n
\n \n {\n e.preventDefault()\n trackFPTI(\n campaign,\n 'impression',\n 'dw_giving_delete_update_screen_shown'\n )\n trackFPTI(campaign, 'click', 'dw_giving_edit_update_delete_pressed')\n setDeleteDailog(true)\n }}\n data-nemo=\"delete-btn\"\n onKeyUp={e => {\n if (e.key === 'Enter') {\n trackFPTI(\n campaign,\n 'impression',\n 'dw_giving_delete_update_screen_shown'\n )\n trackFPTI(campaign, 'click', 'dw_giving_edit_update_delete_pressed')\n setDeleteDailog(true)\n }\n }}\n >\n {i18n('delete_cf_title')}\n \n {showDeleteDialog && (\n
\n )\n}\n\nDeleteUpdateActivity.propTypes = {\n campaignId: PropTypes.string.isRequired,\n id: PropTypes.string.isRequired,\n deleteOrganizerActivity: PropTypes.func,\n onClose: PropTypes.func,\n campaign: PropTypes.object,\n}\n\nexport default cssModules(DeleteUpdateActivity, styles)\n","import fetchClient from 'lib/fetch_client'\nimport routes from 'server_routes'\nimport {\n ADD_ORGANIZER_UPDATE,\n DELETE_ORGANIZER_UPDATE,\n EDIT_ORGANIZER_UPDATE,\n SET_ORGANIZER_UPDATE_LIST,\n startRemoteOperation,\n finishRemoteOperation,\n failedCampaignRemoteOperation,\n APPEND_ORGANIZER_UPDATE,\n} from './campaign'\n\n/**\n * @param {searchParams: {page: int, size: int, campaignId: string}}\n * Returns a list of organizerUpdate list with pagesize and pagenumber\n */\n\nexport function getOrganizerUpdate(searchParams) {\n return dispatch => {\n dispatch(startRemoteOperation(searchParams.campaignId))\n return fetchClient()\n .request(routes.organizer_update.api.index(), {\n method: 'GET',\n query: searchParams,\n })\n .then(response => {\n dispatch(\n setOrganizerUpdateList(\n searchParams.page > 1\n ? APPEND_ORGANIZER_UPDATE\n : SET_ORGANIZER_UPDATE_LIST,\n searchParams.campaignId,\n response\n )\n )\n dispatch(finishRemoteOperation(searchParams.campaignId))\n return Promise.resolve(response)\n })\n .catch(err => {\n dispatch(failedCampaignRemoteOperation(searchParams.campaignId, err))\n return Promise.reject(err)\n })\n }\n}\n\n/**\n * @param {campaignId: string, id: string}\n * Returns success after deleting the data\n */\nexport function deleteOrganizerUpdate(campaignId, id) {\n return dispatch => {\n dispatch(startRemoteOperation(campaignId))\n return fetchClient()\n .request(routes.organizer_update.api.index(), {\n method: 'DELETE',\n query: { id, campaignId },\n })\n .then(response => {\n dispatch(removeOrganizerUpdate(campaignId, id))\n dispatch(finishRemoteOperation(campaignId))\n return Promise.resolve()\n })\n .catch(err => {\n dispatch(failedCampaignRemoteOperation(campaignId, err))\n return Promise.reject(err)\n })\n }\n}\n\n/**\n * @param {body: {campaignId: string, subject: string, text: string}}\n * Returns a newly created instance of organizer update\n */\nexport function createOrganizerUpdate(body) {\n return dispatch => {\n dispatch(startRemoteOperation(body.campaignId))\n return fetchClient()\n .request(routes.organizer_update.api.index(), {\n method: 'POST',\n body,\n })\n .then(response => {\n dispatch(addOrganizerUpdate(body.campaignId, response))\n dispatch(finishRemoteOperation(body.campaignId))\n return Promise.resolve(response)\n })\n .catch(err => {\n dispatch(failedCampaignRemoteOperation(body.campaignId, err))\n return Promise.reject(err)\n })\n }\n}\n\n/**\n * @param {\n * campaignId: string,\n * id: string,\n * updatableInstance: [{op: string, path: string, value: string}]\n * }\n * Returns the updated instance of organizer update\n */\n\nexport function editOrganizerUpdate(campaignId, id, updatableInstance) {\n return dispatch => {\n dispatch(startRemoteOperation(campaignId))\n return fetchClient()\n .request(routes.organizer_update.api.index(), {\n method: 'PATCH',\n body: {\n id,\n campaignId,\n updatableInstance,\n },\n })\n .then(response => {\n dispatch(modifyOrganizerUpdate(campaignId, response))\n dispatch(finishRemoteOperation(campaignId))\n return Promise.resolve(response)\n })\n .catch(err => {\n err.updateData = err.message\n dispatch(failedCampaignRemoteOperation(campaignId, err))\n return Promise.reject(err)\n })\n }\n}\n\nexport function setOrganizerUpdateList(type, id, response) {\n return { type, payload: { id, response } }\n}\n\nexport function removeOrganizerUpdate(campaignId, id) {\n return {\n type: DELETE_ORGANIZER_UPDATE,\n payload: { campaignId, id },\n }\n}\n\nexport function modifyOrganizerUpdate(campaignId, response) {\n return {\n type: EDIT_ORGANIZER_UPDATE,\n payload: { campaignId, response },\n }\n}\n\nexport function addOrganizerUpdate(campaignId, response) {\n return {\n type: ADD_ORGANIZER_UPDATE,\n payload: { campaignId, response },\n }\n}\n","import { connect } from 'react-redux'\nimport DeleteUpdateActivity from './delete_update_activity'\nimport { deleteOrganizerUpdate } from '../../../../redux/modules/organizer_update'\n\nconst mapDispatchToProps = dispatch => {\n return {\n deleteOrganizerActivity(campaignId, id) {\n return dispatch(deleteOrganizerUpdate(campaignId, id))\n },\n }\n}\n\nexport default connect(\n null,\n mapDispatchToProps\n)(DeleteUpdateActivity)\n","import React from 'react'\nimport PropTypes from 'prop-types'\nimport cssModules from 'react-css-modules'\nimport { getI18n } from 'client/i18n'\nimport StandardDialog from 'components/common/standard_dialog'\nimport {\n DESCRIPTION_ROWS,\n CROWDFUNDING_DESCRIPTION_LENGTH,\n} from 'shared/lengths'\nimport styles from './post_update_cf.less'\nimport { domOnlyProps } from 'lib/form_utils'\nimport {\n TextInput,\n HeadingText,\n Button,\n TextArea,\n BodyText,\n CaptionText,\n} from '@paypalcorp/pp-react'\nimport { getFormError } from 'lib/validators'\nimport { TOAST_NOTIFICATIONS } from 'shared/shared_consts'\nimport { Message } from '@paypalcorp/worldready-react'\nimport DeleteUpdateActivity from '../delete_organizer_update/delete_update_activity_container'\nimport { appendPath } from 'lib/route_utils'\nimport { trackFPTI } from 'lib/fpti_utils'\nimport { get } from 'lodash'\n\nconst i18n = getI18n('components/edit_glimpse/post_update')\n\nclass PostUpdate extends React.Component {\n static propTypes = {\n fields: PropTypes.object.isRequired,\n showDelete: PropTypes.bool,\n location: PropTypes.oneOfType([PropTypes.object, PropTypes.string]),\n onSave: PropTypes.func,\n handleSubmit: PropTypes.func,\n router: PropTypes.object,\n campaign: PropTypes.object,\n stepRef: PropTypes.func,\n dirty: PropTypes.bool,\n onToggleToast: PropTypes.func,\n organizer_update_id: PropTypes.string,\n resetError: PropTypes.func,\n campaignId: PropTypes.string,\n campaignError: PropTypes.object,\n errors: PropTypes.object,\n }\n\n state = {\n isOpen: false,\n editedCampagin: this.props.campaign,\n showBackDialog: false,\n callback: null,\n showDeleteDialog: false,\n }\n\n handleSubmit = () => {\n trackFPTI(\n this.props.campaign,\n 'click',\n 'dw_giving_post_update_quit_finish_update_pressed'\n )\n this.setState({ showBackDialog: false, callback: null })\n const request = {\n subject: this.props.fields.subject.value,\n text: this.props.fields.text.value,\n }\n return this.props\n .onSave(request, this.props.organizer_update_id)\n .then(response => {\n if (this.props.organizer_update_id) {\n this.editBack()\n } else {\n this.goToSharePage(response)\n }\n trackFPTI(\n this.props.campaign,\n 'ac',\n 'dw_giving_update_post_success_occurred'\n )\n this.props.onToggleToast(TOAST_NOTIFICATIONS.EDIT_SUCCESS)\n })\n .catch(err => {\n this.props.router.push({\n pathname: appendPath(location.pathname, 'error'),\n state: { error: err },\n })\n })\n }\n\n componentDidMount() {\n if (this.props.stepRef) {\n this.props.stepRef(this)\n }\n if (this.props.organizer_update_id) {\n trackFPTI(\n this.props.campaign,\n 'impression',\n 'dw_giving_edit_update_screen_shown'\n )\n } else {\n trackFPTI(\n this.props.campaign,\n 'impression',\n 'dw_giving_create_update_screen_shown'\n )\n }\n }\n\n goToSharePage = updateData => {\n const pathname = appendPath(location.pathname, `${updateData.fou_id}/share`)\n this.props.router.push({\n pathname,\n state: { updateData },\n })\n }\n\n editBack = params => {\n const { params: { hideBack = false } = {} } = this.props.router\n if (hideBack || params?.hideBack) {\n this.props.router.push({\n pathname: '/pools',\n state: { campaignId: this.props.campaignId },\n })\n } else {\n this.props.router.goBack()\n }\n }\n\n handleDialogClose = () => {\n this.setState({ showBackDialog: false })\n trackFPTI(\n this.props.campaign,\n 'click',\n 'dw_giving_post_update_quit_dismiss_pressed',\n 'close'\n )\n }\n\n confirmNavigation = callback => {\n if (this.props.dirty) {\n this.setState({ showBackDialog: true, callback })\n trackFPTI(\n this.props.campaign,\n 'impression',\n 'dw_giving_post_update_quit_screen_shown'\n )\n } else {\n if (this.props.organizer_update_id) {\n trackFPTI(\n this.props.campaign,\n 'click',\n 'dw_giving_edit_update_dismiss_pressed',\n 'close'\n )\n } else {\n trackFPTI(\n this.props.campaign,\n 'click',\n 'dw_giving_create_update_dismiss_pressed',\n 'close'\n )\n }\n this.editBack()\n }\n }\n\n handleQuit = () => {\n trackFPTI(\n this.props.campaign,\n 'click',\n 'dw_giving_post_update_quit_cancel_pressed',\n 'close'\n )\n this.editBack()\n }\n render() {\n const {\n fields: { subject, text },\n handleSubmit,\n showDelete,\n organizer_update_id,\n campaign,\n } = this.props\n const description = get(this.props, 'values.text', '')\n if (description.length > CROWDFUNDING_DESCRIPTION_LENGTH) {\n const error = {\n error_desc: 'exceed_max_1000_characters',\n error_code: 'MATCH',\n }\n trackFPTI(\n campaign,\n 'ac',\n 'dw_giving_post_update_form_error_occurred',\n '',\n error\n )\n }\n\n return (\n \n )\n }\n}\n\nexport default cssModules(PostUpdate, styles)\n","export function organizerUpdate(organizerUpdateId, organizerUpdateData) {\n const filterorganizerUpdate = organizerUpdateData.filter(\n element => element.fou_id === organizerUpdateId\n )\n return filterorganizerUpdate.length > 0 ? filterorganizerUpdate[0] : {}\n}\nexport function formUpdatePayload(object) {\n return Object.keys(object).map(key => ({\n op: 'replace',\n path: `/${key}`,\n value: object[key],\n }))\n}\n","import PostUpdate from './post_update_cf'\nimport { reduxForm } from 'redux-form'\nimport formUtils from 'lib/form_utils'\nimport { getCampaignSelector } from 'redux/selectors/campaign'\nimport { show } from 'redux/modules/toast_notification'\nimport { getI18n } from 'client/i18n'\nimport { combine, required, length } from 'lib/validators'\nimport { TITLE_LENGTH, CROWDFUNDING_DESCRIPTION_LENGTH } from 'shared/lengths'\nimport {\n getOrganizerUpdate,\n editOrganizerUpdate,\n createOrganizerUpdate,\n} from 'redux/modules/organizer_update'\nimport { organizerUpdate, formUpdatePayload } from 'lib/organizerupdate'\nimport _ from 'lodash'\n\nconst i18n = getI18n('components/edit_glimpse/post_update')\n\nconst mapStateToProps = (state, props) => {\n const campaign = getCampaignSelector(state, props)\n const organizerUpdateItems = _.get(campaign, 'organizerUpdate.items') || []\n const organizer_update_id = _.get(props, 'routeParams.fouId') || ''\n const postupdate = organizerUpdate(organizer_update_id, organizerUpdateItems)\n\n const subject = _.get(postupdate, 'subject') || ''\n const text = _.get(postupdate, 'text') || ''\n let validators = [\n required('text', i18n('text_required')),\n length(\n 'text',\n CROWDFUNDING_DESCRIPTION_LENGTH,\n i18n('text_too_long', { maxLength: CROWDFUNDING_DESCRIPTION_LENGTH })\n ),\n length(\n 'subject',\n TITLE_LENGTH,\n i18n('subject_too_long', { maxLength: TITLE_LENGTH })\n ),\n required('subject', i18n('subject_required')),\n ]\n return {\n validate: combine(...validators),\n initialValues: {\n subject: subject,\n text: text,\n },\n showDelete: organizer_update_id,\n organizer_update_id: organizer_update_id,\n campaignId: props.campaignId,\n campaignError: campaign.err,\n campaign: campaign,\n }\n}\n\nconst mapDispatchToProps = (dispatch, { campaignId }) => {\n return {\n onSave(formValues, organizer_update_id) {\n if (organizer_update_id) {\n const formattedPayload = formUpdatePayload(formValues)\n return dispatch(\n editOrganizerUpdate(campaignId, organizer_update_id, formattedPayload)\n )\n } else {\n return dispatch(\n createOrganizerUpdate({\n campaignId,\n subject: formValues.subject,\n text: formValues.text,\n })\n )\n }\n },\n onToggleToast(toastId) {\n dispatch(show(toastId))\n },\n fetchOrganizerUpdateList(page = 1, size = 1) {\n return dispatch(\n getOrganizerUpdate(campaignId, { page, size, campaignId })\n )\n },\n }\n}\n\nexport default reduxForm(\n {\n form: 'postupdate',\n fields: ['subject', 'text'],\n },\n mapStateToProps,\n mapDispatchToProps\n)(formUtils(PostUpdate))\n","import React from 'react'\nimport PropTypes from 'prop-types'\nimport cssModules from 'react-css-modules'\nimport styles from './share_update_activity.less'\nimport { getI18n } from 'client/i18n'\nimport Clipboard from 'clipboard'\nimport FirstChild from 'components/common/first_child'\nimport ReactCSSTransitionGroup from 'react-transition-group/CSSTransitionGroup'\nimport { CaptionText, Link, LinkIcon, Row, Col } from '@paypalcorp/pp-react'\n\nimport {\n EmailSharing,\n TwitterSharing,\n FacebookSharing,\n WhatsAppSharing,\n SmsSharing,\n} from 'components/common/share_buttons'\n\nconst TOOLTIP_SHOW_DELAY = 750\nconst TOOLTIP_ANIMATION_DURATION = 250\n\nconst i18n = getI18n('components/share_campaign_textarea')\n\nclass ShareUpdateActivity extends React.Component {\n static propTypes = {\n shareUrl: PropTypes.string.isRequired,\n displayUrl: PropTypes.string.isRequired,\n shareable: PropTypes.bool.isRequired,\n appId: PropTypes.number.isRequired,\n\n onClickOverride: PropTypes.func,\n\n showFacebook: PropTypes.bool,\n showMessenger: PropTypes.bool,\n showTwitter: PropTypes.bool,\n showWhatsApp: PropTypes.bool,\n showEmail: PropTypes.bool,\n showSms: PropTypes.bool,\n showSubtext: PropTypes.bool,\n description: PropTypes.string,\n styles: PropTypes.object,\n isMobile: PropTypes.bool,\n campaignId: PropTypes.string,\n }\n\n static defaultProps = {\n shareable: true,\n showFacebook: true,\n showMessenger: true,\n showTwitter: true,\n showWhatsApp: true,\n showEmail: true,\n showSms: true,\n showSubtext: false,\n isMobile: false,\n }\n\n state = {\n copyText: this.props.displayUrl,\n showTooltip: false,\n errorMsg: false,\n }\n\n componentDidMount() {\n if (this.props.shareable) {\n this.clipboard = new Clipboard(this.copyLink, {\n text: () => this.state.copyText,\n })\n this.clipboard.on('success', this.handleCopySuccess)\n }\n }\n\n componentWillUnmount() {\n if (this.clipboard) {\n this.clipboard.destroy()\n }\n }\n\n copyValidation = () => {\n if (this.state.copyText === '') {\n this.setState({ errorMsg: true })\n } else {\n this.setState({ errorMsg: false })\n }\n }\n\n handleChange = event => {\n this.setState({ copyText: event.target.value, errorMsg: false })\n }\n\n handleCopySuccess = e => {\n this.setState({ showTooltip: true })\n setTimeout(() => {\n this.setState({ showTooltip: false })\n }, TOOLTIP_SHOW_DELAY)\n }\n\n render() {\n const transitionNames = {\n enter: this.props.styles['tooltip-enter'],\n enterActive: this.props.styles['tooltip-enter-active'],\n leave: this.props.styles['tooltip-leave'],\n leaveActive: this.props.styles['tooltip-leave-active'],\n }\n\n return (\n \n {this.state.errorMsg && (\n \n {i18n('error')}\n \n )}\n \n {i18n('email')} \n \n {i18n('sms')} \n \n \n {i18n('facebook')}\n \n \n {i18n('twitter')} \n \n \n {i18n('whatsapp')}\n \n \n \n {i18n('copylink')}\n \n \n
\n
\n )\n }\n}\n\nexport default cssModules(ShareUpdateActivity, styles, {\n allowMultiple: true,\n})\n","import { getI18nBase } from 'client/i18n'\nimport {\n campaignUrlForDisplay,\n campaignUrlWithMeDomain,\n} from 'lib/campaign_url'\nimport { canShareSelector } from 'redux/selectors/share'\nimport { getCampaignSelector } from 'redux/selectors/campaign'\n\nconst i18nBase = getI18nBase('components/pages/crowdfunding/update_share')\n\nexport function getUpdateActivityShareDetails(state, ownProps) {\n const canShare = canShareSelector(state)\n const campaign = getCampaignSelector(state, ownProps)\n const shareUrl = campaignUrlWithMeDomain(campaign.id, campaign.campaign_type)\n const campaignTitle = campaign.title\n\n const emailSubject = i18nBase('email_subject', {\n campaignTitle,\n organizerName: campaign.owner.full_name,\n })\n\n const body = i18nBase('body', {\n campaignTitle,\n shareUrl,\n })\n\n let props = {\n shareable: true,\n displayUrl: campaignUrlForDisplay(campaign.id, campaign.campaign_type),\n appId: state.social.app_id,\n emailBody: body,\n emailSubject,\n isMobile: state.device_info.isMobile,\n shareMsgFB: body,\n shareMsgTwitter: `${body}\\n#PeopleHelpingPeople`,\n shareMsgWhatsapp: body,\n }\n\n if (!canShare) {\n props.showFacebook = false\n props.showMessenger = false\n props.showTwitter = false\n props.showWhatsApp = false\n props.showEmail = false\n props.showSms = false\n }\n\n return props\n}\n","import ShareUpdateActivity from './share_update_activity'\nimport { connect } from 'react-redux'\nimport { getUpdateActivityShareDetails } from 'lib/share_update'\n\nconst mapStateToProps = (state, ownProps) => {\n return getUpdateActivityShareDetails(state, ownProps)\n}\n\nexport default connect(\n mapStateToProps,\n {}\n)(ShareUpdateActivity)\n","import React from 'react'\nimport PropTypes from 'prop-types'\nimport cssModules from 'react-css-modules'\nimport styles from './postupdate_share.less'\nimport CrossFadeTransition from 'components/common/transitions/cross_fade'\nimport ShareUpdateActivity from 'components/common/share_update_activity'\nimport { BodyText, HeadingText } from '@paypalcorp/pp-react'\nimport { Message } from '@paypalcorp/worldready-react'\nimport { trackFPTI } from 'lib/fpti_utils'\n\nclass PostUpdateShare extends React.Component {\n static propTypes = {\n campaignId: PropTypes.string,\n cdnHost: PropTypes.string,\n campaign: PropTypes.object,\n }\n\n render() {\n const { campaign } = this.props\n trackFPTI(campaign, 'impression', 'dw_giving_share_update_screen_shown')\n let Component\n Component = (\n \n {\n this.copyLink = copyLink\n }}\n onClick={this.copyValidation}\n title=\"copy\"\n data-testid=\"copy-text\"\n >\n \n {this.state.showTooltip && (\n
\n {i18n('copy')}
\n )}\n \n {i18n('copied')}\n
\n )}\n \n \n \n \n \n \n
\n )\n\n return \n
\n \n
\n \n : null}\n title={\n isLimitReachedError\n ? i18n('error_max_update_title')\n : i18n('error_title')\n }\n subtitle={\n isLimitReachedError ? (\n i18n('error_max_update_subtitle')\n ) : (\n <>\n \n {isLimitReachedError\n ? i18n('error_max_update_done_button')\n : i18n('back')}\n \n }\n />\n
\n )\n }\n}\n\nexport default withRouter(cssModules(PostUpdateError, styles))\n","import PostUpdateError from './post_update_error'\nimport { connect } from 'react-redux'\nimport { withRouter } from 'react-router'\nimport { getCampaignSelector } from 'redux/selectors/campaign'\n\nconst mapStateToProps = (state, props) => {\n const campaign = getCampaignSelector(state, props)\n return {\n error: campaign.err,\n campaign,\n }\n}\n\nexport default withRouter(connect(mapStateToProps)(PostUpdateError))\n","import React from 'react'\nimport {\n HeadingText,\n Button,\n Link,\n IconButton,\n AddIcon,\n} from '@paypalcorp/pp-react'\nimport { Link as RouterLink } from 'react-router'\nimport PropTypes from 'prop-types'\nimport cssModules from 'react-css-modules'\nimport styles from './view_updates.less'\nimport UpdateRow from 'components/contributions_list/rows/update_row'\nimport { glimpseRoute } from 'lib/route_utils'\nimport _ from 'lodash'\nimport { Message } from '@paypalcorp/worldready-react'\nimport { trackFPTI } from 'lib/fpti_utils'\n\nclass ViewUpdatesActivity extends React.Component {\n static propTypes = {\n campaignId: PropTypes.string,\n activitiesCount: PropTypes.string,\n organizerUpdate: PropTypes.object,\n fetchOrganizerUpdateList: PropTypes.func,\n router: PropTypes.object,\n isDonerView: PropTypes.bool,\n campaign: PropTypes.object,\n }\n state = {\n page: 1,\n }\n onShowMore = (prop, eventType, event) => {\n this.props\n .fetchOrganizerUpdateList(this.state.page, 5)\n .then(data => {\n this.setState({ page: this.state.page + 1 })\n const list_count = _.get(data, 'total') || 0\n trackFPTI(prop, eventType, event, '', '', list_count)\n })\n .catch(err => {\n const { pathname } = this.props.router.location\n const nextPathname = `${pathname}/error`\n this.props.router.push({\n pathname: `${nextPathname}`,\n state: { updateData: err.updateData },\n })\n })\n }\n componentDidMount() {\n const eventName = this.props.isDonerView\n ? 'dw_giving_donor_update_list_screen_shown'\n : 'dw_giving_organizer_update_list_screen_shown'\n this.onShowMore(this.props.campaign, 'impression', eventName)\n }\n confirmNavigation = callback => {\n this.trackFPTI(\n this.props.campaign,\n 'click',\n 'dw_giving_create_update_dismiss_pressed',\n 'close'\n )\n }\n\n trackPostUpdateEvent = total => {\n trackFPTI(\n this.props.campaign,\n 'click',\n 'dw_giving_organizer_update_list_post_pressed',\n total\n )\n }\n render() {\n const { campaignId, organizerUpdate, isDonerView, campaign } = this.props\n const postUpdateUrl = `c/${campaignId}/postupdate`\n const donerViewUrl = `c/${campaignId}/viewupdates`\n const total = _.get(organizerUpdate, 'total', 0)\n let updateState = 'multiple'\n if (total === 0) {\n updateState = 'zero'\n } else if (total === 1) {\n updateState = 'one'\n }\n return (\n <>\n \n \n \n {total > 0 &&\n !isDonerView && (\n <>\n this.trackPostUpdateEvent(total)}\n >\n
\n \n this.trackPostUpdateEvent(total)}\n />\n
\n \n )}\n \n {\n const isDonerEventName = isDonerView\n ? 'dw_giving_donor_update_list_show_previous_pressed'\n : 'dw_giving_organizer_update_list_show_previous_pressed'\n this.onShowMore(campaign, 'click', isDonerEventName)\n }}\n data-testid=\"show-more-button\"\n >\n
\n )}\n \n )\n }\n}\n\nexport default cssModules(ViewUpdatesActivity, styles)\n","import ViewUpdatesActivity from './view_updates_activity'\nimport { connect } from 'react-redux'\nimport { getCampaignSelector } from 'redux/selectors/campaign'\nimport { getOrganizerUpdate } from 'redux/modules/organizer_update'\n\nconst mapStateToProps = (state, props) => {\n const campaign = getCampaignSelector(state, props)\n return {\n organizerUpdate: campaign.organizerUpdate,\n campaign,\n }\n}\n\nconst mapDispatchToProps = (dispatch, { campaignId }) => {\n return {\n fetchOrganizerUpdateList(page = 1, size = 1) {\n return dispatch(getOrganizerUpdate({ page, size, campaignId }))\n },\n }\n}\n\nexport default connect(\n mapStateToProps,\n mapDispatchToProps\n)(ViewUpdatesActivity)\n","import OrganizerUpdateDetail from './organizer_update_detail'\nimport { connect } from 'react-redux'\nimport { getCampaignSelector } from 'redux/selectors/campaign'\nimport { get } from 'lodash'\nimport { organizerUpdate } from 'lib/organizerupdate'\nimport { organizerUpdateState } from 'lib/fpti_utils'\n\nconst mapStateToProps = (state, props) => {\n const campaign = getCampaignSelector(state, props)\n const organizerUpdateItems = get(campaign, 'organizerUpdate.items') || []\n const organizer_update_id = get(props, 'routeParams.fouId', '')\n const selectedOrganizerUpdate = organizerUpdate(\n organizer_update_id,\n organizerUpdateItems\n )\n const getOrganizerUpdate = get(campaign, 'organizerUpdate') || {}\n const updateState = organizerUpdateState(getOrganizerUpdate)\n return {\n organizerUpdateRow: selectedOrganizerUpdate,\n postUpdateUrl: `c/${campaign.id}/postupdate`,\n enableEditButton: get(props, 'params.enableEditButton', false),\n campaign,\n eventName: 'dw_giving_update_detail_screen_shown',\n updateState,\n }\n}\n\nexport default connect(mapStateToProps)(OrganizerUpdateDetail)\n","import EditGlimpse from 'components/glimpses/edit_glimpse'\nimport PostUpdate from 'components/glimpses/edit_glimpse/post_update_cf'\nimport PostUpdateShare from 'components/pages/crowdfunding/postupdate_share'\nimport PostUpdateError from 'components/glimpses/edit_glimpse/post_update_error'\nimport ViewUpdatesActivity from 'components/glimpses/edit_glimpse/viewupdates'\nimport { trackEnter, trackChange, firstInGlimpse } from 'lib/glimpse'\nimport {\n getStepName,\n glimpselessRoute,\n assertNoDeepLink,\n} from 'lib/route_utils'\nimport { isCampaignOwner } from 'lib/is_owner'\nimport { NEW_CAMPAIGN_ID } from 'redux/modules/campaign'\nimport { getCampaignSelector } from 'redux/selectors/campaign'\nimport { fromVeniceSelector } from 'redux/selectors/venice'\nimport { POOLS_CAMPAIGN_TYPES } from 'shared/shared_consts'\nimport OrganizerUpdateDetail from 'components/glimpses/edit_glimpse/organizer_update_detail'\n\nconst INITIAL_STEP = 'manage'\nconst INITIAL_STEP_IN_PREVIEW = undefined\nconst { CROWD_FUNDING } = POOLS_CAMPAIGN_TYPES\n\nexport default (store, history) => ({\n path: 'postupdate',\n component: { glimpse: EditGlimpse },\n indexRoute: {\n getComponent(nextState, callback) {\n const campaign = getCampaignSelector(store.getState(), {\n campaignId: nextState.params.campaignId,\n })\n\n if (campaign.campaign_type === CROWD_FUNDING) {\n return callback(null, PostUpdate)\n }\n },\n },\n onEnter(nextState, replace) {\n const campaignId = nextState.params.campaignId\n const inPreview = campaignId === NEW_CAMPAIGN_ID\n if (!store.getState()?.flags?.isOrganizerUpdatesEnabled) {\n replace('/pools')\n return\n }\n if (isCampaignOwner(store, campaignId) || inPreview) {\n trackEnter('postupdate', nextState, replace)\n nextState.params.hideBack = true\n const stepName = getStepName('postupdate', nextState.routes)\n if (stepName !== 'transfer') {\n // Only support deep linking into edit flow is the user is coming from Venice\n const isVeniceUser = true || fromVeniceSelector()(store.getState())\n if (!isVeniceUser) {\n assertNoDeepLink(\n 'postupdate',\n inPreview ? INITIAL_STEP_IN_PREVIEW : INITIAL_STEP,\n nextState,\n replace\n )\n }\n }\n } else {\n replace(glimpselessRoute('postupdate'))\n }\n },\n onChange(prevState, nextState, replace) {\n trackChange('postupdate', prevState, nextState, replace)\n nextState.params.hideBack = firstInGlimpse('postupdate')\n },\n childRoutes: [\n {\n path: 'viewupdates',\n component: ViewUpdatesActivity,\n onEnter(nextState, replace) {\n nextState.params.isOwnerView = true\n },\n },\n {\n path: ':fouId/updatedetails',\n component: OrganizerUpdateDetail,\n onEnter(nextState, replace) {\n nextState.params.enableEditButton = true\n nextState.params.hideLogo = true\n nextState.params.hideButton = true\n },\n },\n {\n path: 'error',\n component: PostUpdateError,\n },\n {\n path: ':fouId',\n component: PostUpdate,\n onEnter(nextState, replace) {\n nextState.params.hideLogo = true\n nextState.params.hideButton = true\n },\n },\n {\n path: ':fouId/share',\n component: PostUpdateShare,\n onEnter(nextState, replace) {\n nextState.params.hideLogo = true\n nextState.params.hideButton = true\n },\n },\n ],\n})\n","import React from 'react'\nimport PropTypes from 'prop-types'\nimport ModalWizard from 'components/modal_wizard'\nimport { withRouter } from 'react-router'\nimport { routerShape } from 'react-router/lib/PropTypes'\n\nimport { exitGlimpse, isForward } from 'lib/glimpse'\n\nclass SendGlimpse extends React.Component {\n static propTypes = {\n onClose: PropTypes.func,\n onUnmount: PropTypes.func,\n showSpinner: PropTypes.bool,\n children: PropTypes.any,\n routes: PropTypes.array.isRequired,\n location: PropTypes.oneOfType([PropTypes.object, PropTypes.string]),\n router: routerShape.isRequired,\n campaignId: PropTypes.string,\n isOwner: PropTypes.bool,\n inSuccess: PropTypes.bool,\n isReturningFromWallet: PropTypes.bool,\n }\n\n handleClose = () => {\n const { router, isReturningFromWallet, campaignId } = this.props\n const currentPoolPath = `/pools/c/${campaignId}`\n if (isReturningFromWallet) {\n router.push({ pathname: currentPoolPath })\n } else {\n exitGlimpse('send', this.props.router, currentPoolPath)\n }\n }\n\n componentWillUnmount() {\n if (this.props.onUnmount) {\n this.props.onUnmount()\n }\n }\n\n render() {\n const child = React.Children.only(this.props.children)\n const stepName = this.props.routes[this.props.routes.length - 1].path\n\n return (\n \n \n {this.props.text && (\n
\n )\n }\n return \n }\n}\n\nexport default cssModules(Separator, styles, { allowMultiple: true })\n","import React from 'react'\nimport PropTypes from 'prop-types'\nimport cssModules from 'react-css-modules'\nimport styles from './checkbox.less'\nimport clsx from 'clsx'\n\nclass Checkbox extends React.Component {\n static propTypes = {\n name: PropTypes.string,\n label: PropTypes.string,\n onChange: PropTypes.func,\n value: PropTypes.bool,\n description: PropTypes.string,\n disabled: PropTypes.bool,\n smallText: PropTypes.bool,\n dataNemo: PropTypes.string,\n 'data-pa-click': PropTypes.string,\n }\n\n render() {\n return (\n {this.props.text}
\n )}\n \n \n
\n {this.props.description && (\n {this.props.description}
\n )}\n \n )\n }\n}\n\nexport default cssModules(Checkbox, styles, { allowMultiple: true })\n","const NON_ASCII_TO_ASCII_AMOUNT_CHAR_MAP = {\n '０': '0',\n '１': '1',\n '２': '2',\n '３': '3',\n '４': '4',\n '５': '5',\n '６': '6',\n '７': '7',\n '８': '8',\n '９': '9',\n '．': '.',\n '。': '.',\n '｡': '.',\n '，': ',',\n '、': ',',\n '､': ',',\n}\n\n/*\n * Convert any non-ASCII input in amount input string to the\n * ASCII counterpart (e.g. for Japananese fullwidth characters)\n *\n * @param {string} input\n * @returns {string} input with any non-ASCII digits/decimals\n * converted to their ASCII counterparts\n */\nexport function normalizeAmountInput(input) {\n if (typeof input !== 'string') {\n return input\n }\n\n return input.replace(\n new RegExp(\n `[${Object.keys(NON_ASCII_TO_ASCII_AMOUNT_CHAR_MAP).join('')}]`,\n 'g'\n ),\n char => NON_ASCII_TO_ASCII_AMOUNT_CHAR_MAP[char]\n )\n}\n","import React from 'react'\nimport PropTypes from 'prop-types'\nimport { TextInput } from '@paypalcorp/pp-react'\nimport { formatMoney, validateFormat } from 'client/griffin'\nimport { normalizeAmountInput } from 'client/lib/amount'\n\nconst MAX_SIZE = 8\n\nfunction dupeZeroes(numZeroes) {\n return numZeroes >= 0 ? '0'.repeat(numZeroes) : ''\n}\n\nclass CurrencyTextBoxRegular extends React.Component {\n static propTypes = {\n currencyCode: PropTypes.string,\n onChange: PropTypes.func,\n onBlur: PropTypes.func,\n decimalDigits: PropTypes.number,\n decimalDot: PropTypes.string,\n value: PropTypes.number,\n autoResize: PropTypes.bool,\n showCurrency: PropTypes.bool, // TODO: rename this to showCurrencySymbol.\n removeTrailingZeros: PropTypes.bool,\n focusOnMount: PropTypes.number,\n decimalDotInRegex: PropTypes.string,\n showIntlCurrencyCode: PropTypes.bool,\n minAmount: PropTypes.number,\n }\n\n static defaultProps = {\n value: 0,\n autoResize: false,\n removeTrailingZeros: false,\n showCurrency: true,\n showIntlCurrencyCode: true,\n }\n\n constructor(props) {\n super(props)\n const majorDigits = MAX_SIZE - props.decimalDigits // no. of digits to left of dot (integer part)\n const minorDigits = props.decimalDigits // no. of digits to right of dot (fractional part)\n let minorPart = ''\n const decimalDotInRegex = '[\\\\.,]'\n if (minorDigits > 0) {\n minorPart = `(${decimalDotInRegex}\\\\d{0,${minorDigits}})?`\n }\n this.state = {\n decimalDot: props.decimalDot,\n allowedInputRegex: new RegExp(\n `^(([1-9]\\\\d{0,${majorDigits - 1}})|0)?${minorPart}$`\n ),\n zeroFractionalString: props.decimalDot + dupeZeroes(minorDigits),\n value: props.value || '', // Note: this deliberately includes the case where value === ''.\n unformattedValue: '',\n minAmount: Number.isInteger(props.minAmount) ? props.minAmount : 1,\n }\n }\n\n UNSAFE_componentWillReceiveProps = ({ value }) => {\n const inputElement = this.getInputElement()\n if (value !== this.props.value && document.activeElement !== inputElement) {\n this.setState({ value }, () => {\n this.formatValueWithGriffin()\n })\n }\n }\n\n getInputElement = () => {\n let inputElement = this.inputElement\n if (this.props.autoResize && inputElement.getInput) {\n inputElement = inputElement.getInput()\n }\n return inputElement\n }\n\n getAmountVal = () => {\n let value = normalizeAmountInput(this.getInputElement().value)\n if (value === this.state.decimalDot) {\n value = `0${this.state.decimalDot}`\n }\n return value\n }\n\n isInputEmpty = () => {\n const amountVal = this.getAmountVal()\n return amountVal == null || amountVal === ''\n }\n\n isInputValid = value => {\n return (\n this.isInputEmpty() ||\n (this.state.allowedInputRegex.test(this.getAmountVal()) &&\n parseFloat(this.getAmountVal()) >= this.state.minAmount &&\n validateFormat(value))\n )\n }\n\n handleChange = event => {\n const value = normalizeAmountInput(event.target.value)\n if (!this.isInputValid(value)) {\n // this.showInvalid() - shake it, baby\n return\n }\n this.setState({ value })\n if (value === '') {\n this.props.onChange(undefined)\n } else {\n this.props.onChange(parseFloat(value.replace(this.state.decimalDot, '.')))\n }\n }\n\n handleFocus = () => {\n if (!this.getInputElement()) {\n return\n }\n this.restoreUnformattedValue()\n }\n\n formatValueWithGriffin = () => {\n this.setState(prevState => {\n let newValue = ''\n if (prevState.value) {\n const prevValue = prevState.value.toString()\n newValue = formatMoney(\n this.props.currencyCode,\n prevValue.replace(this.props.decimalDot, '.'),\n {\n showCurrencySymbol: this.props.showCurrency,\n hideCurrencyCode: !this.props.showIntlCurrencyCode,\n }\n )\n }\n return {\n value: newValue,\n unformattedValue: prevState.value,\n }\n })\n }\n\n restoreUnformattedValue = () => {\n this.setState(prevState => {\n if (prevState.unformattedValue) {\n return {\n value: prevState.unformattedValue,\n }\n }\n return undefined\n })\n }\n\n handleBlur = () => {\n this.formatValueWithGriffin(this.props.onBlur())\n }\n\n componentDidMount() {\n if (this.props.focusOnMount != null) {\n const inputElement = this.getInputElement()\n setTimeout(() => {\n this.formatValueWithGriffin()\n inputElement.focus()\n }, this.props.focusOnMount)\n }\n }\n\n render() {\n const { ...inputProps } = this.props\n delete inputProps.currencyCode\n delete inputProps.decimalDigits\n delete inputProps.decimalDot\n delete inputProps.autoResize\n delete inputProps.showCurrency\n delete inputProps.removeTrailingZeros\n delete inputProps.focusOnMount\n delete inputProps.showIntlCurrencyCode\n\n inputProps.onChange = this.handleChange\n inputProps.onKeyDown = this.handleChange\n inputProps.onFocus = this.handleFocus\n inputProps.onBlur = this.handleBlur\n inputProps.ref = inputElement => {\n this.inputElement = inputElement\n }\n inputProps.value = this.state.value\n if (!inputProps.touched) {\n delete inputProps.error\n }\n if (this.props.autoResize) {\n inputProps.inputClassName = inputProps.className\n delete inputProps.className\n return\n
\n )\n }\n}\n\nexport default cssModules(Money, styles)\n","import React from 'react'\nimport PropTypes from 'prop-types'\nimport cssModules from 'react-css-modules'\nimport clsx from 'clsx'\nimport styles from './input_error.less'\n\nconst errorsShape = PropTypes.oneOfType([PropTypes.array, PropTypes.string])\n\nclass InputError extends React.Component {\n /*\n\t\tshowAsError determines whether we're displaying the error with a red border\n\t\tand a red background.\n\t\twhen it's true, the errors displayed are the ones in the 'errors' prop (if blank, nothing is rendered).\n\t\twhen it's false, the errors displayed are the ones in the 'nonErrors' props (if blank, nothing is rendered).\n\t*/\n static propTypes = {\n showAsError: PropTypes.bool,\n errors: errorsShape,\n nonErrors: errorsShape,\n align: PropTypes.oneOf(['left', 'center']),\n }\n\n static defaultProps = {\n errors: null,\n align: 'left',\n showAsError: true,\n }\n\n render() {\n let errors\n if (!this.props.showAsError) {\n errors = this.props.nonErrors\n } else {\n errors = this.props.errors\n }\n\n if (!errors) {\n return null\n }\n\n if (!Array.isArray(errors)) {\n errors = [errors]\n }\n\n return (\n \n \n {currencySymbol}\n \n {this.props.editable ? (\n
\n {this.props.showIntlCurrencyCode &&\n shouldUseIntlFormat(this.props.currency) && (\n {this.props.currency}
\n )}\n - \n {errors.map((e, i) => (\n
- \n {e}\n \n ))}\n
{gdprContent}
\n }\n return (\n\n
\n )\n }\n}\n\nexport default cssModules(SendAmount, styles)\n","import SendAmount, { amountTypeToLabel } from './send_amount'\nimport { reduxForm } from 'redux-form'\nimport { getFullName, formatMoney } from 'griffin'\nimport { AMOUNT_TYPES } from 'shared/shared_consts'\nimport formUtils from 'lib/form_utils'\nimport { getCampaignSelector } from 'redux/selectors/campaign'\nimport { getI18n } from 'client/i18n'\n\nconst i18n = getI18n('components/send_glimpse/send_amount')\n\nconst mapStateToProps = (state, props) => {\n const campaign = getCampaignSelector(state, props)\n const { location: { pathname = '' } = {} } = props\n return {\n shouldAutoFocus: props.router.params.action !== 'POP',\n displayName: getFullName({\n givenName: campaign.owner.first_name,\n surname: campaign.owner.last_name,\n }),\n title: campaign.title,\n campaignType: campaign.campaign_type,\n currency: campaign.currency,\n amountType: campaign.amount_type || AMOUNT_TYPES.any,\n amount: campaign.amount,\n maxAmount: campaign.max_amount,\n initialValues: {\n amount: campaign.amount_type !== AMOUNT_TYPES.any ? campaign.amount : 0,\n anonymous: false,\n },\n isGuest: pathname.includes('guest'),\n countryCode: state.country.country_code,\n locale: state.country.locale,\n contributorCommentDisabled:\n state.flags && state.flags.contributor_comment_disabled,\n minamount: state.flags.min_amount_donation,\n }\n}\n\nconst mapDispatchToProps = dispatch => {\n return {}\n}\n\nfunction amountValidator() {\n return (values, props) => {\n const amount = parseFloat(values.amount)\n\n if (props.amountType === AMOUNT_TYPES.at_least) {\n const formattedAmount = formatMoney(\n props.currency,\n props.initialValues.amount,\n { removeTrailingZeros: false }\n )\n const errorLabel = i18n(amountTypeToLabel(props.amountType), {\n amount: formattedAmount,\n })\n\n if (!values.amount) {\n return { amount: errorLabel }\n }\n\n if (amount < props.amount) {\n return { amount: errorLabel }\n }\n } else if (props.amountType === AMOUNT_TYPES.any) {\n const errorLabel = i18n('amount_required')\n if (!values.amount) {\n return { amount: errorLabel }\n }\n if (amount === 0) {\n return { amount: errorLabel }\n }\n }\n\n if (props.maxAmount) {\n if (amount > props.maxAmount) {\n const formattedAmount = formatMoney(props.currency, props.maxAmount, {\n removeTrailingZeros: false,\n })\n const errorLabel = i18n('max_amount', { amount: formattedAmount })\n return { amount: errorLabel }\n }\n }\n\n return {}\n }\n}\n\nexport default reduxForm(\n {\n form: 'send',\n fields: ['amount', 'anonymous'],\n destroyOnUnmount: false,\n touchOnChange: false,\n touchOnBlur: true,\n validate: amountValidator(),\n },\n mapStateToProps,\n mapDispatchToProps\n)(formUtils(SendAmount))\n","import React from 'react'\nimport PropTypes from 'prop-types'\nimport cssModules from 'react-css-modules'\nimport MaskedInput from 'react-text-mask'\nimport { getCurrencySymbol } from 'client/griffin'\n\nimport styles from './text_box.less'\nimport AutosizeTextarea from 'react-textarea-autosize'\nimport CurrencyTextBox from 'components/common/currency_text_box'\nimport InputError from 'components/common/input_error'\nimport { getJSONFromScript } from 'lib/server_params'\n\nimport ReactCSSTransitionGroup from 'react-transition-group/CSSTransitionGroup'\n\nimport clsx from 'clsx'\n\n/*\n\tA Note on TextBoxes in Pools\n\t~~~~~~~~~~~~~~~~~~~~~~~~~~~~~\n\n\tThere are three kinds of textboxes:\n\t1. Native/low-level TextBoxes, which require a behavior that fundamentally changes the\n\t way that textboxes behave. These include the regular , \n
\n \n
\n \n {i18n(titleKey)}
\n {this.props.displayName}
\n