import pageData from "~/data/employee-engagement-survey.json"; import { toast } from "sonner"; export function SurveyForm() { const { data, updateData } = useData(pageData); const [currentSection, setCurrentSection] = React.useState(0); const [responses, setResponses] = React.useState(data.responses || {}); const [isSubmitted, setIsSubmitted] = React.useState(data.isSubmitted || false); const sections = [ { title: "Remote Work Satisfaction", questions: [ { id: "remote_satisfaction", text: "How satisfied are you with your remote work setup?", type: "scale", scale: 5 }, { id: "work_life_balance", text: "How well are you able to maintain work-life balance while working remotely?", type: "scale", scale: 5 }, { id: "remote_tools", text: "How effective are the digital tools and platforms provided for remote work?", type: "scale", scale: 5 }, { id: "remote_challenges", text: "What are your biggest challenges with remote work? (Select all that apply)", type: "multiple", options: ["Isolation/Loneliness", "Distractions at home", "Technical issues", "Communication delays", "Meeting fatigue", "Other"] } ] }, { title: "Team Communication", questions: [ { id: "communication_clarity", text: "How clear and effective is communication within your team?", type: "scale", scale: 5 }, { id: "meeting_frequency", text: "Are team meetings held at an appropriate frequency?", type: "radio", options: ["Too frequent", "Just right", "Not frequent enough"] }, { id: "async_communication", text: "How satisfied are you with asynchronous communication tools (Slack, email, etc.)?", type: "scale", scale: 5 }, { id: "team_collaboration", text: "How would you rate collaboration within your team?", type: "scale", scale: 5 } ] }, { title: "Manager Support", questions: [ { id: "manager_support", text: "How supportive is your direct manager?", type: "scale", scale: 5 }, { id: "feedback_frequency", text: "How often do you receive constructive feedback from your manager?", type: "radio", options: ["Weekly", "Bi-weekly", "Monthly", "Quarterly", "Rarely", "Never"] }, { id: "manager_availability", text: "How available is your manager when you need guidance or support?", type: "scale", scale: 5 }, { id: "recognition", text: "How well does your manager recognize your contributions and achievements?", type: "scale", scale: 5 } ] }, { title: "Career Growth Opportunities", questions: [ { id: "growth_satisfaction", text: "How satisfied are you with career growth opportunities at the company?", type: "scale", scale: 5 }, { id: "skill_development", text: "How well does the company support your professional skill development?", type: "scale", scale: 5 }, { id: "learning_resources", text: "Which learning and development resources would be most valuable to you? (Select all that apply)", type: "multiple", options: ["Online courses", "Conference attendance", "Mentorship programs", "Internal training", "Certification support", "Cross-team projects"] }, { id: "promotion_clarity", text: "How clear are the promotion criteria and career advancement paths?", type: "scale", scale: 5 } ] } ]; const handleResponseChange = (questionId, value) => { const newResponses = { ...responses, [questionId]: value }; setResponses(newResponses); updateData({ ...data, responses: newResponses }); }; const handleMultipleChoice = (questionId, option) => { const currentValues = responses[questionId] || []; const newValues = currentValues.includes(option) ? currentValues.filter(v => v !== option) : [...currentValues, option]; handleResponseChange(questionId, newValues); }; const nextSection = () => { if (currentSection < sections.length - 1) { setCurrentSection(currentSection + 1); } }; const prevSection = () => { if (currentSection > 0) { setCurrentSection(currentSection - 1); } }; const submitSurvey = () => { setIsSubmitted(true); updateData({ ...data, responses, isSubmitted: true, submittedAt: new Date().toISOString() }); toast("Survey submitted successfully! Thank you for your feedback."); }; const resetSurvey = () => { setIsSubmitted(false); setResponses({}); setCurrentSection(0); updateData({ responses: {}, isSubmitted: false }); }; if (isSubmitted) { return (

Survey Completed

Thank You!

Your feedback has been submitted and will help us improve the workplace experience.

); } const currentSectionData = sections[currentSection]; const progress = ((currentSection + 1) / sections.length) * 100; return (

Employee Engagement Survey {currentSection + 1} of {sections.length}

{currentSectionData.title}

{currentSectionData.questions.map((question) => (

{question.text} {question.type === "scale" && (

1 handleResponseChange(question.id, value[0])} max={question.scale} min={1} step={1} className="flex-1" /> {question.scale} {responses[question.id] || 1}

)} {question.type === "radio" && ( handleResponseChange(question.id, value)} > {question.options.map((option) => (

{option}

))} )} {question.type === "multiple" && (

{question.options.map((option) => (

handleMultipleChoice(question.id, option)} /> {option}

))}

)}

))}

{currentSection === sections.length - 1 ? ( ) : ( )} ); }