diff --git a/dashboard/src/components/InviteEmailModal.tsx b/dashboard/src/components/InviteEmailModal.tsx index 7f69bd5..33bb792 100644 --- a/dashboard/src/components/InviteEmailModal.tsx +++ b/dashboard/src/components/InviteEmailModal.tsx @@ -27,11 +27,11 @@ import { useClient } from 'urql'; import { FaUserPlus, FaMinusCircle, FaPlus, FaUpload } from 'react-icons/fa'; import { useDropzone } from 'react-dropzone'; import { escape } from 'lodash'; -import { validateEmail } from '../utils'; +import { validateEmail, validateURI } from '../utils'; import { UpdateUser } from '../graphql/mutation'; import { ArrayInputOperations, csvDemoData } from '../constants'; -interface emailDataTypes { +interface stateDataTypes { value: string; isInvalid: boolean; } @@ -40,19 +40,12 @@ const InviteEmailModal = () => { const client = useClient(); const toast = useToast(); const { isOpen, onOpen, onClose } = useDisclosure(); - const [emails, setEmails] = useState([ - { - value: '', - isInvalid: false, - }, - { - value: '', - isInvalid: false, - }, - { - value: '', - isInvalid: false, - }, + const [tabIndex, setTabIndex] = useState(0); + const [redirectURI, setRedirectURI] = useState({ + value: '', + isInvalid: false, + }); + const [emails, setEmails] = useState([ { value: '', isInvalid: false, @@ -90,6 +83,18 @@ const InviteEmailModal = () => { const onDrop = useCallback((acceptedFiles) => { console.log(acceptedFiles); }, []); + const handleTabsChange = (index: number) => { + setTabIndex(index); + }; + const setRedirectURIHandler = (value: string) => { + const updatedRedirectURI: stateDataTypes = { + value: '', + isInvalid: false, + }; + updatedRedirectURI.value = value; + updatedRedirectURI.isInvalid = !validateURI(value); + setRedirectURI(updatedRedirectURI); + }; const { getRootProps, getInputProps, isDragActive } = useDropzone({ onDrop }); return ( <> @@ -111,7 +116,12 @@ const InviteEmailModal = () => { Invite Email - + Enter emails Upload CSV @@ -124,6 +134,33 @@ const InviteEmailModal = () => { > + + Redirect URI + + + + + setRedirectURIHandler(e.currentTarget.value) + } + /> + + { ? true : false; }; + +export const validateURI = (uri: string) => { + if (!uri || uri === '') return true; + return uri + .toLowerCase() + .match( + /(?:^|\s)((https?:\/\/)?(?:localhost|[\w-]+(?:\.[\w-]+)+)(:\d+)?(\/\S*)?)/ + ) + ? true + : false; +};