From be4e6070c639c7f8b218986672a37870079b8c63 Mon Sep 17 00:00:00 2001
From: sudeepmi <sudeepm0599@gmail.com>
Date: Mon, 19 Sep 2022 00:05:28 +0545
Subject: [PATCH 1/3] dynamic question inputs

---
 .../Dashboard/components/NewQuestionaires.jsx | 71 +++++++++----------
 1 file changed, 33 insertions(+), 38 deletions(-)

diff --git a/admin/src/pages/Dashboard/components/NewQuestionaires.jsx b/admin/src/pages/Dashboard/components/NewQuestionaires.jsx
index 53f79cf..7fcdb8e 100644
--- a/admin/src/pages/Dashboard/components/NewQuestionaires.jsx
+++ b/admin/src/pages/Dashboard/components/NewQuestionaires.jsx
@@ -28,7 +28,13 @@ function NewQuestionaires({ setisHome, setAction,getQuestions }) {
     const getFixtures = () => {
         axios
             .get(`${import.meta.env.VITE_SERVER_URI}api/fixture/get-fixtures`)
-            .then((res) => setFixturesItems(res.data?.fixtures))
+            .then((res) => {
+                setFixturesItems(res.data?.fixtures)
+                setnewQuestionaires({
+                    ...newQuestionaires,
+                    fixtureId:res.data?.fixtures[0]._id
+                })
+            })
             .catch((err) => console.error(err));
     }
 
@@ -40,9 +46,9 @@ function NewQuestionaires({ setisHome, setAction,getQuestions }) {
     const handleResetInputs = () =>{
         setnewQuestionaires({
             fixtureId:"",
-            questionaireType:"",
+            questionaireType:3,
             questionairePrice:"",
-            poolType:"",
+            poolType:"duo",
             questionaires:[
                 { question:""},
                 { question:""},
@@ -71,6 +77,21 @@ function NewQuestionaires({ setisHome, setAction,getQuestions }) {
         })
         .catch((err) => console.error(err));
     }
+
+    const Inputs = ()=>{
+        const temp =[];
+        for (let index = 0; index < newQuestionaires.questionaireType; index++) {
+           temp.push(<input 
+            type="text" 
+            placeholder={"Question "+(index+1)} 
+            value={newQuestionaires.questionaires[index].question}
+            onChange={
+                e=>handleQuestion(index,e.target.value)
+            } />)
+        }
+        return temp;
+    }
+
     
     return (
         <div className='newQuestionaires__container'>
@@ -88,12 +109,14 @@ function NewQuestionaires({ setisHome, setAction,getQuestions }) {
                     value={newQuestionaires.questionairePrice}
                     onChange={e=>setnewQuestionaires({...newQuestionaires,questionairePrice:e.target.value})}
                 />
-                <input 
-                    type="number" 
-                    placeholder='Questionaire Type' 
-                    value={newQuestionaires.questionaireType} 
-                    onChange={e=>setnewQuestionaires({...newQuestionaires,questionaireType:e.target.value})}
-                />
+    
+                <select 
+                onChange={e=>setnewQuestionaires({...newQuestionaires,questionaireType:e.target.value})}
+                value={newQuestionaires.questionaireType} 
+                >
+                    <option value="3">3</option>
+                    <option value="4">4</option>
+                </select>
                 <select 
                     value={newQuestionaires.poolType}
                     onChange={e=>setnewQuestionaires({...newQuestionaires,poolType:e.target.value})}
@@ -101,35 +124,7 @@ function NewQuestionaires({ setisHome, setAction,getQuestions }) {
                     <option value="duo">Duo</option>
                     <option value="trio">Trio</option>
                 </select>
-                    <input 
-                        type="text" 
-                        placeholder={"Question 1"} 
-                        value={newQuestionaires.questionaires[0].question}
-                        onChange={
-                            e=>handleQuestion(0,e.target.value)
-                        }
-                        />
-                    <input 
-                        type="text" 
-                        placeholder={"Question 2"} 
-                        value={newQuestionaires.questionaires[1].question}
-                        onChange={
-                            e=>handleQuestion(1,e.target.value)
-                        } />
-                    <input 
-                        type="text" 
-                        placeholder={"Question 3"} 
-                        value={newQuestionaires.questionaires[2].question} 
-                        onChange={
-                            e=>handleQuestion(2,e.target.value)
-                        }/>
-                    <input 
-                        type="text" 
-                        placeholder={"Question 4"} 
-                        value={newQuestionaires.questionaires[3].question}
-                        onChange={
-                            e=>handleQuestion(3,e.target.value)
-                        } />
+                <Inputs />
                 {/* <Button onClick={()=>addField()}>Add More Question</Button> */}
                 <div className="buttons">
                     <Button type="submit">Submit</Button>

From b8c433b1fdab461b69548b5ec173db09d53e48ca Mon Sep 17 00:00:00 2001
From: sudeepmi <sudeepm0599@gmail.com>
Date: Mon, 19 Sep 2022 00:37:08 +0545
Subject: [PATCH 2/3] dynamic question inputs

---
 .../Dashboard/components/NewQuestionaires.jsx | 62 +++++++++----------
 1 file changed, 31 insertions(+), 31 deletions(-)

diff --git a/admin/src/pages/Dashboard/components/NewQuestionaires.jsx b/admin/src/pages/Dashboard/components/NewQuestionaires.jsx
index 7fcdb8e..81ffbee 100644
--- a/admin/src/pages/Dashboard/components/NewQuestionaires.jsx
+++ b/admin/src/pages/Dashboard/components/NewQuestionaires.jsx
@@ -5,17 +5,13 @@ import React, { useState } from 'react'
 function NewQuestionaires({ setisHome, setAction,getQuestions }) {
 
     const [FixturesItems, setFixturesItems] = React.useState([])
+    const [noInputs, setnoInputs] = React.useState([]);
     const [newQuestionaires, setnewQuestionaires] = React.useState({
         fixtureId:"",
-        questionaireType:"",
+        questionaireType:3,
         questionairePrice:"",
-        poolType:"",
-        questionaires:[
-            { question:""},
-            { question:""},
-            { question:""},
-            { question:""}
-        ]
+        poolType:"unlimited",
+        questionaires:[]
     })
    
 
@@ -48,13 +44,8 @@ function NewQuestionaires({ setisHome, setAction,getQuestions }) {
             fixtureId:"",
             questionaireType:3,
             questionairePrice:"",
-            poolType:"duo",
-            questionaires:[
-                { question:""},
-                { question:""},
-                { question:""},
-                { question:""}
-            ]
+            poolType:"unlimited",
+            questionaires:[]
         })
     }
     const handleQuestion = (index,value)=>{
@@ -78,19 +69,17 @@ function NewQuestionaires({ setisHome, setAction,getQuestions }) {
         .catch((err) => console.error(err));
     }
 
-    const Inputs = ()=>{
-        const temp =[];
-        for (let index = 0; index < newQuestionaires.questionaireType; index++) {
-           temp.push(<input 
-            type="text" 
-            placeholder={"Question "+(index+1)} 
-            value={newQuestionaires.questionaires[index].question}
-            onChange={
-                e=>handleQuestion(index,e.target.value)
-            } />)
-        }
-        return temp;
-    }
+  
+    React.useEffect(() => {
+        let arr = []
+      for (let index = 1; index <=newQuestionaires.questionaireType; index++) {
+            arr.push(index);
+      }
+      setnoInputs(arr);
+    }, [newQuestionaires.questionaireType])
+    
+
+
 
     
     return (
@@ -117,15 +106,26 @@ function NewQuestionaires({ setisHome, setAction,getQuestions }) {
                     <option value="3">3</option>
                     <option value="4">4</option>
                 </select>
-                <select 
+                <select
                     value={newQuestionaires.poolType}
                     onChange={e=>setnewQuestionaires({...newQuestionaires,poolType:e.target.value})}
                     >
+                    <option value="unlimited">Unlimited</option>
                     <option value="duo">Duo</option>
                     <option value="trio">Trio</option>
+                    <option value="nonet">Nonet</option>
                 </select>
-                <Inputs />
-                {/* <Button onClick={()=>addField()}>Add More Question</Button> */}
+                {
+                     noInputs.map((i,index)=>
+                     <input 
+                     type="text" 
+                     key={index}
+                     placeholder={"Question "+(index+1)} 
+                     value={newQuestionaires.questionaires[index]?.question || ""}
+                     onChange={
+                         e=>handleQuestion(index,e.target.value)
+                     } />)
+                }
                 <div className="buttons">
                     <Button type="submit">Submit</Button>
                     <Button onClick={() => handleResetInputs()}>Reset</Button>

From 83de32430126bd8960cb84a419487b74d91e0103 Mon Sep 17 00:00:00 2001
From: sudeepmi <sudeepm0599@gmail.com>
Date: Mon, 19 Sep 2022 00:38:59 +0545
Subject: [PATCH 3/3] dynamic question inputs tested successfully

---
 .../Dashboard/components/NewQuestionaires.jsx | 108 +++++++++---------
 1 file changed, 51 insertions(+), 57 deletions(-)

diff --git a/admin/src/pages/Dashboard/components/NewQuestionaires.jsx b/admin/src/pages/Dashboard/components/NewQuestionaires.jsx
index 81ffbee..2210003 100644
--- a/admin/src/pages/Dashboard/components/NewQuestionaires.jsx
+++ b/admin/src/pages/Dashboard/components/NewQuestionaires.jsx
@@ -2,19 +2,17 @@ import { Button } from '@mui/material'
 import axios from 'axios';
 import React, { useState } from 'react'
 
-function NewQuestionaires({ setisHome, setAction,getQuestions }) {
+function NewQuestionaires({ setisHome, setAction, getQuestions }) {
 
     const [FixturesItems, setFixturesItems] = React.useState([])
     const [noInputs, setnoInputs] = React.useState([]);
     const [newQuestionaires, setnewQuestionaires] = React.useState({
-        fixtureId:"",
-        questionaireType:3,
-        questionairePrice:"",
-        poolType:"unlimited",
-        questionaires:[]
+        fixtureId: "",
+        questionaireType: 3,
+        questionairePrice: "",
+        poolType: "unlimited",
+        questionaires: []
     })
-   
-
     const handleBack = () => {
         setisHome(true);
         setAction("");
@@ -28,7 +26,7 @@ function NewQuestionaires({ setisHome, setAction,getQuestions }) {
                 setFixturesItems(res.data?.fixtures)
                 setnewQuestionaires({
                     ...newQuestionaires,
-                    fixtureId:res.data?.fixtures[0]._id
+                    fixtureId: res.data?.fixtures[0]._id
                 })
             })
             .catch((err) => console.error(err));
@@ -38,93 +36,89 @@ function NewQuestionaires({ setisHome, setAction,getQuestions }) {
         getFixtures();
     }, []);
 
-   
-    const handleResetInputs = () =>{
+
+    const handleResetInputs = () => {
         setnewQuestionaires({
-            fixtureId:"",
-            questionaireType:3,
-            questionairePrice:"",
-            poolType:"unlimited",
-            questionaires:[]
+            fixtureId: "",
+            questionaireType: 3,
+            questionairePrice: "",
+            poolType: "unlimited",
+            questionaires: []
         })
     }
-    const handleQuestion = (index,value)=>{
+    const handleQuestion = (index, value) => {
         const ques = newQuestionaires.questionaires;
-        ques[index] = {question: value};
+        ques[index] = { question: value };
         setnewQuestionaires({
             ...newQuestionaires,
-            questionaires:ques
+            questionaires: ques
         })
     }
 
     const handleNewQuestionaire = (e) => {
         e.preventDefault()
         axios
-        .post(`${import.meta.env.VITE_SERVER_URI}api/questionaire/new-questionaire`,newQuestionaires)
-        .then((res) => {
-            if(res.status===200){
-               handleBack();
-            }
-        })
-        .catch((err) => console.error(err));
+            .post(`${import.meta.env.VITE_SERVER_URI}api/questionaire/new-questionaire`, newQuestionaires)
+            .then((res) => {
+                if (res.status === 200) {
+                    handleBack();
+                }
+            })
+            .catch((err) => console.error(err));
     }
 
-  
+
     React.useEffect(() => {
         let arr = []
-      for (let index = 1; index <=newQuestionaires.questionaireType; index++) {
+        for (let index = 1; index <= newQuestionaires.questionaireType; index++) {
             arr.push(index);
-      }
-      setnoInputs(arr);
+        }
+        setnoInputs(arr);
     }, [newQuestionaires.questionaireType])
-    
-
 
-
-    
     return (
         <div className='newQuestionaires__container'>
             <Button onClick={() => handleBack()} >BACK</Button>
             <form onSubmit={handleNewQuestionaire}>
                 <h3>New Questionaires</h3>
-                <select 
-                    value={newQuestionaires.fixtureId} 
-                    onChange={e=>setnewQuestionaires({...newQuestionaires,fixtureId:e.target.value})}>
-                    {FixturesItems.map((fixtures,key)=>
-                    <option value={fixtures._id} key={key}>{fixtures.HomeTeam} vs {fixtures.AwayTeam}</option>)}
+                <select
+                    value={newQuestionaires.fixtureId}
+                    onChange={e => setnewQuestionaires({ ...newQuestionaires, fixtureId: e.target.value })}>
+                    {FixturesItems.map((fixtures, key) =>
+                        <option value={fixtures._id} key={key}>{fixtures.HomeTeam} vs {fixtures.AwayTeam}</option>)}
                 </select>
-                <input type="number" 
-                    placeholder='Questionaire Price' 
+                <input type="number"
+                    placeholder='Questionaire Price'
                     value={newQuestionaires.questionairePrice}
-                    onChange={e=>setnewQuestionaires({...newQuestionaires,questionairePrice:e.target.value})}
+                    onChange={e => setnewQuestionaires({ ...newQuestionaires, questionairePrice: e.target.value })}
                 />
-    
-                <select 
-                onChange={e=>setnewQuestionaires({...newQuestionaires,questionaireType:e.target.value})}
-                value={newQuestionaires.questionaireType} 
+
+                <select
+                    onChange={e => setnewQuestionaires({ ...newQuestionaires, questionaireType: e.target.value })}
+                    value={newQuestionaires.questionaireType}
                 >
                     <option value="3">3</option>
                     <option value="4">4</option>
                 </select>
                 <select
                     value={newQuestionaires.poolType}
-                    onChange={e=>setnewQuestionaires({...newQuestionaires,poolType:e.target.value})}
-                    >
+                    onChange={e => setnewQuestionaires({ ...newQuestionaires, poolType: e.target.value })}
+                >
                     <option value="unlimited">Unlimited</option>
                     <option value="duo">Duo</option>
                     <option value="trio">Trio</option>
                     <option value="nonet">Nonet</option>
                 </select>
                 {
-                     noInputs.map((i,index)=>
-                     <input 
-                     type="text" 
-                     key={index}
-                     placeholder={"Question "+(index+1)} 
-                     value={newQuestionaires.questionaires[index]?.question || ""}
-                     onChange={
-                         e=>handleQuestion(index,e.target.value)
-                     } />)
+                    noInputs.map((i, index) =>
+                        <input
+                            type="text"
+                            key={index}
+                            placeholder={"Question " + (index + 1)}
+                            value={newQuestionaires.questionaires[index]?.question || ""}
+                            onChange={
+                                e => handleQuestion(index, e.target.value)
+                            } />)
                 }
                 <div className="buttons">
                     <Button type="submit">Submit</Button>