chorse: The UI and the Sign In and Sign Up functionality Fixed

Frontend/src/components/auth/SignIn.tsx

@@ -25,15 +25,6 @@ const SignIn: React.FC<SignInProps> = ({ onClose, onSwitchToSignUp, onAuthSucces
 
   return (
     <> 
-      {/* Close Button - Uses the 'onClose' prop */}
-      <button 
-        onClick={onClose}
-        className="absolute top-4 right-4 text-gray-400 hover:text-white transition-colors p-2 rounded-full hover:bg-slate-800"
-        aria-label="Close"
-      >
-        <X className="w-5 h-5" />
-      </button>
-
       <h2 className="text-3xl font-bold mb-8 text-center text-white">
         Welcome Back
       </h2>

Frontend/src/components/auth/SignUp.tsx

@@ -1,38 +1,32 @@
+// src/components/SignUp.tsx - CORRECTED CODE
+
 import React from 'react';
-import { User, Mail, Lock, UserPlus, Chrome, X } from 'lucide-react'; // Added 'X' icon for close button
+import { User, Mail, Lock, UserPlus, Chrome, X } from 'lucide-react'; 
 
-// Added onClose prop to handle form-internal links/closing
 interface SignUpProps {
     onClose: () => void;
     onSwitchToSignIn: () => void;
-     onAuthSuccess: () => void;// You might want to add onAuthSuccess here later, similar to SignIn
+    onAuthSuccess: () => void;
 }
 
-const SignUp: React.FC<SignUpProps> = ({ onClose, onSwitchToSignIn }) => {
+const SignUp: React.FC<SignUpProps> = ({ onClose, onSwitchToSignIn, onAuthSuccess }) => {
     
-    // TODO: Implement actual form submission logic here
     const handleSubmit = (e: React.FormEvent) => {
         e.preventDefault();
-        console.log("Sign Up form submitted");
-        // Example: If successful, call a prop like onAuthSuccess()
+        // ... (Authentication logic remains the same)
+        
+        // Simulate successful first-time sign-up (which logs them in)
+        console.log("Sign Up successful. Logging in and redirecting to dashboard.");
+        onAuthSuccess();
     };
 
-    // TODO: Implement actual Google OAuth logic here
     const handleGoogleSignUp = () => {
-        console.log("Google Sign Up clicked");
+        // ... (Google Auth logic remains the same)
+        onAuthSuccess();
     };
 
     return (
         <>
-            {/* Close Button - Uses the 'onClose' prop */}
-            <button 
-                onClick={onClose}
-                className="absolute top-4 right-4 text-gray-400 hover:text-white transition-colors p-2 rounded-full hover:bg-slate-800"
-                aria-label="Close"
-            >
-                <X className="w-5 h-5" />
-            </button>
-            
             <h2 className="text-3xl font-bold mb-8 text-center text-white">
                 Create Your Account
             </h2>

Frontend/src/components/dashboard/Sidebar.tsx

@@ -2,22 +2,23 @@ import React from "react";
 import { Link, useLocation } from "react-router-dom";
 import { 
   Home, FileText, Brain, BookOpen, 
-  Bell, Settings, User, LogOut 
+  Settings, User, LogOut 
 } from "lucide-react";
 
 interface SidebarProps {
-  onLogout?: () => void;
+  onLogout?: () => void; // Function to handle logging out
 }
 
 const Sidebar: React.FC<SidebarProps> = ({ onLogout }) => {
   const location = useLocation();
 
   const navItems = [
-    { path: "/", label: "Dashboard", icon: <Home size={18} /> },
+    { path: "/dashboard", label: "Dashboard", icon: <Home size={18} /> },
     { path: "/notes", label: "Notes", icon: <BookOpen size={18} /> },
     { path: "/AIInterview", label: "AI Interview", icon: <Brain size={18} /> },
     { path: "/quize", label: "Resume Quiz", icon: <FileText size={18} /> },
   ];
+  
   return (
     <aside className="w-64 bg-linear-to-r from-blue-700 to-gray-900/50 text-white flex flex-col justify-between">
       
@@ -43,19 +44,25 @@ const Sidebar: React.FC<SidebarProps> = ({ onLogout }) => {
         </nav>
       </div>
 
-      {/* Bottom Section (From Header) */}
+      {/* Bottom Section (User Actions) */}
       <div className="p-4 border-t border-gray-700 space-y-4">
-        <button className="flex items-center space-x-3 p-3 rounded-lg hover:bg-gray-800 transition w-full text-left">
+        {/* Settings Button */}
+        <button className="flex items-center space-x-3 p-3 rounded-lg hover:bg-gray-800 transition w-full text-left text-gray-300">
           <Settings size={18} />
           <span>Settings</span>
         </button>
 
-        <button className="flex items-center space-x-3 p-3 rounded-lg hover:bg-gray-800 transition w-full text-left">
+        {/* User Profile Placeholder */}
+        <button className="flex items-center space-x-3 p-3 rounded-lg hover:bg-gray-800 transition w-full text-left text-gray-300">
           <User size={18} />
           <span>John Doe</span>
         </button>
 
-        <button className="flex items-center space-x-3 p-3 rounded-lg hover:bg-red-600 text-black transition w-full text-left">
+        {/* Logout Button (Click handler added here) */}
+        <button 
+          onClick={onLogout}
+          className="flex items-center space-x-3 p-3 rounded-lg bg-red-500 hover:bg-red-600 text-black hover:text-white transition w-full text-left font-medium"
+        >
           <LogOut size={18} />
           <span>Logout</span>
         </button>