From b9eda94b20d64f4f80bc364f6249b50ef337cdb5 Mon Sep 17 00:00:00 2001 From: Sumit Dutta Date: Tue, 11 Jul 2023 00:36:13 +0530 Subject: [PATCH 01/10] Add files via upload --- components/AddTask.js | 29 +++++++++++++++ components/LoginForm.js | 50 +++++++++++++++++++++++++- components/Nav.js | 5 ++- components/TodoListItem.js | 63 ++++++++++++++++++++++++++------- context/auth.js | 1 + middlewares/auth_required.js | 19 ++++++++++ middlewares/no_auth_required.js | 17 +++++++++ pages/index.js | 26 +++++++++++++- 8 files changed, 195 insertions(+), 15 deletions(-) diff --git a/components/AddTask.js b/components/AddTask.js index 8b8177f..2a688eb 100644 --- a/components/AddTask.js +++ b/components/AddTask.js @@ -1,10 +1,37 @@ +import { useState } from "react"; +import { useAuth } from "../context/auth"; +import { API_URL } from '../utils/constants' +import axios from "../utils/axios"; + export default function AddTask() { + + const [task,setTask] = useState(""); + const { token } = useAuth(); + const addTask = () => { /** * @todo Complete this function. * @todo 1. Send the request to add the task to the backend server. * @todo 2. Add the task in the dom. */ + if(task.length===0) console.log("Enter a task") + else{ + axios({ + headers:{ + Authorization:'Token '+token + }, + url:API_URL + 'todo/create/', + method:'POST', + data:{ + title: task + } + }).then(({data,status}) =>{ + setTask(""); + console.log("Task successfully Added") + }).catch((err)=>{ + console.log("Task not Added") + }) + } }; return ( @@ -13,6 +40,8 @@ export default function AddTask() { type="text" className="todo-add-task-input px-4 py-2 placeholder-blueGray-300 text-blueGray-600 bg-white rounded text-sm border border-blueGray-300 outline-none focus:outline-none focus:ring w-full" placeholder="Enter Task" + value={task} + onChange={(e)=>{setTask(e.target.value)}} /> -
- Sample Task 1 +
+ {props.title}
- + - - } -
+
+ {token && <> + + + }
+ + } ); diff --git a/components/RegisterForm.js b/components/RegisterForm.js index 0b9425c..bbdf564 100644 --- a/components/RegisterForm.js +++ b/components/RegisterForm.js @@ -43,6 +43,7 @@ export default function Register() { .then(function ({ data, status }) { setToken(data.token); router.push("/") + router.reload() }) .catch(function (err) { console.log("An account using same email or username is already created"); diff --git a/middlewares/auth_required.js b/middlewares/auth_required.js index d4a62b0..38855ef 100644 --- a/middlewares/auth_required.js +++ b/middlewares/auth_required.js @@ -14,7 +14,7 @@ export default function auth_required() { useEffect(()=>{ if(token === undefined || token === null){ - router.replace('/login') + router.push('/login') } },[token]) diff --git a/pages/_app.js b/pages/_app.js index a58a1f5..3ddfa44 100644 --- a/pages/_app.js +++ b/pages/_app.js @@ -2,6 +2,7 @@ import "../styles/globals.css"; import { AuthProvider } from "../context/auth"; import Nav from "../components/Nav"; + function MyApp({ Component, pageProps }) { return ( diff --git a/pages/index.js b/pages/index.js index b3021f4..4128db7 100644 --- a/pages/index.js +++ b/pages/index.js @@ -5,14 +5,12 @@ import { useRouter } from "next/router"; import axios from "../utils/axios"; import { useAuth } from "../context/auth"; import { API_URL } from '../utils/constants'; -import auth_required from "../middlewares/auth_required"; export default function Home() { const { token } = useAuth(); const [tasks, setTasks] = useState([]); - - auth_required() + const router = useRouter() function getTasks() { /*** @@ -34,7 +32,9 @@ export default function Home() { }) } - useEffect(()=>{getTasks()},[tasks]) + useEffect(()=>{ + getTasks() + },[tasks]) return (
From 04618f38489d5fe868fd8a364276fa9cdc6ed78a Mon Sep 17 00:00:00 2001 From: Sumit Dutta Date: Tue, 11 Jul 2023 14:00:04 +0530 Subject: [PATCH 07/10] Add files via upload --- components/LoginForm.js | 12 +++++++++--- components/RegisterForm.js | 13 +++++++++---- pages/_app.js | 14 ++++++++++---- 3 files changed, 28 insertions(+), 11 deletions(-) diff --git a/components/LoginForm.js b/components/LoginForm.js index 06d5d8e..5edc762 100644 --- a/components/LoginForm.js +++ b/components/LoginForm.js @@ -1,7 +1,13 @@ +'use client' + import { useState } from "react"; import {useRouter} from "next/router"; import { useAuth } from "../context/auth"; -import axios from "../utils/axios"; +import axios from "../utils/axios"; +import { toast } from 'react-toastify'; + + import 'react-toastify/dist/ReactToastify.css'; + export default function RegisterForm() { @@ -43,10 +49,10 @@ export default function RegisterForm() { .then(({ data,status})=>{ setToken(data.token) router.push("/") - router.reload() + router.reload(); }) .catch(function (err) { - console.log("Enter Correct Username and Password"); + toast.error("Enter Correct Username and Password"); }); } diff --git a/components/RegisterForm.js b/components/RegisterForm.js index bbdf564..f143970 100644 --- a/components/RegisterForm.js +++ b/components/RegisterForm.js @@ -1,7 +1,12 @@ +'use client' + import React, { useState } from "react"; import axios from "../utils/axios"; import { useAuth } from "../context/auth"; import { useRouter } from "next/router"; +import { toast } from 'react-toastify'; + + import 'react-toastify/dist/ReactToastify.css'; export default function Register() { const { setToken } = useAuth(); @@ -15,11 +20,11 @@ export default function Register() { const registerFieldsAreValid = (firstName, lastName, email, username, password) => { if (firstName === "" || lastName === "" || email === "" || username === "" || password === "") { - console.log("Please fill all the fields correctly."); + toast.error("Please fill all the fields correctly."); return false; } if (!/^\w+([\.-]?\w+)*@\w+([\.-]?\w+)*(\.\w{2,3})+$/.test(email)) { - console.log("Please enter a valid email address."); + toast.error("Please enter a valid email address."); return false; } return true; @@ -40,13 +45,13 @@ export default function Register() { axios .post("auth/register/", dataForApiRequest) - .then(function ({ data, status }) { + .then(function ({ data, status }){ setToken(data.token); router.push("/") router.reload() }) .catch(function (err) { - console.log("An account using same email or username is already created"); + toast.error("Username and Password already exists!") }); } }; diff --git a/pages/_app.js b/pages/_app.js index 3ddfa44..30ff92e 100644 --- a/pages/_app.js +++ b/pages/_app.js @@ -1,14 +1,20 @@ +'use client' + import "../styles/globals.css"; import { AuthProvider } from "../context/auth"; import Nav from "../components/Nav"; +import { ToastContainer } from "react-toastify"; function MyApp({ Component, pageProps }) { return ( - -