✨ fix: prevent multiple form submissions in Contact component
This commit is contained in:
@@ -19,9 +19,6 @@ COPY .env .env
|
||||
# Build the Next.js application
|
||||
RUN npm run build
|
||||
|
||||
# Set environmental variable for production mode
|
||||
ENV NODE_ENV=production
|
||||
|
||||
# Expose the port the app runs on
|
||||
EXPOSE 3000
|
||||
|
||||
|
||||
@@ -40,19 +40,30 @@ export default function Contact() {
|
||||
// Convert FormData to a plain object
|
||||
const jsonData = JSON.stringify(data);
|
||||
|
||||
const response = await sendEmail(jsonData);
|
||||
if (response.success) {
|
||||
form.reset();
|
||||
}
|
||||
//prevent multiple submissions
|
||||
const submitButton = form.querySelector("button[type='submit']");
|
||||
if (submitButton) {
|
||||
submitButton.setAttribute("disabled", "true");
|
||||
submitButton.textContent = "Sending...";
|
||||
|
||||
setBanner({
|
||||
show: true,
|
||||
message: response.message,
|
||||
type: response.success ? "success" : "error",
|
||||
});
|
||||
setTimeout(() => {
|
||||
setBanner((prev) => ({ ...prev, show: false }));
|
||||
}, 3000);
|
||||
const response = await sendEmail(jsonData);
|
||||
if (response.success) {
|
||||
form.reset();
|
||||
submitButton.textContent = "Sent!";
|
||||
setTimeout(() => {
|
||||
submitButton.removeAttribute("disabled");
|
||||
submitButton.textContent = "Send";
|
||||
}, 2000);
|
||||
}
|
||||
setBanner({
|
||||
show: true,
|
||||
message: response.message,
|
||||
type: response.success ? "success" : "error",
|
||||
});
|
||||
setTimeout(() => {
|
||||
setBanner((prev) => ({ ...prev, show: false }));
|
||||
}, 3000);
|
||||
}
|
||||
}
|
||||
return (
|
||||
<section
|
||||
|
||||
Reference in New Issue
Block a user