diff --git a/package-lock.json b/package-lock.json index f398c81f..d2785905 100644 --- a/package-lock.json +++ b/package-lock.json @@ -43,6 +43,7 @@ "styled-components": "^6.0.0-beta.9", "svg-loaders-react": "^2.2.1", "typechain": "^8.0.0", + "validator": "^13.9.0", "wagmi": "^0.9.6" }, "devDependencies": { @@ -32492,6 +32493,14 @@ "spdx-expression-parse": "^3.0.0" } }, + "node_modules/validator": { + "version": "13.9.0", + "resolved": "https://registry.npmjs.org/validator/-/validator-13.9.0.tgz", + "integrity": "sha512-B+dGG8U3fdtM0/aNK4/X8CXq/EcxU2WPrPEkJGslb47qyHsxmbggTWK0yEA4qnYVNF+nxNlN88o14hIcPmSIEA==", + "engines": { + "node": ">= 0.10" + } + }, "node_modules/value-or-promise": { "version": "1.0.12", "resolved": "https://registry.npmjs.org/value-or-promise/-/value-or-promise-1.0.12.tgz", @@ -58872,6 +58881,11 @@ "spdx-expression-parse": "^3.0.0" } }, + "validator": { + "version": "13.9.0", + "resolved": "https://registry.npmjs.org/validator/-/validator-13.9.0.tgz", + "integrity": "sha512-B+dGG8U3fdtM0/aNK4/X8CXq/EcxU2WPrPEkJGslb47qyHsxmbggTWK0yEA4qnYVNF+nxNlN88o14hIcPmSIEA==" + }, "value-or-promise": { "version": "1.0.12", "resolved": "https://registry.npmjs.org/value-or-promise/-/value-or-promise-1.0.12.tgz", diff --git a/package.json b/package.json index 5e583cc7..a9661b8b 100644 --- a/package.json +++ b/package.json @@ -39,6 +39,7 @@ "styled-components": "^6.0.0-beta.9", "svg-loaders-react": "^2.2.1", "typechain": "^8.0.0", + "validator": "^13.9.0", "wagmi": "^0.9.6" }, "scripts": { diff --git a/src/components/ClaimPOAPModal/ClaimPOAPModal.tsx b/src/components/ClaimPOAPModal/ClaimPOAPModal.tsx index 34ef9763..e3d9524b 100644 --- a/src/components/ClaimPOAPModal/ClaimPOAPModal.tsx +++ b/src/components/ClaimPOAPModal/ClaimPOAPModal.tsx @@ -8,6 +8,7 @@ import Lottie from 'lottie-react'; import { useMemo, useState } from 'react'; import { styled } from 'styled-components'; import { isAddressOrEns } from 'utils'; +import isEmail from 'validator/es/lib/isEmail'; import claimErrorLottie from './claimErrorLottie.json'; import { ClaimPOAPButton } from './ClaimPOAPButton'; @@ -76,10 +77,10 @@ export function ClaimPOAPModal({ }: ClaimPOAPModalProps) { const [showBody, setShowBody] = useState(false); + // a valid EVM address, ENS name or email const isRecipientValid = useMemo(() => { if (!reciever) return false; - - return isAddressOrEns(reciever); + return isAddressOrEns(reciever) || isEmail(reciever); }, [reciever]); return (