{"ast":null,"code":"import React,{useState,useEffect}from'react';import{useNavigate}from'react-router-dom';import{useAuth}from'../contexts/AuthContext';import{jsx as _jsx,jsxs as _jsxs}from\"react/jsx-runtime\";const Login=()=>{const[formData,setFormData]=useState({username:'',password:''});const[error,setError]=useState('');const[loading,setLoading]=useState(false);const{login,isAuthenticated}=useAuth();const navigate=useNavigate();// Redirect if already authenticated\nuseEffect(()=>{if(isAuthenticated){navigate('/',{replace:true});}},[isAuthenticated,navigate]);const handleChange=e=>{setFormData({...formData,[e.target.name]:e.target.value});setError('');// Clear error when user types\n};const handleSubmit=async e=>{e.preventDefault();setLoading(true);setError('');const result=await login(formData.username,formData.password);if(!result.success){setError(result.message);setLoading(false);}else{// Success! The useEffect will handle the redirect when isAuthenticated becomes true\nsetLoading(false);}};return/*#__PURE__*/_jsx(\"div\",{className:\"min-h-screen bg-gradient-to-br from-blue-50 to-indigo-100 flex items-center justify-center py-12 px-4 sm:px-6 lg:px-8\",children:/*#__PURE__*/_jsxs(\"div\",{className:\"max-w-md w-full space-y-8\",children:[/*#__PURE__*/_jsxs(\"div\",{className:\"text-center\",children:[/*#__PURE__*/_jsx(\"div\",{className:\"mx-auto h-16 w-16 bg-indigo-600 rounded-full flex items-center justify-center\",children:/*#__PURE__*/_jsx(\"svg\",{className:\"h-8 w-8 text-white\",fill:\"none\",stroke:\"currentColor\",viewBox:\"0 0 24 24\",children:/*#__PURE__*/_jsx(\"path\",{strokeLinecap:\"round\",strokeLinejoin:\"round\",strokeWidth:2,d:\"M13 10V3L4 14h7v7l9-11h-7z\"})})}),/*#__PURE__*/_jsx(\"h2\",{className:\"mt-6 text-3xl font-extrabold text-gray-900\",children:\"SolarBank IoT Dashboard\"}),/*#__PURE__*/_jsx(\"p\",{className:\"mt-2 text-sm text-gray-600\",children:\"Sign in to access your dashboard\"})]}),/*#__PURE__*/_jsx(\"form\",{className:\"mt-8 space-y-6\",onSubmit:handleSubmit,children:/*#__PURE__*/_jsxs(\"div\",{className:\"bg-white shadow-lg rounded-lg p-6\",children:[/*#__PURE__*/_jsxs(\"div\",{className:\"space-y-4\",children:[/*#__PURE__*/_jsxs(\"div\",{children:[/*#__PURE__*/_jsx(\"label\",{htmlFor:\"username\",className:\"block text-sm font-medium text-gray-700\",children:\"Username\"}),/*#__PURE__*/_jsx(\"input\",{id:\"username\",name:\"username\",type:\"text\",required:true,value:formData.username,onChange:handleChange,className:\"mt-1 appearance-none relative block w-full px-3 py-2 border border-gray-300 placeholder-gray-500 text-gray-900 rounded-md focus:outline-none focus:ring-indigo-500 focus:border-indigo-500 focus:z-10 sm:text-sm\",placeholder:\"Enter your username\"})]}),/*#__PURE__*/_jsxs(\"div\",{children:[/*#__PURE__*/_jsx(\"label\",{htmlFor:\"password\",className:\"block text-sm font-medium text-gray-700\",children:\"Password\"}),/*#__PURE__*/_jsx(\"input\",{id:\"password\",name:\"password\",type:\"password\",required:true,value:formData.password,onChange:handleChange,className:\"mt-1 appearance-none relative block w-full px-3 py-2 border border-gray-300 placeholder-gray-500 text-gray-900 rounded-md focus:outline-none focus:ring-indigo-500 focus:border-indigo-500 focus:z-10 sm:text-sm\",placeholder:\"Enter your password\"})]})]}),error&&/*#__PURE__*/_jsx(\"div\",{className:\"mt-4 bg-red-50 border border-red-200 text-red-600 px-4 py-3 rounded-md text-sm\",children:error}),/*#__PURE__*/_jsx(\"div\",{className:\"mt-6\",children:/*#__PURE__*/_jsx(\"button\",{type:\"submit\",disabled:loading,className:`group relative w-full flex justify-center py-2 px-4 border border-transparent text-sm font-medium rounded-md text-white ${loading?'bg-gray-400 cursor-not-allowed':'bg-indigo-600 hover:bg-indigo-700 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-indigo-500'}`,children:loading?/*#__PURE__*/_jsxs(\"div\",{className:\"flex items-center\",children:[/*#__PURE__*/_jsx(\"div\",{className:\"animate-spin rounded-full h-4 w-4 border-b-2 border-white mr-2\"}),\"Signing in...\"]}):'Sign in'})})]})}),/*#__PURE__*/_jsx(\"div\",{className:\"text-center\",children:/*#__PURE__*/_jsxs(\"div\",{className:\"bg-blue-50 border border-blue-200 rounded-md p-4\",children:[/*#__PURE__*/_jsx(\"p\",{className:\"text-sm text-blue-600 font-medium\",children:\"Default Login Credentials:\"}),/*#__PURE__*/_jsxs(\"p\",{className:\"text-xs text-blue-500 mt-1\",children:[\"Username: \",/*#__PURE__*/_jsx(\"strong\",{children:\"admin\"}),\" | Password: \",/*#__PURE__*/_jsx(\"strong\",{children:\"admin123\"})]})]})})]})});};export default Login;","map":{"version":3,"names":["React","useState","useEffect","useNavigate","useAuth","jsx","_jsx","jsxs","_jsxs","Login","formData","setFormData","username","password","error","setError","loading","setLoading","login","isAuthenticated","navigate","replace","handleChange","e","target","name","value","handleSubmit","preventDefault","result","success","message","className","children","fill","stroke","viewBox","strokeLinecap","strokeLinejoin","strokeWidth","d","onSubmit","htmlFor","id","type","required","onChange","placeholder","disabled"],"sources":["/home/m3mo/Desktop/temparea/solarbank/frontend/src/components/Login.js"],"sourcesContent":["import React, { useState, useEffect } from 'react';\nimport { useNavigate } from 'react-router-dom';\nimport { useAuth } from '../contexts/AuthContext';\n\nconst Login = () => {\n const [formData, setFormData] = useState({\n username: '',\n password: '',\n });\n const [error, setError] = useState('');\n const [loading, setLoading] = useState(false);\n const { login, isAuthenticated } = useAuth();\n const navigate = useNavigate();\n\n // Redirect if already authenticated\n useEffect(() => {\n if (isAuthenticated) {\n navigate('/', { replace: true });\n }\n }, [isAuthenticated, navigate]);\n\n const handleChange = (e) => {\n setFormData({\n ...formData,\n [e.target.name]: e.target.value,\n });\n setError(''); // Clear error when user types\n };\n\n const handleSubmit = async (e) => {\n e.preventDefault();\n setLoading(true);\n setError('');\n\n const result = await login(formData.username, formData.password);\n \n if (!result.success) {\n setError(result.message);\n setLoading(false);\n } else {\n // Success! The useEffect will handle the redirect when isAuthenticated becomes true\n setLoading(false);\n }\n };\n\n return (\n
\n Sign in to access your dashboard\n
\nDefault Login Credentials:
\n\n Username: admin | Password: admin123\n
\n