diff --git a/apps/potlock/widget/Components/Indicator.jsx b/apps/potlock/widget/Components/Indicator.jsx index 243ab0e0..486a93a7 100644 --- a/apps/potlock/widget/Components/Indicator.jsx +++ b/apps/potlock/widget/Components/Indicator.jsx @@ -2,8 +2,8 @@ const Outer = styled.div` display: flex; align-items: center; justify-content: center; - width: 16px; - height: 16px; + width: 18px; + height: 18px; border-radius: 50%; background-color: ${props.colorOuter}; @@ -17,12 +17,15 @@ const Outer = styled.div` } } + ${props.animate && + ` animation: beacon 1.5s infinite; + `} `; const Inner = styled.div` - width: 9px; - height: 9px; + width: 10px; + height: 10px; border-radius: 50%; background-color: ${props.colorInner}; `; diff --git a/apps/potlock/widget/Index.jsx b/apps/potlock/widget/Index.jsx index 905ab284..c4cb03f4 100644 --- a/apps/potlock/widget/Index.jsx +++ b/apps/potlock/widget/Index.jsx @@ -70,6 +70,7 @@ State.init({ note: null, referrerId: null, currency: null, + // isSybilModalOpen: false, }); if (!state.nearToUsd) { @@ -434,6 +435,10 @@ const props = { return `${differenceInDays} ${differenceInDays === 1 ? "day" : "days"}${suffix || ""}`; }, + NADA_BOT_URL: "https://app.nada.bot", + // openSybilModal: () => { + // State.update({ isSybilModalOpen: true }); + // }, }; if (props.transactionHashes && props.tab === CART_TAB) { @@ -523,5 +528,13 @@ return ( {tabContent} + {/* State.update({ isSybilModalOpen: false }), + }} + /> */} ); diff --git a/apps/potlock/widget/Pots/ButtonVerifyToDonate.jsx b/apps/potlock/widget/Pots/ButtonVerifyToDonate.jsx new file mode 100644 index 00000000..115b5d36 --- /dev/null +++ b/apps/potlock/widget/Pots/ButtonVerifyToDonate.jsx @@ -0,0 +1,15 @@ +const { ownerId } = props; + +return ( + +); diff --git a/apps/potlock/widget/Pots/Detail.jsx b/apps/potlock/widget/Pots/Detail.jsx index 8db9bb75..bb7a9014 100644 --- a/apps/potlock/widget/Pots/Detail.jsx +++ b/apps/potlock/widget/Pots/Detail.jsx @@ -80,7 +80,7 @@ State.init({ applicationMessage: "", applicationMessageError: "", applicationSuccess: false, - sybilWrapperProviderResult: null, + sybilRequirementMet: null, }); if (state.potDetail === null) { @@ -109,8 +109,10 @@ if (state.potDetail === null) { const [contractId, methodName] = potDetail.sybil_wrapper_provider.split(":"); Near.asyncView(contractId, methodName, { account_id: context.accountId }).then((result) => { console.log("sybil result: ", result); - State.update({ sybilWrapperProviderResult: result }); + State.update({ sybilRequirementMet: result }); }); + } else { + State.update({ sybilRequirementMet: true }); } }) .catch((e) => { @@ -224,6 +226,7 @@ return ( ...props, setApplicationModalOpen: (isOpen) => State.update({ isApplicationModalOpen: isOpen }), handleApplyToPot, + sybilRequirementMet: state.sybilRequirementMet, }} /> @@ -247,6 +250,7 @@ return ( props={{ ...props, potDetail: state.potDetail, + sybilRequirementMet: state.sybilRequirementMet, }} /> diff --git a/apps/potlock/widget/Pots/Header.jsx b/apps/potlock/widget/Pots/Header.jsx index 3f2aea50..dac29b2f 100644 --- a/apps/potlock/widget/Pots/Header.jsx +++ b/apps/potlock/widget/Pots/Header.jsx @@ -1,4 +1,12 @@ -const { ownerId, potId, MAX_DONATION_MESSAGE_LENGTH, formatDate, referrerId } = props; +const { + ownerId, + potId, + MAX_DONATION_MESSAGE_LENGTH, + formatDate, + referrerId, + sybilRequirementMet, + NADA_BOT_URL, +} = props; const loraCss = fetch("https://fonts.googleapis.com/css2?family=Lora&display=swap").body; @@ -313,6 +321,7 @@ return ( props={{ colorOuter: "#D7F5A1", colorInner: "#9ADD33", + animate: true, }} /> Matching round live @@ -355,8 +364,11 @@ return ( src={`${ownerId}/widget/Components.Button`} props={{ type: "primary", - text: "Donate to projects", - href: props.hrefWithEnv(`?tab=pot&potId=${potId}&nav=projects`), + text: sybilRequirementMet ? "Donate to projects" : "Verify to Donate", + href: sybilRequirementMet + ? props.hrefWithEnv(`?tab=pot&potId=${potId}&nav=projects`) + : NADA_BOT_URL, + target: sybilRequirementMet ? "_self" : "_blank", }} /> )} diff --git a/apps/potlock/widget/Pots/Projects.jsx b/apps/potlock/widget/Pots/Projects.jsx index 2423b5e2..0a3602b9 100644 --- a/apps/potlock/widget/Pots/Projects.jsx +++ b/apps/potlock/widget/Pots/Projects.jsx @@ -1,5 +1,5 @@ // get projects -const { ownerId, potId, potDetail } = props; +const { ownerId, potId, potDetail, sybilRequirementMet } = props; const projects = Near.view(potId, "get_approved_applications", {}); if (!projects) return "Loading..."; @@ -35,18 +35,9 @@ return ( ...props, potId, projectId: project.project_id, - allowDonate: publicRoundOpen && project.project_id !== context.accountId, - // button: ( - // - // ), - // TODO: add prop indicating that button should read "Donate" and providing onClick method + allowDonate: + sybilRequirementMet && publicRoundOpen && project.project_id !== context.accountId, + requireVerification: !sybilRequirementMet, }} /> ); diff --git a/apps/potlock/widget/Pots/UNUSED/ModalSybil.jsx b/apps/potlock/widget/Pots/UNUSED/ModalSybil.jsx new file mode 100644 index 00000000..a866fe1f --- /dev/null +++ b/apps/potlock/widget/Pots/UNUSED/ModalSybil.jsx @@ -0,0 +1,126 @@ +const { ownerId, isModalOpen, onClose, NADA_BOT_URL } = props; + +const IPFS_BASE_URL = "https://nftstorage.link/ipfs/"; +const CLOSE_ICON_URL = + IPFS_BASE_URL + "bafkreifyg2vvmdjpbhkylnhye5es3vgpsivhigkjvtv2o4pzsae2z4vi5i"; +const ERROR_ICON_URL = + IPFS_BASE_URL + "bafkreicqarojxk6jhdtsk2scfsmnigqpxjfgar6om4wlhn5xmqbbu74u5i"; +const IMAGE_URL = IPFS_BASE_URL + "bafkreidwashbfmlr7qo2yoqcfdsqi4ouisgt6h6jwxymz53v2f7hhoy75a"; + +const loraCss = fetch("https://fonts.googleapis.com/css2?family=Lora&display=swap").body; + +const ModalHeader = styled.div` + width: 100%; + padding: 10px 20px; + display: flex; + justify-content: space-between; + align-items: center; + background: #f6f5f3; +`; + +const ModalHeaderText = styled.div` + font-size: 17px; + font-weight: 600; + line-height: 24px; + color: #292929; +`; + +const Icon = styled.img` + width: 24px; + height: 24px; +`; + +const ModalContent = styled.div` + padding: 16px 20px 32px 20px; + display: flex; + flex-direction: column; + gap: 24px; + align-items: center; + justify-content: center; +`; + +const Row = styled.div` + display: flex; + flex-direction: row; + align-items: center; + justify-content: center; +`; + +const ContentHeaderText = styled.div` + margin-left: 24px; + font-size: 32px; + font-weight: 400; + line-height: 40px; + color: #525252; + font-family: "Lora"; + ${loraCss} +`; + +const ContentDescriptionText = styled.div` + font-size: 16px; + font-weight: 400; + line-height: 28px; +`; + +const ErrorSpan = styled.span` + color: #dd3345; +`; + +const BoldSpan = styled.span` + font-weight: 600; +`; + +const Image = styled.img` + width: 100px; + max-height: 245px; + margin: 0px 32px; +`; + +return ( + + +
+ Verify Via Nada.bot + +
+ + + + + You Are Not verified + + + + + To donate to a project via this pot, you need to get verified from{" "} + Nada.bot + + + + + + + + + ), + }} + /> +); diff --git a/apps/potlock/widget/Project/Card.jsx b/apps/potlock/widget/Project/Card.jsx index 110bbc75..ca0ac97f 100644 --- a/apps/potlock/widget/Project/Card.jsx +++ b/apps/potlock/widget/Project/Card.jsx @@ -1,4 +1,4 @@ -const { ownerId, potDetail } = props; +const { ownerId, potDetail, NADA_BOT_URL } = props; const donationContractId = "donate.potlock.near"; // console.log("props in Card: ", props); @@ -190,5 +190,19 @@ return ( }} /> )} + {props.requireVerification && ( + + )} );