From 41c1894a50678c3f15cfa29cb31844efc4e7cb71 Mon Sep 17 00:00:00 2001 From: amyra98 Date: Mon, 27 Jun 2022 22:33:40 +0530 Subject: [PATCH] To Do React app --- components/AddTask.js | 43 +- components/LoginForm.js | 40 +- components/Nav.js | 88 +- components/RegisterForm.js | 50 +- components/TodoListItem.js | 61 +- context/auth.js | 4 +- middlewares/auth_required.js | 16 + middlewares/no_auth_required.js | 15 +- package-lock.json | 10186 ++++++++++++++++++++++++++++++ package.json | 1 + pages/_app.js | 4 + pages/index.js | 33 +- pages/login.js | 3 +- tailwind.config.js | 6 +- yarn.lock | 12 + 15 files changed, 10476 insertions(+), 86 deletions(-) create mode 100644 package-lock.json diff --git a/components/AddTask.js b/components/AddTask.js index 9652adb..62aec3a 100644 --- a/components/AddTask.js +++ b/components/AddTask.js @@ -1,21 +1,58 @@ +import axios from "axios" +import { useState } from "react" +import { useAuth } from "../context/auth" +import { API_URL } from "../utils/constants" +import {toast} from 'react-toastify' +import 'react-toastify/dist/ReactToastify.css' + + export default function AddTask() { + const [task, setTask] = useState("") + const {token, theme} = 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){ + toast.warn("Write some task") + } + else{ + axios({ + headers : {Authorization : "Token "+token}, + url : API_URL + 'todo/', + method : 'get', + + }).then((res)=>{ + const {data,status}=res + const apiData = {id : data.length, title : task} + axios({ + headers : {Authorization : "Token "+token}, + url : API_URL + 'todo/create/', + method: "post", + data : apiData + }).then( + toast.success("Task added"), + setTask('') + ).catch((error)=> + toast.notify("Task couldn't be added",{type: "error"}) + ) + }) + } } return (
{setTask(e.target.value)}} /> - + + + + + + )} +
- + + ) } + diff --git a/components/RegisterForm.js b/components/RegisterForm.js index a6ef2e3..5fde890 100644 --- a/components/RegisterForm.js +++ b/components/RegisterForm.js @@ -2,9 +2,13 @@ import React, { useState } from 'react' import axios from '../utils/axios' import { useAuth } from '../context/auth' import { useRouter } from 'next/router' +import { no_auth_required } from '../middlewares/no_auth_required' +import {toast} from 'react-toastify' +import 'react-toastify/dist/ReactToastify.css' export default function Register() { - const { setToken } = useAuth() + no_auth_required() + const { setToken} = useAuth() const router = useRouter() const [firstName, setFirstName] = useState('') @@ -12,6 +16,7 @@ export default function Register() { const [email, setEmail] = useState('') const [password, setPassword] = useState('') const [username, setUsername] = useState('') + const [confpass, setConfPass] = useState("") const registerFieldsAreValid = ( firstName, @@ -27,11 +32,12 @@ export default function Register() { username === '' || password === '' ) { - console.log('Please fill all the fields correctly.') + + toast.warn("Please fill the field correctly") return false } if (!/^\w+([\.-]?\w+)*@\w+([\.-]?\w+)*(\.\w{2,3})+$/.test(email)) { - console.log('Please enter a valid email address.') + toast.warn("Invalid email address") return false } return true @@ -43,8 +49,8 @@ export default function Register() { if ( registerFieldsAreValid(firstName, lastName, email, username, password) ) { - console.log('Please wait...') - + if(confpass===password){ + toast.info("Wait..!!") const dataForApiRequest = { name: firstName + ' ' + lastName, email: email, @@ -58,24 +64,27 @@ export default function Register() { ) .then(function ({ data, status }) { setToken(data.token) - router.push('/') + router.reload() + toast.info("Wait..!!") }) .catch(function (err) { - console.log( - 'An account using same email or username is already created' - ) + toast.error("Email or Username already exists") }) } + else{ + toast.error("Passwords dont match!!!") + } + } } return (
-
+

Register

setPassword(e.target.value)} placeholder='Password' /> + {setConfPass(e.target.value)}} + />
-
- Sample Task 1 +
+ {props.title}
- +