completed auth (#127)
This commit is contained in:
parent
7ff0c87c48
commit
5a78c71bc1
|
@ -6,9 +6,9 @@
|
||||||
"code": "ERR_PNPM_NO_IMPORTER_MANIFEST_FOUND",
|
"code": "ERR_PNPM_NO_IMPORTER_MANIFEST_FOUND",
|
||||||
"err": {
|
"err": {
|
||||||
"name": "pnpm",
|
"name": "pnpm",
|
||||||
"message": "No package.json (or package.yaml, or package.json5) was found in \"/home/chirag/Desktop/jwoc/url-minify\".",
|
"message": "No package.json (or package.yaml, or package.json5) was found in \"D:\\url-minify\".",
|
||||||
"code": "ERR_PNPM_NO_IMPORTER_MANIFEST_FOUND",
|
"code": "ERR_PNPM_NO_IMPORTER_MANIFEST_FOUND",
|
||||||
"stack": "pnpm: No package.json (or package.yaml, or package.json5) was found in \"/home/chirag/Desktop/jwoc/url-minify\".\n at readProjectManifest (/usr/local/lib/node_modules/pnpm/dist/pnpm.cjs:19808:13)\n at async Object.readProjectManifestOnly (/usr/local/lib/node_modules/pnpm/dist/pnpm.cjs:19812:28)\n at async readProjectManifestOnly (/usr/local/lib/node_modules/pnpm/dist/pnpm.cjs:43691:24)\n at async Object.handler (/usr/local/lib/node_modules/pnpm/dist/pnpm.cjs:177805:24)\n at async /usr/local/lib/node_modules/pnpm/dist/pnpm.cjs:182068:21\n at async run (/usr/local/lib/node_modules/pnpm/dist/pnpm.cjs:182042:34)\n at async runPnpm (/usr/local/lib/node_modules/pnpm/dist/pnpm.cjs:182261:5)\n at async /usr/local/lib/node_modules/pnpm/dist/pnpm.cjs:182253:7"
|
"stack": "pnpm: No package.json (or package.yaml, or package.json5) was found in \"D:\\url-minify\".\n at readProjectManifest (C:\\Users\\chira\\AppData\\Roaming\\npm\\node_modules\\pnpm\\dist\\pnpm.cjs:19805:13)\n at async Object.readProjectManifestOnly (C:\\Users\\chira\\AppData\\Roaming\\npm\\node_modules\\pnpm\\dist\\pnpm.cjs:19809:28)\n at async readProjectManifestOnly (C:\\Users\\chira\\AppData\\Roaming\\npm\\node_modules\\pnpm\\dist\\pnpm.cjs:43712:24)\n at async Object.handler (C:\\Users\\chira\\AppData\\Roaming\\npm\\node_modules\\pnpm\\dist\\pnpm.cjs:177753:24)\n at async C:\\Users\\chira\\AppData\\Roaming\\npm\\node_modules\\pnpm\\dist\\pnpm.cjs:182016:21\n at async run (C:\\Users\\chira\\AppData\\Roaming\\npm\\node_modules\\pnpm\\dist\\pnpm.cjs:181990:34)\n at async runPnpm (C:\\Users\\chira\\AppData\\Roaming\\npm\\node_modules\\pnpm\\dist\\pnpm.cjs:182209:5)\n at async C:\\Users\\chira\\AppData\\Roaming\\npm\\node_modules\\pnpm\\dist\\pnpm.cjs:182201:7"
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
|
@ -1,3 +1,3 @@
|
||||||
MONGO_DB=mongo-uri
|
MONGO_DB=mongodb://localhost:27017/urlMinify
|
||||||
SECRET=secret
|
SECRET=secret
|
||||||
AUTH_SECRET=secret
|
AUTH_SECRET=secret
|
|
@ -1,2 +1,3 @@
|
||||||
NODE_ENV=dev
|
NODE_ENV=dev
|
||||||
NEXT_PUBLIC_API_URL=https://api.minfy.xyz
|
#NEXT_PUBLIC_API_URL=https://api.minfy.xyz
|
||||||
|
NEXT_PUBLIC_API_URL=http://localhost:5000
|
||||||
|
|
|
@ -1,18 +1,18 @@
|
||||||
import React from 'react'
|
import React from 'react'
|
||||||
import LoginStyle from './Login.style'
|
import LoginStyle from './Login.style'
|
||||||
import AccountCircleIcon from '@mui/icons-material/AccountCircle'
|
// import AccountCircleIcon from '@mui/icons-material/AccountCircle'
|
||||||
import { FontAwesomeIcon } from '@fortawesome/react-fontawesome'
|
import { FontAwesomeIcon } from '@fortawesome/react-fontawesome'
|
||||||
import {
|
import { faEnvelope, faLock } from '@fortawesome/free-solid-svg-icons'
|
||||||
faUser,
|
import UserContext from '../../helpers/user/usercontext'
|
||||||
faEnvelope,
|
|
||||||
faLock,
|
|
||||||
} from '@fortawesome/free-solid-svg-icons'
|
|
||||||
import { UserContext } from '../../helpers/user/usercontext'
|
|
||||||
import { useState } from 'react'
|
import { useState } from 'react'
|
||||||
import Link from 'next/link'
|
import Link from 'next/link'
|
||||||
import { useContext } from 'react'
|
import { useContext } from 'react'
|
||||||
|
import { useRouter } from 'next/router'
|
||||||
|
|
||||||
function Login() {
|
function Login() {
|
||||||
|
const router = useRouter()
|
||||||
|
const user = useContext(UserContext)
|
||||||
|
|
||||||
const [userData, setUserData] = useState({
|
const [userData, setUserData] = useState({
|
||||||
email: '',
|
email: '',
|
||||||
password: '',
|
password: '',
|
||||||
|
@ -24,9 +24,17 @@ function Login() {
|
||||||
setUserData({ ...userData, [name]: value })
|
setUserData({ ...userData, [name]: value })
|
||||||
}
|
}
|
||||||
|
|
||||||
|
const handleLogin = (evt) => {
|
||||||
|
evt.preventDefault()
|
||||||
|
user.login(userData)
|
||||||
|
}
|
||||||
|
|
||||||
|
if (user.user) {
|
||||||
|
router.push('/dashboard')
|
||||||
|
}
|
||||||
return (
|
return (
|
||||||
<LoginStyle>
|
<LoginStyle>
|
||||||
<form className="form-wrapper">
|
<form className="form-wrapper" onSubmit={handleLogin}>
|
||||||
<p className="reg-title">Sign in</p>
|
<p className="reg-title">Sign in</p>
|
||||||
|
|
||||||
<img src="/images/user.png"></img>
|
<img src="/images/user.png"></img>
|
||||||
|
@ -61,11 +69,9 @@ function Login() {
|
||||||
/>
|
/>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<Link href="/">
|
<button type="submit" className="submit-button">
|
||||||
<button type="submit" className="submit-button">
|
Submit
|
||||||
Submit
|
</button>
|
||||||
</button>
|
|
||||||
</Link>
|
|
||||||
|
|
||||||
<p className="foot-text">
|
<p className="foot-text">
|
||||||
New here?
|
New here?
|
||||||
|
|
|
@ -1,13 +1,15 @@
|
||||||
import React from 'react'
|
import React from 'react'
|
||||||
import RegStyle from './Reg.style'
|
import RegStyle from './Reg.style'
|
||||||
import Image from 'next/image'
|
|
||||||
import { FontAwesomeIcon } from '@fortawesome/react-fontawesome'
|
import { FontAwesomeIcon } from '@fortawesome/react-fontawesome'
|
||||||
import { faUser, faEnvelope, faLock } from '@fortawesome/free-solid-svg-icons'
|
import { faUser, faEnvelope, faLock } from '@fortawesome/free-solid-svg-icons'
|
||||||
import { useState, useContext } from 'react'
|
import { useState, useContext } from 'react'
|
||||||
import { Link } from '@mui/material'
|
import { Link } from '@mui/material'
|
||||||
import UserAuth from 'helpers/user/usercontext'
|
import UserAuth from 'helpers/user/usercontext'
|
||||||
|
import { useRouter } from 'next/router'
|
||||||
|
|
||||||
function Reg() {
|
function Reg() {
|
||||||
|
const router = useRouter()
|
||||||
|
const context = useContext(UserAuth)
|
||||||
const [userData, setUserData] = useState({
|
const [userData, setUserData] = useState({
|
||||||
username: '',
|
username: '',
|
||||||
email: '',
|
email: '',
|
||||||
|
@ -25,7 +27,10 @@ function Reg() {
|
||||||
setUserData(userData)
|
setUserData(userData)
|
||||||
context.createAcc(userData)
|
context.createAcc(userData)
|
||||||
}
|
}
|
||||||
const context = useContext(UserAuth);
|
|
||||||
|
if (context.user) {
|
||||||
|
router.push('/dashboard')
|
||||||
|
}
|
||||||
return (
|
return (
|
||||||
<RegStyle>
|
<RegStyle>
|
||||||
<form onSubmit={handleSubmit} className="form-wrapper">
|
<form onSubmit={handleSubmit} className="form-wrapper">
|
||||||
|
|
|
@ -1,31 +1,102 @@
|
||||||
import UserAuth from './usercontext'
|
import UserAuth from './usercontext'
|
||||||
import { useState } from 'react'
|
import { useState } from 'react'
|
||||||
import axios from 'helpers/Axios'
|
import axios from 'helpers/Axios'
|
||||||
|
import { useEffect } from 'react'
|
||||||
|
|
||||||
|
const storeJWT = (data) => {
|
||||||
|
let jwt = data
|
||||||
|
try {
|
||||||
|
localStorage.setItem('jwt', jwt)
|
||||||
|
return false
|
||||||
|
} catch (e) {
|
||||||
|
return true
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
const fetchJWT = () => {
|
||||||
|
try {
|
||||||
|
let jwt = localStorage.getItem('jwt')
|
||||||
|
return jwt
|
||||||
|
} catch (e) {
|
||||||
|
return false
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
const UserAuthProvider = ({ children }) => {
|
const UserAuthProvider = ({ children }) => {
|
||||||
const [user, setUser] = useState(null)
|
const [user, setUser] = useState(null)
|
||||||
const login = () => {
|
const [jwt, setJwt] = useState(null)
|
||||||
setUser('default')
|
const login = async ({ email, password }) => {
|
||||||
|
let login = true
|
||||||
|
await axios
|
||||||
|
.post(`/user/login`, {
|
||||||
|
email: email,
|
||||||
|
password: password,
|
||||||
|
})
|
||||||
|
.then(function (response) {
|
||||||
|
setJwt(response.data.access_token)
|
||||||
|
storeJWT(response.data.access_token)
|
||||||
|
})
|
||||||
|
.catch(function (error) {
|
||||||
|
login = false
|
||||||
|
console.error(error)
|
||||||
|
})
|
||||||
|
return login
|
||||||
}
|
}
|
||||||
const createAcc = (data) => {
|
const createAcc = async ({ email, password, name }) => {
|
||||||
axios
|
let register = true
|
||||||
|
await axios
|
||||||
.post(`/user/register`, {
|
.post(`/user/register`, {
|
||||||
email: data.email,
|
email: email,
|
||||||
password: data.password,
|
password: password,
|
||||||
name: data.name,
|
name: name,
|
||||||
})
|
})
|
||||||
.then(function (response) {
|
.then(function (response) {
|
||||||
console.log(response)
|
console.log(response)
|
||||||
|
setJwt(response.data)
|
||||||
|
storeJWT(response.data)
|
||||||
})
|
})
|
||||||
.catch(function (error) {
|
.catch(function (error) {
|
||||||
console.log(error)
|
register = false
|
||||||
|
console.error(error)
|
||||||
|
})
|
||||||
|
return register
|
||||||
|
}
|
||||||
|
const fetchUser = async () => {
|
||||||
|
if (!jwt) {
|
||||||
|
return
|
||||||
|
}
|
||||||
|
axios({
|
||||||
|
headers: {
|
||||||
|
Authorization: jwt,
|
||||||
|
},
|
||||||
|
method: 'GET',
|
||||||
|
url: '/user/me',
|
||||||
|
})
|
||||||
|
.then((user) => {
|
||||||
|
setUser(user.data)
|
||||||
|
})
|
||||||
|
.catch((err) => {
|
||||||
|
console.error(err)
|
||||||
|
setJwt(null)
|
||||||
|
setUser(null)
|
||||||
|
storeJWT(null)
|
||||||
})
|
})
|
||||||
}
|
}
|
||||||
|
|
||||||
const logout = () => {
|
const logout = () => {
|
||||||
setUser(null)
|
setUser(null)
|
||||||
|
setJwt(null)
|
||||||
|
storeJWT(null)
|
||||||
}
|
}
|
||||||
const context = { user, login, logout, createAcc }
|
const context = { jwt, user, login, logout, createAcc }
|
||||||
|
useEffect(() => {
|
||||||
|
let jwt = fetchJWT()
|
||||||
|
if (jwt) {
|
||||||
|
setJwt(jwt)
|
||||||
|
}
|
||||||
|
}, [])
|
||||||
|
useEffect(() => {
|
||||||
|
fetchUser()
|
||||||
|
}, [jwt])
|
||||||
|
|
||||||
return <UserAuth.Provider value={context}>{children}</UserAuth.Provider>
|
return <UserAuth.Provider value={context}>{children}</UserAuth.Provider>
|
||||||
}
|
}
|
||||||
|
|
|
@ -6,15 +6,12 @@ import '../styles/404.css'
|
||||||
import UserAuthProvider from 'helpers/user/userState'
|
import UserAuthProvider from 'helpers/user/userState'
|
||||||
import Page from 'react-page-loading'
|
import Page from 'react-page-loading'
|
||||||
|
|
||||||
|
|
||||||
function MyApp({ Component, pageProps }) {
|
function MyApp({ Component, pageProps }) {
|
||||||
return (
|
return (
|
||||||
<UserAuthProvider>
|
<UserAuthProvider>
|
||||||
<Page loader={"bar"} color={"#03b1fc"} size={10} >
|
<Page loader={'bar'} color={'#03b1fc'} size={10}>
|
||||||
<Component {...pageProps} />
|
<Component {...pageProps} />
|
||||||
|
|
||||||
</Page>
|
</Page>
|
||||||
|
|
||||||
</UserAuthProvider>
|
</UserAuthProvider>
|
||||||
)
|
)
|
||||||
}
|
}
|
||||||
|
|
Loading…
Reference in New Issue