function MainComponent({ logoUrl, signInUrl, jobBoardUrl, lsuLogoUrl, resumeCreatorUrl, postEditorUrl, jobDescriptionUrl }) { const [inputType, setInputType] = React.useState('description'); const [responseReady, setResponseReady] = React.useState(false); const [alertVisible, setAlertVisible] = React.useState(false); const [interviewQuestions, setInterviewQuestions] = React.useState([]); const [modalVisible, setModalVisible] = React.useState(false); const fetchInterviewQuestions = async (content)=>{ setResponseReady(false); const response = await fetch('/integrations/chat-gpt/conversationgpt4', { method: 'POST', body: JSON.stringify({ messages: [ { role: 'user', content } ], system_prompt: `Prepare for a job interview in Land Surveying using AI`, max_tokens: 2000 }), headers: { 'Content-Type': 'application/json' } }); const data = await response.json(); setResponseReady(true); if (data.status) { setInterviewQuestions(data.result.split('\n').slice(0, 20)); setModalVisible(true); } }; const handleInputFocus = ()=>{ setAlertVisible(true); }; const handleInputBlur = ()=>{ setAlertVisible(false); }; const handleSubmit = (e)=>{ e.preventDefault(); const content = e.target.elements[inputType === 'description' ? 'jobDescription' : 'jobUrl'].value.trim(); if (content) { fetchInterviewQuestions(content); } }; const closeModal = ()=>{ setModalVisible(false); }; const openModal = React.useCallback((url)=>{ // This function will be used to open IFrame Modals }, []); return /*#__PURE__*/ React.createElement(React.Fragment, null, /*#__PURE__*/ React.createElement("style", { jsx: true, global: true, __source: { fileName: "", lineNumber: 63, columnNumber: 7 }, __self: this }, ` @keyframes radial-gradient-animation { 0% { background-position: 0% 50%; } 50% { background-position: 100% 50%; } 100% { background-position: 0% 50%; } } `), /*#__PURE__*/ React.createElement("div", { className: "min-h-screen flex flex-col bg-[#121212] text-white font-roboto", __source: { fileName: "", lineNumber: 70, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("a", { href: jobBoardUrl, className: "self-center mt-4", __source: { fileName: "", lineNumber: 71, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("img", { src: logoUrl, alt: "Land Surveying Jobs Logo", className: "w-[100px] sm:w-[200px]", __source: { fileName: "", lineNumber: 72, columnNumber: 11 }, __self: this })), /*#__PURE__*/ React.createElement("h1", { className: "text-center mt-4 text-xl sm:text-2xl", __source: { fileName: "", lineNumber: 74, columnNumber: 9 }, __self: this }, "Prepare for a job interview in Land Surveying using AI"), alertVisible && /*#__PURE__*/ React.createElement("div", { className: "absolute top-20 left-1/2 transform -translate-x-1/2 bg-red-500 p-2 rounded-md", __source: { fileName: "", lineNumber: 76, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("p", { __source: { fileName: "", lineNumber: 77, columnNumber: 13 }, __self: this }, "Make sure you are signed in"), /*#__PURE__*/ React.createElement("a", { href: signInUrl, className: "text-orange-500", __source: { fileName: "", lineNumber: 78, columnNumber: 13 }, __self: this }, "Sign in")), /*#__PURE__*/ React.createElement("div", { className: "mt-6 w-full max-w-xl mx-auto", __source: { fileName: "", lineNumber: 81, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("ul", { className: "flex justify-center gap-4", __source: { fileName: "", lineNumber: 82, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("li", { className: `py-2 px-4 cursor-pointer ${inputType === 'description' ? 'text-orange-500 border-b-2 border-orange-500' : 'text-gray-300'}`, onClick: ()=>setInputType('description'), __source: { fileName: "", lineNumber: 83, columnNumber: 13 }, __self: this }, "Input Job Description"), /*#__PURE__*/ React.createElement("li", { className: `py-2 px-4 cursor-pointer ${inputType === 'url' ? 'text-orange-500 border-b-2 border-orange-500' : 'text-gray-300'}`, onClick: ()=>setInputType('url'), __source: { fileName: "", lineNumber: 89, columnNumber: 13 }, __self: this }, "Paste Job URL")), /*#__PURE__*/ React.createElement("form", { className: "p-4", onSubmit: handleSubmit, __source: { fileName: "", lineNumber: 96, columnNumber: 11 }, __self: this }, inputType === 'description' && /*#__PURE__*/ React.createElement(React.Fragment, null, /*#__PURE__*/ React.createElement("p", { __source: { fileName: "", lineNumber: 99, columnNumber: 17 }, __self: this }, "Provide the text of the job description you want to apply to"), /*#__PURE__*/ React.createElement("textarea", { name: "jobDescription", className: "w-full h-40 p-2 bg-transparent border border-gray-700 rounded-md mt-2 focus:outline-none", onFocus: handleInputFocus, onBlur: handleInputBlur, __source: { fileName: "", lineNumber: 100, columnNumber: 17 }, __self: this })), inputType === 'url' && /*#__PURE__*/ React.createElement(React.Fragment, null, /*#__PURE__*/ React.createElement("p", { __source: { fileName: "", lineNumber: 110, columnNumber: 17 }, __self: this }, "Provide the URL of the job you want to apply to"), /*#__PURE__*/ React.createElement("input", { type: "url", name: "jobUrl", className: "w-full p-2 bg-transparent border border-gray-700 rounded-md mt-2 focus:outline-none", onFocus: handleInputFocus, onBlur: handleInputBlur, __source: { fileName: "", lineNumber: 111, columnNumber: 17 }, __self: this })), /*#__PURE__*/ React.createElement("button", { type: "submit", className: `w-full my-6 py-2 rounded-md shadow-lg text-white ${responseReady ? '' : 'animate-radialGradient'}`, style: { background: 'linear-gradient(90deg, rgba(255,69,0,1) 0%, rgba(255,165,0,1) 50%, rgba(255,69,0,1) 100%)', animation: `${responseReady ? '' : 'radial-gradient-animation 3s infinite'}` }, __source: { fileName: "", lineNumber: 120, columnNumber: 13 }, __self: this }, "Generate Interview Questions"))), /*#__PURE__*/ React.createElement("a", { href: lsuLogoUrl, className: "self-center mt-8 mb-4", __source: { fileName: "", lineNumber: 132, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("img", { src: lsuLogoUrl, alt: "Land Surveyors United Logo", className: "w-[100px] sm:w-[150px]", __source: { fileName: "", lineNumber: 133, columnNumber: 11 }, __self: this })), modalVisible && /*#__PURE__*/ React.createElement("div", { className: "fixed inset-0 bg-black bg-opacity-50 flex items-center justify-center", __source: { fileName: "", lineNumber: 136, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "bg-[#121212] p-8 max-w-2xl w-full rounded-md", __source: { fileName: "", lineNumber: 137, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("h2", { className: "text-orange-500 font-semibold text-lg mb-4", __source: { fileName: "", lineNumber: 138, columnNumber: 15 }, __self: this }, "Interview Questions"), /*#__PURE__*/ React.createElement("ul", { className: "max-h-[600px] overflow-y-auto mb-6", __source: { fileName: "", lineNumber: 139, columnNumber: 15 }, __self: this }, interviewQuestions.map((question, index)=>/*#__PURE__*/ React.createElement("li", { key: index, className: "py-2", __source: { fileName: "", lineNumber: 141, columnNumber: 19 }, __self: this }, question))), /*#__PURE__*/ React.createElement("button", { className: "absolute top-0 right-0 mt-4 mr-4 text-orange-500", onClick: closeModal, __source: { fileName: "", lineNumber: 144, columnNumber: 15 }, __self: this }, "Close ✕"))), /*#__PURE__*/ React.createElement("div", { className: "flex flex-col items-center my-4 space-y-2", __source: { fileName: "", lineNumber: 148, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("button", { className: "bg-orange-500 text-white py-2 w-full", onClick: ()=>openModal(resumeCreatorUrl), __source: { fileName: "", lineNumber: 149, columnNumber: 11 }, __self: this }, "AI Job Generator"), /*#__PURE__*/ React.createElement("button", { className: "bg-orange-500 text-white py-2 w-full", onClick: ()=>openModal(postEditorUrl), __source: { fileName: "", lineNumber: 150, columnNumber: 11 }, __self: this }, "Post Builder"), /*#__PURE__*/ React.createElement("button", { className: "bg-orange-500 text-white py-2 w-full", onClick: ()=>openModal(jobDescriptionUrl), __source: { fileName: "", lineNumber: 151, columnNumber: 11 }, __self: this }, "Build Resume")), /*#__PURE__*/ React.createElement("p", { className: "text-center text-xs text-gray-400 mx-4 mb-4", __source: { fileName: "", lineNumber: 153, columnNumber: 9 }, __self: this }, "If you are seeking employment, reverse the job search by posting your resume and link to profile.")), /*#__PURE__*/ React.createElement("p", { className: "text-center text-orange-500 cursor-pointer", __source: { fileName: "", lineNumber: 157, columnNumber: 7 }, __self: this }, "Post To Jobs Board"), /*#__PURE__*/ React.createElement("p", { className: "text-center text-orange-500 cursor-pointer my-2", __source: { fileName: "", lineNumber: 158, columnNumber: 7 }, __self: this }, "International Jobs Board")); } function StoryComponent() { const props = { logoUrl: "https://s3hellobox.s3.ap-southeast-2.amazonaws.com/production/10824/1936/1936-land-surveyor-jobs1-1704724887.png", signInUrl: "https://landsurveyorsunited.com/main/authorization/signIn?target=/my/profile", jobBoardUrl: "https://jobs.landsurveyorsunited.org", lsuLogoUrl: "https://storage.ning.com/topology/rest/1.0/file/get/12222126291?profile=original", resumeCreatorUrl: "https://landsurveyorsuniteddocs.on.drv.tw/membertools/jobs/resumecreator/jobdescription.html", postEditorUrl: "https://landsurveyorsuniteddocs.on.drv.tw/membertools/jobs/posteditor/generatejobpost.html", jobDescriptionUrl: "https://landsurveyorsuniteddocs.on.drv.tw/membertools/jobs/resumecreator/" }; return /*#__PURE__*/ React.createElement(MainComponent, { ...props, __source: { fileName: "", lineNumber: 175, columnNumber: 5 }, __self: this }); }