function MainComponent() { const [isRegistered, setIsRegistered] = React.useState(false); const [selectedJobs, setSelectedJobs] = React.useState([]); const [selectedOptions, setSelectedOptions] = React.useState({}); const [showMoreJobs, setShowMoreJobs] = React.useState(false); const [showLogin, setShowLogin] = React.useState(false); const [showRegister, setShowRegister] = React.useState(false); const [showMenu, setShowMenu] = React.useState(false); const [showConfirmation, setShowConfirmation] = React.useState(false); const [showDatabaseEntries, setShowDatabaseEntries] = React.useState(false); const [isAdmin, setIsAdmin] = React.useState(false); const [showAdminBackoffice, setShowAdminBackoffice] = React.useState(false); const [showCreateUser, setShowCreateUser] = React.useState(false); const [showDeleteUser, setShowDeleteUser] = React.useState(false); const jobs = [ { title: "Frontend Developer", icon: "fa-code" }, { title: "Backend Developer", icon: "fa-server" }, { title: "Full Stack Developer", icon: "fa-layer-group" }, { title: "DevOps Engineer", icon: "fa-gears" }, { title: "Data Scientist", icon: "fa-chart-line" }, { title: "UI/UX Designer", icon: "fa-paintbrush" }, { title: "Cybersecurity Analyst", icon: "fa-shield-halved" }, { title: "Cloud Architect", icon: "fa-cloud" } ]; const moreJobs = [ { title: "AI Engineer", icon: "fa-robot" }, { title: "Blockchain Developer", icon: "fa-link" }, { title: "IoT Specialist", icon: "fa-microchip" }, { title: "Game Developer", icon: "fa-gamepad" }, { title: "Mobile App Developer", icon: "fa-mobile-alt" }, { title: "QA Engineer", icon: "fa-check-double" }, { title: "Database Administrator", icon: "fa-database" }, { title: "Network Engineer", icon: "fa-network-wired" } ]; const jobOptions = { "Frontend Developer": [ "React", "Vue.js", "Angular", "TypeScript", "Webpack", "Jest", "Cypress", "Redux", "GraphQL", "Sass" ], "Backend Developer": [ "Node.js", "Python", "Java", "Go", "Ruby", "C#", ".NET", "Express.js", "Django", "Spring Boot" ], "Full Stack Developer": [ "MERN Stack", "MEAN Stack", "Ruby on Rails", "Laravel", "ASP.NET Core", "Vue.js + Express", "Django + React", "Spring Boot + Angular", "FastAPI + Vue.js", "Phoenix + Elm" ], "DevOps Engineer": [ "Docker", "Kubernetes", "Jenkins", "Ansible", "Terraform", "Prometheus", "GitLab CI/CD", "AWS CloudFormation", "Puppet", "Chef" ], "Data Scientist": [ "Machine Learning", "Big Data", "Data Visualization", "Python", "R", "TensorFlow", "Scikit-learn", "Pandas", "Spark", "Tableau" ], "UI/UX Designer": [ "Figma", "Adobe XD", "Sketch", "InVision", "Zeplin", "Prototyping", "User Research", "Wireframing", "Accessibility Design", "Motion Design" ], "Cybersecurity Analyst": [ "Network Security", "Ethical Hacking", "Security Auditing", "Penetration Testing", "Incident Response", "Malware Analysis", "SIEM", "Cryptography", "Identity and Access Management", "Cloud Security" ], "Cloud Architect": [ "AWS", "Azure", "Google Cloud", "Serverless Architecture", "Microservices", "Containerization", "Cloud Migration", "Multi-Cloud Strategies", "DevOps Integration", "Cloud Security" ], "AI Engineer": [ "TensorFlow", "PyTorch", "Natural Language Processing", "Computer Vision", "Reinforcement Learning", "Deep Learning", "Keras", "OpenCV", "Scikit-learn", "GANs" ], "Blockchain Developer": [ "Ethereum", "Solidity", "Smart Contracts", "Hyperledger", "Corda", "Web3.js", "Truffle", "Consensus Algorithms", "DApps", "Tokenization" ], "IoT Specialist": [ "Embedded Systems", "Sensors", "MQTT", "Raspberry Pi", "Arduino", "LoRaWAN", "Edge Computing", "IoT Security", "IoT Platforms", "Industrial IoT" ], "Game Developer": [ "Unity", "Unreal Engine", "3D Modeling", "C++", "Game Design", "VR/AR Development", "Game AI", "Physics Engines", "Multiplayer Networking", "Shader Programming" ], "Mobile App Developer": [ "React Native", "Flutter", "Swift", "Kotlin", "Android SDK", "iOS Development", "Mobile UI/UX", "App Store Optimization", "Push Notifications", "Mobile Analytics" ], "QA Engineer": [ "Selenium", "JUnit", "Test Automation", "Manual Testing", "Performance Testing", "API Testing", "Continuous Integration", "Test Planning", "Defect Tracking", "Agile Testing" ], "Database Administrator": [ "SQL", "MongoDB", "Oracle", "PostgreSQL", "MySQL", "Database Design", "Data Modeling", "Database Security", "Performance Tuning", "Backup and Recovery" ], "Network Engineer": [ "Cisco", "VPNs", "Network Security", "Routing Protocols", "Switching", "Firewalls", "Network Monitoring", "SDN", "WAN Optimization", "Wireless Networking" ] }; const handleJobSelect = (job)=>{ setSelectedJobs((prevJobs)=>{ if (prevJobs.includes(job)) { return prevJobs.filter((j)=>j !== job); } else { return [ ...prevJobs, job ]; } }); setSelectedOptions((prevOptions)=>({ ...prevOptions, [job]: prevOptions[job] || [] })); }; const toggleLogin = ()=>{ setShowLogin(!showLogin); setShowRegister(false); setShowMenu(false); }; const toggleRegister = ()=>{ setShowRegister(!showRegister); setShowLogin(false); setShowMenu(false); }; const toggleMenu = ()=>{ setShowMenu(!showMenu); }; const handleOptionToggle = (job, option)=>{ setSelectedOptions((prevOptions)=>({ ...prevOptions, [job]: prevOptions[job].includes(option) ? prevOptions[job].filter((item)=>item !== option) : [ ...prevOptions[job], option ] })); }; const handleConfirmSelection = ()=>{ setShowConfirmation(true); }; const toggleDatabaseEntries = ()=>{ setShowDatabaseEntries(!showDatabaseEntries); }; const toggleAdminBackoffice = ()=>{ setShowAdminBackoffice(!showAdminBackoffice); }; const toggleCreateUser = ()=>{ setShowCreateUser(!showCreateUser); setShowDeleteUser(false); setShowDatabaseEntries(false); }; const toggleDeleteUser = ()=>{ setShowDeleteUser(!showDeleteUser); setShowCreateUser(false); setShowDatabaseEntries(false); }; return /*#__PURE__*/ React.createElement("div", { className: "bg-[#0054FF] min-h-screen text-white font-sans overflow-y-auto pb-20", __source: { fileName: "", lineNumber: 288, columnNumber: 5 }, __self: this }, /*#__PURE__*/ React.createElement("header", { className: "p-4 flex justify-between items-center", __source: { fileName: "", lineNumber: 289, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "flex items-center", __source: { fileName: "", lineNumber: 290, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("img", { src: "/linkstream-logo.png", alt: "LinkStream Logo", className: "h-8 mr-2", __source: { fileName: "", lineNumber: 291, columnNumber: 11 }, __self: this }), /*#__PURE__*/ React.createElement("a", { href: "https://linkstream.be/", className: "text-2xl font-bold text-white hover:text-gray-300", __source: { fileName: "", lineNumber: 296, columnNumber: 11 }, __self: this }, "LinkStream")), /*#__PURE__*/ React.createElement("div", { className: "flex space-x-4", __source: { fileName: "", lineNumber: 303, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("button", { className: "bg-white text-[#0054FF] px-3 py-1 rounded-full", __source: { fileName: "", lineNumber: 304, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("i", { className: "fas fa-search", __source: { fileName: "", lineNumber: 305, columnNumber: 13 }, __self: this })), /*#__PURE__*/ React.createElement("button", { className: "text-white", onClick: toggleMenu, __source: { fileName: "", lineNumber: 307, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("i", { className: "fas fa-bars", __source: { fileName: "", lineNumber: 308, columnNumber: 13 }, __self: this })))), showMenu && /*#__PURE__*/ React.createElement("nav", { className: "bg-[#0066CC] p-4", __source: { fileName: "", lineNumber: 313, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("a", { href: "/", className: "block text-white hover:text-gray-300 py-2", __source: { fileName: "", lineNumber: 314, columnNumber: 11 }, __self: this }, "Home"), /*#__PURE__*/ React.createElement("button", { onClick: toggleRegister, className: "block text-white hover:text-gray-300 py-2 w-full text-left", __source: { fileName: "", lineNumber: 317, columnNumber: 11 }, __self: this }, "Register"), /*#__PURE__*/ React.createElement("button", { onClick: toggleLogin, className: "block text-white hover:text-gray-300 py-2 w-full text-left", __source: { fileName: "", lineNumber: 323, columnNumber: 11 }, __self: this }, "Login")), /*#__PURE__*/ React.createElement("main", { className: "p-4", __source: { fileName: "", lineNumber: 332, columnNumber: 7 }, __self: this }, showLogin ? /*#__PURE__*/ React.createElement(LoginComponent, { setIsAdmin: setIsAdmin, setShowLogin: setShowLogin, __source: { fileName: "", lineNumber: 334, columnNumber: 11 }, __self: this }) : showRegister ? /*#__PURE__*/ React.createElement(RegisterComponent, { setIsRegistered: setIsRegistered, selectedJobs: selectedJobs, selectedOptions: selectedOptions, __source: { fileName: "", lineNumber: 336, columnNumber: 11 }, __self: this }) : showConfirmation ? /*#__PURE__*/ React.createElement("div", { className: "text-center", __source: { fileName: "", lineNumber: 342, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("h2", { className: "text-2xl font-bold mb-4", __source: { fileName: "", lineNumber: 343, columnNumber: 13 }, __self: this }, "Confirm Your Selection"), /*#__PURE__*/ React.createElement("p", { className: "mb-4", __source: { fileName: "", lineNumber: 344, columnNumber: 13 }, __self: this }, "Selected jobs: ", selectedJobs.join(", ")), /*#__PURE__*/ React.createElement("p", { className: "mb-4", __source: { fileName: "", lineNumber: 345, columnNumber: 13 }, __self: this }, "Selected skills:"), Object.entries(selectedOptions).map(([job, skills])=>/*#__PURE__*/ React.createElement("p", { key: job, __source: { fileName: "", lineNumber: 347, columnNumber: 15 }, __self: this }, job, ": ", skills.join(", "))), /*#__PURE__*/ React.createElement("button", { onClick: toggleRegister, className: "w-full bg-white text-[#0054FF] py-2 rounded-full font-bold mt-4 mb-20", __source: { fileName: "", lineNumber: 351, columnNumber: 13 }, __self: this }, "Proceed to Registration")) : showDatabaseEntries ? /*#__PURE__*/ React.createElement(DatabaseEntriesComponent, { __source: { fileName: "", lineNumber: 359, columnNumber: 11 }, __self: this }) : isAdmin ? showAdminBackoffice ? /*#__PURE__*/ React.createElement(AdminBackofficeComponent, { toggleDatabaseEntries: toggleDatabaseEntries, toggleCreateUser: toggleCreateUser, toggleDeleteUser: toggleDeleteUser, __source: { fileName: "", lineNumber: 362, columnNumber: 13 }, __self: this }) : showCreateUser ? /*#__PURE__*/ React.createElement(RegisterComponent, { setIsRegistered: setIsRegistered, selectedJobs: [], selectedOptions: {}, __source: { fileName: "", lineNumber: 368, columnNumber: 13 }, __self: this }) : showDeleteUser ? /*#__PURE__*/ React.createElement(DeleteUserComponent, { __source: { fileName: "", lineNumber: 374, columnNumber: 13 }, __self: this }) : /*#__PURE__*/ React.createElement("div", { className: "text-center", __source: { fileName: "", lineNumber: 376, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("h2", { className: "text-2xl font-bold mb-4", __source: { fileName: "", lineNumber: 377, columnNumber: 15 }, __self: this }, "Admin Dashboard"), /*#__PURE__*/ React.createElement("p", { __source: { fileName: "", lineNumber: 378, columnNumber: 15 }, __self: this }, "Welcome, Admin!"), /*#__PURE__*/ React.createElement("button", { onClick: toggleAdminBackoffice, className: "w-full bg-white text-[#0054FF] py-2 rounded-full font-bold mt-4", __source: { fileName: "", lineNumber: 379, columnNumber: 15 }, __self: this }, "Open Admin Backoffice")) : !isRegistered ? /*#__PURE__*/ React.createElement("div", { __source: { fileName: "", lineNumber: 388, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("h2", { className: "text-2xl font-bold mb-4", __source: { fileName: "", lineNumber: 389, columnNumber: 13 }, __self: this }, "Mark your skills"), /*#__PURE__*/ React.createElement("div", { className: "grid grid-cols-2 sm:grid-cols-3 gap-4 mb-8", __source: { fileName: "", lineNumber: 390, columnNumber: 13 }, __self: this }, jobs.map((job, index)=>/*#__PURE__*/ React.createElement("button", { key: index, className: `p-4 rounded-lg flex flex-col items-center ${selectedJobs.includes(job.title) ? "bg-[#003399]" : "bg-[#0066CC]"}`, onClick: ()=>handleJobSelect(job.title), __source: { fileName: "", lineNumber: 392, columnNumber: 17 }, __self: this }, /*#__PURE__*/ React.createElement("i", { className: `fas ${job.icon} text-3xl mb-2`, __source: { fileName: "", lineNumber: 401, columnNumber: 19 }, __self: this }), /*#__PURE__*/ React.createElement("span", { __source: { fileName: "", lineNumber: 402, columnNumber: 19 }, __self: this }, job.title))), /*#__PURE__*/ React.createElement("button", { className: `p-4 rounded-lg flex flex-col items-center ${showMoreJobs ? "bg-[#003399]" : "bg-[#0066CC]"}`, onClick: ()=>setShowMoreJobs(!showMoreJobs), __source: { fileName: "", lineNumber: 405, columnNumber: 15 }, __self: this }, /*#__PURE__*/ React.createElement("i", { className: `fas ${showMoreJobs ? "fa-chevron-up" : "fa-chevron-down"} text-3xl mb-2`, __source: { fileName: "", lineNumber: 409, columnNumber: 17 }, __self: this }), /*#__PURE__*/ React.createElement("span", { __source: { fileName: "", lineNumber: 412, columnNumber: 17 }, __self: this }, showMoreJobs ? "Less" : "More"))), showMoreJobs && /*#__PURE__*/ React.createElement("div", { className: "grid grid-cols-3 gap-4 mb-8", __source: { fileName: "", lineNumber: 416, columnNumber: 15 }, __self: this }, moreJobs.map((job, index)=>/*#__PURE__*/ React.createElement("button", { key: index, className: `p-4 rounded-lg flex flex-col items-center ${selectedJob === job.title ? "bg-[#003399]" : "bg-[#0066CC]"}`, onClick: ()=>handleJobSelect(job.title), __source: { fileName: "", lineNumber: 418, columnNumber: 19 }, __self: this }, /*#__PURE__*/ React.createElement("i", { className: `fas ${job.icon} text-3xl mb-2`, __source: { fileName: "", lineNumber: 427, columnNumber: 21 }, __self: this }), /*#__PURE__*/ React.createElement("span", { __source: { fileName: "", lineNumber: 428, columnNumber: 21 }, __self: this }, job.title)))), selectedJobs.length > 0 && /*#__PURE__*/ React.createElement("div", { className: "mb-8", __source: { fileName: "", lineNumber: 435, columnNumber: 15 }, __self: this }, selectedJobs.map((job)=>/*#__PURE__*/ React.createElement("div", { key: job, className: "mb-4", __source: { fileName: "", lineNumber: 437, columnNumber: 19 }, __self: this }, /*#__PURE__*/ React.createElement("h3", { className: "text-xl font-bold mb-2", __source: { fileName: "", lineNumber: 438, columnNumber: 21 }, __self: this }, "Options for ", job), /*#__PURE__*/ React.createElement("div", { className: "space-y-2", __source: { fileName: "", lineNumber: 441, columnNumber: 21 }, __self: this }, jobOptions[job].map((option, index)=>/*#__PURE__*/ React.createElement("label", { key: index, className: "flex items-center space-x-2", __source: { fileName: "", lineNumber: 443, columnNumber: 25 }, __self: this }, /*#__PURE__*/ React.createElement("input", { type: "checkbox", className: "form-checkbox text-[#003399]", checked: selectedOptions[job] && selectedOptions[job].includes(option), onChange: ()=>handleOptionToggle(job, option), __source: { fileName: "", lineNumber: 447, columnNumber: 27 }, __self: this }), /*#__PURE__*/ React.createElement("span", { __source: { fileName: "", lineNumber: 456, columnNumber: 27 }, __self: this }, option))))))), selectedJobs.length > 0 && /*#__PURE__*/ React.createElement("button", { onClick: handleConfirmSelection, className: "w-full bg-white text-[#0054FF] py-2 rounded-full font-bold mt-4 mb-20", __source: { fileName: "", lineNumber: 465, columnNumber: 15 }, __self: this }, "Send Information")) : /*#__PURE__*/ React.createElement("div", { className: "text-center", __source: { fileName: "", lineNumber: 474, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("h2", { className: "text-2xl font-bold mb-4", __source: { fileName: "", lineNumber: 475, columnNumber: 13 }, __self: this }, "Application Submitted"), /*#__PURE__*/ React.createElement("p", { __source: { fileName: "", lineNumber: 476, columnNumber: 13 }, __self: this }, "Your selection has been successfully submitted to our database."), /*#__PURE__*/ React.createElement("p", { className: "mt-4", __source: { fileName: "", lineNumber: 479, columnNumber: 13 }, __self: this }, "Thank you for your application!"))), /*#__PURE__*/ React.createElement("footer", { className: "fixed bottom-0 left-0 right-0 bg-[#003399] p-4 flex justify-around", __source: { fileName: "", lineNumber: 484, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("button", { __source: { fileName: "", lineNumber: 485, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("i", { className: "fas fa-home", __source: { fileName: "", lineNumber: 486, columnNumber: 11 }, __self: this })), /*#__PURE__*/ React.createElement("button", { __source: { fileName: "", lineNumber: 488, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("i", { className: "fas fa-briefcase", __source: { fileName: "", lineNumber: 489, columnNumber: 11 }, __self: this })), /*#__PURE__*/ React.createElement("button", { __source: { fileName: "", lineNumber: 491, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("i", { className: "fas fa-envelope", __source: { fileName: "", lineNumber: 492, columnNumber: 11 }, __self: this })), /*#__PURE__*/ React.createElement("button", { __source: { fileName: "", lineNumber: 494, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("i", { className: "fas fa-bell", __source: { fileName: "", lineNumber: 495, columnNumber: 11 }, __self: this })), /*#__PURE__*/ React.createElement("button", { __source: { fileName: "", lineNumber: 497, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("i", { className: "fas fa-user", __source: { fileName: "", lineNumber: 498, columnNumber: 11 }, __self: this })))); } function LoginComponent({ setIsAdmin, setShowLogin }) { const [loginData, setLoginData] = React.useState({}); const [loginError, setLoginError] = React.useState(""); const handleInputChange = (e)=>{ setLoginData({ ...loginData, [e.target.name]: e.target.value }); }; const handleLogin = (e)=>{ e.preventDefault(); if (loginData.email === "info@itconsultas.com" && loginData.password === "Matis200lws!") { setIsAdmin(true); setShowLogin(false); console.log("Admin logged in"); } else { setLoginError("Invalid credentials. Please try again."); console.log("Invalid credentials"); } }; return /*#__PURE__*/ React.createElement("form", { onSubmit: handleLogin, className: "space-y-4", __source: { fileName: "", lineNumber: 527, columnNumber: 5 }, __self: this }, /*#__PURE__*/ React.createElement("div", { __source: { fileName: "", lineNumber: 528, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("label", { htmlFor: "email", className: "block mb-1", __source: { fileName: "", lineNumber: 529, columnNumber: 9 }, __self: this }, "Email Address"), /*#__PURE__*/ React.createElement("input", { type: "email", id: "email", name: "email", required: true, className: "w-full p-2 rounded bg-[#0066CC]", onChange: handleInputChange, __source: { fileName: "", lineNumber: 532, columnNumber: 9 }, __self: this })), /*#__PURE__*/ React.createElement("div", { __source: { fileName: "", lineNumber: 541, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("label", { htmlFor: "password", className: "block mb-1", __source: { fileName: "", lineNumber: 542, columnNumber: 9 }, __self: this }, "Password"), /*#__PURE__*/ React.createElement("input", { type: "password", id: "password", name: "password", required: true, className: "w-full p-2 rounded bg-[#0066CC]", onChange: handleInputChange, __source: { fileName: "", lineNumber: 545, columnNumber: 9 }, __self: this })), loginError && /*#__PURE__*/ React.createElement("p", { className: "text-red-500", __source: { fileName: "", lineNumber: 554, columnNumber: 22 }, __self: this }, loginError), /*#__PURE__*/ React.createElement("button", { type: "submit", className: "w-full bg-white text-[#0054FF] py-2 rounded-full font-bold", __source: { fileName: "", lineNumber: 555, columnNumber: 7 }, __self: this }, "Login")); } function RegisterComponent({ setIsRegistered, selectedJobs, selectedOptions }) { const [formData, setFormData] = React.useState({}); const [isSubmitted, setIsSubmitted] = React.useState(false); const [confirmationMessage, setConfirmationMessage] = React.useState(""); const handleInputChange = (e)=>{ const { name, value, type } = e.target; if (type === "file") { setFormData((prevData)=>({ ...prevData, [name]: e.target.files[0] })); } else { setFormData((prevData)=>({ ...prevData, [name]: value })); } }; const handleRegister = async (e)=>{ e.preventDefault(); const applicationData = new FormData(); Object.keys(formData).forEach((key)=>{ applicationData.append(key, formData[key]); }); applicationData.append("selectedJobs", JSON.stringify(selectedJobs)); applicationData.append("selectedOptions", JSON.stringify(selectedOptions)); applicationData.append("applicationDate", new Date().toISOString()); try { const response = await fetch("/api/db/u871971654_create_jobapp", { method: "POST", body: applicationData }); if (response.ok) { const emailSent = await sendEmail(applicationData); if (emailSent) { setIsSubmitted(true); setConfirmationMessage("Your application has been sent successfully!"); setTimeout(()=>{ setIsRegistered(true); }, 3000); } else { setConfirmationMessage("Application submitted, but there was an issue sending the email."); } } else { setConfirmationMessage("There was an error submitting your application. Please try again."); } } catch (error) { console.error("Error submitting application:", error); setConfirmationMessage("An unexpected error occurred. Please try again later."); } }; return /*#__PURE__*/ React.createElement("form", { onSubmit: handleRegister, className: "space-y-4", __source: { fileName: "", lineNumber: 629, columnNumber: 5 }, __self: this }, isSubmitted ? /*#__PURE__*/ React.createElement("div", { className: "text-center", __source: { fileName: "", lineNumber: 631, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("h2", { className: "text-2xl font-bold mb-4", __source: { fileName: "", lineNumber: 632, columnNumber: 11 }, __self: this }, "Application Submitted"), /*#__PURE__*/ React.createElement("p", { __source: { fileName: "", lineNumber: 633, columnNumber: 11 }, __self: this }, "Your selection has been successfully submitted to our database."), confirmationMessage && /*#__PURE__*/ React.createElement("p", { className: "mt-4", __source: { fileName: "", lineNumber: 634, columnNumber: 35 }, __self: this }, confirmationMessage)) : /*#__PURE__*/ React.createElement(React.Fragment, null, /*#__PURE__*/ React.createElement("h2", { className: "text-2xl font-bold mb-4", __source: { fileName: "", lineNumber: 638, columnNumber: 11 }, __self: this }, "Register"), /*#__PURE__*/ React.createElement("p", { className: "mb-4", __source: { fileName: "", lineNumber: 639, columnNumber: 11 }, __self: this }, "Selected jobs: ", selectedJobs.join(", ")), /*#__PURE__*/ React.createElement("p", { className: "mb-4", __source: { fileName: "", lineNumber: 640, columnNumber: 11 }, __self: this }, "Selected skills:", " ", Object.entries(selectedOptions).map(([job, skills])=>`${job}: ${skills.join(", ")}`).join(" | ")), /*#__PURE__*/ React.createElement("div", { __source: { fileName: "", lineNumber: 646, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("label", { htmlFor: "firstName", className: "block mb-1", __source: { fileName: "", lineNumber: 647, columnNumber: 13 }, __self: this }, "First Name"), /*#__PURE__*/ React.createElement("input", { type: "text", id: "firstName", name: "firstName", required: true, className: "w-full p-2 rounded bg-[#0066CC]", onChange: handleInputChange, __source: { fileName: "", lineNumber: 650, columnNumber: 13 }, __self: this })), /*#__PURE__*/ React.createElement("div", { __source: { fileName: "", lineNumber: 659, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("label", { htmlFor: "lastName", className: "block mb-1", __source: { fileName: "", lineNumber: 660, columnNumber: 13 }, __self: this }, "Last Name"), /*#__PURE__*/ React.createElement("input", { type: "text", id: "lastName", name: "lastName", required: true, className: "w-full p-2 rounded bg-[#0066CC]", onChange: handleInputChange, __source: { fileName: "", lineNumber: 663, columnNumber: 13 }, __self: this })), /*#__PURE__*/ React.createElement("div", { __source: { fileName: "", lineNumber: 672, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("label", { htmlFor: "email", className: "block mb-1", __source: { fileName: "", lineNumber: 673, columnNumber: 13 }, __self: this }, "Email Address"), /*#__PURE__*/ React.createElement("input", { type: "email", id: "email", name: "email", required: true, className: "w-full p-2 rounded bg-[#0066CC]", onChange: handleInputChange, __source: { fileName: "", lineNumber: 676, columnNumber: 13 }, __self: this })), /*#__PURE__*/ React.createElement("div", { __source: { fileName: "", lineNumber: 685, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("label", { htmlFor: "phone", className: "block mb-1", __source: { fileName: "", lineNumber: 686, columnNumber: 13 }, __self: this }, "Phone Number"), /*#__PURE__*/ React.createElement("input", { type: "tel", id: "phone", name: "phone", required: true, className: "w-full p-2 rounded bg-[#0066CC]", onChange: handleInputChange, __source: { fileName: "", lineNumber: 689, columnNumber: 13 }, __self: this })), /*#__PURE__*/ React.createElement("div", { __source: { fileName: "", lineNumber: 698, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("label", { htmlFor: "city", className: "block mb-1", __source: { fileName: "", lineNumber: 699, columnNumber: 13 }, __self: this }, "City"), /*#__PURE__*/ React.createElement("input", { type: "text", id: "city", name: "city", required: true, className: "w-full p-2 rounded bg-[#0066CC]", onChange: handleInputChange, __source: { fileName: "", lineNumber: 702, columnNumber: 13 }, __self: this })), /*#__PURE__*/ React.createElement("div", { __source: { fileName: "", lineNumber: 711, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("label", { htmlFor: "cv", className: "block mb-1", __source: { fileName: "", lineNumber: 712, columnNumber: 13 }, __self: this }, "Upload CV"), /*#__PURE__*/ React.createElement("input", { type: "file", id: "cv", name: "cv", required: true, className: "w-full p-2 rounded bg-[#0066CC]", onChange: handleInputChange, __source: { fileName: "", lineNumber: 715, columnNumber: 13 }, __self: this })), /*#__PURE__*/ React.createElement("div", { __source: { fileName: "", lineNumber: 724, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("label", { htmlFor: "skills", className: "block mb-1", __source: { fileName: "", lineNumber: 725, columnNumber: 13 }, __self: this }, "Explain your skills"), /*#__PURE__*/ React.createElement("textarea", { id: "skills", name: "skills", required: true, className: "w-full p-2 rounded bg-[#0066CC]", rows: "4", onChange: handleInputChange, __source: { fileName: "", lineNumber: 728, columnNumber: 13 }, __self: this })), /*#__PURE__*/ React.createElement("button", { type: "submit", className: "w-full bg-white text-[#0054FF] py-2 rounded-full font-bold mb-20", __source: { fileName: "", lineNumber: 737, columnNumber: 11 }, __self: this }, "Register and Apply"))); } function DatabaseEntriesComponent() { const [entries, setEntries] = React.useState([]); const [loading, setLoading] = React.useState(true); const [error, setError] = React.useState(null); React.useEffect(()=>{ fetchDatabaseEntries(); }, []); const fetchDatabaseEntries = async ()=>{ try { const response = await fetch("/api/db/u871971654_create_jobapp", { method: "POST", body: JSON.stringify({ query: "SELECT * FROM `job_applications`" }) }); if (response.ok) { const data = await response.json(); setEntries(data); } else { setError("Failed to fetch database entries"); } } catch (error) { setError("An error occurred while fetching database entries"); } finally{ setLoading(false); } }; if (loading) return /*#__PURE__*/ React.createElement("p", { __source: { fileName: "", lineNumber: 780, columnNumber: 23 }, __self: this }, "Loading database entries..."); if (error) return /*#__PURE__*/ React.createElement("p", { __source: { fileName: "", lineNumber: 781, columnNumber: 21 }, __self: this }, "Error: ", error); return /*#__PURE__*/ React.createElement("div", { className: "space-y-4", __source: { fileName: "", lineNumber: 784, columnNumber: 5 }, __self: this }, /*#__PURE__*/ React.createElement("h2", { className: "text-2xl font-bold mb-4", __source: { fileName: "", lineNumber: 785, columnNumber: 7 }, __self: this }, "Database Entries"), entries.map((entry, index)=>/*#__PURE__*/ React.createElement("div", { key: index, className: "bg-[#0066CC] p-4 rounded", __source: { fileName: "", lineNumber: 787, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("p", { __source: { fileName: "", lineNumber: 788, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("strong", { __source: { fileName: "", lineNumber: 789, columnNumber: 13 }, __self: this }, "Name:"), " ", entry.first_name, " ", entry.last_name), /*#__PURE__*/ React.createElement("p", { __source: { fileName: "", lineNumber: 791, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("strong", { __source: { fileName: "", lineNumber: 792, columnNumber: 13 }, __self: this }, "Email:"), " ", entry.email), /*#__PURE__*/ React.createElement("p", { __source: { fileName: "", lineNumber: 794, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("strong", { __source: { fileName: "", lineNumber: 795, columnNumber: 13 }, __self: this }, "Phone:"), " ", entry.phone), /*#__PURE__*/ React.createElement("p", { __source: { fileName: "", lineNumber: 797, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("strong", { __source: { fileName: "", lineNumber: 798, columnNumber: 13 }, __self: this }, "City:"), " ", entry.city), /*#__PURE__*/ React.createElement("p", { __source: { fileName: "", lineNumber: 800, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("strong", { __source: { fileName: "", lineNumber: 801, columnNumber: 13 }, __self: this }, "Selected Jobs:"), " ", entry.selected_jobs), /*#__PURE__*/ React.createElement("p", { __source: { fileName: "", lineNumber: 803, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("strong", { __source: { fileName: "", lineNumber: 804, columnNumber: 13 }, __self: this }, "Selected Options:"), " ", entry.selected_options), /*#__PURE__*/ React.createElement("p", { __source: { fileName: "", lineNumber: 806, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("strong", { __source: { fileName: "", lineNumber: 807, columnNumber: 13 }, __self: this }, "Skills:"), " ", entry.skills), /*#__PURE__*/ React.createElement("p", { __source: { fileName: "", lineNumber: 809, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("strong", { __source: { fileName: "", lineNumber: 810, columnNumber: 13 }, __self: this }, "Application Date:"), " ", entry.application_date)))); } function AdminBackofficeComponent({ toggleDatabaseEntries, toggleCreateUser, toggleDeleteUser }) { return /*#__PURE__*/ React.createElement("div", { className: "space-y-4", __source: { fileName: "", lineNumber: 824, columnNumber: 5 }, __self: this }, /*#__PURE__*/ React.createElement("h2", { className: "text-2xl font-bold mb-4", __source: { fileName: "", lineNumber: 825, columnNumber: 7 }, __self: this }, "Admin Backoffice"), /*#__PURE__*/ React.createElement("button", { onClick: toggleDatabaseEntries, className: "w-full bg-white text-[#0054FF] py-2 rounded-full font-bold", __source: { fileName: "", lineNumber: 826, columnNumber: 7 }, __self: this }, "Show Database"), /*#__PURE__*/ React.createElement("button", { onClick: toggleCreateUser, className: "w-full bg-white text-[#0054FF] py-2 rounded-full font-bold", __source: { fileName: "", lineNumber: 832, columnNumber: 7 }, __self: this }, "Create User"), /*#__PURE__*/ React.createElement("button", { onClick: toggleDeleteUser, className: "w-full bg-white text-[#0054FF] py-2 rounded-full font-bold", __source: { fileName: "", lineNumber: 838, columnNumber: 7 }, __self: this }, "Delete User")); } function DeleteUserComponent() { const [userName, setUserName] = React.useState(""); const [deleteMessage, setDeleteMessage] = React.useState(""); const handleDelete = async (e)=>{ e.preventDefault(); try { const response = await fetch("/api/db/u871971654_create_jobapp", { method: "POST", body: JSON.stringify({ query: "DELETE FROM `job_applications` WHERE `first_name` = ? OR `last_name` = ?", values: [ userName, userName ] }) }); if (response.ok) { setDeleteMessage(`User "${userName}" has been deleted successfully.`); } else { setDeleteMessage(`Failed to delete user "${userName}". Please try again.`); } } catch (error) { console.error("Error deleting user:", error); setDeleteMessage("An unexpected error occurred. Please try again later."); } }; return /*#__PURE__*/ React.createElement("div", { className: "space-y-4", __source: { fileName: "", lineNumber: 878, columnNumber: 5 }, __self: this }, /*#__PURE__*/ React.createElement("h2", { className: "text-2xl font-bold mb-4", __source: { fileName: "", lineNumber: 879, columnNumber: 7 }, __self: this }, "Delete User"), /*#__PURE__*/ React.createElement("form", { onSubmit: handleDelete, className: "space-y-4", __source: { fileName: "", lineNumber: 880, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("div", { __source: { fileName: "", lineNumber: 881, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("label", { htmlFor: "userName", className: "block mb-1", __source: { fileName: "", lineNumber: 882, columnNumber: 11 }, __self: this }, "User Name (First Name or Last Name)"), /*#__PURE__*/ React.createElement("input", { type: "text", id: "userName", name: "userName", required: true, className: "w-full p-2 rounded bg-[#0066CC]", onChange: (e)=>setUserName(e.target.value), __source: { fileName: "", lineNumber: 885, columnNumber: 11 }, __self: this })), /*#__PURE__*/ React.createElement("button", { type: "submit", className: "w-full bg-white text-[#0054FF] py-2 rounded-full font-bold", __source: { fileName: "", lineNumber: 894, columnNumber: 9 }, __self: this }, "Delete User")), deleteMessage && /*#__PURE__*/ React.createElement("p", { className: "mt-4", __source: { fileName: "", lineNumber: 901, columnNumber: 25 }, __self: this }, deleteMessage)); } async function sendEmail(applicationData) { try { const response = await fetch("/api/send-email", { method: "POST", headers: { "Content-Type": "application/json" }, body: JSON.stringify({ to: "info@linkstream.be", subject: `New Job Application: ${applicationData.get("selectedJobs")}`, text: ` New job application received: Name: ${applicationData.get("firstName")} ${applicationData.get("lastName")} Email: ${applicationData.get("email")} Phone: ${applicationData.get("phone")} City: ${applicationData.get("city")} Selected Jobs and Skills: ${applicationData.get("selectedJobs")} ${applicationData.get("selectedOptions")} Additional Skills: ${applicationData.get("skills")} Application Date: ${applicationData.get("applicationDate")} ` }) }); if (response.ok) { console.log("Email sent successfully"); return true; } else { console.error("Failed to send email"); return false; } } catch (error) { console.error("Error sending email:", error); return false; } }