diff --git a/src/Components/RegisterForWorkShop/RegisterForWorkShop.js b/src/Components/RegisterForWorkShop/RegisterForWorkShop.js
new file mode 100644
index 0000000..77b0849
--- /dev/null
+++ b/src/Components/RegisterForWorkShop/RegisterForWorkShop.js
@@ -0,0 +1,379 @@
+import React, { useState, useRef } from "react";
+import {
+ TextField,
+ Button,
+ Box,
+ Typography,
+ MenuItem,
+ Alert,
+ Snackbar,
+} from "@mui/material";
+import { collection, addDoc } from "firebase/firestore";
+import db from "../../firebase";
+import { ref, uploadBytes, getDownloadURL } from "firebase/storage"; // Import Firebase Storage methods
+import { storage } from "../../firebase";
+
+const RegisterForWorkshop = () => {
+ const fileInputRef = useRef(null);
+
+ const initialBasicDetails = {
+ name: "",
+ email: "",
+ contactNumber: "",
+ registrationNumber: "",
+ };
+
+ const initialAdditionalDetails = {
+ course: "",
+ yearOfStudy: "",
+ branch: "",
+ };
+
+ const [basicDetails, setBasicDetails] = useState(initialBasicDetails);
+ const [additionalDetails, setAdditionalDetails] = useState(initialAdditionalDetails);
+ const [paymentScreenshot, setPaymentScreenshot] = useState(null); // New state for file upload
+ const [showAdditionalFields, setShowAdditionalFields] = useState(false);
+ const [successMessage, setSuccessMessage] = useState("");
+ const [openSnackbar, setOpenSnackbar] = useState(false);
+ const [basicDetailsError, setBasicDetailsError] = useState({
+ name: false,
+ email: false,
+ contactNumber: false,
+ registrationNumber: false,
+ });
+
+ const handleBasicDetailsChange = (e) => {
+ const { name, value } = e.target;
+ if (name === "email") {
+ const isValidEmail = /^[^\s@]+@[^\s@]+\.[^\s@]+$/.test(value);
+ setBasicDetailsError((prevState) => ({
+ ...prevState,
+ [name]: value.trim().length > 0 && !isValidEmail,
+ }));
+ } else if (name === "contactNumber") {
+ const isValidContactNumber = /^\d{10}$/.test(value);
+ setBasicDetailsError((prevState) => ({
+ ...prevState,
+ [name]: value.trim().length > 0 && !isValidContactNumber,
+ }));
+ }
+ setBasicDetails((prevState) => ({
+ ...prevState,
+ [name]: value,
+ }));
+ setBasicDetailsError((prevState) => ({
+ ...prevState,
+ [name]: false,
+ }));
+ };
+
+ const handleAdditionalDetailsChange = (e) => {
+ const { name, value } = e.target;
+ setAdditionalDetails((prevState) => ({
+ ...prevState,
+ [name]: value,
+ }));
+ };
+
+ const handleFileChange = (e) => {
+ setPaymentScreenshot(e.target.files[0]); // Set the uploaded file
+ };
+
+ const handleCloseSnackbar = (event, reason) => {
+ if (reason === 'clickaway') {
+ return;
+ }
+ setOpenSnackbar(false);
+ };
+
+ const handleContinue = () => {
+ if (
+ basicDetails.name &&
+ /^\d{10}$/.test(basicDetails.contactNumber) &&
+ basicDetails.registrationNumber &&
+ /^[^\s@]+@[^\s@]+\.[^\s@]+$/.test(basicDetails.email)
+ ) {
+ setShowAdditionalFields(true);
+ } else {
+ setBasicDetailsError({
+ name: !basicDetails.name,
+ email:
+ !basicDetails.email ||
+ (basicDetails.email.trim().length > 0 &&
+ !/^[^\s@]+@[^\s@]+\.[^\s@]+$/.test(basicDetails.email)),
+ contactNumber:
+ basicDetails.contactNumber.trim().length === 0 ||
+ !/^\d{10}$/.test(basicDetails.contactNumber),
+ registrationNumber: !basicDetails.registrationNumber,
+ });
+ }
+ };
+
+ const handleBack = () => {
+ setShowAdditionalFields(false);
+ };
+
+ const handleSubmit = async (e) => {
+ e.preventDefault();
+ console.log("Form is being submitted");
+
+ if (!paymentScreenshot) {
+ alert("Please upload a payment screenshot before submitting.");
+ return;
+ }
+
+ try {
+ const storageRef = ref(storage, `workshopRegistrations/${paymentScreenshot.name}`); // Make sure this path is correct
+ await uploadBytes(storageRef, paymentScreenshot);
+ const downloadURL = await getDownloadURL(storageRef);
+
+ await addDoc(collection(db, "workshopRegistrations"), {
+ ...basicDetails,
+ ...additionalDetails,
+ paymentScreenshot: downloadURL,
+ timestamp: new Date(),
+ });
+
+ console.log("Data successfully added to Firestore");
+
+ setSuccessMessage("Registered successfully!");
+ setOpenSnackbar(true);
+ setBasicDetails(initialBasicDetails);
+ setAdditionalDetails(initialAdditionalDetails);
+ setPaymentScreenshot(null); // Reset file input
+
+ if (fileInputRef.current) {
+ fileInputRef.current.value = null; // Clear file input value
+ }
+
+ setShowAdditionalFields(false);
+
+ } catch (error) {
+ console.error("Error adding document: ", error);
+ }
+};
+
+ return (
+
+ {/* Poster Image */}
+
+ 
+
+
+ {/* Registration Form */}
+
+
+ Register for Workshop
+
+
+
+
+ {successMessage}
+
+
+
+ {!showAdditionalFields && (
+ <>
+
+
+
+
+
+
+
+
+
+
+
+ Payment Information
+
+
+ 
+
+ Scan the QR code and pay ₹99
+
+
+
+
+
+
+
+
+ )}
+
+
+ );
+};
+
+export default RegisterForWorkshop;
diff --git a/src/firebase.js b/src/firebase.js
index 3ac6046..c79285c 100644
--- a/src/firebase.js
+++ b/src/firebase.js
@@ -17,12 +17,13 @@ const firebaseConfig = {
const firebaseApp = firebase.initializeApp(firebaseConfig);
const db = firebaseApp.firestore();
const auth = firebase.auth();
-const storage = getStorage(firebaseApp)
+const storage = getStorage(firebaseApp);
const googleProvider = new firebase.auth.GoogleAuthProvider();
const githubProvider = new firebase.auth.GithubAuthProvider();
const facebookProvider = new firebase.auth.FacebookAuthProvider();
const twitterProvider = new firebase.auth.TwitterAuthProvider();
const analytics = getAnalytics(firebaseApp);
-export { auth, googleProvider, githubProvider, facebookProvider, twitterProvider, storage, analytics }
+export { auth, googleProvider, githubProvider, facebookProvider, twitterProvider, analytics }
+export { storage };
export default db;
\ No newline at end of file
+
+
+