diff --git a/.eslintrc b/.eslintrc index a2ceebe..0b5b69d 100644 --- a/.eslintrc +++ b/.eslintrc @@ -1,3 +1,6 @@ { - "extends": ["next/babel", "next/core-web-vitals"] + "extends": [ + "next", + "next/core-web-vitals" + ] } diff --git a/components/AddTask.js b/components/AddTask.js index 9652adb..b3623b2 100644 --- a/components/AddTask.js +++ b/components/AddTask.js @@ -1,17 +1,53 @@ +import React, { useState} from 'react' +import axios from '../utils/axios' +import { useAuth } from "../context/auth" +import { toast, ToastContainer } from 'react-toastify'; +import 'react-toastify/dist/ReactToastify.css'; + 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==="") { + toast.warn("Don't leave task empty......") + return; + } + + toast.info('Please wait...',{position: "top-center",autoClose: 1000}) + + const dataForApiRequest = { + title: task + } + + const headersForApiRequest = { + headers: {Authorization: 'Token ' + token,} + } + + + axios.post( + '/todo/create/',dataForApiRequest,headersForApiRequest, + ) + .then(function ({ data, status }) { + setTask(""); + toast.success("Your Task has been added in the Todo Succesfully....",{position: "top-center"}) + }) + .catch(function (err) { + toast.error("Unable to add Task. Please try again ....",{position: "top-center"}) + }) + } return (
+ setTask(e.target.value)} />
- ) -} + ) + + } + + diff --git a/components/LoginForm.js b/components/LoginForm.js index fa28f9e..fbd88ff 100644 --- a/components/LoginForm.js +++ b/components/LoginForm.js @@ -1,11 +1,49 @@ -export default function RegisterForm() { +import React, { useState } from 'react' +import { useAuth } from '../context/auth' +import {noAuthRequired} from '../middlewares/no_auth_required' +import { useRouter } from 'next/router' +import axios from '../utils/axios' +import 'react-toastify/dist/ReactToastify.css'; +import { ToastContainer, toast } from 'react-toastify'; + + +export default function LoginForm() { + + const { setToken } = useAuth() + const router = useRouter() + + noAuthRequired (); + + const [password, setPassword] = useState('') + const [username, setUsername] = useState('') + + const login = () => { - /*** - * @todo Complete this function. - * @todo 1. Write code for form validation. - * @todo 2. Fetch the auth token from backend and login the user. - * @todo 3. Set the token in the context (See context/auth.js) - */ + if (username === '' ||password === '') { + + toast.warn("Please Don't leave any empty spaces....",{position: "top-center"}); + return + } + + const dataForApiRequest = { + username: username, + password: password + } + + axios.post( + 'auth/login/', + dataForApiRequest, + ) + .then(function ({ data, status }) { + setToken(data.token) + toast.success("You have been logged in succesfully....",{position: "top-center"}) + router.reload() + }) + .catch(function (err) { + toast.error('Unable to log in...Please try again.... ',{position: "top-center"}) + }) + + } return ( @@ -13,12 +51,15 @@ export default function RegisterForm() {

Login

+ setUsername(e.target.value)} /> setPassword(e.target.value)} />
+ } ) diff --git a/components/RegisterForm.js b/components/RegisterForm.js index a6ef2e3..3481012 100644 --- a/components/RegisterForm.js +++ b/components/RegisterForm.js @@ -1,12 +1,21 @@ import React, { useState } from 'react' import axios from '../utils/axios' import { useAuth } from '../context/auth' +import {noAuthRequired} from '../middlewares/no_auth_required' +import { ToastContainer, toast } from 'react-toastify'; import { useRouter } from 'next/router' +import 'react-toastify/dist/ReactToastify.css'; + + export default function Register() { const { setToken } = useAuth() const router = useRouter() + + noAuthRequired(); + + const [firstName, setFirstName] = useState('') const [lastName, setLastName] = useState('') const [email, setEmail] = useState('') @@ -27,11 +36,11 @@ export default function Register() { username === '' || password === '' ) { - console.log('Please fill all the fields correctly.') + toast.warn('Fill all the fields correctly...',{position: "top-center"}) return false } if (!/^\w+([\.-]?\w+)*@\w+([\.-]?\w+)*(\.\w{2,3})+$/.test(email)) { - console.log('Please enter a valid email address.') + toast.warn('Enter a valid email address...',{position: "top-center"}) return false } return true @@ -61,18 +70,20 @@ export default function Register() { router.push('/') }) .catch(function (err) { - console.log( + toast.error( 'An account using same email or username is already created' - ) + ,{position: "top-center"}) }) } } return ( +

Register

+ { - /** - * @todo Complete this function. - * @todo 1. Update the dom accordingly - */ + document.getElementById("input-button-"+id).classList.remove("hideme"); + document.getElementById("done-button-"+id).classList.remove("hideme"); + document.getElementById("task-"+id).classList.add("hideme"); + document.getElementById("task-actions-"+id).classList.add("hideme"); + } const deleteTask = (id) => { - /** - * @todo Complete this function. - * @todo 1. Send the request to delete the task to the backend server. - * @todo 2. Remove the task from the dom. - */ + toast.info("Please wait...",{position: "top-center"}); + + const headersForApiRequest = { + headers: {Authorization: 'Token ' + token,} + } + + + axios.delete( + 'todo/' + id + '/',headersForApiRequest, + ).then(function ({ data, status }) { + toast.success("Task has been deleted successfully.....",{position: "top-center"}) + }).catch(function (err) { + toast.error("Couldn't delete the task ..Please try again....",{position: "top-center"}) + }) + } const updateTask = (id) => { - /** - * @todo Complete this function. - * @todo 1. Send the request to update the task to the backend server. - * @todo 2. Update the task in the dom. - */ + + if (updatetask===""){ + toast.warn("Don't Leave any empty Spaces...Please enter a task...",{position: "top-center"}); + return; + } + const dataForApiRequest={ + title: updatetask + } + + const headersForApiRequest = { + headers: {Authorization: 'Token ' + token,} +} + axios.patch( + 'todo/' + id + '/',dataForApiRequest,headersForApiRequest, + ).then(function ({ data, status }) { + document.getElementById("input-button-"+id).classList.add("hideme"); + document.getElementById("done-button-"+id).classList.add("hideme"); + document.getElementById("task-"+id).classList.remove("hideme"); + document.getElementById("task-actions-"+id).classList.remove("hideme"); + toast.success("Item in todo list Updated successfully... ",{position: "top-center"}) + }).catch(function (err) { + toast.warn("Not able to add task.Please try again.....",{position: "top-center"}); + }) + } return ( <> -
  • + +
  • setUpdatetask(e.target.value)} /> -
    +
    -
    - Sample Task 1 +
    + {props.title}
    - +