mirror of
https://github.com/FranP-code/Pomodoro-Timer-with-Clockify-integration.git
synced 2025-10-12 23:52:30 +00:00
Added the integration with Clockify and validate the API key introduced
This commit is contained in:
@@ -5,6 +5,7 @@ import {getAuth, onAuthStateChanged} from 'firebase/auth'
|
|||||||
const Account = () => {
|
const Account = () => {
|
||||||
|
|
||||||
const [signIn, setSignIn] = useState('false')
|
const [signIn, setSignIn] = useState('false')
|
||||||
|
const [apiKey, setApiKey] = useState('')
|
||||||
|
|
||||||
const auth = getAuth()
|
const auth = getAuth()
|
||||||
|
|
||||||
@@ -16,12 +17,75 @@ const Account = () => {
|
|||||||
setSignIn(false)
|
setSignIn(false)
|
||||||
}
|
}
|
||||||
})
|
})
|
||||||
|
|
||||||
|
const uploadApiKey = async (e) => {
|
||||||
|
e.preventDefault()
|
||||||
|
|
||||||
|
const data = await makeRequest()
|
||||||
|
console.log(data)
|
||||||
|
|
||||||
|
if (await validateRequest(data)) {
|
||||||
|
|
||||||
|
|
||||||
|
} else {
|
||||||
|
|
||||||
|
|
||||||
|
}
|
||||||
|
|
||||||
|
}
|
||||||
|
|
||||||
|
const makeRequest = async () => {
|
||||||
|
try {
|
||||||
|
const request = {
|
||||||
|
method: "GET",
|
||||||
|
headers: {
|
||||||
|
'X-Api-Key': apiKey,
|
||||||
|
"content-type": "application/json"
|
||||||
|
}
|
||||||
|
}
|
||||||
|
const response = await fetch(`https://api.clockify.me/api/v1/workspaces/`, request)
|
||||||
|
const data = await response.json()
|
||||||
|
|
||||||
|
return await data
|
||||||
|
|
||||||
|
} catch (error) {
|
||||||
|
console.log(error)
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
const validateRequest = async (data) => {
|
||||||
|
if (data.code !== 1000) {
|
||||||
|
console.log('TODO BIEN')
|
||||||
|
return true
|
||||||
|
} else {
|
||||||
|
console.log('TODO MAL')
|
||||||
|
return false
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<div>
|
<div>
|
||||||
{
|
{
|
||||||
signIn ?
|
signIn ?
|
||||||
<h1>Insert your Clockify API here</h1> :
|
<div>
|
||||||
|
<h1>One more step...</h1>
|
||||||
|
<h2>Insert your Clockify API here</h2>
|
||||||
|
<form
|
||||||
|
onSubmit={uploadApiKey}
|
||||||
|
>
|
||||||
|
<input
|
||||||
|
type="text"
|
||||||
|
onChange=
|
||||||
|
{
|
||||||
|
(e) => {setApiKey(e.target.value)}
|
||||||
|
}
|
||||||
|
/>
|
||||||
|
|
||||||
|
<input
|
||||||
|
type="submit"
|
||||||
|
/>
|
||||||
|
</form>
|
||||||
|
</div>:
|
||||||
<h1>Sign in before access to this page...</h1>
|
<h1>Sign in before access to this page...</h1>
|
||||||
}
|
}
|
||||||
</div>
|
</div>
|
||||||
|
|||||||
@@ -6,6 +6,7 @@ import {firebase} from './Firebase/firebase'
|
|||||||
import {withRouter} from 'react-router-dom'
|
import {withRouter} from 'react-router-dom'
|
||||||
|
|
||||||
import {getAuth, createUserWithEmailAndPassword, signInWithEmailAndPassword} from 'firebase/auth'
|
import {getAuth, createUserWithEmailAndPassword, signInWithEmailAndPassword} from 'firebase/auth'
|
||||||
|
import { getFirestore, collection, doc, setDoc } from 'firebase/firestore'
|
||||||
|
|
||||||
|
|
||||||
const Identify = (props) => {
|
const Identify = (props) => {
|
||||||
@@ -24,6 +25,12 @@ const Identify = (props) => {
|
|||||||
|
|
||||||
try {
|
try {
|
||||||
const response = await createUserWithEmailAndPassword(auth, email, password)
|
const response = await createUserWithEmailAndPassword(auth, email, password)
|
||||||
|
console.log(response)
|
||||||
|
console.log(response.user)
|
||||||
|
|
||||||
|
const uid = response.user.uid
|
||||||
|
|
||||||
|
addNewUserToFirebase(uid)
|
||||||
|
|
||||||
} catch (error) {
|
} catch (error) {
|
||||||
console.log(error)
|
console.log(error)
|
||||||
@@ -32,6 +39,22 @@ const Identify = (props) => {
|
|||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
const addNewUserToFirebase = async (uid) => {
|
||||||
|
|
||||||
|
try {
|
||||||
|
|
||||||
|
const db = getFirestore(firebase)
|
||||||
|
|
||||||
|
await setDoc(doc(db, 'users', uid), {
|
||||||
|
|
||||||
|
keyClockify: ''
|
||||||
|
})
|
||||||
|
|
||||||
|
} catch (error) {
|
||||||
|
alert(error)
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
const login = async () => {
|
const login = async () => {
|
||||||
|
|
||||||
try {
|
try {
|
||||||
@@ -39,7 +62,7 @@ const Identify = (props) => {
|
|||||||
console.log(response)
|
console.log(response)
|
||||||
console.log(response.user)
|
console.log(response.user)
|
||||||
|
|
||||||
props.history.push('/config-account')
|
//props.history.push('/config-account')
|
||||||
|
|
||||||
} catch (error) {
|
} catch (error) {
|
||||||
console.log(error)
|
console.log(error)
|
||||||
|
|||||||
Reference in New Issue
Block a user