From bbe18f41218386a5fbaff6df1a45f0182c37aadd Mon Sep 17 00:00:00 2001
From: AymonOsama <Ayyman834@gmail.com>
Date: Thu, 30 Jan 2025 13:21:36 +0200
Subject: [PATCH] Fix: Remove unused variable and update href values in
 Login.js

---
 src/pages/Auth/Login.js | 81 ++++++++++++++++-------------------------
 1 file changed, 32 insertions(+), 49 deletions(-)

diff --git a/src/pages/Auth/Login.js b/src/pages/Auth/Login.js
index 81865c5..f8ababb 100644
--- a/src/pages/Auth/Login.js
+++ b/src/pages/Auth/Login.js
@@ -1,10 +1,6 @@
 import React, { useState } from 'react';
 import { Link, useNavigate } from 'react-router-dom';
-
-// Import motion from framer-motion
-import { motion } from 'framer-motion'; 
-
-// Import sweetalert2
+import { motion } from 'framer-motion';
 import Swal from 'sweetalert2';
 
 // Import style files
@@ -25,7 +21,6 @@ const Login = () => {
     const navigate = useNavigate();
     const [email, setEmail] = useState('');
     const [password, setPassword] = useState('');
-    const [error, setError] = useState('');
 
     const theEmail = 'Aymanausama5@yahoo.com';
     const thePassword = '1973aaaa';
@@ -61,16 +56,16 @@ const Login = () => {
     return (
         <motion.div
             className='LoginPage'
-            initial={{ opacity: 0 }} // Start with opacity 0
-            animate={{ opacity: 1 }} // Animate to opacity 1
-            transition={{ duration: 1 }} // Duration of the animation
+            initial={{ opacity: 0 }}
+            animate={{ opacity: 1 }}
+            transition={{ duration: 1 }}
         >
             <div className='Login_Form px-32 py-16'>
                 <motion.div
                     className='HeadOfLoginForm'
-                    initial={{ y: -50, opacity: 0 }} // Start above and invisible
-                    animate={{ y: 0, opacity: 1 }} // Animate to original position and visible
-                    transition={{ delay: 0.5, duration: 1 }} // Delay and duration
+                    initial={{ y: -50, opacity: 0 }}
+                    animate={{ y: 0, opacity: 1 }}
+                    transition={{ delay: 0.5, duration: 1 }}
                 >
                     <p className='text-[1.4rem] text-gray-400 font-bold'>There’s some Great Discounts</p>
                     <p className='text-4xl text-gray-900 font-semibold py-4'>
@@ -80,11 +75,10 @@ const Login = () => {
 
                 <div className='LoginFormInputs'>
                     <form onSubmit={handleSubmit} className="pt-16 pb-8 w-full max-w-md h-full">
-                        {/* Email Field */}
                         <motion.fieldset
                             className="border-2 border-orange-500 rounded-md px-3 py-4 mb-8"
-                            whileHover={{ scale: 1.02 }} // Scale up on hover
-                            transition={{ type: 'spring', stiffness: 300 }} // Spring animation
+                            whileHover={{ scale: 1.02 }}
+                            transition={{ type: 'spring', stiffness: 300 }}
                         >
                             <legend className="text-gray-400 text-sm font-bold px-3">E-mail</legend>
                             <div className="flex items-center">
@@ -102,11 +96,10 @@ const Login = () => {
                             </div>
                         </motion.fieldset>
 
-                        {/* Password Field */}
                         <motion.fieldset
                             className="border-2 border-orange-500 rounded-md px-3 py-4 mb-3"
-                            whileHover={{ scale: 1.02 }} // Scale up on hover
-                            transition={{ type: 'spring', stiffness: 300 }} // Spring animation
+                            whileHover={{ scale: 1.02 }}
+                            transition={{ type: 'spring', stiffness: 300 }}
                         >
                             <legend className="text-gray-400 text-sm font-bold px-3">Password</legend>
                             <div className="flex items-center">
@@ -124,29 +117,23 @@ const Login = () => {
                             </div>
                         </motion.fieldset>
 
-                        {/* Forget Password Link */}
                         <Link to='/forgot-password' className='text-sm text-gray-600 font-bold'>Forget Password?</Link>
 
-                        {/* Error Message */}
-                        {error && <p className="text-red-500 text-sm font-bold mb-4">{error}</p>}
-
-                        {/* Sign Up Button */}
                         <motion.button
                             className="w-full inline-block rounded border border-orange-500 bg-orange-500 px-12 py-4 text-base font-bold text-white hover:bg-orange-600 focus:outline-none focus:ring shadow-md text-center mt-10"
                             type='submit'
-                            whileHover={{ scale: 1.05 }} // Scale up on hover
-                            whileTap={{ scale: 0.95 }} // Scale down on click
+                            whileHover={{ scale: 1.05 }}
+                            whileTap={{ scale: 0.95 }}
                         >
                             Sign Up
                         </motion.button>
                     </form>
 
-                    {/* Create Account Link */}
                     <motion.div
                         className="absolute bottom-4 h-10 w-60 left-6"
-                        initial={{ opacity: 0, x: -50 }} // Start invisible and to the left
-                        animate={{ opacity: 1, x: 0 }} // Animate to visible and original position
-                        transition={{ delay: 1, duration: 1 }} // Delay and duration
+                        initial={{ opacity: 0, x: -50 }}
+                        animate={{ opacity: 1, x: 0 }}
+                        transition={{ delay: 1, duration: 1 }}
                     >
                         <p className="text-sm text-gray-600 font-bold absolute bottom-0 left-0 mb-4">
                             Have No Account?
@@ -159,33 +146,30 @@ const Login = () => {
             </div>
 
             <div className='Login_About pl-10'>
-                {/* Logo */}
                 <motion.div
                     className='logo w-full flex justify-end items-center'
-                    initial={{ opacity: 0, x: 50 }} // Start invisible and to the right
-                    animate={{ opacity: 1, x: 0 }} // Animate to visible and original position
-                    transition={{ delay: 0.5, duration: 1 }} // Delay and duration
+                    initial={{ opacity: 0, x: 50 }}
+                    animate={{ opacity: 1, x: 0 }}
+                    transition={{ delay: 0.5, duration: 1 }}
                 >
                     <img src={logo} alt="logo_yumlicious" className='w-44' />
                 </motion.div>
 
-                {/* About Info */}
                 <motion.div
                     className='aboutInfo w-full py-8'
-                    initial={{ opacity: 0, y: 50 }} // Start invisible and below
-                    animate={{ opacity: 1, y: 0 }} // Animate to visible and original position
-                    transition={{ delay: 1, duration: 1 }} // Delay and duration
+                    initial={{ opacity: 0, y: 50 }}
+                    animate={{ opacity: 1, y: 0 }}
+                    transition={{ delay: 1, duration: 1 }}
                 >
                     <p className='text-5xl mb-6 text-white font-semibold'>Welcome to</p>
                     <span className='font-extrabold text-6xl text-white'>Yumlicious</span>
                     <p style={{ letterSpacing: '0.1rem' }} className='mt-7 font-bold text-1xl text-white w-96'>Best Restaurant for Satisfying Your Cravings with Delicious Flavors</p>
                 </motion.div>
 
-                {/* View Menu Button */}
                 <motion.div
                     className='viewMenuBtn mt-10'
-                    whileHover={{ scale: 1.05 }} // Scale up on hover
-                    whileTap={{ scale: 0.95 }} // Scale down on click
+                    whileHover={{ scale: 1.05 }}
+                    whileTap={{ scale: 0.95 }}
                 >
                     <Link
                         className="inline-block rounded-2xl border-4 border-white px-6 py-3 text-sm font-bold text-white focus:outline-none transform transition-transform duration-300 hover:scale-105"
@@ -195,21 +179,20 @@ const Login = () => {
                     </Link>
                 </motion.div>
 
-                {/* Social Media Icons */}
                 <motion.div
                     className='socialMediaIcons mt-20 mr-10 ml-10'
-                    initial={{ opacity: 0 }} // Start invisible
-                    animate={{ opacity: 1 }} // Animate to visible
-                    transition={{ delay: 1.5, duration: 1 }} // Delay and duration
+                    initial={{ opacity: 0 }}
+                    animate={{ opacity: 1 }}
+                    transition={{ delay: 1.5, duration: 1 }}
                 >
                     <div className='SocialMediaIconsHeader'>
                         <p style={{ letterSpacing: '0.1rem' }} className='text-white font-bold '>Follow US</p>
                     </div>
                     <div className='SocialMediaIconsSec my-12 flex justify-between'>
-                        <a target='blank' href='#' className='text-2xl'><FaFacebook /></a>
-                        <a target='blank' href='#' className='text-2xl'><FaSquareInstagram /></a>
-                        <a target='blank' href='#' className='text-2xl'><FaTwitter /></a>
-                        <a target='blank' href='#' className='text-2xl'><FaTelegramPlane /></a>
+                        <a target='_blank' rel="noreferrer" href='https://www.facebook.com' className='text-2xl'><FaFacebook /></a>
+                        <a target='_blank' rel="noreferrer" href='https://www.instagram.com' className='text-2xl'><FaSquareInstagram /></a>
+                        <a target='_blank' rel="noreferrer" href='https://www.twitter.com' className='text-2xl'><FaTwitter /></a>
+                        <a target='_blank' rel="noreferrer" href='https://www.telegram.com' className='text-2xl'><FaTelegramPlane /></a>
                     </div>
                 </motion.div>
             </div>
@@ -217,4 +200,4 @@ const Login = () => {
     );
 };
 
-export default Login;
\ No newline at end of file
+export default Login;