function MainComponent() { const [connected, setConnected] = React.useState(false); const [currentCommand, setCurrentCommand] = React.useState('None'); const [loading, setLoading] = React.useState(false); const [searchQuery, setSearchQuery] = React.useState(''); const [searchResults, setSearchResults] = React.useState([]); const [isSearching, setIsSearching] = React.useState(false); const connectDevice = ()=>{ setLoading(true); fetch('/integrations/chat-gpt/conversationgpt4', { method: 'POST', body: JSON.stringify({ messages: [ { "role": "system", "content": "Connect to EpocX device" } ], system_prompt: 'Execute device connection', max_tokens: 2000 }), headers: { 'Content-Type': 'application/json' } }).then((response)=>response.json()).then((data)=>{ if (data.status) { setConnected(true); } else { alert("Failed to connect device."); } setLoading(false); }).catch(()=>{ alert("Error connecting to device."); setLoading(false); }); }; const selectMentalCommand = (event)=>{ setCurrentCommand(event.target.value); }; const handleSearchInput = (event)=>{ setSearchQuery(event.target.value); }; const executeSearch = ()=>{ setIsSearching(true); fetch(`/integrations/google-search/search?q=${encodeURIComponent(searchQuery)}`, { method: 'GET' }).then((response)=>response.json()).then((data)=>{ setSearchResults(data.items); setIsSearching(false); }).catch(()=>{ alert("Error executing search."); setIsSearching(false); }); }; return /*#__PURE__*/ React.createElement("div", { className: "w-full h-screen bg-[#f4f7f6] p-4 flex flex-col items-center justify-start", __source: { fileName: "", lineNumber: 67, columnNumber: 5 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "w-full max-w-4xl bg-white shadow-lg rounded-lg p-6", __source: { fileName: "", lineNumber: 68, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("h1", { className: "font-roboto text-xl text-[#333] mb-4", __source: { fileName: "", lineNumber: 69, columnNumber: 9 }, __self: this }, "Emotiv Device Dashboard"), /*#__PURE__*/ React.createElement("div", { className: "grid grid-cols-1 md:grid-cols-2 gap-6", __source: { fileName: "", lineNumber: 70, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: `bg-[#eff3f2] p-4 rounded-lg flex flex-col items-center ${loading ? "animate-pulse" : ""}`, __source: { fileName: "", lineNumber: 71, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("h2", { className: "font-roboto text-lg text-[#222] mb-3", __source: { fileName: "", lineNumber: 72, columnNumber: 13 }, __self: this }, "Device Connection"), connected ? /*#__PURE__*/ React.createElement("p", { className: "mt-2 py-2 px-4 bg-[#4CAF50] text-white rounded", __source: { fileName: "", lineNumber: 74, columnNumber: 15 }, __self: this }, "Connected to EpocX") : /*#__PURE__*/ React.createElement("button", { onClick: connectDevice, className: "mt-2 py-2 px-4 bg-[#4CAF50] text-white rounded hover:bg-[#45a049]", __source: { fileName: "", lineNumber: 76, columnNumber: 15 }, __self: this }, "Connect EpocX")), /*#__PURE__*/ React.createElement("div", { className: "flex flex-col bg-[#eff3f2] p-4 rounded-lg", __source: { fileName: "", lineNumber: 81, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("h2", { className: "font-roboto text-lg text-[#222] mb-3", __source: { fileName: "", lineNumber: 82, columnNumber: 13 }, __self: this }, "Profile"), /*#__PURE__*/ React.createElement("select", { name: "mentalCommandProfile", className: "w-full p-2 rounded border border-[#ccc]", onChange: selectMentalCommand, __source: { fileName: "", lineNumber: 83, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("option", { value: "", disabled: true, __source: { fileName: "", lineNumber: 84, columnNumber: 15 }, __self: this }, "Select Profile"), /*#__PURE__*/ React.createElement("option", { value: "direction", __source: { fileName: "", lineNumber: 85, columnNumber: 15 }, __self: this }, "Direction"), /*#__PURE__*/ React.createElement("option", { value: "otherCommands", __source: { fileName: "", lineNumber: 86, columnNumber: 15 }, __self: this }, "Other Commands")), /*#__PURE__*/ React.createElement("div", { className: "mt-6", __source: { fileName: "", lineNumber: 88, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("p", { className: "font-roboto text-[#666]", __source: { fileName: "", lineNumber: 89, columnNumber: 15 }, __self: this }, "Current Command: ", /*#__PURE__*/ React.createElement("span", { className: "text-[#4CAF50]", __source: { fileName: "", lineNumber: 89, columnNumber: 71 }, __self: this }, currentCommand))))))); }