diff --git a/pages/poll/[id].tsx b/pages/poll/[id].tsx
index 5224b59..2f7c7f6 100644
--- a/pages/poll/[id].tsx
+++ b/pages/poll/[id].tsx
@@ -8,6 +8,7 @@ import { serverAPI } from "../../src/api/server";
import Layout from "../../src/components/Layout";
import PollInfo from "../../src/components/PollInfo";
import PollTable from "../../src/components/PollTable";
+import InviteMail from "../../src/components/InviteMail";
import {
Choice,
ChoiceFromDB,
@@ -49,9 +50,17 @@ const Poll = (props: {
loggedInUserEmailID === pollCreatorEmailID && (
)}
+ {!pollFromDB.open &&
+ loggedInUserEmailID === pollCreatorEmailID && (
+
+ )}
-
+
{
+ const { pollid, polltitle, finalChoice } = props;
+
+ const displayName = useSelector(
+ (state: RootState) => state.authReducer.displayName
+ );
+ const loggedInUserEmailID = useSelector(
+ (state: RootState) => state.authReducer.username
+ );
+ const token = useSelector((state: RootState) => state.authReducer.token);
+ const [currentEmail, setCurrentEmail] = useState("");
+ const [emailList, setEmails] = useState([]);
+ const [error, setError] = useState("");
+
+ const [response, setResponse] = useState({
+ status: false,
+ type: "null",
+ msg: "",
+ });
+
+ const isInList = (email: string): boolean => {
+ return emailList.includes(email);
+ };
+
+ const isEmail = (email: string): boolean => {
+ return /[\w\d.-]+@[\w\d.-]+\.[\w\d.-]+/.test(email);
+ };
+
+ const isValid = (email: string): boolean => {
+ let mailerror = null;
+ if (isInList(email)) {
+ mailerror = `${email} has already been added.`;
+ }
+ if (!isEmail(email)) {
+ mailerror = `${email} is not a valid email address.`;
+ }
+ if (mailerror) {
+ setError(mailerror);
+ return false;
+ }
+ return true;
+ };
+
+ const handleKeyDown = (evt: React.KeyboardEvent): void => {
+ if ([","].includes(evt.key)) {
+ evt.preventDefault();
+ let value = currentEmail.trim();
+ if (value && isValid(value)) {
+ setEmails([...emailList, value]);
+ setCurrentEmail("");
+ }
+ }
+ };
+
+ const handleChange = (evt: React.ChangeEvent): void => {
+ setCurrentEmail(evt.target.value);
+ setError("");
+ };
+
+ const handleDelete = (email: string): void => {
+ setEmails(emailList.filter((i) => i !== email));
+ };
+
+ const handlePaste = (evt: React.ClipboardEvent): void => {
+ evt.preventDefault();
+ let paste = evt.clipboardData.getData("text");
+ let emails = paste.match(/[\w\d.-]+@[\w\d.-]+\.[\w\d.-]+/g);
+ if (emails) {
+ let toBeAdded = emails.filter((email) => !isInList(email));
+ setEmails([...emailList, ...toBeAdded]);
+ }
+ };
+
+ const handleSubmit = async (): Promise => {
+ try {
+ let sendEmailsResponse;
+ if (finalChoice) {
+ const mailerEvArgs: MailerEventArgs = {
+ senderName: displayName,
+ pollTitle: polltitle,
+ finalOption: finalChoice,
+ receiverIDs: emailList,
+ };
+ sendEmailsResponse = await mailerAPI.sendEventInvites(mailerEvArgs, token);
+ } else {
+ const mailerArgs: MailerPollArgs = {
+ pollID: pollid,
+ pollTitle: polltitle,
+ receiverIDs: emailList,
+ senderName: displayName,
+ senderEmailID: loggedInUserEmailID,
+ };
+ sendEmailsResponse = await mailerAPI.sendPollInvites(mailerArgs, token);
+ }
+ if (sendEmailsResponse.statusCode === 200) {
+ setEmails([]); // emailList is cleared if mails are sent.
+ setResponse({
+ status: true,
+ type: "success",
+ msg: "Emails successfully sent.",
+ });
+ } else {
+ setResponse({
+ status: true,
+ type: "error",
+ msg: "Unable to send emails. Please try again later.",
+ });
+ }
+ } catch (err) {
+ setResponse({
+ status: true,
+ type: "error",
+ msg: "Unable to send emails. Check your connection.",
+ });
+ }
+ };
+
+ return (
+
+
+
+ Invite participants
+
+
+
+ {emailList.map((email) => (
+
+ {email}
+
+
+ ))}
+ {error &&
{error}
}
+
+
+
+
+ setResponse({ status: false, type: "null", msg: "" })
+ }
+ />
+
+ );
+};
+
+export default InviteMail;
diff --git a/src/components/ShareInvite.tsx b/src/components/ShareInvite.tsx
index 685d156..9899bfa 100644
--- a/src/components/ShareInvite.tsx
+++ b/src/components/ShareInvite.tsx
@@ -6,12 +6,8 @@ import {
OverlayTrigger,
} from "react-bootstrap";
import copy from "copy-to-clipboard";
-import { useState } from "react";
-import { useSelector } from "react-redux";
-import ResponseMessage from "./ResponseMessage";
-import { MailerPollArgs } from "../models/poll";
-import { RootState } from "../store/store";
import { mailerAPI } from "../api/mailer";
+import InviteMail from "./InviteMail";
const ShareInvite = (props: {
pollid: string;
@@ -20,22 +16,6 @@ const ShareInvite = (props: {
const { pollid } = props;
const { polltitle } = props;
const pollurl = `${mailerAPI.domain}/poll/${pollid}`; /* This should be replaced */
- const displayName = useSelector(
- (state: RootState) => state.authReducer.displayName
- );
- const loggedInUserEmailID = useSelector(
- (state: RootState) => state.authReducer.username
- );
- const token = useSelector((state: RootState) => state.authReducer.token);
- const [currentEmail, setCurrentEmail] = useState("");
- const [emailList, setEmails] = useState([]);
- const [error, setError] = useState("");
-
- const [response, setResponse] = useState({
- status: false,
- type: "null",
- msg: "",
- });
const handleCopy = (): void => {
copy(pollurl);
@@ -46,167 +26,44 @@ const ShareInvite = (props: {
Copied!
);
-
- const isInList = (email: string): boolean => {
- return emailList.includes(email);
- };
-
- const isEmail = (email: string): boolean => {
- return /[\w\d.-]+@[\w\d.-]+\.[\w\d.-]+/.test(email);
- };
-
- const isValid = (email: string): boolean => {
- let mailerror = null;
- if (isInList(email)) {
- mailerror = `${email} has already been added.`;
- }
- if (!isEmail(email)) {
- mailerror = `${email} is not a valid email address.`;
- }
- if (mailerror) {
- setError(mailerror);
- return false;
- }
- return true;
- };
-
- const handleKeyDown = (evt: React.KeyboardEvent): void => {
- if ([","].includes(evt.key)) {
- evt.preventDefault();
- let value = currentEmail.trim();
- if (value && isValid(value)) {
- setEmails([...emailList, value]);
- setCurrentEmail("");
- }
- }
- };
-
- const handleChange = (evt: React.ChangeEvent): void => {
- setCurrentEmail(evt.target.value);
- setError("");
- };
-
- const handleDelete = (email: string): void => {
- setEmails(emailList.filter((i) => i !== email));
- };
-
- const handlePaste = (evt: React.ClipboardEvent): void => {
- evt.preventDefault();
- let paste = evt.clipboardData.getData("text");
- let emails = paste.match(/[\w\d.-]+@[\w\d.-]+\.[\w\d.-]+/g);
- if (emails) {
- let toBeAdded = emails.filter((email) => !isInList(email));
- setEmails([...emailList, ...toBeAdded]);
- }
- };
-
- const handleSubmit = async (): Promise => {
- const mailerArgs: MailerPollArgs = {
- pollID: pollid,
- pollTitle: polltitle,
- receiverIDs: emailList,
- senderName: displayName,
- senderEmailID: loggedInUserEmailID,
- };
- try {
- const sendEmailsResponse = await mailerAPI.sendPollInvites(
- mailerArgs,
- token
- );
- if (sendEmailsResponse.statusCode === 200) {
- setEmails([]); // emailList is cleared if mails are sent.
- setResponse({
- status: true,
- type: "success",
- msg: "Emails successfully sent.",
- });
- } else {
- setResponse({
- status: true,
- type: "error",
- msg: "Unable to send emails. Please try again later.",
- });
- }
- } catch (err) {
- setResponse({
- status: true,
- type: "error",
- msg: "Unable to send emails. Check your connection.",
- });
- }
- };
-
+
return (
-
+
- Share link
-
-
-
-
-
-
-
-
-
-
-
-
- Invite participants
-
-
-
- {emailList.map((email) => (
-
- {email}
-
-
-
+
+
+
+
+
+
+
-
- setResponse({ status: false, type: "null", msg: "" })
- }
- />
);
};
diff --git a/src/styles/index.css b/src/styles/index.css
index 4241c5a..53fdb1d 100644
--- a/src/styles/index.css
+++ b/src/styles/index.css
@@ -469,6 +469,12 @@ h4 {
padding-right: 3rem;
}
+.poll-invitemail {
+ margin-top: 2rem;
+ padding-left: 2rem;
+ padding-right: 3rem;
+}
+
.poll-info-title {
font-size: 3rem;
font-weight: 700;
@@ -507,7 +513,8 @@ h4 {
padding-right: 0;
}
- .poll-shareinvite-content {
+ .poll-shareinvite-content,
+ .poll-invitemail {
padding-left: 0;
padding-right: 0;
}