updatedTodo

Author: yogivalecha9898

src/components/signUp.jsx

@@ -3,7 +3,7 @@ import { db } from './firebase'
 
 function SignUp() {
 
-    // const[arr] = useState(['Sunday','Monday','Tuesday','Wednesday','Thursday','Friday','Saturday',])
+    const[arr] = useState(['Sunday','Monday','Tuesday','Wednesday','Thursday','Friday','Saturday',])
 
     // useEffect(() => {
     //     const obj = {
@@ -12,7 +12,8 @@ function SignUp() {
     //         Day: "",
     //         Id: "",
     //         status: false,
-    //         RemindMe: ""
+    //         RemindMe: "",
+    //         CreatedAt: "",
     //     }
 
     //     arr.forEach(day => {
@@ -26,7 +27,7 @@ function SignUp() {
     //             })
     //         }
     //     })
-    // })
+    // }, [])
 
     return (
         <div>hello</div>

src/components/todo.jsx

@@ -1,6 +1,6 @@
-import { useState } from "react"
+import { useEffect, useState } from "react"
 import { db } from './firebase'
-// import SignUp from './signUp'
+import SignUp from './signUp'
 
 function Todo() {
 
@@ -10,6 +10,44 @@ function Todo() {
     const[dis, setDis] = useState('')
     const[day, setDay] = useState('')
     const[time, setTime] = useState('')
+    const[tod, setTod] = useState([]) //tod = today's list
+    const[yesRem, setYRem] = useState([]) //yesRem = yesterday's remaining
+    const[tom, setTom] = useState([]) //tomorrow's list
+    const[cur, setCur] = useState({})
+
+    useEffect(() => {
+        let yesIdx = ((idx-1)%arr.length + arr.length)%arr.length
+        db.collection('user').doc(`${arr[yesIdx]}`).collection('tasks').get()
+        .then(doc => {
+            let yArr = []
+            doc.forEach(document => {
+                if(!document.data().status) yArr.push(document.data())
+            })
+            setYRem(yArr)
+        })
+        .catch(err => alert(err))
+
+        let todIdx = idx
+        db.collection('user').doc(`${arr[todIdx]}`).collection('tasks').get()
+        .then(doc => {
+            let todArr = []
+            doc.forEach(document => {
+                todArr.push(document.data())
+            })
+            setTod(todArr)
+        })
+        .catch(err => alert(err))
+
+        let tomIdx = (idx+1)%arr.length
+        db.collection('user').doc(`${arr[tomIdx]}`).collection('tasks').get()
+        .then(doc => {
+            let tomArr = []
+            doc.forEach(document => {
+                tomArr.push(document.data())
+            })
+            setTom(tomArr)
+        })
+    }, [cur])
 
     const handleChange = (e)=> {
         e.preventDefault()
@@ -19,15 +57,17 @@ function Todo() {
             EventDisc: "",
             Day: "",
             status: false,
-            RemindMe: ""
+            RemindMe: "",
+            CreatedAt: ""
         }
 
         const obj2 = {
             EventName: name,
             EventDisc: dis,
             Day: day,
             status: false,
-            RemindMe: time
+            RemindMe: time,
+            CreatedAt: new Date().getTime()
         }
 
         let yesIdx = ((idx-2)%arr.length + arr.length)%arr.length
@@ -54,11 +94,14 @@ function Todo() {
                             docRef.doc(`${el.id}`).update(obj2)
                         }
                     })
+                    setCur(obj2)
                     if(flag === 0) alert("Only 4 todos are to be done in a day")
+                    else docRef.orderBy("CreatedAt", "asc")
                 })
             })
         })
 
+
         const form = document.getElementById('form')
         form.reset()
     }
@@ -81,14 +124,14 @@ function Todo() {
                         name="day" 
                         value={arr[idx%arr.length]} 
                         onClick={e => setDay(arr[idx%arr.length])}
-                    />{arr[idx%arr.length]}
+                    />Today ({arr[idx]})
 
                     <input 
                         type="radio" 
                         name="day" 
                         value={arr[(idx+1)%arr.length]} 
                         onClick={e => setDay(arr[(idx+1)%arr.length])}
-                    />{arr[(idx+1)%arr.length]}
+                    />Tomorrow ({arr[(idx+1)%arr.length]})
                 </div>
                 <div>
                     <label>Remind me at</label>
@@ -102,8 +145,22 @@ function Todo() {
                     <input type="submit" value="Submit"/>
                 </div>
             </form>
+
+            <div>
+                {yesRem.map(val => (<div>{JSON.stringify(val)}</div>))}
+            </div>
+            <br />
+            <br />
+            <div>
+                {tod.map(val => (<div>{JSON.stringify(val)}</div>))}
+            </div>
+            <br />
+            <br />
+            <div>
+                {tom.map(val => (<div>{JSON.stringify(val)}</div>))}
+            </div>
+            {/* <SignUp /> */}
         </div>
-        // <SignUp />
     )
 }