From 12cdfa50a717cc883c22842f580b1a6f542655cc Mon Sep 17 00:00:00 2001 From: Spicer Matthews Date: Wed, 15 Nov 2023 00:15:37 -0800 Subject: [PATCH] Launched November shop promo --- .../promos/November2023NoShopUser.js | 145 ++++++++++++++++++ src/pages/index.js | 27 +++- src/schema/schema.graphql | 46 ++++++ 3 files changed, 217 insertions(+), 1 deletion(-) create mode 100644 src/components/promos/November2023NoShopUser.js diff --git a/src/components/promos/November2023NoShopUser.js b/src/components/promos/November2023NoShopUser.js new file mode 100644 index 00000000..840f4109 --- /dev/null +++ b/src/components/promos/November2023NoShopUser.js @@ -0,0 +1,145 @@ +import React, { useEffect, useState } from 'react' +import gtag from 'ga-gtag' +import PropTypes from 'prop-types' +import Button from '@material-ui/core/Button' +import Card from '@material-ui/core/Card' +import CardContent from '@material-ui/core/CardContent' +import Typography from '@material-ui/core/Typography' +import IconButton from '@material-ui/core/IconButton' +import CloseIcon from '@material-ui/icons/Close' +import localStorageMgr from 'src/utils/localstorage-mgr' +import { NOTIF_DISMISS_PREFIX } from 'src/utils/constants' + +const iframeBaseUrl = + 'https://tab.gladly.io/promos/mothers-day-2023/?nolayout=true' + +const contStyles = { + position: 'relative', + marginLeft: 'auto', + marginRight: 'auto', + width: 700, + // top: 175, + // left: '50%', + // transform: 'translate(-50%, -50%)', + marginTop: 20, + marginBottom: 0, + zIndex: 100000, +} + +const November2023NoShopUser = ({ user }) => { + const [show, setShow] = useState(false) + + const getNotifDismissKey = (code) => `${NOTIF_DISMISS_PREFIX}.${code}` + + const onDismiss = (e) => { + e.stopPropagation() + e.nativeEvent.stopImmediatePropagation() + gtag('event', 'november_2023_no_shop_user_dismiss') + localStorageMgr.setItem(getNotifDismissKey('november-2023-no-shop'), true) + setShow(false) + return false + } + + useEffect(() => { + const dissNotif = + localStorageMgr.getItem(getNotifDismissKey('november-2023-no-shop')) || + false + + if (!dissNotif) { + setShow(true) + } else { + setShow(false) + } + }, [user]) + + return ( + <> + {show && ( +
+ + + + + + + + Win $100 by Giving Back during Black Friday and Cyber Monday + + + + Expand your giving this holiday season by using{' '} + + Shop for a Cause + + , allowing you to make a positive impact with every purchase, + and double the joy of giving back while you shop. As a bonus, + everyone who activates Shop for a Cause on one of our over + 10,000 partner shops in November will be entered into a drawing + for two $100 Visa gift cards ( + + promo details + + ). + + + + + +
+ )} + + ) +} + +November2023NoShopUser.displayName = 'November2023NoShopUserComponent' + +November2023NoShopUser.propTypes = { + user: PropTypes.shape({ + userId: PropTypes.string, + cause: PropTypes.shape({ + nameForShop: PropTypes.string, + }), + }).isRequired, +} + +November2023NoShopUser.defaultProps = {} + +export default November2023NoShopUser diff --git a/src/pages/index.js b/src/pages/index.js index e76cd907..e2c2e394 100644 --- a/src/pages/index.js +++ b/src/pages/index.js @@ -107,6 +107,9 @@ import AddShortcutPageContainer from 'src/components/AddShortcutPageContainer' import FrontpageShortcutListContainer from 'src/components/FrontpageShortcutListContainer' import Modal from '@material-ui/core/Modal' import { Box } from '@material-ui/core' +import November2023NoShopUser from 'src/components/promos/November2023NoShopUser' + +const getNotifDismissKey = (code) => `${NOTIF_DISMISS_PREFIX}.${code}` const useStyles = makeStyles((theme) => ({ pageContainer: { @@ -384,6 +387,7 @@ const getRelayQuery = async ({ AuthUser }) => { joined showYahooPrompt showSfacExtensionPrompt + shopSignupTimestamp cause { causeId impactType @@ -637,6 +641,19 @@ const Index = ({ data: fallbackData, userAgent }) => { } }, [showYahooPrompt, interactedWithSFACNotification, features, searches]) + // Figure out margin of search + const [searchMargin, setSearchMargin] = useState(0) + + useEffect(() => { + if (!user.shopSignupTimestamp) { + if ( + !localStorageMgr.getItem(getNotifDismissKey('november-2023-no-shop')) + ) { + setSearchMargin(-250) + } + } + }) + // set the causeId in local storage for tab ads useEffect(() => { localStorageMgr.setItem(STORAGE_NEW_USER_CAUSE_ID, causeId) @@ -1109,7 +1126,15 @@ const Index = ({ data: fallbackData, userAgent }) => { ) : null} -
+ {/* November No Shop User 2023 Promo */} + {user.userId && !user.shopSignupTimestamp && ( + + )} + +
{/* Prime day 2023 Promo */} {/* {user.userId && notif && } */} diff --git a/src/schema/schema.graphql b/src/schema/schema.graphql index 3281a143..89ed2733 100644 --- a/src/schema/schema.graphql +++ b/src/schema/schema.graphql @@ -981,11 +981,17 @@ type User implements Node { """whether or not the user has opted into searching for extra impact""" yahooPaidSearchRewardOptIn: Boolean! + """ISO datetime string of when this Shop Signup Timestamp was started""" + shopSignupTimestamp: String + """Current UserGroupImpactMetric""" userGroupImpactMetric: UserGroupImpactMetric """Current UserGroupImpactMetrics leaderboard""" leaderboard: [leaderboardEntry] + + """User historical data related to group impacts""" + groupImpactHistory: [UserGroupImpactMetricLog] } """a user's charity specific impact""" @@ -1331,6 +1337,45 @@ type leaderboardEntry { user: User } +""" +A historical view of a specific users contribution to a GroupImpactMetric +""" +type UserGroupImpactMetricLog implements Node { + """The ID of an object""" + id: ID! + + """The ID of the user which the UserGroupImpactMetric belongs to""" + userId: String! + + """ + The micro USD amount raised for this instance of GroupImpactMetric so far by this user + """ + dollarContribution: Int! + + """ + The micro USD amount raised for this instance of GroupImpactMetric so far by this user from tabs + """ + tabDollarContribution: Int! + + """ + The micro USD amount raised for this instance of GroupImpactMetric so far by this user from search + """ + searchDollarContribution: Int! + + """ + The micro USD amount raised for this instance of GroupImpactMetric so far by this user from shopping + """ + shopDollarContribution: Int! + + """ + The micro USD amount raised for this instance of GroupImpactMetric so far by this user from referrals + """ + referralDollarContribution: Int! + + """Date the group impact metric started""" + dateStarted: String! +} + """The Wildfire object""" type Wildfire { causeName: String @@ -1698,6 +1743,7 @@ input CreateNewUserInput { v4BetaEnabled: Boolean missionId: String causeId: String + campaignId: String clientMutationId: String }