, ]
+ searchDisplayProgress || shopDisplayProgress
+ ? [, , ]
: []
}
tooltips={[
`${
- totalProgress - searchDollarProgress
+ totalProgress - searchDollarProgress - shopDollarProgress
}% of funds raised by tabs opened through Tab for a Cause`,
`${searchDollarProgress}% of funds raised by searches through Search for a Cause`,
+ `${shopDollarProgress}% of funds raised by shopping through Shop for a Cause`,
]}
/>
@@ -578,12 +606,13 @@ const GroupImpactSidebar = ({
({
id: 'abcd',
dollarProgress: 250,
dollarProgressFromSearch: 125,
+ dollarProgressFromShop: 0,
dollarGoal: 600,
impactMetric: {
impactTitle: 'impact-title',
@@ -76,6 +77,7 @@ describe('GroupImpact component', () => {
id: 'bcde',
dollarProgress: 28e5,
dollarProgressFromSearch: 125,
+ dollarProgressFromShop: 0,
dollarGoal: 5e6,
impactMetric: {
impactTitle: 'Provide 1 home visit from a community health worker',
@@ -99,6 +101,7 @@ describe('GroupImpact component', () => {
id: 'bcde',
dollarProgress: 28e5,
dollarProgressFromSearch: 125,
+ dollarProgressFromShop: 0,
dollarGoal: 5e6,
impactMetric: {
impactTitle: 'Provide 1 home visit from a community health worker',
@@ -122,6 +125,7 @@ describe('GroupImpact component', () => {
id: 'abcd',
dollarProgress: 28e5,
dollarProgressFromSearch: 125,
+ dollarProgressFromShop: 0,
dollarGoal: 5e6,
impactMetric: {
impactTitle: 'Provide 1 home visit from a community health worker',
@@ -144,6 +148,7 @@ describe('GroupImpact component', () => {
id: 'bcde',
dollarProgress: 28e5,
dollarProgressFromSearch: 125,
+ dollarProgressFromShop: 0,
dollarGoal: 5e6,
impactMetric: {
impactTitle: 'Provide 1 home visit from a community health worker',
@@ -177,6 +182,7 @@ describe('GroupImpact component', () => {
id: 'bcde',
dollarProgress: 28e5,
dollarProgressFromSearch: 125,
+ dollarProgressFromShop: 0,
dollarGoal: 5e6,
impactMetric: {
impactTitle: 'Provide 1 home visit from a community health worker',
@@ -285,6 +291,7 @@ describe('GroupImpact component', () => {
id: 'bcde',
dollarProgress: 28e5,
dollarProgressFromSearch: 125,
+ dollarProgressFromShop: 0,
dollarGoal: 5e6,
impactMetric: {
impactTitle: 'Provide 1 home visit from a community health worker',
@@ -322,6 +329,7 @@ describe('GroupImpact component', () => {
id: 'bcde',
dollarProgress: 28e5,
dollarProgressFromSearch: 125,
+ dollarProgressFromShop: 0,
dollarGoal: 5e6,
impactMetric: {
impactTitle: 'Provide 1 home visit from a community health worker',
diff --git a/src/components/groupImpactComponents/__tests__/GroupImpactSidebar.test.js b/src/components/groupImpactComponents/__tests__/GroupImpactSidebar.test.js
index dde86e22..efbdde91 100644
--- a/src/components/groupImpactComponents/__tests__/GroupImpactSidebar.test.js
+++ b/src/components/groupImpactComponents/__tests__/GroupImpactSidebar.test.js
@@ -12,6 +12,7 @@ import { shopLandingURL } from 'src/utils/urls'
import { windowOpenTop } from 'src/utils/navigation'
import SearchIcon from '@material-ui/icons/Search'
import TabIcon from '@material-ui/icons/Tab'
+import ShoppingCartIcon from '@mui/icons-material/ShoppingCart'
import GroupImpactLeaderboard from '../GroupImpactLeaderboard'
jest.mock('ga-gtag')
@@ -119,6 +120,7 @@ describe('GroupImpactSidebar component', () => {
groupImpactMetric: {
dollarProgress: 250,
dollarProgressFromSearch: 100,
+ dollarProgressFromShop: 0,
dollarGoal: 600,
impactMetric: {
impactTitle: 'impact-title',
@@ -147,16 +149,23 @@ describe('GroupImpactSidebar component', () => {
(mockProps.groupImpactMetric.dollarProgressFromSearch /
mockProps.groupImpactMetric.dollarGoal)
),
+ Math.floor(
+ 100 *
+ (mockProps.groupImpactMetric.dollarProgressFromShop /
+ mockProps.groupImpactMetric.dollarGoal)
+ ),
])
expect(wrapper.find(VerticalLinearProgress).first().prop('icons')).toEqual([
,
,
+ ,
])
expect(
wrapper.find(VerticalLinearProgress).first().prop('tooltips')
).toEqual([
`25% of funds raised by tabs opened through Tab for a Cause`,
`16% of funds raised by searches through Search for a Cause`,
+ `0% of funds raised by shopping through Shop for a Cause`,
])
expect(wrapper.find(VerticalLinearProgress).at(1).prop('progress')).toEqual(
[
@@ -170,6 +179,7 @@ describe('GroupImpactSidebar component', () => {
(mockProps.groupImpactMetric.dollarProgressFromSearch /
mockProps.groupImpactMetric.dollarGoal)
),
+ 0,
]
)
})
@@ -182,6 +192,7 @@ describe('GroupImpactSidebar component', () => {
groupImpactMetric: {
dollarProgress: 650,
dollarProgressFromSearch: 100,
+ dollarProgressFromShop: 0,
dollarGoal: 600,
impactMetric: {
impactTitle: 'impact-title',
@@ -193,19 +204,21 @@ describe('GroupImpactSidebar component', () => {
expect(wrapper.find(Typography).at(2).text()).toEqual('108%')
expect(
wrapper.find(VerticalLinearProgress).first().prop('progress')
- ).toEqual([100, 16])
+ ).toEqual([100, 16, 0])
expect(wrapper.find(VerticalLinearProgress).first().prop('icons')).toEqual([
,
,
+ ,
])
expect(
wrapper.find(VerticalLinearProgress).first().prop('tooltips')
).toEqual([
`84% of funds raised by tabs opened through Tab for a Cause`,
`16% of funds raised by searches through Search for a Cause`,
+ `0% of funds raised by shopping through Shop for a Cause`,
])
expect(wrapper.find(VerticalLinearProgress).at(1).prop('progress')).toEqual(
- [100, 16]
+ [100, 16, 0]
)
})
@@ -217,6 +230,7 @@ describe('GroupImpactSidebar component', () => {
groupImpactMetric: {
dollarProgress: 20,
dollarProgressFromSearch: 6,
+ dollarProgressFromShop: 0,
dollarGoal: 600,
impactMetric: {
impactTitle: 'impact-title',
@@ -234,19 +248,21 @@ describe('GroupImpactSidebar component', () => {
)
expect(
wrapper.find(VerticalLinearProgress).first().prop('progress')
- ).toEqual([16, 8])
+ ).toEqual([16, 8, 0])
expect(wrapper.find(VerticalLinearProgress).first().prop('icons')).toEqual([
,
,
+ ,
])
expect(
wrapper.find(VerticalLinearProgress).first().prop('tooltips')
).toEqual([
`2% of funds raised by tabs opened through Tab for a Cause`,
`1% of funds raised by searches through Search for a Cause`,
+ `0% of funds raised by shopping through Shop for a Cause`,
])
expect(wrapper.find(VerticalLinearProgress).at(1).prop('progress')).toEqual(
- [3, 1]
+ [3, 1, 0]
)
})
@@ -412,6 +428,7 @@ describe('GroupImpactSidebar component', () => {
...getMockProps(),
groupImpactMetric: {
dollarProgressFromSearch: 125,
+ dollarProgressFromShop: 0,
dollarProgress: 250,
dollarGoal: 600,
impactMetric: {
@@ -439,6 +456,7 @@ describe('GroupImpactSidebar component', () => {
...getMockProps(),
groupImpactMetric: {
dollarProgressFromSearch: 125,
+ dollarProgressFromShop: 0,
dollarProgress: 250,
dollarGoal: 600,
impactMetric: {
@@ -466,6 +484,7 @@ describe('GroupImpactSidebar component', () => {
...getMockProps(),
groupImpactMetric: {
dollarProgressFromSearch: 125,
+ dollarProgressFromShop: 0,
dollarProgress: 250,
dollarGoal: 600,
impactMetric: {
@@ -487,6 +506,7 @@ describe('GroupImpactSidebar component', () => {
...getMockProps(),
groupImpactMetric: {
dollarProgressFromSearch: 125,
+ dollarProgressFromShop: 0,
dollarProgress: 250,
dollarGoal: 600,
impactMetric: {
diff --git a/src/pages/_document.js b/src/pages/_document.js
index bed25b84..ce645d85 100644
--- a/src/pages/_document.js
+++ b/src/pages/_document.js
@@ -19,6 +19,23 @@ class CustomDocument extends Document {
+
+
{/**
* Begin: Ads code.
* See: https://github.com/gladly-team/tab-ads#html-tags
diff --git a/src/pages/index.js b/src/pages/index.js
index d4f50e37..c621f590 100644
--- a/src/pages/index.js
+++ b/src/pages/index.js
@@ -6,7 +6,7 @@ import { isNil } from 'lodash/lang'
import clsx from 'clsx'
import dayjs from 'dayjs'
import { graphql } from 'react-relay'
-import { AdComponent, fetchAds } from 'tab-ads'
+import { AdComponent } from 'tab-ads'
import { v4 as uuid } from 'uuid'
import { get } from 'lodash/object'
import {
@@ -40,7 +40,8 @@ import Typography from '@material-ui/core/Typography'
import IconButton from '@material-ui/core/IconButton'
import SettingsIcon from '@material-ui/icons/Settings'
import Chip from '@material-ui/core/Chip'
-import Button from '@material-ui/core/Button'
+
+// import Button from '@material-ui/core/Button'
// utils
import withDataSSR from 'src/utils/pageWrappers/withDataSSR'
@@ -53,14 +54,8 @@ import LogTabMutation from 'src/utils/mutations/LogTabMutation'
import UpdateImpactMutation from 'src/utils/mutations/UpdateImpactMutation'
import LogUserRevenueMutation from 'src/utils/mutations/LogUserRevenueMutation'
import SetHasViewedIntroFlowMutation from 'src/utils/mutations/SetHasViewedIntroFlowMutation'
-import { getCurrentURL, goTo } from 'src/utils/navigation'
-import {
- getAdUnits,
- areAdsEnabled,
- showMockAds,
- isGAMDevEnvironment,
- incrementTabsOpenedToday,
-} from 'src/utils/adHelpers'
+import { goTo } from 'src/utils/navigation'
+import { getAdUnits, incrementTabsOpenedToday } from 'src/utils/adHelpers'
import { isClientSide } from 'src/utils/ssr'
import { aboutURL, accountURL, achievementsURL } from 'src/utils/urls'
import {
@@ -103,7 +98,9 @@ import SearchbarSFACSellNotification from 'src/components/SearchbarSFACSellNotif
import GroupImpactContainer from 'src/components/groupImpactComponents/GroupImpactContainer'
import ShopFullPage from 'src/components/promos/ShopFullPage'
import SearchFullPage from 'src/components/promos/SearchFullPage'
-import Notification from 'src/components/Notification'
+
+// import Notification from 'src/components/Notification'
+
import AddShortcutPageContainer from 'src/components/AddShortcutPageContainer'
import FrontpageShortcutListContainer from 'src/components/FrontpageShortcutListContainer'
import Modal from '@material-ui/core/Modal'
@@ -239,7 +236,7 @@ const useStyles = makeStyles((theme) => ({
background: grey['300'],
},
centerContainer: {
- // height: '100%',
+ height: '100%',
width: '100%',
display: 'flex',
justifyContent: 'center',
@@ -252,7 +249,6 @@ const useStyles = makeStyles((theme) => ({
justifyContent: 'center',
minWidth: 500,
maxWidth: 800,
- marginTop: '60px',
},
searchBar: {
position: 'relative',
@@ -322,47 +318,47 @@ const useStyles = makeStyles((theme) => ({
},
}))
-if (isClientSide()) {
- // Load ads immediately on the client side when we parse
- // this file rather than waiting for component mount.
- const loadAds = () => {
- try {
- const setGAMDevKey = isGAMDevEnvironment()
-
- fetchAds({
- adUnits: Object.values(getAdUnits()),
- pageLevelKeyValues: {
- v4: 'true',
- causeId: localStorageMgr.getCauseForGAM(),
- ...(setGAMDevKey && { dev: 'true' }),
- },
- auctionTimeout: 1000,
- bidderTimeout: 700,
- consent: {
- enabled: true,
-
- // Time to wait for the consent management platform (CMP) to respond.
- // If the CMP does not respond in this time, ad auctions may be cancelled.
- // The tab-cmp package aims to make the CMP respond much more quickly
- // than this after the user's first page load.
- timeout: 500,
- },
- publisher: {
- pageUrl: getCurrentURL(),
- },
- logLevel: 'error',
- onError: (e) => {
- logger.error(e)
- },
- disableAds: !areAdsEnabled(),
- useMockAds: showMockAds(),
- })
- } catch (e) {
- logger.error(e)
- }
- }
- loadAds()
-}
+// if (isClientSide()) {
+// // Load ads immediately on the client side when we parse
+// // this file rather than waiting for component mount.
+// const loadAds = () => {
+// try {
+// const setGAMDevKey = isGAMDevEnvironment()
+
+// fetchAds({
+// adUnits: Object.values(getAdUnits()),
+// pageLevelKeyValues: {
+// v4: 'true',
+// causeId: localStorageMgr.getCauseForGAM(),
+// ...(setGAMDevKey && { dev: 'true' }),
+// },
+// auctionTimeout: 1000,
+// bidderTimeout: 700,
+// consent: {
+// enabled: true,
+
+// // Time to wait for the consent management platform (CMP) to respond.
+// // If the CMP does not respond in this time, ad auctions may be cancelled.
+// // The tab-cmp package aims to make the CMP respond much more quickly
+// // than this after the user's first page load.
+// timeout: 500,
+// },
+// publisher: {
+// pageUrl: getCurrentURL(),
+// },
+// logLevel: 'error',
+// onError: (e) => {
+// logger.error(e)
+// },
+// disableAds: !areAdsEnabled(),
+// useMockAds: showMockAds(),
+// })
+// } catch (e) {
+// logger.error(e)
+// }
+// }
+// loadAds()
+// }
const getRelayQuery = async ({ AuthUser }) => {
// If the user is not authenticated, don't try to fetch data
@@ -757,10 +753,10 @@ const Index = ({ data: fallbackData, userAgent }) => {
notifSearch = null
}
- // Our survey notification
- const surveyNotif = notificationsToShow.find(
- (res) => res.code === 'user-survey-august-2023'
- )
+ // // Our survey notification
+ // const surveyNotif = notificationsToShow.find(
+ // (res) => res.code === 'user-survey-december-2023'
+ // )
// Don't load the page until there is data. Data won't exist
// if the user doesn't have auth cookies and thus doesn't fetch
@@ -1007,7 +1003,7 @@ const Index = ({ data: fallbackData, userAgent }) => {
* that appear via the UserImpact component.
*/}
- {surveyNotif ? (
+ {/* surveyNotif ? (
{
gutterBottom
className={classes.notificationTitle}
>
- We want to hear from you!
+ Time for the 2023 Survey!
- We'd love your feedback via this quick (<2 min) survey
- to help improve Tab for a Cause!
+ Help decide what is next for Tab for a Cause by providing
+ your feedback. Thanks for Tabbing!
@@ -1033,17 +1029,17 @@ const Index = ({ data: fallbackData, userAgent }) => {
buttons={