Skip to content

Commit

Permalink
Merge pull request #35 from devansh-srv/fix
Browse files Browse the repository at this point in the history
fix: added captcha check to AdminSignup
  • Loading branch information
devansh-srv authored Jan 27, 2025
2 parents 1663f53 + 080a3e3 commit d89146b
Show file tree
Hide file tree
Showing 2 changed files with 37 additions and 39 deletions.
40 changes: 21 additions & 19 deletions client/src/components/AdminSignup.js
Original file line number Diff line number Diff line change
@@ -1,10 +1,10 @@
import React, { useState } from 'react';
import { signup,login } from '../api/api';
import { signup, login } from '../api/api';
import { Turnstile } from '@marsidev/react-turnstile';
import { useNavigate } from 'react-router-dom';


const AdminSignup = ({onLogin}) => {
const AdminSignup = ({ onLogin }) => {
const [formData, setFormData] = useState({ username: '', email: '', password: '' });
const [captchaToken, setCaptchaToken] = useState('');
const [showPassword, setShowPassword] = useState(false);
Expand All @@ -16,14 +16,19 @@ const AdminSignup = ({onLogin}) => {
};

const handleSubmit = async (e) => {
if (!captchaToken) {
alert('Please complete the CAPTCHA.');
return;
}
e.preventDefault();
try {
console.log("FormData:", formData);
await signup({ ...formData, role: 'admin', 'cf-turnstile-response': captchaToken });
const loginResponse = await login({ ...formData, role: 'admin', 'cf-turnstile-response': captchaToken });

localStorage.setItem("token", loginResponse.data.access_token);
onLogin({username: formData.username, role: 'admin'});

onLogin({ username: formData.username, role: 'admin' });
navigate('/admin-dashboard');

} catch (error) {
Expand All @@ -33,19 +38,18 @@ const AdminSignup = ({onLogin}) => {
};

return (
<div className="min-h-screen w-full flex items-center justify-center bg-gradient-to-br from-emerald-500 to-blue-200 py-12 px-4">
<div className="w-full max-w-md bg-white/90 backdrop-blur-sm rounded-xl shadow-xl">
<div className="flex justify-center items-center py-12 px-4 w-full min-h-screen bg-gradient-to-br from-emerald-500 to-blue-200">
<div className="w-full max-w-md rounded-xl shadow-xl bg-white/90 backdrop-blur-sm">
<div className="p-8">
<div className="mb-1 text-sm font-semibold tracking-wide uppercase text-emerald-700">Admin Registration</div>
<div className="mb-1 text-sm font-semibold tracking-wide text-emerald-700 uppercase">Admin Registration</div>
<h2 className="block mt-1 text-2xl font-medium leading-tight text-emerald-900">Create an admin account</h2>
<form onSubmit={handleSubmit} className="mt-6 space-y-6">
<div>
<label className="block mb-2 text-sm font-medium text-emerald-800" htmlFor="username">
Username
</label>
<input
className="w-full px-3 py-2 bg-white/50 border border-emerald-300 rounded-lg
focus:outline-none focus:ring-2 focus:ring-emerald-500"
className="py-2 px-3 w-full rounded-lg border border-emerald-300 focus:ring-2 focus:ring-emerald-500 focus:outline-none bg-white/50"
id="username"
type="text"
name="username"
Expand All @@ -59,8 +63,7 @@ const AdminSignup = ({onLogin}) => {
Email
</label>
<input
className="w-full px-3 py-2 bg-white/50 border border-emerald-300 rounded-lg
focus:outline-none focus:ring-2 focus:ring-emerald-500"
className="py-2 px-3 w-full rounded-lg border border-emerald-300 focus:ring-2 focus:ring-emerald-500 focus:outline-none bg-white/50"
id="email"
type="email"
name="email"
Expand All @@ -69,13 +72,13 @@ const AdminSignup = ({onLogin}) => {
required
/>
</div>
<div>
<div>
<label className="block mb-2 text-sm font-medium text-emerald-700" htmlFor="password">
Password
</label>
<div className="relative">
<input
className="w-full px-3 py-2 bg-white/50 border border-emerald-300 rounded-lg focus:outline-none focus:ring-2 focus:ring-emerald-500"
className="py-2 px-3 w-full rounded-lg border border-emerald-300 focus:ring-2 focus:ring-emerald-500 focus:outline-none bg-white/50"
id="password"
type={showPassword ? 'text' : 'password'}
name="password"
Expand All @@ -85,7 +88,7 @@ const AdminSignup = ({onLogin}) => {
/>
<button
type="button"
className="absolute inset-y-0 right-3 flex items-center text-emerald-600"
className="flex absolute inset-y-0 right-3 items-center text-emerald-600"
onClick={() => setShowPassword((prev) => !prev)}
>
{showPassword ? 'Hide' : 'Show'}
Expand All @@ -103,9 +106,8 @@ const AdminSignup = ({onLogin}) => {
/>
</div>
<div>
<button
className="w-full px-4 py-2 text-white font-semibold bg-emerald-700
hover:bg-emerald-800 rounded-lg transition-colors duration-300"
<button
className="py-2 px-4 w-full font-semibold text-white bg-emerald-700 rounded-lg transition-colors duration-300 hover:bg-emerald-800"
type="submit"
>
Sign Up
Expand All @@ -115,7 +117,7 @@ const AdminSignup = ({onLogin}) => {
</div>
</div>
</div>
);
);
};

export default AdminSignup;
36 changes: 16 additions & 20 deletions client/src/components/BuyerSignup.js
Original file line number Diff line number Diff line change
@@ -1,10 +1,10 @@
import React, { useState } from 'react';
import { signup,login } from '../api/api';
import { signup, login } from '../api/api';
import { Turnstile } from '@marsidev/react-turnstile';
import { useNavigate } from 'react-router-dom';


const BuyerSignup = ({onLogin}) => {
const BuyerSignup = ({ onLogin }) => {
const [formData, setFormData] = useState({ username: '', email: '', password: '' });
const [captchaToken, setCaptchaToken] = useState('');
const [showPassword, setShowPassword] = useState(false);
Expand All @@ -23,33 +23,32 @@ const BuyerSignup = ({onLogin}) => {
try {
console.log("FormData:", formData);
await signup({ ...formData, role: 'buyer', 'cf-turnstile-response': captchaToken });
const loginResponse = await login({...formData,role: 'buyer', 'cf-turnstile-response': captchaToken });
const loginResponse = await login({ ...formData, role: 'buyer', 'cf-turnstile-response': captchaToken });

localStorage.setItem("token", loginResponse.data.access_token);

onLogin({ username: formData.username, role: 'buyer'});
onLogin({ username: formData.username, role: 'buyer' });
navigate('/buyer-dashboard');

} catch (error) {
console.error('Signup failed:', error);

}
};

return (
<div className="min-h-screen w-full flex items-center justify-center bg-gradient-to-br from-indigo-500 to-blue-400 py-12 px-4">
<div className="w-full max-w-md bg-white/90 backdrop-blur-sm rounded-xl shadow-xl">
<div className="flex justify-center items-center py-12 px-4 w-full min-h-screen bg-gradient-to-br from-indigo-500 to-blue-400">
<div className="w-full max-w-md rounded-xl shadow-xl bg-white/90 backdrop-blur-sm">
<div className="p-8">
<div className="mb-1 text-sm font-semibold tracking-wide uppercase text-blue-700">Buyer Registration</div>
<div className="mb-1 text-sm font-semibold tracking-wide text-blue-700 uppercase">Buyer Registration</div>
<h2 className="block mt-1 text-2xl font-medium leading-tight text-blue-900">Create a buyer account</h2>
<form onSubmit={handleSubmit} className="mt-6 space-y-6">
<div>
<label className="block mb-2 text-sm font-medium text-blue-800" htmlFor="username">
Username
</label>
<input
className="w-full px-3 py-2 bg-white/50 border border-blue-300 rounded-lg
focus:outline-none focus:ring-2 focus:ring-blue-500"
className="py-2 px-3 w-full rounded-lg border border-blue-300 focus:ring-2 focus:ring-blue-500 focus:outline-none bg-white/50"
id="username"
type="text"
name="username"
Expand All @@ -63,8 +62,7 @@ const BuyerSignup = ({onLogin}) => {
Email
</label>
<input
className="w-full px-3 py-2 bg-white/50 border border-blue-300 rounded-lg
focus:outline-none focus:ring-2 focus:ring-blue-500"
className="py-2 px-3 w-full rounded-lg border border-blue-300 focus:ring-2 focus:ring-blue-500 focus:outline-none bg-white/50"
id="email"
type="email"
name="email"
Expand All @@ -73,15 +71,14 @@ const BuyerSignup = ({onLogin}) => {
required
/>
</div>
<div>

<div>
<label className="block mb-2 text-sm font-medium text-blue-800" htmlFor="password">
Password
</label>
<div className="relative">
<input
className="w-full px-3 py-2 bg-white/50 border border-blue-300 rounded-lg
focus:outline-none focus:ring-2 focus:ring-blue-500"
className="py-2 px-3 w-full rounded-lg border border-blue-300 focus:ring-2 focus:ring-blue-500 focus:outline-none bg-white/50"
id="password"
type={showPassword ? 'text' : 'password'}
name="password"
Expand All @@ -91,7 +88,7 @@ const BuyerSignup = ({onLogin}) => {
/>
<button
type="button"
className="absolute inset-y-0 right-3 flex items-center text-blue-600"
className="flex absolute inset-y-0 right-3 items-center text-blue-600"
onClick={() => setShowPassword((prev) => !prev)}
>
{showPassword ? 'Hide' : 'Show'}
Expand All @@ -109,9 +106,8 @@ const BuyerSignup = ({onLogin}) => {
/>
</div>
<div>
<button
className="w-full px-4 py-2 text-white font-semibold bg-blue-600
hover:bg-blue-700 rounded-lg transition-colors duration-300"
<button
className="py-2 px-4 w-full font-semibold text-white bg-blue-600 rounded-lg transition-colors duration-300 hover:bg-blue-700"
type="submit"
>
Sign Up
Expand Down

0 comments on commit d89146b

Please sign in to comment.