Skip to content

Commit

Permalink
feat: added validation for login,fix:admin get req to post
Browse files Browse the repository at this point in the history
  • Loading branch information
sanjaybaskaran01 committed Sep 6, 2021
1 parent 4be0df8 commit e081dbd
Show file tree
Hide file tree
Showing 8 changed files with 136 additions and 32 deletions.
11 changes: 9 additions & 2 deletions package-lock.json

Some generated files are not rendered by default. Learn more about how customized files appear on GitHub.

18 changes: 16 additions & 2 deletions src/api/Request.js
Original file line number Diff line number Diff line change
Expand Up @@ -36,9 +36,9 @@ export const getToken = async (uname, password) => {
}
);
localStorage.setItem('jwtToken', res.data);
return
return res.data;
} catch (err) {
console.error(err);
console.error("this isthe error",err);
return
}
}
Expand All @@ -47,3 +47,17 @@ export const postEvent= async(form)=>{
let res = await API.post("/api/add",form)
return res.data;
}

export const approveEvent = async (id) =>{
let res = await API.post(`/admin/approve`,{id}, { headers: { Authorization: `Bearer ${localStorage.getItem('jwtToken')}` } })
return res.data;
}

export const denyEvent = async (id,reason) =>{
let res = await API.post(`/admin/deny`,{id,reason}, { headers: { Authorization: `Bearer ${localStorage.getItem('jwtToken')}` } })
return res.data;
}
export const removeEvent = async (id) =>{
let res = await API.post(`/admin/remove`,{id}, { headers: { Authorization: `Bearer ${localStorage.getItem('jwtToken')}` } })
return res.data;
}
6 changes: 3 additions & 3 deletions src/components/EventProfile.jsx
Original file line number Diff line number Diff line change
Expand Up @@ -14,7 +14,7 @@ const EventProfile = ({img,org,title,desc,start,end,url,backgroundColor,textColo
<div className="w-full">
<div className="flex flex-col">
<div
className="border border-gray-900 align-center text-left p-2 mr-2 mb-2 mt-2 w-full h-full sm:h-56 flex-col sm:flex-row"
className="border border-gray-900 align-center text-left p-2 mr-2 mb-2 mt-2 w-full h-full sm:h-56 flex-col sm:flex-row"
style={{ backgroundColor,borderRadius:"8px",display:"flex",}}
>
<div className="h-80 w-80 self-center sm:w-48 sm:h-48 my-2 flex items-center justify-center imgdiv">
Expand All @@ -23,7 +23,7 @@ const EventProfile = ({img,org,title,desc,start,end,url,backgroundColor,textColo
className="object-cover rounded self-center w-full h-full"
/>
</div>
<div id="eventprofilecard" className="flex-none sm:flex w-full sm:w-4/5" style={{overflowY:todayChecker?"auto":"none",overflowX:"hidden"}}>
<div id="eventprofilecard" className="flex-none sm:flex w-full sm:w-3/4" style={{overflowY:todayChecker?"auto":"none",overflowX:"hidden"}}>
<div className="flex-auto w-full p-2 sm:ml-2 justify-evenly">
<div className="flex items-start sm:justify-between sm:mt-2">
<div className="flex items-center">
Expand Down Expand Up @@ -54,7 +54,7 @@ const EventProfile = ({img,org,title,desc,start,end,url,backgroundColor,textColo
{org}
</span>
<span
className="font-bold mt-3 sm:mt-0 ml-0 sm:ml-28"
className="font-bold mt-3 sm:mt-0 ml-0 sm:ml-28 italic hover:underline"
style={{cursor:"pointer"}}
onClick={(e) => {
e.preventDefault();
Expand Down
1 change: 0 additions & 1 deletion src/components/serviceWorker.jsx
Original file line number Diff line number Diff line change
@@ -1,7 +1,6 @@
export const RegisterSW = async () =>{
if('serviceWorker' in navigator){
try{
console.log("Service worker launched")
await navigator.serviceWorker.register('./sw.js')
}catch(e)
{
Expand Down
10 changes: 5 additions & 5 deletions src/pages/Eventform/index.jsx
Original file line number Diff line number Diff line change
Expand Up @@ -52,7 +52,7 @@ const EventForm = () => {
});
} else {
let res = await postEvent(eventDetails);
if (res.code === "6969") {
if (res.code === 1) {
routeChange("/verify");
} else {
toast.error("Submission Failed! Please retry.", {
Expand Down Expand Up @@ -195,7 +195,7 @@ const EventForm = () => {
</div>
</div>
<div className="col-full mt-6">
<h4>Start Date and Time of Event</h4>
<h4>Start Date and Time</h4>
<div >
<DatePicker
selected={start}
Expand All @@ -209,7 +209,7 @@ const EventForm = () => {
</div>
</div>
<div className="col-full">
<h4>End Date and Time of Event</h4>
<h4>End Date and Time</h4>
<div >
<div className="col-full">
<DatePicker
Expand Down Expand Up @@ -247,7 +247,7 @@ const EventForm = () => {
type="submit"
className="invisible sm:visible sm:w-full sm:mt-8 text-white font-bold bg-indigo-700 hover:bg-indigo-900
scale-100 h-12 transition ease-in duration-200 text-center text-base
shadow-md focus:outline-none focus:ring-2 focus:ring-offset-2 rounded-lg fc-button"
shadow-md focus:outline-none focus:ring-2 focus:ring-offset-2 rounded-lg fc-button whitespace-nowrap"
>
Submit Event For Approval
</button>
Expand Down Expand Up @@ -279,7 +279,7 @@ const EventForm = () => {
type="submit"
className="visible sm:invisible w-full text-white font-bold bg-indigo-700 hover:bg-indigo-900
scale-100 h-12 transition ease-in duration-200 text-center text-base
shadow-md focus:outline-none focus:ring-2 focus:ring-offset-2 rounded-lg fc-button"
shadow-md focus:outline-none focus:ring-2 focus:ring-offset-2 rounded-lg fc-button whitespace-nowrap"
>
Submit Event For Approval
</button>
Expand Down
25 changes: 19 additions & 6 deletions src/pages/admin/index.jsx
Original file line number Diff line number Diff line change
@@ -1,6 +1,6 @@
import React, { useState, useEffect } from "react";
import { Link, useHistory } from "react-router-dom";
import { getCalendar, getEvents } from "../../api/Request";
import { approveEvent, denyEvent, getCalendar, getEvents, removeEvent } from "../../api/Request";


const Admin = () => {
Expand Down Expand Up @@ -119,19 +119,27 @@ const Admin = () => {
</div>
<a
href={event.url}
className="flex-no-shrink bg-blue-400 hover:bg-blue-500 px-3 ml-4 py-1 text-xs shadow-sm hover:shadow-lg font-medium tracking-wider border-2 border-blue-300 hover:border-blue-500 text-white rounded-full transition ease-in duration-300"
className="flex-no-shrink bg-blue-400 hover:bg-blue-500 px-3 ml-4 py-1 text-xs shadow-sm hover:shadow-lg font-medium tracking-wider border-2 border-blue-300 hover:border-indigo-800 text-white rounded-full transition ease-in duration-300"
target="_blank"
>
<b></b>
</a>
<a
href={`http://localhost:3001/admin/approve/${event._id}`}
href={`#/`}
className="flex-no-shrink bg-green-400 hover:bg-green-500 px-3 ml-4 py-1 text-xs shadow-sm hover:shadow-lg font-medium tracking-wider border-2 border-green-300 hover:border-green-500 text-white rounded-full transition ease-in duration-300"
onClick={async ()=>{
await approveEvent(event._id)
window.location.reload()}}
>
<b></b>
</a>
<a
href={`http://localhost:3001/admin/deny/${event._id}/${reason}`}
href={`#/`}
className="flex-no-shrink bg-red-400 hover:bg-red-500 px-3 ml-4 py-1 text-xs shadow-sm hover:shadow-lg font-medium tracking-wider border-2 border-red-300 hover:border-red-500 text-white rounded-full transition ease-in duration-300"
onClick={async ()=>{
await denyEvent(event._id,reason)
window.location.reload()
}}
>
<b></b>
</a>
Expand Down Expand Up @@ -219,8 +227,13 @@ const Admin = () => {
</svg>
<p className="">{event.email}</p>
<a
href={`http://localhost:3001/admin/remove/${event._id}`}
href={`#/`}
className="flex-no-shrink bg-red-400 hover:bg-red-500 px-3 ml-4 py-1 text shadow-sm hover:shadow-lg font-medium tracking-wider border-2 border-red-300 hover:border-red-500 text-white rounded-full transition ease-in duration-300"

onClick={async ()=>{
await removeEvent(event._id,reason)
window.location.reload()
}}
>
<b></b>
</a>
Expand Down Expand Up @@ -252,7 +265,7 @@ const Admin = () => {
<div className="w-full md:w-2/3 flex flex-col mb-16 items-center text-center">
<h1 className="title-font sm:text-4xl text-3xl mb-4 font-medium text-white">Forbidden</h1>
<div className="flex w-full justify-center items-end">
<a href="/login" className="inline-flex text-white bg-green-500 border-0 py-2 px-6 focus:outline-none hover:bg-green-600 rounded text-lg">Login Here</a>
<a href="/login" style={{backgroundColor:"#4C42C2"}} className="inline-flex text-white py-2 px-6 outline-none rounded text-lg fc-button">Login Here</a>
</div>
</div>
</div>
Expand Down
89 changes: 76 additions & 13 deletions src/pages/admin/login.jsx
Original file line number Diff line number Diff line change
Expand Up @@ -2,27 +2,88 @@ import React, { useState } from "react";
import { getToken } from "../../api/Request";
import { useHistory } from "react-router-dom";
import "./styles.css";
import { toast, ToastContainer } from "react-toastify";
import loginFormSchema from "../../validation/loginform";

const AdminLogin = () => {
const [username, setUsername] = useState("");
const [password, setPassword] = useState("");
const history = useHistory();
const routeChange = () => {
let path = `/admin`;
const routeChange = (path) => {
history.push(path);
};
const handleOnClick = async (e) => {
// const routeChange = (res) => {
// let path
// if(res){
// if(res.code===0){
// toast.error("Invalid Credentials", {
// autoClose: 5000,
// hideProgressBar: false,
// closeOnClick: true,
// pauseOnHover: true,
// draggable: true,
// progress: undefined,
// });
// console.log("inside this");

// }
// else
// {
// path='/admin'
// history.push(path);
// }
// }
// else
// {
// path='/admin'
// history.push(path);
// }



// };
const validate = async () => {

let Username=username;
let Password=password;
const { error } = loginFormSchema.validate({Username,Password});
if (error) {
toast.error(error.message, {
autoClose: 5000,
hideProgressBar: false,
closeOnClick: true,
pauseOnHover: true,
draggable: true,
progress: undefined,
});
} else {
let res = await getToken(username, password);
if (res.code !== 0) {
routeChange("/admin");
} else {
toast.error("Invalid Credentials", {
autoClose: 5000,
hideProgressBar: false,
closeOnClick: true,
pauseOnHover: true,
draggable: true,
progress: undefined,
});
}
}
};
const handleOnClick = (e) => {
e.preventDefault();
await getToken(username, password);
routeChange()
validate()
};

return (
<div className="flex md:container md:mx-auto h-screen items-center justify-center">
<ToastContainer />
<div
id="container"
className="flex flex-col align-middle w-full max-w-md px-4 py-8 bg-white rounded-lg shadow dark:bg-gray-800 sm:px-6 md:px-8 lg:px-10"
style={{backgroundColor: "#2A2B2C",
border: "1px solid #00c49a"}}
style={{backgroundColor: "#4C42C2"}}
>
<div className="self-center mb-6 text-xl font-light sm:text-2xl text-white">
Evie Admin Login
Expand All @@ -31,7 +92,7 @@ const AdminLogin = () => {
<form autoComplete="off">
<div className="flex flex-col mb-2">
<div className="flex relative ">
<span className="rounded-l-md inline-flex items-center px-3 border-t bg-white border-l border-b border-gray-300 text-gray-500 shadow-sm text-sm">
<span className="inline-flex items-center px-3 bg-none mt-2 text-white text-sm">
<svg
width="15"
height="15"
Expand All @@ -44,16 +105,17 @@ const AdminLogin = () => {
</span>
<input
type="text"
className=" rounded-r-lg flex-1 appearance-none border border-gray-300 w-full py-2 px-4 bg-white text-gray-700 placeholder-gray-400 shadow-sm text-base focus:outline-none focus:ring-2 focus:ring-green-500 focus:border-transparent"
className="flex-1 appearance-none w-full py-2 px-4 bg-white text-gray-700 placeholder-gray-400 text-base focus:outline-none focus:ring-1 focus:ring-indigo-800 outline-none focus:border-transparent"
placeholder="Username"
name="uname"
onChange={(e) => setUsername(e.target.value)}
style={{backgroundColor:"#191927"}}
/>
</div>
</div>
<div className="flex flex-col mb-6">
<div className="flex relative ">
<span className="rounded-l-md inline-flex items-center px-3 border-t bg-white border-l border-b border-gray-300 text-gray-500 shadow-sm text-sm">
<span className="inline-flex items-center px-3 bg-none mt-2 text-white text-sm">
<svg
width="15"
height="15"
Expand All @@ -66,19 +128,20 @@ const AdminLogin = () => {
</span>
<input
type="password"
className=" rounded-r-lg flex-1 appearance-none border border-gray-300 w-full py-2 px-4 bg-white text-gray-700 placeholder-gray-400 shadow-sm text-base focus:outline-none focus:ring-2 focus:ring-green-500 focus:border-transparent"
className="flex-1 appearance-none w-full py-2 px-4 bg-white text-gray-700 placeholder-gray-400 text-base focus:outline-none focus:ring-1 focus:ring-indigo-800 outline-none focus:border-transparent"
placeholder="Password"
name="password"
onChange={(e) => setPassword(e.target.value)}
style={{backgroundColor:"#191927"}}
/>
</div>
</div>
<div className="flex w-full">
<button
type="submit"
className="py-2 px-4 bg-green-500 hover:bg-green-700 focus:ring-purple-500 focus:ring-offset-purple-200 text-white w-full transition ease-in duration-200 text-center text-base font-semibold shadow-md focus:outline-none focus:ring-2 focus:ring-offset-2 rounded-lg "
className="text-white transition ease-in duration-200 text-center text-base font-semibold focus:outline-none focus:ring-2 focus:ring-offset-2 fc-button w-full rounded-lg "
onClick={handleOnClick}
style={{backgroundColor:"#00c49a"}}
style={{backgroundColor:"#191927"}}
>
Login
</button>
Expand Down
Loading

0 comments on commit e081dbd

Please sign in to comment.