From 6f50787bb3e9ebe294616fc0c76c8070da3ff943 Mon Sep 17 00:00:00 2001 From: adrian mustea Date: Mon, 13 May 2024 22:40:08 +0300 Subject: [PATCH 1/5] show ref message --- .../components/StartReferralQuests/index.tsx | 26 +++++++++++++++---- 1 file changed, 21 insertions(+), 5 deletions(-) diff --git a/wondrous-bot-admin/src/components/StartReferralQuests/index.tsx b/wondrous-bot-admin/src/components/StartReferralQuests/index.tsx index 915247840..19ba5bf9b 100644 --- a/wondrous-bot-admin/src/components/StartReferralQuests/index.tsx +++ b/wondrous-bot-admin/src/components/StartReferralQuests/index.tsx @@ -5,12 +5,22 @@ import { OrgProfilePicture } from "components/Shared/ProjectProfilePicture"; import { Reward } from "components/ViewQuestResults/ViewRewards"; import { useMemo, useState } from "react"; import { constructRewards } from "utils/common"; -import { REFERRAL_REWARD_SCHEME } from "utils/constants"; +import { REFERRAL_REWARD_SCHEME, REFERRAL_STATUSES } from "utils/constants"; import InfoModal from "./InfoModal"; import IndividualQuestComponent from "./IndividualQuestComponent"; import useStartQuest from "./utils/hooks"; import SafeImage from "components/SafeImage"; import InactiveQuestInfoModal from "./InactiveQuest"; +import moment from "moment"; + +const TopBarMessage = ({ displayName, hasEnded }) => { + if (hasEnded) return <>This campaign has ended, but you can still complete the quests below!; + return ( + <> + {displayName} referred you, complete the quests below! + + ); +}; const StartReferralQuests = ({ referralCampaign, referralCode, referralCampaignExternalId, referralCodeInfo }) => { const [infoModalQuestId, setInfoModalQuestId] = useState(null); @@ -69,6 +79,11 @@ const StartReferralQuests = ({ referralCampaign, referralCode, referralCampaignE const referralBannerImage = referralCampaign?.media?.[0]?.slug; + const endDate = referralCampaign?.endDate ? moment(referralCampaign?.endDate) : null; + const hasEnded = + referralCampaign?.status !== REFERRAL_STATUSES.ACTIVE || + (endDate && endDate.isBefore(moment().utcOffset(0)?.endOf("day")?.toISOString())); + return ( <> - - {{referralCodeInfo?.referrerDisplayName}} referred you, complete the quests below! + + setDisplayReferrer(false)} From 0fea0f96e1bf21d82e8e16f7b27fe2ed81a31659 Mon Sep 17 00:00:00 2001 From: Adrian Date: Mon, 13 May 2024 23:14:37 +0300 Subject: [PATCH 2/5] show ref message (#2258) --- .../components/StartReferralQuests/index.tsx | 26 +++++++++++++++---- 1 file changed, 21 insertions(+), 5 deletions(-) diff --git a/wondrous-bot-admin/src/components/StartReferralQuests/index.tsx b/wondrous-bot-admin/src/components/StartReferralQuests/index.tsx index 915247840..19ba5bf9b 100644 --- a/wondrous-bot-admin/src/components/StartReferralQuests/index.tsx +++ b/wondrous-bot-admin/src/components/StartReferralQuests/index.tsx @@ -5,12 +5,22 @@ import { OrgProfilePicture } from "components/Shared/ProjectProfilePicture"; import { Reward } from "components/ViewQuestResults/ViewRewards"; import { useMemo, useState } from "react"; import { constructRewards } from "utils/common"; -import { REFERRAL_REWARD_SCHEME } from "utils/constants"; +import { REFERRAL_REWARD_SCHEME, REFERRAL_STATUSES } from "utils/constants"; import InfoModal from "./InfoModal"; import IndividualQuestComponent from "./IndividualQuestComponent"; import useStartQuest from "./utils/hooks"; import SafeImage from "components/SafeImage"; import InactiveQuestInfoModal from "./InactiveQuest"; +import moment from "moment"; + +const TopBarMessage = ({ displayName, hasEnded }) => { + if (hasEnded) return <>This campaign has ended, but you can still complete the quests below!; + return ( + <> + {displayName} referred you, complete the quests below! + + ); +}; const StartReferralQuests = ({ referralCampaign, referralCode, referralCampaignExternalId, referralCodeInfo }) => { const [infoModalQuestId, setInfoModalQuestId] = useState(null); @@ -69,6 +79,11 @@ const StartReferralQuests = ({ referralCampaign, referralCode, referralCampaignE const referralBannerImage = referralCampaign?.media?.[0]?.slug; + const endDate = referralCampaign?.endDate ? moment(referralCampaign?.endDate) : null; + const hasEnded = + referralCampaign?.status !== REFERRAL_STATUSES.ACTIVE || + (endDate && endDate.isBefore(moment().utcOffset(0)?.endOf("day")?.toISOString())); + return ( <> - - {{referralCodeInfo?.referrerDisplayName}} referred you, complete the quests below! + + setDisplayReferrer(false)} From cbdc03e7473d32fed62928dc1f0a79c99c1632da Mon Sep 17 00:00:00 2001 From: terryli0095 Date: Mon, 13 May 2024 15:20:20 -0700 Subject: [PATCH 3/5] remove points if ended --- .../src/components/StartReferralQuests/index.tsx | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/wondrous-bot-admin/src/components/StartReferralQuests/index.tsx b/wondrous-bot-admin/src/components/StartReferralQuests/index.tsx index 19ba5bf9b..85d9daa11 100644 --- a/wondrous-bot-admin/src/components/StartReferralQuests/index.tsx +++ b/wondrous-bot-admin/src/components/StartReferralQuests/index.tsx @@ -227,9 +227,9 @@ const StartReferralQuests = ({ referralCampaign, referralCode, referralCampaignE Earn rewards for completing these quests! - + {!hasEnded && {rewardsValue.map(Reward)} - + } ) : null} {/* //TODO: REPLACE THIS WITH NEWEST CARD */} From c87163fc818e0cd5414f9396adb5325237dac24d Mon Sep 17 00:00:00 2001 From: adrian mustea Date: Tue, 14 May 2024 12:22:54 +0300 Subject: [PATCH 4/5] prompt users to join discord if campaign has ended for exocore --- .../StartReferralQuests/ReferralAction.tsx | 75 +++++++++++ .../components/StartReferralQuests/index.tsx | 72 ++++------- .../utils/customization.ts | 5 + .../StartReferralQuests/utils/hooks.tsx | 118 ++++++++++++------ wondrous-bot-admin/src/utils/constants.tsx | 2 + 5 files changed, 187 insertions(+), 85 deletions(-) create mode 100644 wondrous-bot-admin/src/components/StartReferralQuests/ReferralAction.tsx create mode 100644 wondrous-bot-admin/src/components/StartReferralQuests/utils/customization.ts diff --git a/wondrous-bot-admin/src/components/StartReferralQuests/ReferralAction.tsx b/wondrous-bot-admin/src/components/StartReferralQuests/ReferralAction.tsx new file mode 100644 index 000000000..f059fc919 --- /dev/null +++ b/wondrous-bot-admin/src/components/StartReferralQuests/ReferralAction.tsx @@ -0,0 +1,75 @@ +import { Masonry } from "@mui/lab"; +import { Box } from "@mui/material"; +import { useMemo } from "react"; +import IndividualQuestComponent from "./IndividualQuestComponent"; +import { useDiscordConnect } from "./utils/hooks"; +import { SharedSecondaryButton } from "components/Shared/styles"; +import { shouldDisplayJoinDiscordButton } from "./utils/customization"; + +const EndedCampaignPrompt = ({ orgId }) => { + const { isMember, handleJoinDiscord } = useDiscordConnect({ + orgId, + }); + + const handleClick = () => { + return handleJoinDiscord({ + shouldVerify: false, + }); + }; + + return ( + + {isMember ? "Visit Discord" : "Join Discord"} + + ); +}; + +const ReferralAction = ({ quests, onStartQuest, hasEnded = false, orgId }) => { + const masonryColumnsConfig = useMemo(() => { + if (quests?.length <= 1) { + return { xs: 1 }; + } else if (quests?.length <= 2) { + return { xs: 1, sm: 2 }; + } + return { xs: 1, sm: 2, md: 2, lg: 3 }; + }, [quests?.length]); + + const showDiscordButton = shouldDisplayJoinDiscordButton(orgId); + if (hasEnded && showDiscordButton) return ; + return ( + + + {quests?.map((quest, index) => ( + + + + ))} + + + ); +}; + +export default ReferralAction; diff --git a/wondrous-bot-admin/src/components/StartReferralQuests/index.tsx b/wondrous-bot-admin/src/components/StartReferralQuests/index.tsx index 19ba5bf9b..a4c5b8c25 100644 --- a/wondrous-bot-admin/src/components/StartReferralQuests/index.tsx +++ b/wondrous-bot-admin/src/components/StartReferralQuests/index.tsx @@ -12,9 +12,20 @@ import useStartQuest from "./utils/hooks"; import SafeImage from "components/SafeImage"; import InactiveQuestInfoModal from "./InactiveQuest"; import moment from "moment"; +import ReferralAction from "./ReferralAction"; +import { shouldDisplayJoinDiscordButton } from "./utils/customization"; -const TopBarMessage = ({ displayName, hasEnded }) => { - if (hasEnded) return <>This campaign has ended, but you can still complete the quests below!; +const TopBarMessage = ({ displayName, hasEnded, orgId }) => { + const showDiscordButton = shouldDisplayJoinDiscordButton(orgId); + + if (hasEnded) + return ( + <> + {showDiscordButton + ? "This campaign is no longer active, but join our Discord to discover more quests!" + : "This campaign has ended, but you can still complete the quests below!"} + + ); return ( <> {displayName} referred you, complete the quests below! @@ -68,15 +79,6 @@ const StartReferralQuests = ({ referralCampaign, referralCode, referralCampaignE const quests = referralCampaign?.quests || []; const rewardsValue = constructRewards({ rewards: referredRewards || [] }); - const masonryColumnsConfig = useMemo(() => { - if (quests?.length <= 1) { - return { xs: 1 }; - } else if (quests?.length <= 2) { - return { xs: 1, sm: 2 }; - } - return { xs: 1, sm: 2, md: 2, lg: 3 }; - }, [quests?.length]); - const referralBannerImage = referralCampaign?.media?.[0]?.slug; const endDate = referralCampaign?.endDate ? moment(referralCampaign?.endDate) : null; @@ -110,7 +112,6 @@ const StartReferralQuests = ({ referralCampaign, referralCode, referralCampaignE display="flex" width="calc(100% - 40px)" position="sticky" - flex="1 0 0" alignItems="center" justifyContent="center" zIndex="10" @@ -134,7 +135,11 @@ const StartReferralQuests = ({ referralCampaign, referralCode, referralCampaignE > - + setDisplayReferrer(false)} @@ -222,7 +227,7 @@ const StartReferralQuests = ({ referralCampaign, referralCode, referralCampaignE {org?.description} ) : null} - {referredRewards?.length ? ( + {referredRewards?.length && !hasEnded ? ( Earn rewards for completing these quests! @@ -234,38 +239,13 @@ const StartReferralQuests = ({ referralCampaign, referralCode, referralCampaignE ) : null} {/* //TODO: REPLACE THIS WITH NEWEST CARD */} - - - {quests?.map((quest, index) => ( - - - - ))} - - + + ); diff --git a/wondrous-bot-admin/src/components/StartReferralQuests/utils/customization.ts b/wondrous-bot-admin/src/components/StartReferralQuests/utils/customization.ts new file mode 100644 index 000000000..84366263c --- /dev/null +++ b/wondrous-bot-admin/src/components/StartReferralQuests/utils/customization.ts @@ -0,0 +1,5 @@ +import { EXOCORE_ORG_ID } from "utils/constants"; + +export const shouldDisplayJoinDiscordButton = (orgId) => { + return [EXOCORE_ORG_ID, '113598456040259806'].includes(orgId); +}; diff --git a/wondrous-bot-admin/src/components/StartReferralQuests/utils/hooks.tsx b/wondrous-bot-admin/src/components/StartReferralQuests/utils/hooks.tsx index 8740ca386..a043357a0 100644 --- a/wondrous-bot-admin/src/components/StartReferralQuests/utils/hooks.tsx +++ b/wondrous-bot-admin/src/components/StartReferralQuests/utils/hooks.tsx @@ -23,6 +23,72 @@ interface IProps { discordUrlParams: any; } +export const useDiscordConnect = ({ orgId, discordUrlParams = {} }) => { + const [getOrgDiscordInviteLink, { data: orgDiscordInviteLinkData }] = useLazyQuery(GET_ORG_DISCORD_INVITE_LINK); + + const { setSnackbarAlertMessage, setSnackbarAlertOpen } = useAlerts(); + const [isDiscordConneceted, setIsDiscordConnected] = useState(false); + const [isMember, setIsMember] = useState(false); + const [isConnectionLoading, setIsConnectionLoading] = useState(false); + + const handleOnCheckMembershipCompleted = async (data) => { + if (data?.checkCmtyUserGuildMembership?.isMember !== isMember) { + setIsMember(data?.checkCmtyUserGuildMembership?.isMember); + } + if (data?.checkCmtyUserGuildMembership?.isMember) { + setIsConnectionLoading(false); + } + }; + + const [checkCmtyUserGuildMembership, { startPolling: membershipStartPolling, stopPolling, data: membershipData }] = + useLazyQuery(CHECK_CMTY_USER_GUILD_MEMBERSHIP, { + notifyOnNetworkStatusChange: true, + fetchPolicy: "no-cache", + nextFetchPolicy: "no-cache", + onCompleted: handleOnCheckMembershipCompleted, + }); + + const handleJoinDiscord = async ({ shouldVerify } = { shouldVerify: true }) => { + setIsConnectionLoading(true); + try { + const { data } = await getOrgDiscordInviteLink({ + variables: { + orgId: orgId, + }, + }); + const inviteLink = data?.getOrgDiscordInviteLink?.link; + window.open(inviteLink); + shouldVerify && membershipStartPolling(1000); + } catch (error) { + setIsConnectionLoading(false); + setSnackbarAlertMessage("Something went wrong. Please try again."); + } + }; + + const handleOnConnect = () => { + setIsConnectionLoading(true); + const discordAuthUrl = getDiscordUrl( + "/discord/callback/cmty-user-connect", + `&state=${encodeURIComponent(JSON.stringify(discordUrlParams))}` + ); + window.open(discordAuthUrl); + }; + + return { + isDiscordConneceted, + isMember, + isConnectionLoading, + handleJoinDiscord, + handleOnConnect, + orgDiscordInviteLinkData, + setIsConnectionLoading, + handleOnCheckMembershipCompleted, + setIsDiscordConnected, + setIsMember, + getOrgDiscordInviteLink, + }; +}; + const useStartQuest = ({ setInfoModalQuestId, orgId, @@ -33,22 +99,22 @@ const useStartQuest = ({ discordUrlParams, }: IProps) => { const [isQuestInactive, setIsQuestInactive] = useState(false); - const [isDiscordConneceted, setIsDiscordConnected] = useState(false); - const [isMember, setIsMember] = useState(false); - const [isConnectionLoading, setIsConnectionLoading] = useState(false); - - const [getOrgDiscordInviteLink, { data: orgDiscordInviteLinkData }] = useLazyQuery(GET_ORG_DISCORD_INVITE_LINK); const { setSnackbarAlertMessage } = useAlerts(); - const handleOnCheckMembershipCompleted = async (data) => { - if (data?.checkCmtyUserGuildMembership?.isMember !== isMember) { - setIsMember(data?.checkCmtyUserGuildMembership?.isMember); - } - if (data?.checkCmtyUserGuildMembership?.isMember) { - setIsConnectionLoading(false); - } - }; + const { + isDiscordConneceted, + isMember, + isConnectionLoading, + handleJoinDiscord, + handleOnConnect, + orgDiscordInviteLinkData, + setIsConnectionLoading, + handleOnCheckMembershipCompleted, + setIsDiscordConnected, + setIsMember, + getOrgDiscordInviteLink, + } = useDiscordConnect({ orgId, discordUrlParams }); const [checkCmtyUserGuildMembership, { startPolling: membershipStartPolling, stopPolling, data: membershipData }] = useLazyQuery(CHECK_CMTY_USER_GUILD_MEMBERSHIP, { @@ -211,32 +277,6 @@ const useStartQuest = ({ return () => window.removeEventListener("storage", onStorageChange); }, []); - const handleJoinDiscord = async () => { - setIsConnectionLoading(true); - try { - const { data } = await getOrgDiscordInviteLink({ - variables: { - orgId: orgId, - }, - }); - const inviteLink = data?.getOrgDiscordInviteLink?.link; - window.open(inviteLink); - membershipStartPolling(1000); - } catch (error) { - setIsConnectionLoading(false); - setSnackbarAlertMessage("Something went wrong. Please try again."); - } - }; - - const handleOnConnect = () => { - setIsConnectionLoading(true); - const discordAuthUrl = getDiscordUrl( - "/discord/callback/cmty-user-connect", - `&state=${encodeURIComponent(JSON.stringify(discordUrlParams))}` - ); - window.open(discordAuthUrl); - }; - const handleInfoModalClose = () => { setInfoModalQuestId(null); stopPolling?.(); diff --git a/wondrous-bot-admin/src/utils/constants.tsx b/wondrous-bot-admin/src/utils/constants.tsx index 788ec3fe5..d8d2a074e 100644 --- a/wondrous-bot-admin/src/utils/constants.tsx +++ b/wondrous-bot-admin/src/utils/constants.tsx @@ -556,3 +556,5 @@ export const LOCKED_PATHS = ["/store", "/store/items/create", "/store/items/:id" export const LOCAL_STORAGE_ORG_ID_KEY = "default-org-id"; export const ALLOWLIST_ADMIN_IDS = ["46108748309069853", "54694658413953389"]; + +export const EXOCORE_ORG_ID = '113885254110937338' \ No newline at end of file From 30e184d9473c0957261e140e4b0aa900db6ec3a9 Mon Sep 17 00:00:00 2001 From: adrian mustea Date: Tue, 14 May 2024 12:49:03 +0300 Subject: [PATCH 5/5] add prod id --- .../src/components/StartReferralQuests/utils/customization.ts | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/wondrous-bot-admin/src/components/StartReferralQuests/utils/customization.ts b/wondrous-bot-admin/src/components/StartReferralQuests/utils/customization.ts index 84366263c..0b1ebd462 100644 --- a/wondrous-bot-admin/src/components/StartReferralQuests/utils/customization.ts +++ b/wondrous-bot-admin/src/components/StartReferralQuests/utils/customization.ts @@ -1,5 +1,5 @@ import { EXOCORE_ORG_ID } from "utils/constants"; export const shouldDisplayJoinDiscordButton = (orgId) => { - return [EXOCORE_ORG_ID, '113598456040259806'].includes(orgId); + return [EXOCORE_ORG_ID, '113598456040259806', '112829438976065706'].includes(orgId); };