function MainComponent() { const [title, setTitle] = React.useState(''); const [outline, setOutline] = React.useState(''); const [keywords, setKeywords] = React.useState(''); const [blogPost, setBlogPost] = React.useState(''); const [isLoading, setIsLoading] = React.useState(false); const [searchQuery, setSearchQuery] = React.useState(''); const [searchResults, setSearchResults] = React.useState([]); const generateBlogPost = async ()=>{ setIsLoading(true); const messages = [ { role: 'system', content: 'You are an SEO expert and content writer. Your task is to generate a high-quality, SEO-optimized blog post based on the given title, outline, and keywords.' }, { role: 'user', content: `Please write a blog post with the following details: Title: ${title} Outline: ${outline} Keywords to target: ${keywords} Make sure the content is engaging, informative, and optimized for search engines. Use the keywords naturally throughout the text.` } ]; try { const response = await fetch('/integrations/anthropic-claude-sonnet-3-5/', { method: 'POST', body: JSON.stringify({ messages }), headers: { 'Content-Type': 'application/json' } }); const data = await response.json(); setBlogPost(data.choices[0].message.content); } catch (error) { console.error('Error generating blog post:', error); setBlogPost('An error occurred while generating the blog post. Please try again.'); } finally{ setIsLoading(false); } }; const fetchSearchResults = async ()=>{ try { const response = await fetch(`/integrations/google-search/search?q=${encodeURIComponent(searchQuery)}`); const data = await response.json(); setSearchResults(data.items.slice(0, 10)); } catch (error) { console.error('Error fetching search results:', error); setSearchResults([]); } }; return /*#__PURE__*/ React.createElement("div", { className: "flex flex-col md:flex-row h-screen bg-gray-100", __source: { fileName: "", lineNumber: 56, columnNumber: 5 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "w-full md:w-1/3 p-4 bg-white shadow-md", __source: { fileName: "", lineNumber: 57, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("h1", { className: "text-2xl font-bold mb-4", __source: { fileName: "", lineNumber: 58, columnNumber: 9 }, __self: this }, "Blog Post Generator"), /*#__PURE__*/ React.createElement("input", { type: "text", placeholder: "Post Title", className: "w-full p-2 mb-4 border rounded", value: title, onChange: (e)=>setTitle(e.target.value), __source: { fileName: "", lineNumber: 59, columnNumber: 9 }, __self: this }), /*#__PURE__*/ React.createElement("textarea", { placeholder: "Outline Notes", className: "w-full p-2 mb-4 border rounded h-32", value: outline, onChange: (e)=>setOutline(e.target.value), __source: { fileName: "", lineNumber: 66, columnNumber: 9 }, __self: this }), /*#__PURE__*/ React.createElement("input", { type: "text", placeholder: "Keywords (comma-separated)", className: "w-full p-2 mb-4 border rounded", value: keywords, onChange: (e)=>setKeywords(e.target.value), __source: { fileName: "", lineNumber: 72, columnNumber: 9 }, __self: this }), /*#__PURE__*/ React.createElement("button", { className: "w-full bg-blue-500 text-white p-2 rounded hover:bg-blue-600", onClick: generateBlogPost, disabled: isLoading, __source: { fileName: "", lineNumber: 79, columnNumber: 9 }, __self: this }, isLoading ? 'Generating...' : 'Generate Blog Post'), /*#__PURE__*/ React.createElement("div", { className: "mt-8", __source: { fileName: "", lineNumber: 87, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("h2", { className: "text-xl font-bold mb-2", __source: { fileName: "", lineNumber: 88, columnNumber: 11 }, __self: this }, "Search Result Checker"), /*#__PURE__*/ React.createElement("input", { type: "text", placeholder: "Search Query", className: "w-full p-2 mb-2 border rounded", value: searchQuery, onChange: (e)=>setSearchQuery(e.target.value), __source: { fileName: "", lineNumber: 89, columnNumber: 11 }, __self: this }), /*#__PURE__*/ React.createElement("button", { className: "w-full bg-green-500 text-white p-2 rounded hover:bg-green-600", onClick: fetchSearchResults, __source: { fileName: "", lineNumber: 96, columnNumber: 11 }, __self: this }, "Check Top 10 Results"))), /*#__PURE__*/ React.createElement("div", { className: "w-full md:w-2/3 p-4 overflow-auto", __source: { fileName: "", lineNumber: 105, columnNumber: 7 }, __self: this }, isLoading ? /*#__PURE__*/ React.createElement("div", { className: "flex items-center justify-center h-full", __source: { fileName: "", lineNumber: 107, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "animate-spin rounded-full h-32 w-32 border-t-2 border-b-2 border-blue-500", __source: { fileName: "", lineNumber: 108, columnNumber: 13 }, __self: this })) : /*#__PURE__*/ React.createElement(React.Fragment, null, /*#__PURE__*/ React.createElement("h2", { className: "text-2xl font-bold mb-4", __source: { fileName: "", lineNumber: 112, columnNumber: 13 }, __self: this }, "Generated Blog Post"), /*#__PURE__*/ React.createElement("div", { className: "bg-white p-4 rounded shadow-md whitespace-pre-wrap", __source: { fileName: "", lineNumber: 113, columnNumber: 13 }, __self: this }, blogPost)), searchResults.length > 0 && /*#__PURE__*/ React.createElement("div", { className: "mt-8", __source: { fileName: "", lineNumber: 118, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("h2", { className: "text-2xl font-bold mb-4", __source: { fileName: "", lineNumber: 119, columnNumber: 13 }, __self: this }, "Top 10 Search Results"), /*#__PURE__*/ React.createElement("ul", { className: "list-disc pl-6", __source: { fileName: "", lineNumber: 120, columnNumber: 13 }, __self: this }, searchResults.map((result, index)=>/*#__PURE__*/ React.createElement("li", { key: index, className: "mb-2", __source: { fileName: "", lineNumber: 122, columnNumber: 17 }, __self: this }, /*#__PURE__*/ React.createElement("a", { href: result.link, target: "_blank", rel: "noopener noreferrer", className: "text-blue-500 hover:underline", __source: { fileName: "", lineNumber: 123, columnNumber: 19 }, __self: this }, result.title))))))); }