Sign up
-
- Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod
- tempor incididunt ut labore et dolore magna aliqua.
-
+
Don't have an account? Register now to access all features!
Register Now!
@@ -80,7 +201,7 @@ const Login = () => {
- )
-}
+ );
+};
-export default Login
+export default Login;
\ No newline at end of file
diff --git a/src/views/pages/login/authSlice.js b/src/views/pages/login/authSlice.js
new file mode 100644
index 000000000..213ae0d3f
--- /dev/null
+++ b/src/views/pages/login/authSlice.js
@@ -0,0 +1,27 @@
+import { createSlice } from '@reduxjs/toolkit';
+
+const initialState = {
+ user: null,
+ isAuthenticated: false,
+ loading: true
+};
+
+const authSlice = createSlice({
+ name: 'auth',
+ initialState,
+ reducers: {
+ loginSuccess: (state, action) => {
+ state.user = action.payload;
+ state.isAuthenticated = true;
+ state.loading = false;
+ },
+ logout: (state) => {
+ state.user = null;
+ state.isAuthenticated = false;
+ state.loading = false;
+ }
+ }
+});
+
+export const { loginSuccess, logout } = authSlice.actions;
+export default authSlice.reducer;
\ No newline at end of file
diff --git a/src/views/pages/register/Register.js b/src/views/pages/register/Register.js
index d78b24c8f..994fd64bf 100644
--- a/src/views/pages/register/Register.js
+++ b/src/views/pages/register/Register.js
@@ -1,4 +1,5 @@
-import React from 'react'
+import React, { useState } from 'react';
+import { useNavigate } from 'react-router-dom';
import {
CButton,
CCard,
@@ -7,14 +8,396 @@ import {
CContainer,
CForm,
CFormInput,
+ CFormSelect,
CInputGroup,
CInputGroupText,
CRow,
-} from '@coreui/react'
-import CIcon from '@coreui/icons-react'
-import { cilLockLocked, cilUser } from '@coreui/icons'
+ CAlert,
+ CProgress
+} from '@coreui/react';
+import CIcon from '@coreui/icons-react';
+import { cilLockLocked, cilUser, cilPhone, cilContact, cilShieldAlt } from '@coreui/icons';
+import {
+ createUserWithEmailAndPassword,
+ signInWithPopup,
+ GoogleAuthProvider
+} from "firebase/auth";
+import { auth, firestore } from '../../../Firebase/firebase';
+import { doc, setDoc, serverTimestamp } from 'firebase/firestore';
+
+// Google Auth Provider Configuration
+const googleProvider = new GoogleAuthProvider();
const Register = () => {
+ const [step, setStep] = useState(1);
+ const [formData, setFormData] = useState({
+ email: '',
+ password: '',
+ confirmPassword: '',
+ firstName: '',
+ lastName: '',
+ phone: '',
+ role: '',
+ emergencyNumber: '',
+ subjects: '',
+ permissions: ''
+ });
+
+ const [error, setError] = useState('');
+ const [loading, setLoading] = useState(false);
+ const navigate = useNavigate();
+
+ const handleSubmit = async (e) => {
+ e.preventDefault();
+
+ if (step === 1) {
+ if (!validateStep1()) return;
+ setStep(2);
+ return;
+ }
+
+ if (step === 2) {
+ if (!validateStep2()) return;
+ setStep(3);
+ return;
+ }
+
+ await handleFinalSubmission();
+ };
+
+ const handleGoogleSignUp = async () => {
+ try {
+ const result = await signInWithPopup(auth, googleProvider);
+ const user = result.user;
+ const [firstName, lastName] = user.displayName?.split(' ') || ['', ''];
+
+ const userData = {
+ firstName,
+ lastName,
+ email: user.email,
+ phone: user.phoneNumber || '',
+ role: 'parent',
+ createdAt: serverTimestamp(),
+ updatedAt: serverTimestamp(),
+ lastLogin: serverTimestamp(),
+ loginCount: 0,
+ parentProfile: {
+ emergencyNumber: '',
+ children: [],
+ communicationPreferences: { email: true, sms: true }
+ }
+ };
+
+ await setDoc(doc(firestore, 'users', user.uid), userData);
+ navigate('/dashboard');
+ } catch (error) {
+ handleFirebaseError(error);
+ }
+ };
+
+ const validateStep1 = () => {
+ if (formData.password !== formData.confirmPassword) {
+ setError('Passwords do not match');
+ return false;
+ }
+ if (formData.password.length < 6) {
+ setError('Password must be at least 6 characters');
+ return false;
+ }
+ return true;
+ };
+
+ const validateStep2 = () => {
+ if (!formData.firstName || !formData.lastName || !formData.phone || !formData.role) {
+ setError('All fields are required');
+ return false;
+ }
+ return true;
+ };
+
+ const handleFinalSubmission = async () => {
+ setLoading(true);
+ try {
+ const userCredential = await createUserWithEmailAndPassword(
+ auth,
+ formData.email,
+ formData.password
+ );
+
+ const userData = {
+ firstName: formData.firstName,
+ lastName: formData.lastName,
+ email: formData.email,
+ phone: formData.phone,
+ role: formData.role,
+ createdAt: serverTimestamp(),
+ updatedAt: serverTimestamp(),
+ lastLogin: serverTimestamp(),
+ loginCount: 0,
+ ...getRoleSpecificData()
+ };
+
+ await setDoc(doc(firestore, 'users', userCredential.user.uid), userData);
+ navigate('/dashboard');
+ } catch (err) {
+ handleFirebaseError(err);
+ } finally {
+ setLoading(false);
+ }
+ };
+
+ const getRoleSpecificData = () => {
+ switch(formData.role) {
+ case 'parent':
+ return {
+ parentProfile: {
+ emergencyNumber: formData.emergencyNumber,
+ children: [],
+ communicationPreferences: { email: true, sms: true }
+ }
+ };
+ case 'teacher':
+ return {
+ teacherProfile: {
+ subjects: formData.subjects.split(',').map(s => s.trim()),
+ classesManaged: [],
+ teacherPerformance: { averageClassAttendance: 0, feedbackScore: 0 }
+ }
+ };
+ case 'admin':
+ return {
+ adminProfile: {
+ permissions: formData.permissions.split(',').map(p => p.trim()),
+ auditMetrics: { lastAudit: null, actionsLogged: 0 }
+ }
+ };
+ default:
+ return {};
+ }
+ };
+
+ const handleChange = (field, value) => {
+ setFormData(prev => ({ ...prev, [field]: value }));
+ };
+
+ const handleFirebaseError = (error) => {
+ switch (error.code) {
+ case 'auth/email-already-in-use':
+ setError('Email is already registered');
+ break;
+ case 'auth/invalid-email':
+ setError('Invalid email address');
+ break;
+ case 'auth/weak-password':
+ setError('Password must be at least 6 characters');
+ break;
+ case 'auth/popup-closed-by-user':
+ setError('Google sign-up window was closed');
+ break;
+ case 'auth/account-exists-with-different-credential':
+ setError('Email already exists with different login method');
+ break;
+ default:
+ setError('Registration failed. Please try again.');
+ }
+ };
+
+ const renderStep = () => {
+ switch (step) {
+ case 1:
+ return (
+ <>
+