function MainComponent() { const [messages, setMessages] = React.useState([ { text: "Welcome to Five Stars App Solutions, the Home of No-code Apps. How can I help you?", sender: "bot" } ]); const [input, setInput] = React.useState(""); const [awaitingMessage, setAwaitingMessage] = React.useState(false); const [conversations, setConversations] = React.useState([]); const [showForm, setShowForm] = React.useState(false); const handleSendMessage = async ()=>{ if (input.trim() === "") return; const newMessage = { text: input, sender: "user" }; const updatedMessages = [ ...messages, newMessage ]; setMessages(updatedMessages); let botResponse = ""; const lastBotMessage = messages[messages.length - 1].text; if (awaitingMessage) { if (input.toLowerCase() === "yes") { botResponse = "Great! Please fill out the form below:"; setShowForm(true); } else if (input.toLowerCase() === "no") { botResponse = "Thank you for your time. Is there anything else I can help you with?"; } else { botResponse = "I'm sorry, I didn't understand. Would you like to leave a message? Please answer with 'yes' or 'no'."; } setAwaitingMessage(false); } else { try { const response = await fetchChatGPTResponse(input, lastBotMessage); botResponse = response.result; if (botResponse.toLowerCase().includes("leave a message") || botResponse.toLowerCase().includes("contact you")) { botResponse = "Would you like to leave a message? Please answer with 'yes' or 'no'."; setAwaitingMessage(true); } if (input.toLowerCase().includes("payment") || input.toLowerCase().includes("pay") || input.toLowerCase().includes("purchase")) { botResponse = "Here's a secure link to make your payment: https://buy.stripe.com/cN2eYnauY9X775ebJl"; } const greetings = [ "hello", "hi", "hey", "greetings", "good morning", "good afternoon", "good evening" ]; if (greetings.some((greeting)=>input.toLowerCase().includes(greeting))) { botResponse = `${botResponse} It's great to meet you! How can I assist you with our products and services today?`; } } catch (error) { console.error("Error fetching ChatGPT response:", error); botResponse = "I apologize, but I'm having trouble processing your request. Would you like to leave a message for our team? Please answer with 'yes' or 'no'."; setAwaitingMessage(true); } } setTimeout(()=>{ setMessages((prevMessages)=>[ ...prevMessages, { text: botResponse, sender: "bot" } ]); }, 1000); setInput(""); }; const sendEmailNotification = (messages)=>{ const conversation1 = messages.map((msg)=>`${msg.sender}: ${msg.text}`).join("\n"); const emailBody = `New message from Five Stars App Solutions chatbot:\n\nFull conversation:\n${conversation1}`; console.log(`Sending email to jayceepee1@fivestarsappsolutions.com with message: ${emailBody}`); }; const saveConversation = (conversation1)=>{ setConversations([ ...conversations, conversation1 ]); }; const fetchChatGPTResponse = async (userInput, lastBotMessage)=>{ const messages = [ { role: "system", content: "You are a helpful AI assistant for Five Stars App Solutions, a company based in Tulsa, Oklahoma. We offer comprehensive technology and lifestyle solutions: 1) App Development: No-code apps using Bubble.io, custom development, AI integration. 2) Website Development: Custom designs, e-commerce, content management. 3) Content Creation: Social media management, graphic design, video production. 4) Smart Foods Tulsa: Healthy meal prep and delivery. 5) Goddess Designs: Spiritual jewelry, accessories, and 2025 planners. 6) Five Star Weddings: Full-service wedding planning, MC services, officiants, vow writing. 7) Book Publisher: Professional publishing and marketing. 8) Music DIY: AI-powered music production and distribution. 9) Five Stars 3D Printing: Custom products including wedding centerpieces, party items, keychains, phone cases, and toys. 10) Vending Machines: Smart vending solutions. 11) Five Star Financials: Financial education and services. Additional services include Pick Me Up Tulsa transportation and various consulting services. When users ask about pricing, mention we have flexible payment plans. For specific pricing, direct them to the payment link. Provide warm, detailed responses about any service, and if you can't answer something specific, suggest leaving a message for our team." }, { role: "user", content: lastBotMessage }, { role: "user", content: userInput } ]; try { const response = await fetch("/integrations/chat-gpt/conversationgpt4", { method: "POST", headers: { "Content-Type": "application/json" }, body: JSON.stringify({ messages }) }); if (!response.ok) { throw new Error("Failed to fetch ChatGPT response"); } const data = await response.json(); return data; } catch (error) { console.error("Error:", error); throw error; } }; return /*#__PURE__*/ React.createElement("div", { className: "flex flex-col h-screen bg-[#0c0c0c] p-4 md:p-8", __source: { fileName: "", lineNumber: 136, columnNumber: 5 }, __self: this }, /*#__PURE__*/ React.createElement("link", { rel: "icon", href: "data:image/svg+xml,", __source: { fileName: "", lineNumber: 137, columnNumber: 7 }, __self: this }), /*#__PURE__*/ React.createElement("div", { className: "flex items-center justify-center mb-6 bg-[#0c0c0c]", __source: { fileName: "", lineNumber: 141, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("h1", { className: "text-3xl font-bold text-[#39FF14] font-crimson-text", __source: { fileName: "", lineNumber: 142, columnNumber: 9 }, __self: this }, "Five Stars App Solutions Assistant")), /*#__PURE__*/ React.createElement("div", { className: "flex-1 overflow-y-auto mb-6 bg-[#0c0c0c] rounded-lg shadow-lg p-6 border border-[#39FF14]", __source: { fileName: "", lineNumber: 146, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "space-y-4", __source: { fileName: "", lineNumber: 147, columnNumber: 9 }, __self: this }, messages.map((message, index1)=>/*#__PURE__*/ React.createElement("div", { key: index1, className: `flex ${message.sender === "user" ? "justify-end" : "justify-start"}`, __source: { fileName: "", lineNumber: 149, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: `max-w-3/4 p-3 rounded-lg ${message.sender === "user" ? "bg-[#39FF14] text-black" : "bg-[#1a1a1a] text-[#39FF14] border border-[#39FF14]"}`, __source: { fileName: "", lineNumber: 153, columnNumber: 15 }, __self: this }, /*#__PURE__*/ React.createElement("p", { className: "text-sm md:text-base", __source: { fileName: "", lineNumber: 160, columnNumber: 17 }, __self: this }, message.text)))))), showForm && /*#__PURE__*/ React.createElement("div", { className: "mb-6", __source: { fileName: "", lineNumber: 167, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("iframe", { width: "100%", height: "480px", src: "https://forms.office.com/r/Wp1Kks1BHS?embed=true", frameBorder: "0", marginWidth: "0", marginHeight: "0", style: { border: "none", maxWidth: "100%", maxHeight: "100vh" }, allowFullScreen: true, webkitallowfullscreen: "true", mozallowfullscreen: "true", msallowfullscreen: "true", __source: { fileName: "", lineNumber: 168, columnNumber: 11 }, __self: this })), /*#__PURE__*/ React.createElement("div", { className: "flex items-center bg-[#1a1a1a] rounded-lg shadow-md border border-[#39FF14]", __source: { fileName: "", lineNumber: 183, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("input", { type: "text", value: input, onChange: (e)=>setInput(e.target.value), onKeyPress: (e)=>e.key === "Enter" && handleSendMessage(), className: "flex-1 p-3 rounded-l-lg bg-[#1a1a1a] text-[#39FF14] focus:outline-none focus:ring-2 focus:ring-[#39FF14]", placeholder: "Type your message here...", __source: { fileName: "", lineNumber: 184, columnNumber: 9 }, __self: this }), /*#__PURE__*/ React.createElement("button", { onClick: handleSendMessage, className: "bg-[#39FF14] text-black p-3 rounded-r-lg hover:bg-[#32D912] focus:outline-none focus:ring-2 focus:ring-[#39FF14] transition duration-300 ease-in-out", __source: { fileName: "", lineNumber: 192, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("i", { className: "fas fa-paper-plane", __source: { fileName: "", lineNumber: 196, columnNumber: 11 }, __self: this }))), /*#__PURE__*/ React.createElement("footer", { className: "mt-4 text-center text-[#39FF14] text-sm", __source: { fileName: "", lineNumber: 199, columnNumber: 7 }, __self: this }, "Powered by Five Stars App Solutions")); } function AdminPage({ conversations }) { return /*#__PURE__*/ React.createElement("div", { className: "flex flex-col h-screen bg-[#0c0c0c] p-4 md:p-8", __source: { fileName: "", lineNumber: 208, columnNumber: 5 }, __self: this }, /*#__PURE__*/ React.createElement("h1", { className: "text-3xl font-bold text-[#39FF14] font-crimson-text mb-6", __source: { fileName: "", lineNumber: 209, columnNumber: 7 }, __self: this }, "Admin Page - Saved Conversations"), /*#__PURE__*/ React.createElement("div", { className: "flex-1 overflow-y-auto bg-[#1a1a1a] rounded-lg shadow-lg p-6 border border-[#39FF14]", __source: { fileName: "", lineNumber: 212, columnNumber: 7 }, __self: this }, conversations.map((conversation1, index1)=>/*#__PURE__*/ React.createElement("div", { key: index1, className: "mb-8 border-b border-[#39FF14] pb-4", __source: { fileName: "", lineNumber: 214, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("h2", { className: "text-xl font-semibold mb-2 text-[#39FF14]", __source: { fileName: "", lineNumber: 215, columnNumber: 13 }, __self: this }, "Conversation ", index1 + 1), conversation1.map((message, msgIndex)=>/*#__PURE__*/ React.createElement("div", { key: msgIndex, className: `flex ${message.sender === "user" ? "justify-end" : "justify-start"} mb-2`, __source: { fileName: "", lineNumber: 219, columnNumber: 15 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: `max-w-3/4 p-3 rounded-lg ${message.sender === "user" ? "bg-[#39FF14] text-black" : "bg-[#1a1a1a] text-[#39FF14] border border-[#39FF14]"}`, __source: { fileName: "", lineNumber: 223, columnNumber: 17 }, __self: this }, /*#__PURE__*/ React.createElement("p", { className: "text-sm md:text-base", __source: { fileName: "", lineNumber: 230, columnNumber: 19 }, __self: this }, message.text))))))), /*#__PURE__*/ React.createElement("div", { key: index, className: "mb-8 border-b border-[#39FF14] pb-4", __source: { fileName: "", lineNumber: 237, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("h2", { className: "text-xl font-semibold mb-2 text-[#39FF14]", __source: { fileName: "", lineNumber: 238, columnNumber: 9 }, __self: this }, "Conversation ", index + 1), conversation.map((message, msgIndex)=>/*#__PURE__*/ React.createElement("div", { key: msgIndex, className: `flex ${message.sender === "user" ? "justify-end" : "justify-start"} mb-2`, __source: { fileName: "", lineNumber: 242, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: `max-w-3/4 p-3 rounded-lg ${message.sender === "user" ? "bg-[#39FF14] text-black" : "bg-[#1a1a1a] text-[#39FF14] border border-[#39FF14]"}`, __source: { fileName: "", lineNumber: 246, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("p", { className: "text-sm md:text-base", __source: { fileName: "", lineNumber: 253, columnNumber: 15 }, __self: this }, message.text)))))); }