function MainComponent() { const [loading, setLoading] = React.useState(false); const [error, setError] = React.useState(null); const [response, setResponse] = React.useState(null); const [formData, setFormData] = React.useState({ dates: '', weather: '', scenary: '', distance: '', budget: '' }); const handleChange = (e)=>{ const { name, value } = e.target; setFormData((prevData)=>({ ...prevData, [name]: value })); }; const handleSubmit = async ()=>{ setLoading(true); setError(null); setResponse(null); try { const chatResponse = await fetch('/integrations/chat-gpt/conversationgpt4', { method: 'POST', headers: { 'Content-Type': 'application/json' }, body: JSON.stringify({ messages: [ { role: 'user', content: `Suggest a travel location based on this input: ${JSON.stringify(formData)}` } ] }) }); const chatData = await chatResponse.json(); const locationSuggestion = chatData.choices[0].message.content; const scrapeResponse = await fetch('/integrations/web-scraping/post', { method: 'POST', headers: { 'Content-Type': 'application/json' }, body: JSON.stringify({ url: 'https://www.popular-travel-website.com', getText: true }) }); const travelData = await scrapeResponse.text(); setResponse({ location: locationSuggestion, travelInfo: travelData }); } catch (error) { setError('An error occurred while fetching data.'); } setLoading(false); }; return /*#__PURE__*/ React.createElement("div", { className: "w-full h-full bg-white flex flex-col justify-center items-center", __source: { fileName: "", lineNumber: 59, columnNumber: 5 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "w-full max-w-[1728px] p-4 border-b flex justify-between items-center", __source: { fileName: "", lineNumber: 60, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "flex justify-start items-center gap-4", __source: { fileName: "", lineNumber: 61, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "relative w-9 h-9", __source: { fileName: "", lineNumber: 62, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "absolute w-9 h-9 bg-[#6ECEDA]", __source: { fileName: "", lineNumber: 63, columnNumber: 13 }, __self: this }), /*#__PURE__*/ React.createElement("div", { className: "absolute w-1 h-1 top-3 left-3 bg-white rounded-full", __source: { fileName: "", lineNumber: 64, columnNumber: 13 }, __self: this }), /*#__PURE__*/ React.createElement("img", { className: "absolute w-4 h-1 top-5 left-5", src: "https://via.placeholder.com/14x3", __source: { fileName: "", lineNumber: 65, columnNumber: 13 }, __self: this })), /*#__PURE__*/ React.createElement("div", { className: "flex flex-col justify-start items-start", __source: { fileName: "", lineNumber: 67, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "text-lg font-inter font-bold", __source: { fileName: "", lineNumber: 68, columnNumber: 13 }, __self: this }, "Next Week"))), /*#__PURE__*/ React.createElement("div", { className: "flex flex-1 h-10 justify-end items-start gap-8", __source: { fileName: "", lineNumber: 71, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "flex justify-start items-start gap-2", __source: { fileName: "", lineNumber: 72, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "p-2 rounded-full border-2 border-black flex justify-center items-center", __source: { fileName: "", lineNumber: 73, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "text-center text-sm font-inter font-bold", __source: { fileName: "", lineNumber: 74, columnNumber: 15 }, __self: this }, "Login")), /*#__PURE__*/ React.createElement("div", { className: "p-2 rounded-full border-2 border-black flex justify-center items-center", __source: { fileName: "", lineNumber: 76, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "text-center text-sm font-inter font-bold", __source: { fileName: "", lineNumber: 77, columnNumber: 15 }, __self: this }, "Sign up"))))), /*#__PURE__*/ React.createElement("div", { className: "h-full flex flex-col justify-center items-start gap-3", __source: { fileName: "", lineNumber: 82, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "flex flex-col justify-center items-start gap-9", __source: { fileName: "", lineNumber: 83, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("div", { __source: { fileName: "", lineNumber: 84, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("span", { className: "text-4xl font-inter leading-[63px]", __source: { fileName: "", lineNumber: 85, columnNumber: 13 }, __self: this }, "you’ve got nothing going on", /*#__PURE__*/ React.createElement("br", { __source: { fileName: "", lineNumber: 85, columnNumber: 93 }, __self: this }), "so.. lets find you something to do", /*#__PURE__*/ React.createElement("br", { __source: { fileName: "", lineNumber: 85, columnNumber: 133 }, __self: this })), /*#__PURE__*/ React.createElement("span", { className: "text-4xl font-inter font-bold leading-[63px]", __source: { fileName: "", lineNumber: 86, columnNumber: 13 }, __self: this }, "next week"), /*#__PURE__*/ React.createElement("span", { className: "text-4xl font-inter leading-[63px]", __source: { fileName: "", lineNumber: 87, columnNumber: 13 }, __self: this }, " :)"))), [ 'dates', 'weather', 'scenary', 'distance', 'budget' ].map((label, index)=>/*#__PURE__*/ React.createElement("div", { key: index, className: "self-stretch flex justify-between items-center border-b-[1px] border-black py-2 p-[px]", __source: { fileName: "", lineNumber: 91, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "text-lg font-inter p-[1px]", __source: { fileName: "", lineNumber: 92, columnNumber: 13 }, __self: this }, label), /*#__PURE__*/ React.createElement("input", { className: "flex-grow text-right text-gray-400 italic", name: label, placeholder: label === 'dates' ? "when's your vacay?" : label === 'weather' ? 'sunny, snowy, rainy etc.' : label === 'scenary' ? 'beach, mountains etc.' : label === 'distance' ? 'How far can you go?' : 'How much we talkin?', value: formData[label], onChange: handleChange, __source: { fileName: "", lineNumber: 93, columnNumber: 13 }, __self: this }), /*#__PURE__*/ React.createElement("div", { className: "w-6 h-6 flex justify-center items-center", __source: { fileName: "", lineNumber: 106, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("i", { className: `fa ${label === 'dates' ? 'fa-calendar' : label === 'weather' ? 'fa-sun' : label === 'scenary' ? 'fa-binoculars' : label === 'distance' ? 'fa-plane' : 'fa-usd'} text-black`, __source: { fileName: "", lineNumber: 107, columnNumber: 15 }, __self: this })))), /*#__PURE__*/ React.createElement("div", { className: "self-stretch flex justify-end items-center py-4", __source: { fileName: "", lineNumber: 115, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("button", { className: "bg-black text-white p-3 rounded-full flex items-center gap-2", onClick: handleSubmit, __source: { fileName: "", lineNumber: 116, columnNumber: 11 }, __self: this }, "lets go!", /*#__PURE__*/ React.createElement("i", { className: "fa fa-arrow-right", __source: { fileName: "", lineNumber: 121, columnNumber: 13 }, __self: this }))), loading && /*#__PURE__*/ React.createElement("p", { __source: { fileName: "", lineNumber: 124, columnNumber: 21 }, __self: this }, "Loading..."), error && /*#__PURE__*/ React.createElement("p", { __source: { fileName: "", lineNumber: 125, columnNumber: 19 }, __self: this }, error), response && /*#__PURE__*/ React.createElement("div", { __source: { fileName: "", lineNumber: 127, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("p", { __source: { fileName: "", lineNumber: 128, columnNumber: 13 }, __self: this }, "Location Suggestion: ", response.location), /*#__PURE__*/ React.createElement("p", { __source: { fileName: "", lineNumber: 129, columnNumber: 13 }, __self: this }, "Travel Info: ", response.travelInfo)))); }