From 45bef1398b1b5e883a11b6d46eff0f610f32c700 Mon Sep 17 00:00:00 2001 From: Sawan Date: Fri, 1 Nov 2024 16:03:11 +0530 Subject: [PATCH] Added backend api of feedback form --- backend/app.js | 2 +- backend/controllers/feedController.js | 49 +++++++++++++++ backend/controllers/feedbackcontroller.js | 24 ------- backend/models/feedback.js | 67 ++++++++++++-------- backend/routes/feebackroute.js | 7 --- backend/routes/feedbackRoute.js | 9 +++ frontend/src/pages/Feedback.js | 77 ++++++++++++++++------- 7 files changed, 155 insertions(+), 80 deletions(-) create mode 100644 backend/controllers/feedController.js delete mode 100644 backend/controllers/feedbackcontroller.js delete mode 100644 backend/routes/feebackroute.js create mode 100644 backend/routes/feedbackRoute.js diff --git a/backend/app.js b/backend/app.js index 38a34d4d..c5efb03d 100644 --- a/backend/app.js +++ b/backend/app.js @@ -3,7 +3,7 @@ import dotenv from "dotenv"; import connectDB from "./utils/db.js"; import blogRoutes from "./routes/blogRoutes.js"; import userRoutes from "./routes/userRoutes.js"; -import feedbackRoutes from "./routes/feebackroute.js"; +import feedbackRoutes from "./routes/feedbackRoute.js"; import cors from "cors"; dotenv.config(); diff --git a/backend/controllers/feedController.js b/backend/controllers/feedController.js new file mode 100644 index 00000000..f9942d68 --- /dev/null +++ b/backend/controllers/feedController.js @@ -0,0 +1,49 @@ +import Feedback from "../models/feedback.js"; + +// Controller to handle feedback submission +export async function submitFeedback(req, res) { // Changed resp to res + console.log('feedback form getting submit') + try { + // Extract feedback data from the request body + const { + overallExperience, + featuresUsed, + mostHelpfulFeature, + improvement, + newFeatures, + recommendation, + additionalComments + } = req.body; + + // Validate required fields + if (!overallExperience || !featuresUsed || !mostHelpfulFeature || !recommendation) { + return res.status(400).json({ message: 'Please provide all required fields.' }); + } + + // Create a new Feedback instance with the extracted data + const feedback = new Feedback({ + overallExperience, + featuresUsed, + mostHelpfulFeature, + improvement, + newFeatures, + recommendation, + additionalComments + }); + + // Save the feedback data to MongoDB + await feedback.save(); + + // Respond with a success message + res.status(201).json({ message: 'Feedback submitted successfully', feedback }); + } catch (error) { + // Handle errors and send a failure response + console.error('Error saving feedback:', error); + res.status(500).json({ message: 'Failed to submit feedback', error: error.message }); + } +} + + +export async function getFeed(req, res) { + res.send("feedback form") +} \ No newline at end of file diff --git a/backend/controllers/feedbackcontroller.js b/backend/controllers/feedbackcontroller.js deleted file mode 100644 index 335652f2..00000000 --- a/backend/controllers/feedbackcontroller.js +++ /dev/null @@ -1,24 +0,0 @@ -import feedback from "../models/feedback.js"; - -export async function saveFeedback(req, resp) { - try { - const { name, userfeedback, email, rating } = req.body; - - if (!name || !userfeedback || !email || typeof rating !== "number") { - return resp.status(400).json({ message: "All fields are required." }); - } - - const newfeedback = new feedback({ name, userfeedback, email, rating }); - - // Save feedback to the database - await newfeedback.save(); - - // Respond with success message - resp - .status(201) - .json({ message: "Feedback saved successfully!", newfeedback }); - } catch (error) { - console.error("Error saving feedback:", error); - resp.status(500).json({ message: "Failed to save feedback.", error }); - } -} diff --git a/backend/models/feedback.js b/backend/models/feedback.js index 08064d10..31b9e200 100644 --- a/backend/models/feedback.js +++ b/backend/models/feedback.js @@ -1,29 +1,46 @@ -import { mongoose } from "mongoose"; +import mongoose from 'mongoose'; -const feedbackSchema = new mongoose.Schema( - { - name: { - type: String, - required: true, - trim: true, - }, - userfeedback: { - type: String, - required: true, - trim: true, - }, - email: { - type: String, - required: true, - }, - rating: { - type: Number, - required: true, - }, +const feedbackSchema = new mongoose.Schema({ + overallExperience: { + type: Number, + required: true, + min: 1, + max: 5 }, - { timestamps: true } -); + featuresUsed: { + type: [String], + enum: ['vocabulary', 'grammar', 'pronunciation', 'reading', 'listening'], + required: true + }, + mostHelpfulFeature: { + type: String, + enum: ['vocabulary', 'grammar', 'pronunciation', 'reading', 'listening'], + required: true + }, + improvement: { + type: String, + trim: true + }, + newFeatures: { + type: String, + trim: true + }, + recommendation: { + type: Number, + required: true, + min: 1, + max: 5 + }, + additionalComments: { + type: String, + trim: true + }, + submittedAt: { + type: Date, + default: Date.now + } +}); -const feedback = mongoose.model(" feedback", feedbackSchema); +const Feedback = mongoose.model("Feedback", feedbackSchema); -export default feedback; +export default Feedback; diff --git a/backend/routes/feebackroute.js b/backend/routes/feebackroute.js deleted file mode 100644 index 51a5ed41..00000000 --- a/backend/routes/feebackroute.js +++ /dev/null @@ -1,7 +0,0 @@ -import express from "express"; -const router = express.Router(); -import { saveFeedback } from "../controllers/feedbackcontroller.js"; - -router.post("/savefeedback", saveFeedback); - -export default router; diff --git a/backend/routes/feedbackRoute.js b/backend/routes/feedbackRoute.js new file mode 100644 index 00000000..2e3af3f6 --- /dev/null +++ b/backend/routes/feedbackRoute.js @@ -0,0 +1,9 @@ +import express from "express"; +import { getFeed, submitFeedback } from "../controllers/feedController.js"; +const router = express.Router(); + + +router.post("/saveFeedback", submitFeedback); +router.get("/saveFeedback", getFeed); + +export default router; diff --git a/frontend/src/pages/Feedback.js b/frontend/src/pages/Feedback.js index 1dff9912..48201e39 100644 --- a/frontend/src/pages/Feedback.js +++ b/frontend/src/pages/Feedback.js @@ -9,28 +9,28 @@ export function renderFeedback(container) {
- +
- ${renderRatingInputs('overall-experience', 5)} + ${renderRatingInputs('overallExperience', 5)}
- +
${renderCheckboxes([ - { id: 'feature-vocabulary', value: 'vocabulary', label: 'Vocabulary Exercises' }, - { id: 'feature-grammar', value: 'grammar', label: 'Grammar Lessons' }, - { id: 'feature-pronunciation', value: 'pronunciation', label: 'Pronunciation Practice' }, - { id: 'feature-reading', value: 'reading', label: 'Reading Comprehension' }, - { id: 'feature-listening', value: 'listening', label: 'Listening Exercises' } - ])} + { id: 'feature-vocabulary', value: 'vocabulary', label: 'Vocabulary Exercises' }, + { id: 'feature-grammar', value: 'grammar', label: 'Grammar Lessons' }, + { id: 'feature-pronunciation', value: 'pronunciation', label: 'Pronunciation Practice' }, + { id: 'feature-reading', value: 'reading', label: 'Reading Comprehension' }, + { id: 'feature-listening', value: 'listening', label: 'Listening Exercises' } + ])}
- - @@ -41,16 +41,16 @@ export function renderFeedback(container) {
${renderTextarea('improvement', 'What aspect of WordWise do you think needs the most improvement?')} - ${renderTextarea('new-features', 'Are there any new features you\'d like to see added to WordWise?')} + ${renderTextarea('newFeatures', 'Are there any new features you\'d like to see added to WordWise?')}
- +
- ${renderRatingInputs('recommend', 5)} + ${renderRatingInputs('recommendation', 5)}
- ${renderTextarea('additional-comments', 'Do you have any additional comments or suggestions?', 4)} + ${renderTextarea('additionalComments', 'Do you have any additional comments or suggestions?', 4)}
`; - // Form submission - document.getElementById('feedbackForm').addEventListener('submit', function(e) { + document.getElementById('feedbackForm').addEventListener('submit', async function (e) { e.preventDefault(); - // Here you would typically send the form data to your server - // For this example, we'll just show a success message - document.getElementById('formSuccess').classList.remove('hidden'); - this.reset(); - // Scroll to the success message - document.getElementById('formSuccess').scrollIntoView({ behavior: 'smooth' }); + + const formData = new FormData(this); + const data = {}; + + formData.forEach((value, key) => { + if (key === 'features-used') { + if (!data.featuresUsed) { + data.featuresUsed = []; + } + data.featuresUsed.push(value); + } else { + data[key] = ['overallExperience', 'recommendation'].includes(key) ? parseInt(value, 10) : value; + } + }); + + console.log(data); + + try { + const response = await fetch('http://localhost:5000/api/feedback/saveFeedback', { + method: 'POST', + headers: { + 'Content-Type': 'application/json' + }, + body: JSON.stringify(data) + }); + + if (response.ok) { + console.log("Form submitted successfully:", await response.json()); + document.getElementById('formSuccess').classList.remove('hidden'); + this.reset(); + document.getElementById('formSuccess').scrollIntoView({ behavior: 'smooth' }); + } else { + const errorData = await response.json(); + console.error("Error submitting form:", errorData); + } + } catch (error) { + console.error("Error submitting form:", error); + } }); }