mirror of
https://github.com/FranP-code/Pomodoro-Timer-with-Clockify-integration.git
synced 2025-10-12 23:52:30 +00:00
Logic for form added
This commit is contained in:
@@ -1,10 +1,23 @@
|
|||||||
import React from 'react'
|
import React from 'react'
|
||||||
|
|
||||||
const LoginForm = () => {
|
const LoginForm = (props) => {
|
||||||
return (
|
return (
|
||||||
<form>
|
<form onSubmit={props.sendForm}>
|
||||||
<input type="email" placeholder="Email"></input>
|
<input
|
||||||
<input type="password" placeholder="Password"></input>
|
type="email"
|
||||||
|
placeholder="Email"
|
||||||
|
onChange= {(e) => {
|
||||||
|
props.setEmail(e.target.value)
|
||||||
|
}}
|
||||||
|
/>
|
||||||
|
|
||||||
|
<input
|
||||||
|
type="password"
|
||||||
|
placeholder="Password"
|
||||||
|
onChange= { (e) => {
|
||||||
|
props.setPassword(e.target.value)
|
||||||
|
}}
|
||||||
|
/>
|
||||||
<input type="submit" value="Login"></input>
|
<input type="submit" value="Login"></input>
|
||||||
</form>
|
</form>
|
||||||
)
|
)
|
||||||
|
|||||||
@@ -1,12 +1,37 @@
|
|||||||
import React from 'react'
|
import React from 'react'
|
||||||
|
|
||||||
const RegisterForm = () => {
|
const RegisterForm = (props) => {
|
||||||
return (
|
return (
|
||||||
<form>
|
<form onSubmit={props.sendForm}>
|
||||||
<input type="email" placeholder="Email"></input>
|
<input
|
||||||
<input type="password" placeholder="Password"></input>
|
type="email"
|
||||||
<input type="password" placeholder="Confirm Password"></input>
|
placeholder="Email"
|
||||||
<input type="submit" value="Register"></input>
|
onChange={(e) => {
|
||||||
|
props.setEmail(e.target.value)
|
||||||
|
}}
|
||||||
|
/>
|
||||||
|
|
||||||
|
<input
|
||||||
|
type="password"
|
||||||
|
placeholder="Password"
|
||||||
|
onChange={(e) => {
|
||||||
|
props.setPassword(e.target.value)
|
||||||
|
}}
|
||||||
|
|
||||||
|
/>
|
||||||
|
|
||||||
|
<input
|
||||||
|
type="password"
|
||||||
|
placeholder="Confirm Password"
|
||||||
|
onChange={(e) => {
|
||||||
|
props.setConfirmPassword(e.target.value)
|
||||||
|
}}
|
||||||
|
/>
|
||||||
|
|
||||||
|
<input
|
||||||
|
type="submit"
|
||||||
|
value="Register"
|
||||||
|
/>
|
||||||
</form>
|
</form>
|
||||||
)
|
)
|
||||||
}
|
}
|
||||||
|
|||||||
@@ -4,7 +4,11 @@ import RegisterForm from './Identify Childrens/RegisterForm'
|
|||||||
|
|
||||||
|
|
||||||
const Identify = () => {
|
const Identify = () => {
|
||||||
const [act, setAct] = useState('register')
|
const [act, setAct] = useState('')
|
||||||
|
|
||||||
|
const [email, setEmail] = useState('')
|
||||||
|
const [password, setPassword] = useState('')
|
||||||
|
const [confirmPassword, setConfirmPassword] = useState('')
|
||||||
|
|
||||||
const defineLogin = () => {
|
const defineLogin = () => {
|
||||||
if (act !== 'login') {
|
if (act !== 'login') {
|
||||||
@@ -18,6 +22,48 @@ const Identify = () => {
|
|||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
const sendForm = (e) => {
|
||||||
|
e.preventDefault()
|
||||||
|
|
||||||
|
if (!email.trim()) {
|
||||||
|
alert('EMAIL EMPTY')
|
||||||
|
return
|
||||||
|
}
|
||||||
|
|
||||||
|
if (!password.trim()) {
|
||||||
|
alert('PASSWORD EMPTY')
|
||||||
|
return
|
||||||
|
}
|
||||||
|
|
||||||
|
if (act === 'register') {
|
||||||
|
|
||||||
|
if (!confirmPassword.trim()) {
|
||||||
|
alert('CONFIRM PASSWORD PLEASE')
|
||||||
|
return
|
||||||
|
}
|
||||||
|
|
||||||
|
e.target.reset()
|
||||||
|
setEmail('')
|
||||||
|
setPassword('')
|
||||||
|
setConfirmPassword('')
|
||||||
|
|
||||||
|
//SEND TO FIREBASE
|
||||||
|
return
|
||||||
|
}
|
||||||
|
|
||||||
|
if (act === 'login') {
|
||||||
|
|
||||||
|
e.target.reset()
|
||||||
|
setEmail('')
|
||||||
|
setPassword('')
|
||||||
|
|
||||||
|
//SEND TO FIREBASE
|
||||||
|
return
|
||||||
|
}
|
||||||
|
|
||||||
|
alert('ACTION NOT VALID')
|
||||||
|
}
|
||||||
|
|
||||||
React.useEffect( () => {
|
React.useEffect( () => {
|
||||||
const urlInfo = new URLSearchParams(window.location.search)
|
const urlInfo = new URLSearchParams(window.location.search)
|
||||||
const action = urlInfo.get('act')
|
const action = urlInfo.get('act')
|
||||||
@@ -69,10 +115,10 @@ const Identify = () => {
|
|||||||
|
|
||||||
<div className="form-container">
|
<div className="form-container">
|
||||||
{
|
{
|
||||||
act === 'login' ? <LoginForm action={act}/> : null
|
act === 'login' ? <LoginForm setEmail={setEmail} setPassword={setPassword} sendForm={sendForm}/> : null
|
||||||
}
|
}
|
||||||
{
|
{
|
||||||
act === 'register' ? <RegisterForm action={act}/> : null
|
act === 'register' ? <RegisterForm setEmail={setEmail} setPassword={setPassword} setConfirmPassword={setConfirmPassword} sendForm={sendForm}/> : null
|
||||||
}
|
}
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|||||||
Reference in New Issue
Block a user