google recaptcha security feature added

.firebase/hosting.YnVpbGQ.cache

@@ -1,16 +1,19 @@
-asset-manifest.json,1684606483429,878a6c73e22057dfe9b651ddc4c920c372cd89e853c9947ba865731a261ef955
-index.html,1684606483427,08b86df9d1dae20ede3fa11fb124df819f42da5946c96b2059a0a0c75ff4ae16
-manifest.json,1684426629326,aff3449bdc238776f5d6d967f19ec491b36aed5fb7f23ccff6500736fd58494a
-robots.txt,1684426633400,bfe106a3fb878dc83461c86818bf74fc1bdc7f28538ba613cd3e775516ce8b49
-static/css/main.54fbc00d.css.map,1684606483478,ab1de5a0ba57cb4385105337d8f2ae2171c756e80257794bbf21f6e768136803
-static/js/787.e36beff6.chunk.js,1684606483477,dbc615c2190220b18efab05c333c9b2472022ea4dae5fc3a915deedda7fe4767
-static/js/787.e36beff6.chunk.js.map,1684606483478,52ac6197d8debc3773a4822f6445e2dc64b29e0d956c14725d710d3127387205
-static/js/main.c706afb7.js.LICENSE.txt,1684606483476,6403b1d91984cb0b086a85b7bda4948ada0746a1ee1f49e5301f85fa36fb6a63
-static/css/main.54fbc00d.css,1684606483477,e501852386f09790797fa6e70a7cf246c8ac50a58bfebc51ac2e3ba2b614aa9d
-logo512.png,1684426631089,ee7e2f3fdb8209c4b6fd7bef6ba50d1b9dba30a25bb5c3126df057e1cb6f5331
-logo192.png,1684426630928,3ee59515172ee198f3be375979df15ac5345183e656720a381b8872b2a39dc8b
-static/media/deadpool.0d9f8e88a662f1bc84aa.png,1684606483477,5b09bd2b1e07329c6a36836eaf9880815a665824aab6a1ae26dd4a95e5c377e2
-static/js/main.c706afb7.js,1684606483478,a0d00c5461cea8755fff14eaecb9316f0d787977810a1d7a653328aa04b29b85
-static/media/logo.f3a3c746f6064387f24e.png,1684606483477,eafadc136f4f9ef4e3b3db70df23a091144da0c8635ccb1f09953cefaf1243fa
-favicon.ico,1684429540052,422b76f218e8ba1e910e9d3e54b6f728bb6c9145a71fa593368a7f19834f6765
-static/js/main.c706afb7.js.map,1684606483480,52cec61e20216c09351207f0cdb3338b2fe43ffdba06c450d79f33630a98658f
+favicon.ico,1685374750579,422b76f218e8ba1e910e9d3e54b6f728bb6c9145a71fa593368a7f19834f6765
+logo192.png,1685374750582,3ee59515172ee198f3be375979df15ac5345183e656720a381b8872b2a39dc8b
+logo512.png,1685374750583,ee7e2f3fdb8209c4b6fd7bef6ba50d1b9dba30a25bb5c3126df057e1cb6f5331
+manifest.json,1685374750584,5c997de1364b8be939319fa9209abd77f2caf7f8844999a9e2e9173f844e7840
+robots.txt,1685374750585,b2090cf9761ef60aa06e4fab97679bd43dfa5e5df073701ead5879d7c68f1ec5
+asset-manifest.json,1690319400691,a3b9cf6d8b5a2e5806ba95841a6dc6a89ce12a8e9d0793be9a9b78dca77fa301
+index.html,1690319400691,e8db0a9e8ead30192bcf7932c354505bd0e1bbbee9845da9fb244aa047160ba0
+static/js/787.e36beff6.chunk.js,1690319400735,dbc615c2190220b18efab05c333c9b2472022ea4dae5fc3a915deedda7fe4767
+static/js/main.dbf75814.js.LICENSE.txt,1690319400735,513d5fbacd4eb25cc6fc51ff56195ee69cb13ad660ae57399b506c1ff8799737
+static/js/787.e36beff6.chunk.js.map,1690319400736,52ac6197d8debc3773a4822f6445e2dc64b29e0d956c14725d710d3127387205
+static/css/main.56d83c31.css.map,1690319400734,e52d03f16cb1c449513849f35326221a547c248144a9b653829853b8d162fbf9
+static/css/main.56d83c31.css,1690319400735,c7265c4529a0abea1870dc885ce29cb8f9eae5c17dc911a10c06312a0faff075
+static/media/4018109.aff383c7498168bf53d7.jpg,1690319400734,8d19545f511b9124d177fb8d161aae70b1903392655e7bab18e7d2aa3d20314d
+static/media/4969.984b7904daf5b22bf9b3.jpg,1690319400732,dfaa1f5ed74c98f459e5c0f6100c2e29d40aa891f0e94823caebe767322aecea
+static/media/justice-league-dc-fandome-artwork-cn.32c56ec6d8a7e9d7bbae.jpg,1690319400735,75dc3eba1f2e756db3cfc4c4c896392016a85ea7a25888bf4eb27b5877cb3a7a
+static/media/deadpool.0d9f8e88a662f1bc84aa.png,1690319400732,5b09bd2b1e07329c6a36836eaf9880815a665824aab6a1ae26dd4a95e5c377e2
+static/media/logo.f3a3c746f6064387f24e.png,1690319400735,eafadc136f4f9ef4e3b3db70df23a091144da0c8635ccb1f09953cefaf1243fa
+static/js/main.dbf75814.js,1690319400735,9edff40f1275bac43fac0cf54ba0e20a19a9e226e8331caf23dca9cd7d9bbbf3
+static/js/main.dbf75814.js.map,1690319400738,72204367f5e6b07608cbd1ae804e65ddc19fc7c1d26069bb069ca6342a54a4fd

package.json

@@ -15,6 +15,7 @@
     "match-sorter": "^6.3.1",
     "react": "^18.2.0",
     "react-dom": "^18.2.0",
+    "react-google-recaptcha": "^3.1.0",
     "react-router-dom": "^6.11.2",
     "react-scripts": "5.0.1",
     "sort-by": "^1.2.0",

src/components/Home.js

@@ -21,11 +21,11 @@ function Home() {
     return (
         <>
             {/* Banner Section */}
-            <section className="h-56 sm:h-64 md:h-96 2xl:h-[90vh] bg-black bg-auto">
+            <section className="h-56 sm:h-64 md:h-96 lg:h-[90vh] bg-black bg-auto">
                 <Carousel>
                     <div className="flex h-full items-center justify-center">
                         <img src={img1} className='h-[90vh] w-full' alt="" />
-                        <div className="h-full w-full absolute flex justify-center  bg-gradient-to-r from-[#000000c0] to-[#000000c0]">
+                        <div className="h-full w-full absolute flex justify-center bg-gradient-to-r from-[#000000c0] to-[#000000c0]">
                             <div className='h-full w-full flex flex-col justify-center items-center text-center'>
                                 <img src="https://upload.wikimedia.org/wikipedia/commons/thumb/b/b9/Marvel_Logo.svg/1200px-Marvel_Logo.svg.png" className='h-28 ' alt="" />
                                 <p className='mt-8 sub-heading text-white text-5xl tracking-normal font-semibold'>All <span className='text-red-600 font-extrabold text-6xl tracking-tighter'>MARVEL</span> Toys And Action Figure <br /> Available Here</p>

src/components/MyToys.js

@@ -174,7 +174,7 @@ function MyToys() {
                                             {
                                                 openModal &&
                                                 <Modal
-                                                className='bg-black backdrop-blur-sm bg-opacity-5'
+                                                className='bg-black bg-opacity-10 backdrop-blur-sm'
                                                     show={openModal}
                                                     onClose={() => {
                                                         setOpenModal(!openModal)

src/components/Signin.js

@@ -1,11 +1,13 @@
 import React, { useContext, useState } from 'react'
 import { Link, useLocation, useNavigate } from 'react-router-dom'
+import ReCAPTCHA from "react-google-recaptcha";
 import Lottie from "lottie-react";
 import login from './../images/93385-login.json'
 import { AuthContext } from '../providers/AuthProvider'
 
 function Signin() {
     const [show, setShow] = useState(false)
+    const [verified, setVerified] = useState(false)
     const { loginUser, googleLogin, githubLogin } = useContext(AuthContext)
     const navigate = useNavigate();
     const location = useLocation();
@@ -44,6 +46,10 @@ function Signin() {
             });
     }
 
+    const captchaValidate = (value) => {
+        setVerified(!verified);
+    }
+
     return (
         <section className="relative flex justify-center flex-wrap  lg:items-center">
             <div className="lg:ms-28 w-full px-4 py-8 sm:px-6 sm:py-16 lg:px-8 lg:py-16 lg:w-96">
@@ -72,8 +78,16 @@ function Signin() {
                     </p>
                     <br />
 
+                    <div className='flex justify-center mt-6'>
+                        <ReCAPTCHA
+                            sitekey="6LeyBFQnAAAAAGlMO5X1YCrD8KtNSdHfBnjJOZT-"
+                            onChange={captchaValidate}
+                        />
+                    </div>
+                    <br />
+
                     <div className='flex justify-center'>
-                        <button className='bg-blue-600 mx-auto text-white py-4 px-8 mt-6 font-bold rounded-full hover:bg-blue-700' type="submit">Sign in</button>
+                        <button className={`bg-blue-600 mx-auto text-white py-4 px-8 font-bold rounded-full ${verified ? 'hover:bg-blue-700' : 'cursor-not-allowed'}`} type="submit">Sign in</button>
                     </div>
 
                 </form>