Staging

wondrous-bot-admin/src/components/AddFormEntity/components/VerifyTokenHolding/index.tsx

@@ -272,9 +272,9 @@ const VerifyTokenHoldingComponent = ({ onChange, value, stepType, error }) => {
           marginTop: "8px",
         }}
       >
-        <Label>Token ID (optional for ERC1155)</Label>
+        <Label>Token ID (mandatory for ERC1155)</Label>
         <TextField
-          placeholder="Token ID (optional for ERC1155)"
+          placeholder="Token ID (mandatory for ERC1155)"
           value={value?.verifyTokenId}
           onChange={(value) => handleOnChange("verifyTokenId", value)}
           multiline={false}

wondrous-bot-admin/src/components/Referral/index.tsx

@@ -12,7 +12,7 @@ import { BG_TYPES } from "utils/constants";
 import { StyledLink } from "./styles";
 import { useQuery } from "@apollo/client";
 import { useLocation } from "react-router-dom";
-import { GET_REFERRAL_CAMPAIGN_BY_EXTERNAL_ID, GET_REFERRAL_CODE_INFO } from "graphql/queries/referral";
+import { GET_REFERRAL_CAMPAIGN_BY_EXTERNAL_ID, GET_REFERRAL_CODE_INFO, GET_REFERRAL_USER_LIMIT_REACHED } from "graphql/queries/referral";
 import StartReferralQuests from "components/StartReferralQuests";
 
 const StartReferralPage = () => {
@@ -41,6 +41,16 @@ const StartReferralPage = () => {
     skip: !referralCampaignExternalId,
   });
 
+  const {data: referralLimitReached, loading: referralLimitLoading} = useQuery(GET_REFERRAL_USER_LIMIT_REACHED, {
+    variables: {
+      referralCode,
+      referralCampaignExternalId
+    },
+    skip: !referralCode
+  });
+
+  const {hasReachedLimit = false} = referralLimitReached?.getReferralUserLimitReached || {};
+
   return (
     <>
       <PageWrapper
@@ -64,10 +74,11 @@ const StartReferralPage = () => {
           flexDirection="column"
           flex="1"
         >
-          {!data?.getReferralCampaignByReferralExternalId || loading ? (
+          {!data?.getReferralCampaignByReferralExternalId || loading || referralLimitLoading ? (
             <PageSpinner color="#fee2ca" />
           ) : (
             <StartReferralQuests
+              hasReachedLimit={hasReachedLimit}
               referralCampaign={data?.getReferralCampaignByReferralExternalId}
               referralCode={referralCode}
               referralCodeInfo={referralCodeInfoData?.getReferralCodeInfo}

wondrous-bot-admin/src/components/StartReferralQuests/index.tsx

@@ -33,7 +33,7 @@ const TopBarMessage = ({ displayName, hasEnded, orgId }) => {
   );
 };
 
-const StartReferralQuests = ({ referralCampaign, referralCode, referralCampaignExternalId, referralCodeInfo }) => {
+const StartReferralQuests = ({ referralCampaign, referralCode, referralCampaignExternalId, referralCodeInfo, hasReachedLimit }) => {
   const [infoModalQuestId, setInfoModalQuestId] = useState(null);
   const discordUrlParams = {
     referralCode,
@@ -84,7 +84,7 @@ const StartReferralQuests = ({ referralCampaign, referralCode, referralCampaignE
   const endDate = referralCampaign?.endDate ? moment(referralCampaign?.endDate) : null;
   const hasEnded =
     referralCampaign?.status !== REFERRAL_STATUSES.ACTIVE ||
-    (endDate && endDate.isBefore(moment().utcOffset(0)?.endOf("day")?.toISOString()));
+    (endDate && endDate.isBefore(moment().utcOffset(0)?.endOf("day")?.toISOString())) || hasReachedLimit;
 
   return (
     <>

wondrous-bot-admin/src/graphql/queries/referral.ts

@@ -97,3 +97,11 @@ export const GET_REFERRAL_CODE_INFO = gql`
     }
   }
 `;
+
+export const GET_REFERRAL_USER_LIMIT_REACHED = gql`
+  query getReferralUserLimitReached($referralCode: String!, $referralCampaignExternalId: String!) {
+    getReferralUserLimitReached(referralCode: $referralCode , referralCampaignExternalId: $referralCampaignExternalId) {
+      hasReachedLimit
+    }
+  }
+`;

wondrous-bot-admin/src/services/validators/customValidation.tsx

@@ -1,5 +1,11 @@
 export const getYouTubeVideoId = (url) => {
   let videoId = "";
+  if (url?.includes("shorts")) {
+    // https://www.youtube.com/shorts/rKANnKDu5-o
+    const shortsRegex = /youtube\.com\/shorts\/([a-zA-Z0-9_-]+)/;
+    const match = url.match(shortsRegex);
+    return match ? match[1] : null;
+  }
   // Extract video ID from the first format: https://youtu.be/videoId
   const regex1 = /^https:\/\/youtu\.be\/([^\?]+)/;
   const match1 = url.match(regex1);