{"version":3,"file":"static/js/7.0b994fa0.chunk.js","mappings":"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","sources":["components/Pageslices/Enrollbutton/PopupSignInForm.js","webpack://Top Choice for Training in Hyderabad - Social Prachar/./src/components/Pageslices/Whatwillyoulearn/Whatwillyoulearn.module.css?e376","components/Pageslices/Whatwillyoulearn/Whatwillyoulearn.js","webpack://Top Choice for Training in Hyderabad - Social Prachar/./src/components/Pageslices/Enrollbutton/PopUpForm.module.css?5a53"],"sourcesContent":["import React, { useState, useEffect, Suspense } from 'react';\r\nimport styles from './PopUpForm.module.css';\r\nimport { data } from './../../Cards/CardData';\r\nimport { useNavigate, useParams } from 'react-router-dom';\r\nimport Loading from '../../extraComponents/loading';\r\n\r\nconst SignInForm = ({ onClose, courseID, actionType }) => {\r\n    const { slug } = useParams();\r\n    const [card, setCard] = useState(null);\r\n    const [isLoading, setIsLoading] = useState(false);\r\n    const navigate = useNavigate();\r\n\r\n    const [formData, setFormData] = useState({\r\n        fullName: '',\r\n        email: '',\r\n        phone: '',\r\n        course: '',\r\n        mode: '',\r\n        pageUrl: window.location.href,\r\n        slug: slug || \"\",\r\n        actionType: actionType || \"\"\r\n    });\r\n\r\n\r\n    useEffect(() => {\r\n        const cardDetails = data.find(card => card.slug === slug);\r\n        setCard(cardDetails);\r\n    }, [slug]);\r\n\r\n    const scriptURL = 'https://script.google.com/macros/s/AKfycbyiFH6YnpFoN2CeaCSOIB5Uv0667e_H3u183xrWTeK95GHV7iUBO1TPn40C6ydXYME2/exec';\r\n\r\n    const handleSubmit = async (e) => {\r\n        e.preventDefault();\r\n        const { fullName, email, phone, actionType, course, mode, pageUrl, slug } = formData;\r\n\r\n        const phoneRegex = /^\\d{10}$/;\r\n        if (!phoneRegex.test(phone)) {\r\n            alert(\"Please enter a valid 10-digit phone number.\");\r\n            return;\r\n        }\r\n\r\n\r\n        if (!fullName || !email || !phone || !course || !mode) {\r\n            alert('Please fill in all required fields.');\r\n            return;\r\n        }\r\n\r\n        setIsLoading(true); // Show loading spinner\r\n\r\n        try {\r\n            const formPayload = new FormData();\r\n            formPayload.append('fullName', formData.fullName);\r\n            formPayload.append('email', formData.email);\r\n            formPayload.append('phone', formData.phone);\r\n            formPayload.append('actionType', actionType);\r\n            formPayload.append('course', formData.course);\r\n            formPayload.append('mode', formData.mode);\r\n            formPayload.append('pageUrl', pageUrl); // Send Page URL\r\n            formPayload.append('slug', slug); // Send Page Slug\r\n\r\n\r\n            const response = await fetch(scriptURL, {\r\n                method: 'POST',\r\n                body: formPayload,\r\n            });\r\n\r\n            setIsLoading(false);\r\n\r\n            if (response.ok) {\r\n                alert('Form submitted successfully!');\r\n                navigate('/thank-you');\r\n            } else {\r\n                alert('Failed to submit form. Please try again.');\r\n            }\r\n        } catch (error) {\r\n            setIsLoading(false);\r\n            console.error('Error:', error);\r\n            alert('There was an error submitting the form.');\r\n        }\r\n    };\r\n\r\n    const handleChange = (e) => {\r\n        const { name, value } = e.target;\r\n        setFormData({ ...formData, [name]: value });\r\n    };\r\n\r\n    return (\r\n        <div className={styles.overlay}>\r\n            {/* Lazy Loading Spinner at the top */}\r\n            {isLoading && (\r\n                <div className={styles.loadingOverlay}>\r\n                    <Suspense fallback={<div>Loading...</div>}>\r\n                        <Loading />\r\n                    </Suspense>\r\n                </div>\r\n            )}\r\n\r\n            <div className={styles.formContainer}>\r\n                <button\r\n                    className={styles.closeButton}\r\n                    onClick={onClose}\r\n                    aria-label=\"Close Form\"\r\n                >\r\n                    &times;\r\n                </button>\r\n                <form>\r\n                    <h2>Enroll Now</h2>\r\n                    {/* Full Name */}\r\n                    <div className={styles.formGroup}>\r\n                        <input\r\n                            type=\"text\"\r\n                            name=\"fullName\"\r\n                            placeholder=\"Full Name\"\r\n                            value={formData.fullName}\r\n                            onChange={handleChange}\r\n                            required\r\n                        />\r\n                    </div>\r\n\r\n                    {/* Email */}\r\n                    <div className={styles.formGroup}>\r\n                        <input\r\n                            type=\"email\"\r\n                            name=\"email\"\r\n                            placeholder=\"Email\"\r\n                            value={formData.email}\r\n                            onChange={handleChange}\r\n                            required\r\n                        />\r\n                    </div>\r\n\r\n                    {/* Phone Number */}\r\n                    <div className={styles.formGroup}>\r\n                        <input\r\n                            type=\"tel\"\r\n                            name=\"phone\"\r\n                            placeholder=\"Phone Number\"\r\n                            value={formData.phone}\r\n                            onChange={handleChange}\r\n                            required\r\n                        />\r\n                    </div>\r\n\r\n                    {/* Select Course */}\r\n                    <div className={styles.formGroup}>\r\n                        <select\r\n                            name=\"course\"\r\n                            value={formData.course}\r\n                            onChange={handleChange}\r\n                            required\r\n                        >\r\n                            <option value=\"\">Select Course</option>\r\n                            {card && card.popUpDropDownCourses && card.popUpDropDownCourses.length > 0 ? (\r\n                                card.popUpDropDownCourses.map((course) => (\r\n                                    <option key={course.dropDownid} value={course.courseName}>\r\n                                        {course.courseName}\r\n                                    </option>\r\n                                ))\r\n                            ) : (\r\n                                <option disabled>No available courses</option>\r\n                            )}\r\n                        </select>\r\n                    </div>\r\n\r\n                    {/* Select Training Mode */}\r\n                    <div className={styles.formGroup}>\r\n                        <select\r\n                            name=\"mode\"\r\n                            value={formData.mode}\r\n                            onChange={handleChange}\r\n                            required\r\n                        >\r\n                            <option value=\"\">Select Training Mode</option>\r\n                            <option value=\"Online\">Online</option>\r\n                            <option value=\"Offline\">Offline</option>\r\n                        </select>\r\n                    </div>\r\n\r\n                    {/* Submit Button */}\r\n                    <button\r\n                        type=\"submit\"\r\n                        className={styles.submitButton}\r\n                        onClick={handleSubmit}\r\n                    >\r\n                        {isLoading ? 'Submitting...' : 'Submit'}\r\n                    </button>\r\n                </form>\r\n            </div>\r\n        </div>\r\n    );\r\n};\r\n\r\nexport default SignInForm;\r\n","// extracted by mini-css-extract-plugin\nexport default {\"container\":\"Whatwillyoulearn_container__iriq0\",\"header\":\"Whatwillyoulearn_header__jIrne\",\"heading\":\"Whatwillyoulearn_heading__Lg-u+\",\"description\":\"Whatwillyoulearn_description__cpbCq\",\"modules\":\"Whatwillyoulearn_modules__WhqvU\",\"moduleContainer\":\"Whatwillyoulearn_moduleContainer__lhxPa\",\"moduleTitle\":\"Whatwillyoulearn_moduleTitle__K4AXD\",\"moduleSubTitle\":\"Whatwillyoulearn_moduleSubTitle__uLU-k\",\"details\":\"Whatwillyoulearn_details__cX8pC\",\"detailItem\":\"Whatwillyoulearn_detailItem__+nlKy\",\"descriptionsContainer\":\"Whatwillyoulearn_descriptionsContainer__Qg-tL\",\"descriptionItem\":\"Whatwillyoulearn_descriptionItem__uneCM\",\"masterclassInfo\":\"Whatwillyoulearn_masterclassInfo__btJZ-\",\"backgroundImage\":\"Whatwillyoulearn_backgroundImage__GTxBh\",\"masterclassQuestion\":\"Whatwillyoulearn_masterclassQuestion__n0Ndu\",\"roleContainer\":\"Whatwillyoulearn_roleContainer__F11aD\",\"role\":\"Whatwillyoulearn_role__hN3rK\",\"roleImage\":\"Whatwillyoulearn_roleImage__5ZD3g\",\"roleTitle\":\"Whatwillyoulearn_roleTitle__K6xLe\",\"roleDescription\":\"Whatwillyoulearn_roleDescription__-vb7P\",\"detailsContainer\":\"Whatwillyoulearn_detailsContainer__nbhNz\"};","import React, { useEffect, useState } from 'react';\r\nimport styles from './Whatwillyoulearn.module.css';\r\nimport { data } from '../../Cards/CardData';\r\nimport { FontAwesomeIcon } from '@fortawesome/react-fontawesome';\r\nimport { faClock } from '@fortawesome/free-regular-svg-icons';\r\nimport backgroundImage from '../../../assets/AssetsOfDetailsPage/background.png';\r\nimport { useParams } from 'react-router-dom';\r\nimport Buttonstyle from '../Enrollbutton/Enrollbutton.module.css';\r\nimport SignInForm from '../Enrollbutton/PopupSignInForm';\r\n\r\nconst colors = [\"#f0f8ff\", \"#f5f5dc\", \"#ffe4e1\", \"#e6e6fa\", \"#ffefd5\", \"#d3ffce\", \"#e6e6fa\", \"#ffefd5\", \"#d3ffce\"];\r\n\r\nconst Whatwillyoulearn = () => {\r\n    const { slug } = useParams();\r\n    const [card, setCard] = useState(null);\r\n    const [courseID,setCourseID] = useState(null);\r\n    const [isPopupVisible, setIsPopupVisible] = useState(false);\r\n\r\n    const togglePopup = () => {\r\n        setIsPopupVisible(!isPopupVisible);\r\n    };\r\n\r\n\r\n    useEffect(() => {\r\n        const cardDetails = data.find(item => item.slug === slug);\r\n        setCard(cardDetails);\r\n        setCourseID(cardDetails.courseID);\r\n    }, [slug]);\r\n\r\n    if (!card) {\r\n        return <div>Loading...</div>;\r\n    }\r\n\r\n    return (\r\n        <div className={styles.totalPage}>\r\n            <div className={styles.container}>\r\n                <div className={styles.header}>\r\n                    <p className={styles.heading}>\r\n                        What will you <span>Learn</span>?\r\n                    </p>\r\n                    <p className={styles.description}>\r\n                        {card.Description}\r\n                    </p>\r\n                </div>\r\n\r\n                <div className={styles.modules}>\r\n                    {card.moduleContent && card.moduleContent.map((module, index) => (\r\n                        <div\r\n                            key={module.id}\r\n                            className={styles.moduleContainer}\r\n                            style={{ backgroundColor: colors[index % colors.length] }}\r\n                        >\r\n                            <div className={styles.moduleHeader}>\r\n                                <p className={styles.moduleTitle}>{module.module}</p>\r\n                                <p className={styles.moduleSubTitle}>{module.title}</p>\r\n                            </div>\r\n\r\n                            <div className={styles.detailsContainer}>\r\n                                <div className={styles.details}>\r\n                                    <div className={styles.detailItem}>\r\n                                        <FontAwesomeIcon icon={faClock} />\r\n                                        <p>Time: {module.details.time}</p>\r\n                                    </div>\r\n                                </div>\r\n                            </div>\r\n\r\n                            <div className={styles.descriptionsContainer}>\r\n                                {module.details.descriptions.map((description, i) => (\r\n                                    <p key={i} className={styles.descriptionItem}>{description}</p>\r\n                                ))}\r\n                            </div>\r\n                        </div>\r\n                    ))}\r\n                </div>\r\n            </div>\r\n\r\n            <div className={styles.masterclassInfo}>\r\n                <img src={backgroundImage} alt=\"Background\" className={styles.backgroundImage} />\r\n                <p className={styles.masterclassQuestion}>Who is this <span>Course</span> for...?</p>\r\n                <section className={styles.roleContainer}>\r\n                    {card && card.courseFor.map((course, index) => (\r\n                        <article key={index} className={styles.role}>\r\n                            <img src={course.image} alt={course.alt} className={styles.roleImage} />\r\n                            <div className={styles.roleContent}>\r\n                                <h3 className={styles.roleTitle}>{course.title}</h3>\r\n                                <p className={styles.roleDescription}>{course.content}</p>\r\n                            </div>\r\n                        </article>\r\n                    ))}\r\n                </section>\r\n\r\n                <div className='pt-5'>\r\n                    <h2>\r\n                        Skill Up Now, Pay in Easy Installments! –\r\n                        <span style={{ color: '#ff5003' }}>\r\n                            {courseID ===  8 ? \"\" : courseID === 1 ? \"₹3,500/month EMIs\" : \"₹2,999/month EMIs\"}\r\n                        </span>\r\n                        <button className={`${Buttonstyle.shinebtn} btn`} onClick={togglePopup}>\r\n                            Get Details\r\n                        </button>\r\n                    </h2>\r\n                    {isPopupVisible && <SignInForm onClose={togglePopup} actionType=\"Button:pricing Details\" />}\r\n                </div>\r\n            </div>\r\n        </div>\r\n    );\r\n};\r\n\r\nexport default Whatwillyoulearn;\r\n","// extracted by mini-css-extract-plugin\nexport default {\"overlay\":\"PopUpForm_overlay__It6SE\",\"loadingOverlay\":\"PopUpForm_loadingOverlay__7YVjw\",\"formContainer\":\"PopUpForm_formContainer__AuNgd\",\"formGroup\":\"PopUpForm_formGroup__gBm+J\",\"submitButton\":\"PopUpForm_submitButton__L34e2\",\"closeButton\":\"PopUpForm_closeButton__SEQea\"};"],"names":["_ref","onClose","courseID","actionType","slug","useParams","card","setCard","useState","isLoading","setIsLoading","navigate","useNavigate","formData","setFormData","fullName","email","phone","course","mode","pageUrl","window","location","href","useEffect","cardDetails","data","find","handleChange","e","name","value","target","_jsxs","className","styles","overlay","children","_jsx","loadingOverlay","Suspense","fallback","Loading","formContainer","closeButton","onClick","formGroup","type","placeholder","onChange","required","popUpDropDownCourses","length","map","courseName","dropDownid","disabled","submitButton","async","preventDefault","test","formPayload","FormData","append","response","fetch","method","body","ok","alert","error","console","colors","Whatwillyoulearn","setCourseID","isPopupVisible","setIsPopupVisible","togglePopup","item","totalPage","container","header","heading","description","Description","modules","moduleContent","module","index","moduleContainer","style","backgroundColor","moduleHeader","moduleTitle","moduleSubTitle","title","detailsContainer","details","detailItem","FontAwesomeIcon","icon","faClock","time","descriptionsContainer","descriptions","i","descriptionItem","id","masterclassInfo","src","backgroundImage","alt","masterclassQuestion","roleContainer","courseFor","role","image","roleImage","roleContent","roleTitle","roleDescription","content","color","concat","Buttonstyle","shinebtn","SignInForm"],"sourceRoot":""}