function MainComponent() { const [step, setStep] = React.useState(0); const [userInput, setUserInput] = React.useState(''); const [clarifyingQuestions, setClarifyingQuestions] = React.useState([]); const [answers, setAnswers] = React.useState({}); const [domainSuggestions, setDomainSuggestions] = React.useState([]); const [loading, setLoading] = React.useState(false); const [domainAvailability, setDomainAvailability] = React.useState({}); const handleInputChange = (e)=>{ setUserInput(e.target.value); }; const handleAnswerChange = (question, answer)=>{ setAnswers((prev)=>({ ...prev, [question]: answer })); }; const generateClarifyingQuestions = async ()=>{ setLoading(true); try { const response = await fetch('/integrations/chat-gpt/conversationgpt4', { method: 'POST', headers: { 'Content-Type': 'application/json' }, body: JSON.stringify({ messages: [ { role: "system", content: "You are a domain name suggestion assistant. Generate 3 clarifying questions to better understand the user's requirements for domain name suggestions. The questions should help gather information about their personal interests, the projects they are building, and other creative criteria." }, { role: "user", content: userInput } ] }) }); const data = await response.json(); if (data.status) { const questions = data.result.split('\n').filter((q)=>q.trim() !== '').map((q)=>q.replace(/^\d+\.\s*/, '')); setClarifyingQuestions(questions); setStep(1); } } catch (error) { console.error("Error generating questions:", error); } setLoading(false); }; const generateDomainSuggestions = async ()=>{ setLoading(true); const fullContext = `User's initial input: ${userInput}\n\nClarifying questions and answers:\n${clarifyingQuestions.map((q, i)=>`Q${i + 1}: ${q}\nA${i + 1}: ${answers[q] || 'N/A'}`).join('\n\n')}`; try { const response = await fetch('/integrations/chat-gpt/conversationgpt4', { method: 'POST', headers: { 'Content-Type': 'application/json' }, body: JSON.stringify({ messages: [ { role: "system", content: "You are a domain name suggestion assistant. Based on the user's input and answers to clarifying questions, suggest 5 creative and relevant domain names." }, { role: "user", content: fullContext } ] }) }); const data = await response.json(); if (data.status) { const suggestions = data.result.split('\n').filter((s)=>s.trim() !== '').map((s)=>s.replace(/^\d+\.\s*/, '')); setDomainSuggestions(suggestions); setStep(2); } } catch (error) { console.error("Error generating domain suggestions:", error); } setLoading(false); }; const checkDomainAvailability = async (domain)=>{ try { const response = await fetch(`/integrations/domain-whois/whois?domain=${domain}`, { method: 'GET' }); const data = await response.json(); setDomainAvailability((prev)=>({ ...prev, [domain]: data.available })); } catch (error) { console.error("Error checking domain availability:", error); } }; return /*#__PURE__*/ React.createElement("div", { className: "min-h-screen bg-gray-100 py-12 px-4 sm:px-6 lg:px-8", __source: { fileName: "", lineNumber: 89, columnNumber: 5 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "max-w-3xl mx-auto", __source: { fileName: "", lineNumber: 90, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("h1", { className: "text-3xl font-bold text-center mb-8 font-sans", __source: { fileName: "", lineNumber: 91, columnNumber: 9 }, __self: this }, "Domain Name Suggestion Tool"), step === 0 && /*#__PURE__*/ React.createElement("div", { __source: { fileName: "", lineNumber: 94, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("textarea", { className: "w-full p-2 border border-gray-300 rounded-md font-sans", rows: "4", placeholder: "Describe your project, interests, and any ideas for your domain name...", value: userInput, onChange: handleInputChange, __source: { fileName: "", lineNumber: 95, columnNumber: 13 }, __self: this }), /*#__PURE__*/ React.createElement("button", { className: "mt-4 w-full bg-blue-500 text-white p-2 rounded-md hover:bg-blue-600 transition duration-300 font-sans", onClick: generateClarifyingQuestions, disabled: loading, __source: { fileName: "", lineNumber: 102, columnNumber: 13 }, __self: this }, loading ? 'Generating Questions...' : 'Get Clarifying Questions')), step === 1 && /*#__PURE__*/ React.createElement("div", { __source: { fileName: "", lineNumber: 113, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("h2", { className: "text-xl font-bold mb-4 font-sans", __source: { fileName: "", lineNumber: 114, columnNumber: 13 }, __self: this }, "Please answer these questions:"), clarifyingQuestions.map((question, index)=>/*#__PURE__*/ React.createElement("div", { key: index, className: "mb-4", __source: { fileName: "", lineNumber: 116, columnNumber: 15 }, __self: this }, /*#__PURE__*/ React.createElement("p", { className: "font-sans", __source: { fileName: "", lineNumber: 117, columnNumber: 17 }, __self: this }, question), /*#__PURE__*/ React.createElement("input", { type: "text", className: "w-full p-2 border border-gray-300 rounded-md mt-2 font-sans", placeholder: "Your answer...", value: answers[question] || '', onChange: (e)=>handleAnswerChange(question, e.target.value), __source: { fileName: "", lineNumber: 118, columnNumber: 17 }, __self: this }))), /*#__PURE__*/ React.createElement("button", { className: "mt-4 w-full bg-blue-500 text-white p-2 rounded-md hover:bg-blue-600 transition duration-300 font-sans", onClick: generateDomainSuggestions, disabled: loading, __source: { fileName: "", lineNumber: 127, columnNumber: 13 }, __self: this }, loading ? 'Generating Suggestions...' : 'Get Domain Suggestions')), step === 2 && /*#__PURE__*/ React.createElement("div", { __source: { fileName: "", lineNumber: 138, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("h2", { className: "text-xl font-bold mb-4 font-sans", __source: { fileName: "", lineNumber: 139, columnNumber: 13 }, __self: this }, "Domain Suggestions:"), /*#__PURE__*/ React.createElement("ul", { __source: { fileName: "", lineNumber: 140, columnNumber: 13 }, __self: this }, domainSuggestions.map((domain, index)=>/*#__PURE__*/ React.createElement("li", { key: index, className: "mb-2 flex items-center justify-between", __source: { fileName: "", lineNumber: 142, columnNumber: 17 }, __self: this }, /*#__PURE__*/ React.createElement("span", { className: "font-sans", __source: { fileName: "", lineNumber: 143, columnNumber: 19 }, __self: this }, domain), /*#__PURE__*/ React.createElement("button", { className: "bg-green-500 text-white px-3 py-1 rounded-md text-sm hover:bg-green-600 transition duration-300 font-sans", onClick: ()=>checkDomainAvailability(domain), disabled: domainAvailability.hasOwnProperty(domain), __source: { fileName: "", lineNumber: 144, columnNumber: 19 }, __self: this }, domainAvailability.hasOwnProperty(domain) ? domainAvailability[domain] ? 'Available' : 'Unavailable' : 'Check Availability'))))))); }