function MainComponent() { const [isLoggedIn, setIsLoggedIn] = React.useState(false); const [searchTerm, setSearchTerm] = React.useState(''); const [selectedPlatform, setSelectedPlatform] = React.useState('All Platforms'); const [showSignInModal, setShowSignInModal] = React.useState(false); const handleSearch = ()=>{ if (!isLoggedIn) { setShowSignInModal(true); } else { // Perform search logic here } }; const handleSignIn = ()=>{ setIsLoggedIn(true); setShowSignInModal(false); }; const handleSignUp = ()=>{ setIsLoggedIn(true); setShowSignInModal(false); }; return /*#__PURE__*/ React.createElement("div", { className: "min-h-screen bg-gray-900 text-white", __source: { fileName: "", lineNumber: 26, columnNumber: 5 }, __self: this }, /*#__PURE__*/ React.createElement("header", { className: "bg-gradient-to-r from-purple-700 to-blue-600 p-4", __source: { fileName: "", lineNumber: 27, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("nav", { className: "flex justify-between items-center", __source: { fileName: "", lineNumber: 28, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("h1", { className: "text-2xl font-bold", __source: { fileName: "", lineNumber: 29, columnNumber: 11 }, __self: this }, "#'s Search Engine"), /*#__PURE__*/ React.createElement("div", { className: "flex space-x-4", __source: { fileName: "", lineNumber: 30, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("a", { href: "#", className: "hover:text-gray-300", __source: { fileName: "", lineNumber: 31, columnNumber: 13 }, __self: this }, "Learn"), /*#__PURE__*/ React.createElement("a", { href: "#", className: "hover:text-gray-300", __source: { fileName: "", lineNumber: 32, columnNumber: 13 }, __self: this }, "Pricing"), /*#__PURE__*/ React.createElement("a", { href: "#", className: "hover:text-gray-300", __source: { fileName: "", lineNumber: 33, columnNumber: 13 }, __self: this }, "Consulting"), /*#__PURE__*/ React.createElement("a", { href: "#", className: "hover:text-gray-300", __source: { fileName: "", lineNumber: 34, columnNumber: 13 }, __self: this }, "Partners")), isLoggedIn ? /*#__PURE__*/ React.createElement("div", { className: "flex items-center", __source: { fileName: "", lineNumber: 37, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("span", { className: "mr-2", __source: { fileName: "", lineNumber: 38, columnNumber: 15 }, __self: this }, "Searches left today: 3 ", /*#__PURE__*/ React.createElement("span", { className: "fa fa-crown text-yellow-500", __source: { fileName: "", lineNumber: 38, columnNumber: 61 }, __self: this })), /*#__PURE__*/ React.createElement("button", { onClick: ()=>setIsLoggedIn(false), className: "bg-red-500 text-white px-4 py-2 rounded", __source: { fileName: "", lineNumber: 39, columnNumber: 15 }, __self: this }, "Sign Out")) : /*#__PURE__*/ React.createElement("button", { onClick: ()=>setShowSignInModal(true), className: "bg-blue-500 text-white px-4 py-2 rounded", __source: { fileName: "", lineNumber: 42, columnNumber: 13 }, __self: this }, "Sign In"))), /*#__PURE__*/ React.createElement("main", { className: "container mx-auto mt-16 px-4 text-center", __source: { fileName: "", lineNumber: 47, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("h2", { className: "text-4xl font-bold mb-12", __source: { fileName: "", lineNumber: 48, columnNumber: 9 }, __self: this }, "Discover what content ", /*#__PURE__*/ React.createElement("span", { className: "text-orange-500", __source: { fileName: "", lineNumber: 49, columnNumber: 33 }, __self: this }, "your audience wants"), " to ", /*#__PURE__*/ React.createElement("span", { className: "text-white", __source: { fileName: "", lineNumber: 49, columnNumber: 97 }, __self: this }, "see")), /*#__PURE__*/ React.createElement("div", { className: "flex justify-center mb-16", __source: { fileName: "", lineNumber: 52, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("input", { type: "text", name: "search", value: searchTerm, onChange: (e)=>setSearchTerm(e.target.value), placeholder: "Enter a topic, brand or product", className: "flex-grow p-2 rounded-l text-black", __source: { fileName: "", lineNumber: 53, columnNumber: 11 }, __self: this }), /*#__PURE__*/ React.createElement("select", { name: "platform", value: selectedPlatform, onChange: (e)=>setSelectedPlatform(e.target.value), className: "p-2 text-black", __source: { fileName: "", lineNumber: 61, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("option", { value: "All Platforms", __source: { fileName: "", lineNumber: 67, columnNumber: 13 }, __self: this }, "All Platforms"), /*#__PURE__*/ React.createElement("option", { value: "Instagram", __source: { fileName: "", lineNumber: 68, columnNumber: 13 }, __self: this }, "Instagram"), /*#__PURE__*/ React.createElement("option", { value: "Facebook", __source: { fileName: "", lineNumber: 69, columnNumber: 13 }, __self: this }, "Facebook"), /*#__PURE__*/ React.createElement("option", { value: "Twitter", __source: { fileName: "", lineNumber: 70, columnNumber: 13 }, __self: this }, "Twitter"), /*#__PURE__*/ React.createElement("option", { value: "YouTube", __source: { fileName: "", lineNumber: 71, columnNumber: 13 }, __self: this }, "YouTube"), /*#__PURE__*/ React.createElement("option", { value: "TikTok", __source: { fileName: "", lineNumber: 72, columnNumber: 13 }, __self: this }, "TikTok")), /*#__PURE__*/ React.createElement("button", { onClick: handleSearch, className: "bg-orange-500 text-white px-4 py-2 rounded-r", __source: { fileName: "", lineNumber: 74, columnNumber: 11 }, __self: this }, "Search")), !isLoggedIn && /*#__PURE__*/ React.createElement("div", { className: "mt-12 space-y-16", __source: { fileName: "", lineNumber: 78, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("h3", { className: "text-2xl font-bold mb-4", __source: { fileName: "", lineNumber: 79, columnNumber: 13 }, __self: this }, "Trusted by ", /*#__PURE__*/ React.createElement("span", { className: "text-orange-500", __source: { fileName: "", lineNumber: 79, columnNumber: 64 }, __self: this }, "1,000's"), " to understand their niche"), /*#__PURE__*/ React.createElement("div", { className: "flex flex-wrap justify-center items-center gap-8 mb-8", __source: { fileName: "", lineNumber: 80, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("img", { src: "/paramount.png", alt: "Paramount logo", className: "h-8", __source: { fileName: "", lineNumber: 81, columnNumber: 15 }, __self: this }), /*#__PURE__*/ React.createElement("img", { src: "/microsoft.png", alt: "Microsoft logo", className: "h-8", __source: { fileName: "", lineNumber: 82, columnNumber: 15 }, __self: this }), /*#__PURE__*/ React.createElement("img", { src: "/pfizer.png", alt: "Pfizer logo", className: "h-8", __source: { fileName: "", lineNumber: 83, columnNumber: 15 }, __self: this }), /*#__PURE__*/ React.createElement("img", { src: "/facebook.png", alt: "Facebook logo", className: "h-8", __source: { fileName: "", lineNumber: 84, columnNumber: 15 }, __self: this }), /*#__PURE__*/ React.createElement("img", { src: "/abbvie.png", alt: "Abbvie logo", className: "h-8", __source: { fileName: "", lineNumber: 85, columnNumber: 15 }, __self: this }), /*#__PURE__*/ React.createElement("img", { src: "/roche.png", alt: "Roche logo", className: "h-8", __source: { fileName: "", lineNumber: 86, columnNumber: 15 }, __self: this }), /*#__PURE__*/ React.createElement("img", { src: "/netflix.png", alt: "Netflix logo", className: "h-8", __source: { fileName: "", lineNumber: 87, columnNumber: 15 }, __self: this }), /*#__PURE__*/ React.createElement("img", { src: "/danone.png", alt: "Danone logo", className: "h-8", __source: { fileName: "", lineNumber: 88, columnNumber: 15 }, __self: this }), /*#__PURE__*/ React.createElement("img", { src: "/visa.png", alt: "Visa logo", className: "h-8", __source: { fileName: "", lineNumber: 89, columnNumber: 15 }, __self: this }), /*#__PURE__*/ React.createElement("img", { src: "/instagram.png", alt: "Instagram logo", className: "h-8", __source: { fileName: "", lineNumber: 90, columnNumber: 15 }, __self: this }), /*#__PURE__*/ React.createElement("img", { src: "/loreal.png", alt: "L'Oreal logo", className: "h-8", __source: { fileName: "", lineNumber: 91, columnNumber: 15 }, __self: this }), /*#__PURE__*/ React.createElement("img", { src: "/salesforce.png", alt: "Salesforce logo", className: "h-8", __source: { fileName: "", lineNumber: 92, columnNumber: 15 }, __self: this })), /*#__PURE__*/ React.createElement("h3", { className: "text-2xl font-bold mt-12 mb-4", __source: { fileName: "", lineNumber: 95, columnNumber: 13 }, __self: this }, "Get Instant, Raw ", /*#__PURE__*/ React.createElement("span", { className: "text-orange-500", __source: { fileName: "", lineNumber: 95, columnNumber: 76 }, __self: this }, "Social Media Insights")), /*#__PURE__*/ React.createElement("button", { className: "mt-4 mb-4 bg-blue-500 text-white px-4 py-2 rounded", __source: { fileName: "", lineNumber: 96, columnNumber: 13 }, __self: this }, "Sign Up for Free"), /*#__PURE__*/ React.createElement("p", { className: "mb-12", __source: { fileName: "", lineNumber: 97, columnNumber: 13 }, __self: this }, "Optimize your social media campaigns with the right hashtags on Instagram, Facebook, Twitter, LinkedIn and more.")), isLoggedIn && /*#__PURE__*/ React.createElement("div", { className: "mt-12", __source: { fileName: "", lineNumber: 102, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("h3", { className: "text-2xl font-bold mb-4", __source: { fileName: "", lineNumber: 103, columnNumber: 13 }, __self: this }, "Search Results: Instagram # (83 Results)"), /*#__PURE__*/ React.createElement("div", { className: "grid grid-cols-1 md:grid-cols-4 gap-4 mb-12", __source: { fileName: "", lineNumber: 104, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "bg-gray-800 p-4 rounded", __source: { fileName: "", lineNumber: 105, columnNumber: 15 }, __self: this }, /*#__PURE__*/ React.createElement("h4", { className: "font-bold", __source: { fileName: "", lineNumber: 106, columnNumber: 17 }, __self: this }, "Instagram"), /*#__PURE__*/ React.createElement("p", { __source: { fileName: "", lineNumber: 107, columnNumber: 17 }, __self: this }, "#trending"), /*#__PURE__*/ React.createElement("p", { __source: { fileName: "", lineNumber: 108, columnNumber: 17 }, __self: this }, "Volume: 1,000,000"), /*#__PURE__*/ React.createElement("p", { className: "text-green-500", __source: { fileName: "", lineNumber: 109, columnNumber: 17 }, __self: this }, "↑ Trending up over last 7 days")), /*#__PURE__*/ React.createElement("div", { className: "bg-gray-800 p-4 rounded", __source: { fileName: "", lineNumber: 111, columnNumber: 15 }, __self: this }, /*#__PURE__*/ React.createElement("h4", { className: "font-bold", __source: { fileName: "", lineNumber: 112, columnNumber: 17 }, __self: this }, "Facebook"), /*#__PURE__*/ React.createElement("p", { __source: { fileName: "", lineNumber: 113, columnNumber: 17 }, __self: this }, "#viral"), /*#__PURE__*/ React.createElement("p", { __source: { fileName: "", lineNumber: 114, columnNumber: 17 }, __self: this }, "Volume: 800,000"), /*#__PURE__*/ React.createElement("p", { className: "text-green-500", __source: { fileName: "", lineNumber: 115, columnNumber: 17 }, __self: this }, "↑ Trending up over last 7 days")), /*#__PURE__*/ React.createElement("div", { className: "bg-gray-800 p-4 rounded", __source: { fileName: "", lineNumber: 117, columnNumber: 15 }, __self: this }, /*#__PURE__*/ React.createElement("h4", { className: "font-bold", __source: { fileName: "", lineNumber: 118, columnNumber: 17 }, __self: this }, "Twitter"), /*#__PURE__*/ React.createElement("p", { __source: { fileName: "", lineNumber: 119, columnNumber: 17 }, __self: this }, "#newtrend"), /*#__PURE__*/ React.createElement("p", { __source: { fileName: "", lineNumber: 120, columnNumber: 17 }, __self: this }, "Volume: 600,000"), /*#__PURE__*/ React.createElement("p", { className: "text-green-500", __source: { fileName: "", lineNumber: 121, columnNumber: 17 }, __self: this }, "↑ Trending up over last 7 days")), /*#__PURE__*/ React.createElement("div", { className: "bg-gray-800 p-4 rounded", __source: { fileName: "", lineNumber: 123, columnNumber: 15 }, __self: this }, /*#__PURE__*/ React.createElement("h4", { className: "font-bold", __source: { fileName: "", lineNumber: 124, columnNumber: 17 }, __self: this }, "YouTube"), /*#__PURE__*/ React.createElement("p", { __source: { fileName: "", lineNumber: 125, columnNumber: 17 }, __self: this }, "#topvideo"), /*#__PURE__*/ React.createElement("p", { __source: { fileName: "", lineNumber: 126, columnNumber: 17 }, __self: this }, "Volume: 500,000"), /*#__PURE__*/ React.createElement("p", { className: "text-green-500", __source: { fileName: "", lineNumber: 127, columnNumber: 17 }, __self: this }, "↑ Trending up over last 7 days"))), /*#__PURE__*/ React.createElement("h3", { className: "text-2xl font-bold mb-4", __source: { fileName: "", lineNumber: 131, columnNumber: 13 }, __self: this }, "Hashtag Insights"), /*#__PURE__*/ React.createElement("div", { className: "bg-gray-800 p-8 rounded", __source: { fileName: "", lineNumber: 132, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "flex justify-center items-center", __source: { fileName: "", lineNumber: 133, columnNumber: 15 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "w-64 h-64 rounded-full border-4 border-orange-500 flex flex-col justify-center items-center", __source: { fileName: "", lineNumber: 134, columnNumber: 17 }, __self: this }, /*#__PURE__*/ React.createElement("p", { className: "text-3xl font-bold", __source: { fileName: "", lineNumber: 135, columnNumber: 19 }, __self: this }, "7/7"), /*#__PURE__*/ React.createElement("p", { __source: { fileName: "", lineNumber: 136, columnNumber: 19 }, __self: this }, "Prepositions"), /*#__PURE__*/ React.createElement("p", { className: "text-sm mt-2", __source: { fileName: "", lineNumber: 137, columnNumber: 19 }, __self: this }, "Search Volume"), /*#__PURE__*/ React.createElement("p", { className: "text-2xl font-bold", __source: { fileName: "", lineNumber: 138, columnNumber: 19 }, __self: this }, "6.12M"))), /*#__PURE__*/ React.createElement("div", { className: "mt-8 flex justify-around", __source: { fileName: "", lineNumber: 141, columnNumber: 15 }, __self: this }, /*#__PURE__*/ React.createElement("p", { __source: { fileName: "", lineNumber: 142, columnNumber: 17 }, __self: this }, "Instagram # to get likes"), /*#__PURE__*/ React.createElement("p", { __source: { fileName: "", lineNumber: 143, columnNumber: 17 }, __self: this }, "Instagram # for reels"), /*#__PURE__*/ React.createElement("p", { __source: { fileName: "", lineNumber: 144, columnNumber: 17 }, __self: this }, "Instagram # for girls"), /*#__PURE__*/ React.createElement("p", { __source: { fileName: "", lineNumber: 145, columnNumber: 17 }, __self: this }, "Instagram # for post"))))), showSignInModal && /*#__PURE__*/ React.createElement("div", { className: "fixed inset-0 bg-black bg-opacity-50 flex justify-center items-center", __source: { fileName: "", lineNumber: 153, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "bg-gray-800 p-8 rounded", __source: { fileName: "", lineNumber: 154, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("h2", { className: "text-2xl font-bold mb-4", __source: { fileName: "", lineNumber: 155, columnNumber: 13 }, __self: this }, "Sign In / Sign Up"), /*#__PURE__*/ React.createElement("input", { type: "email", placeholder: "Email", className: "w-full p-2 mb-4 text-black rounded", __source: { fileName: "", lineNumber: 156, columnNumber: 13 }, __self: this }), /*#__PURE__*/ React.createElement("input", { type: "password", placeholder: "Password", className: "w-full p-2 mb-4 text-black rounded", __source: { fileName: "", lineNumber: 157, columnNumber: 13 }, __self: this }), /*#__PURE__*/ React.createElement("button", { onClick: handleSignIn, className: "bg-blue-500 text-white px-4 py-2 rounded mb-2 w-full", __source: { fileName: "", lineNumber: 158, columnNumber: 13 }, __self: this }, "Sign In with Email"), /*#__PURE__*/ React.createElement("button", { onClick: handleSignIn, className: "bg-red-500 text-white px-4 py-2 rounded mb-2 w-full", __source: { fileName: "", lineNumber: 159, columnNumber: 13 }, __self: this }, "Sign In with Google"), /*#__PURE__*/ React.createElement("button", { onClick: handleSignIn, className: "bg-blue-700 text-white px-4 py-2 rounded mb-4 w-full", __source: { fileName: "", lineNumber: 160, columnNumber: 13 }, __self: this }, "Sign In with Facebook"), /*#__PURE__*/ React.createElement("p", { __source: { fileName: "", lineNumber: 161, columnNumber: 13 }, __self: this }, "Don't have an account? ", /*#__PURE__*/ React.createElement("button", { onClick: handleSignUp, className: "text-blue-500", __source: { fileName: "", lineNumber: 161, columnNumber: 39 }, __self: this }, "Sign Up")), /*#__PURE__*/ React.createElement("button", { onClick: ()=>setShowSignInModal(false), className: "mt-4 text-gray-400", __source: { fileName: "", lineNumber: 162, columnNumber: 13 }, __self: this }, "Close")))); }

Discover what content your audience wants to see

Trusted by 1,000's to understand their niche

Get Instant, Raw Social Media Insights