function MainComponent() { const [isCreatorView, setIsCreatorView] = useState(true); const [messages, setMessages] = useState([]); const [loading, setLoading] = useState(true); const [error, setError] = useState(""); const [showMessages, setShowMessages] = useState(false); const [selectedChat, setSelectedChat] = useState(null); const [newMessage, setNewMessage] = useState(""); const [sendingMessage, setSendingMessage] = useState(false); const [isLoggedIn, setIsLoggedIn] = useState(false); const [loginData, setLoginData] = useState({ email: "", password: "", userType: "creator" }); useEffect(()=>{ const storedCreatorEmail = localStorage.getItem("creator_email"); const storedBrandEmail = localStorage.getItem("brand_email"); if (storedCreatorEmail || storedBrandEmail) { verifyLogin(storedCreatorEmail || storedBrandEmail, null, storedCreatorEmail ? "creator" : "brand", true); } }, []); useEffect(()=>{ const userEmail = localStorage.getItem(isCreatorView ? "creator_email" : "brand_email"); if (userEmail && isLoggedIn) { fetchMessages(userEmail); } }, [ isCreatorView, isLoggedIn ]); const verifyLogin = async (email, password, userType, isStoredLogin = false)=>{ try { const table = userType === "creator" ? "creators" : "brands"; const query = isStoredLogin ? "SELECT * FROM `" + table + "` WHERE email = ? LIMIT 1" : "SELECT * FROM `" + table + "` WHERE email = ? AND password = ? LIMIT 1"; const values = isStoredLogin ? [ email ] : [ email, password ]; const response = await fetch(`/api/db/${table}`, { method: "POST", body: JSON.stringify({ query, values }) }); const data = await response.json(); if (data.length > 0) { localStorage.setItem(userType === "creator" ? "creator_email" : "brand_email", email); setIsLoggedIn(true); return true; } return false; } catch (error) { console.error("Login verification failed:", error); return false; } }; const handleLogin = async (e)=>{ e.preventDefault(); const isValid = await verifyLogin(loginData.email, loginData.password, loginData.userType); if (!isValid) { setError("Invalid credentials. Please try again."); } }; const fetchMessages = async (userEmail)=>{ try { setLoading(true); setError(""); const userType = isCreatorView ? "creators" : "brands"; const userResponse = await fetch(`/api/db/${userType}`, { method: "POST", body: JSON.stringify({ query: `SELECT id FROM ${userType} WHERE email = ? LIMIT 1`, values: [ userEmail ] }) }); const userData = await userResponse.json(); if (!userData || userData.length === 0) { throw new Error("User not found"); } const userId = userData[0].id; const response = await fetch("/api/db/creator-chats", { method: "POST", body: JSON.stringify({ query: ` SELECT c.*, CASE WHEN cr.email IS NOT NULL THEN cr.email WHEN b.email IS NOT NULL THEN b.email ELSE 'Unknown' END as sender_email, CASE WHEN CAST(c.sender_id AS TEXT) = CAST(? AS TEXT) THEN c.receiver_id ELSE c.sender_id END as chat_partner_id FROM chat_messages c LEFT JOIN creators cr ON (CAST(c.sender_id AS TEXT) = CAST(cr.id AS TEXT) OR CAST(c.receiver_id AS TEXT) = CAST(cr.id AS TEXT)) LEFT JOIN brands b ON (CAST(c.sender_id AS TEXT) = CAST(b.id AS TEXT) OR CAST(c.receiver_id AS TEXT) = CAST(b.id AS TEXT)) WHERE CAST(c.sender_id AS TEXT) = CAST(? AS TEXT) OR CAST(c.receiver_id AS TEXT) = CAST(? AS TEXT) ORDER BY c.timestamp DESC `, values: [ userId, userId, userId ] }) }); const data = await response.json(); if (!Array.isArray(data)) { throw new Error("Invalid response format"); } const groupedMessages = data.reduce((acc, msg)=>{ const chatPartnerId = msg.chat_partner_id; if (!acc[chatPartnerId]) { acc[chatPartnerId] = []; } acc[chatPartnerId].push(msg); return acc; }, {}); setMessages(groupedMessages); } catch (err) { setError(err.message || "Failed to load messages"); console.error(err); } finally{ setLoading(false); } }; const formatMessageTime = (timestamp)=>{ return new Date(timestamp).toLocaleTimeString([], { hour: "2-digit", minute: "2-digit" }); }; const handleSendMessage = async ()=>{ if (!newMessage.trim()) return; setSendingMessage(true); try { const userEmail = localStorage.getItem(isCreatorView ? "creator_email" : "brand_email"); if (!userEmail) throw new Error("Not logged in"); const userType = isCreatorView ? "creators" : "brands"; const userResponse = await fetch(`/api/db/${userType}`, { method: "POST", body: JSON.stringify({ query: `SELECT id FROM ${userType} WHERE email = ? LIMIT 1`, values: [ userEmail ] }) }); const userData = await userResponse.json(); if (!userData || userData.length === 0) throw new Error("User not found"); const userId = userData[0].id; await fetch("/api/db/creator-chats", { method: "POST", body: JSON.stringify({ query: "INSERT INTO chat_messages (message, sender_id, receiver_id, timestamp) VALUES (?, ?, ?, ?)", values: [ newMessage, userId, selectedChat.chat_partner_id, new Date().toISOString() ] }) }); setNewMessage(""); fetchMessages(userEmail); } catch (err) { setError(err.message || "Failed to send message"); } finally{ setSendingMessage(false); } }; const CreatorView = ()=>/*#__PURE__*/ React.createElement("div", { className: "text-center max-w-4xl mx-auto px-4 md:px-8", __source: { fileName: "", lineNumber: 213, columnNumber: 5 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "mb-6 md:mb-8", __source: { fileName: "", lineNumber: 214, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("h1", { className: "text-3xl md:text-6xl font-bold mb-3 md:mb-4", __source: { fileName: "", lineNumber: 215, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("span", { className: "block md:inline", __source: { fileName: "", lineNumber: 216, columnNumber: 11 }, __self: this }, "connect and"), /*#__PURE__*/ React.createElement("span", { className: "bg-[#00ff00] px-3 md:px-4 mx-1 md:mx-2 rounded-full inline-block my-1 md:my-0", __source: { fileName: "", lineNumber: 217, columnNumber: 11 }, __self: this }, "get paid"), /*#__PURE__*/ React.createElement("span", { className: "block md:inline", __source: { fileName: "", lineNumber: 220, columnNumber: 11 }, __self: this }, "to make content for"), /*#__PURE__*/ React.createElement("div", { className: "mt-1 md:mt-0", __source: { fileName: "", lineNumber: 221, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("span", { __source: { fileName: "", lineNumber: 222, columnNumber: 13 }, __self: this }, "brands you"), /*#__PURE__*/ React.createElement("span", { className: "bg-[#ff4d79] px-3 md:px-4 mx-1 md:mx-2 rounded-full inline-block my-1 md:my-0", __source: { fileName: "", lineNumber: 223, columnNumber: 13 }, __self: this }, "love"))), /*#__PURE__*/ React.createElement("p", { className: "text-lg md:text-2xl text-gray-600 mt-4 md:mt-6", __source: { fileName: "", lineNumber: 228, columnNumber: 9 }, __self: this }, "Turn your viral campaigns into money printing machines")), /*#__PURE__*/ React.createElement("a", { target: "_self", href: "https://trycreatorconnect.com/creator-onboard", className: "inline-block bg-[#00ff00] text-black font-bold py-2 md:py-3 px-6 md:px-8 rounded-full text-base md:text-xl shadow-lg hover:opacity-90 transition-opacity w-full md:w-auto", __source: { fileName: "", lineNumber: 232, columnNumber: 7 }, __self: this }, "Get Connected →"), /*#__PURE__*/ React.createElement("div", { className: "flex flex-wrap justify-center gap-6 mt-20", __source: { fileName: "", lineNumber: 239, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "bg-white rounded-xl shadow-lg overflow-hidden w-[250px] hover:-translate-y-2 transition-transform", __source: { fileName: "", lineNumber: 240, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "p-4", __source: { fileName: "", lineNumber: 241, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "flex items-center gap-3", __source: { fileName: "", lineNumber: 242, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("i", { className: "fas fa-building text-[#00ff00] text-xl", __source: { fileName: "", lineNumber: 243, columnNumber: 15 }, __self: this }), /*#__PURE__*/ React.createElement("h3", { className: "text-lg font-bold", __source: { fileName: "", lineNumber: 244, columnNumber: 15 }, __self: this }, "Realsify"), /*#__PURE__*/ React.createElement("span", { className: "ml-auto text-xl font-bold", __source: { fileName: "", lineNumber: 245, columnNumber: 15 }, __self: this }, "$5,000")), /*#__PURE__*/ React.createElement("img", { src: "https://ucarecdn.com/5c50b99b-1040-4877-8f3b-b5547dadfc19/-/format/auto/", alt: "Realsify brand showcase featuring real estate content", className: "w-full h-[350px] object-cover rounded-lg mt-4", __source: { fileName: "", lineNumber: 247, columnNumber: 13 }, __self: this }))), /*#__PURE__*/ React.createElement("div", { className: "bg-white rounded-xl shadow-lg overflow-hidden w-[250px] hover:-translate-y-2 transition-transform", __source: { fileName: "", lineNumber: 254, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "p-4", __source: { fileName: "", lineNumber: 255, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "flex items-center gap-3", __source: { fileName: "", lineNumber: 256, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("i", { className: "fas fa-igloo text-[#00ff00] text-xl", __source: { fileName: "", lineNumber: 257, columnNumber: 15 }, __self: this }), /*#__PURE__*/ React.createElement("h3", { className: "text-lg font-bold", __source: { fileName: "", lineNumber: 258, columnNumber: 15 }, __self: this }, "Pudgy Penguins"), /*#__PURE__*/ React.createElement("span", { className: "ml-auto text-xl font-bold", __source: { fileName: "", lineNumber: 259, columnNumber: 15 }, __self: this }, "$8,500")), /*#__PURE__*/ React.createElement("img", { src: "https://ucarecdn.com/aad79244-db1f-432c-8771-d2907b423146/-/format/auto/", alt: "Pudgy Penguins brand showcase featuring NFT content", className: "w-full h-[350px] object-cover rounded-lg mt-4", __source: { fileName: "", lineNumber: 261, columnNumber: 13 }, __self: this }))), /*#__PURE__*/ React.createElement("div", { className: "bg-white rounded-xl shadow-lg overflow-hidden w-[250px] hover:-translate-y-2 transition-transform", __source: { fileName: "", lineNumber: 268, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "p-4", __source: { fileName: "", lineNumber: 269, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "flex items-center gap-3", __source: { fileName: "", lineNumber: 270, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("i", { className: "fas fa-mask text-[#00ff00] text-xl", __source: { fileName: "", lineNumber: 271, columnNumber: 15 }, __self: this }), /*#__PURE__*/ React.createElement("h3", { className: "text-lg font-bold", __source: { fileName: "", lineNumber: 272, columnNumber: 15 }, __self: this }, "The Visage Collection"), /*#__PURE__*/ React.createElement("span", { className: "ml-auto text-xl font-bold", __source: { fileName: "", lineNumber: 273, columnNumber: 15 }, __self: this }, "$6,500")), /*#__PURE__*/ React.createElement("img", { src: "https://ucarecdn.com/df73b2b4-ad25-4fc3-8a38-e523e0577c46/-/format/auto/", alt: "Visage Collection brand showcase featuring fashion content", className: "w-full h-[350px] object-cover rounded-lg mt-4", __source: { fileName: "", lineNumber: 275, columnNumber: 13 }, __self: this })))), showMessages && isLoggedIn ? /*#__PURE__*/ React.createElement("div", { className: "fixed bottom-4 right-4 w-96 h-[500px] bg-white rounded-lg shadow-xl border border-gray-200 flex flex-col", __source: { fileName: "", lineNumber: 285, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "flex justify-between items-center p-4 border-b", __source: { fileName: "", lineNumber: 286, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("h3", { className: "font-bold", __source: { fileName: "", lineNumber: 287, columnNumber: 13 }, __self: this }, "Messages"), /*#__PURE__*/ React.createElement("button", { onClick: ()=>setShowMessages(false), __source: { fileName: "", lineNumber: 288, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("i", { className: "fas fa-times", __source: { fileName: "", lineNumber: 289, columnNumber: 15 }, __self: this }))), /*#__PURE__*/ React.createElement("div", { className: "flex-1 overflow-y-auto p-4", __source: { fileName: "", lineNumber: 293, columnNumber: 11 }, __self: this }, loading ? /*#__PURE__*/ React.createElement("div", { className: "flex justify-center items-center h-full", __source: { fileName: "", lineNumber: 295, columnNumber: 15 }, __self: this }, /*#__PURE__*/ React.createElement("i", { className: "fas fa-spinner fa-spin text-[#00ff00] text-2xl", __source: { fileName: "", lineNumber: 296, columnNumber: 17 }, __self: this })) : error ? /*#__PURE__*/ React.createElement("div", { className: "text-red-500 text-center", __source: { fileName: "", lineNumber: 299, columnNumber: 15 }, __self: this }, error) : !selectedChat ? Object.entries(messages).length === 0 ? /*#__PURE__*/ React.createElement("div", { className: "text-gray-500 text-center", __source: { fileName: "", lineNumber: 302, columnNumber: 17 }, __self: this }, "No messages yet") : /*#__PURE__*/ React.createElement("div", { className: "space-y-4", __source: { fileName: "", lineNumber: 304, columnNumber: 17 }, __self: this }, Object.entries(messages).map(([partnerId, msgs])=>{ const latestMsg = msgs[0]; return /*#__PURE__*/ React.createElement("div", { key: partnerId, onClick: ()=>setSelectedChat({ chat_partner_id: partnerId, messages: msgs }), className: "cursor-pointer hover:bg-gray-50 p-3 rounded-lg border", __source: { fileName: "", lineNumber: 308, columnNumber: 23 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "flex justify-between items-center", __source: { fileName: "", lineNumber: 318, columnNumber: 25 }, __self: this }, /*#__PURE__*/ React.createElement("span", { className: "font-medium", __source: { fileName: "", lineNumber: 319, columnNumber: 27 }, __self: this }, latestMsg.sender_email), /*#__PURE__*/ React.createElement("span", { className: "text-xs text-gray-500", __source: { fileName: "", lineNumber: 322, columnNumber: 27 }, __self: this }, formatMessageTime(latestMsg.timestamp))), /*#__PURE__*/ React.createElement("p", { className: "text-sm text-gray-600 truncate", __source: { fileName: "", lineNumber: 326, columnNumber: 25 }, __self: this }, latestMsg.message)); })) : /*#__PURE__*/ React.createElement("div", { className: "space-y-4", __source: { fileName: "", lineNumber: 335, columnNumber: 15 }, __self: this }, /*#__PURE__*/ React.createElement("button", { onClick: ()=>setSelectedChat(null), className: "text-gray-500 hover:text-gray-700", __source: { fileName: "", lineNumber: 336, columnNumber: 17 }, __self: this }, /*#__PURE__*/ React.createElement("i", { className: "fas fa-arrow-left mr-2", __source: { fileName: "", lineNumber: 340, columnNumber: 19 }, __self: this }), "Back"), /*#__PURE__*/ React.createElement("div", { className: "space-y-4", __source: { fileName: "", lineNumber: 342, columnNumber: 17 }, __self: this }, selectedChat.messages.map((msg, index)=>/*#__PURE__*/ React.createElement("div", { key: index, className: `flex flex-col ${msg.sender_id === selectedChat.chat_partner_id ? "items-start" : "items-end"}`, __source: { fileName: "", lineNumber: 344, columnNumber: 21 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: `rounded-lg p-3 max-w-[80%] ${msg.sender_id === selectedChat.chat_partner_id ? "bg-gray-100" : "bg-[#00ff00] text-black"}`, __source: { fileName: "", lineNumber: 352, columnNumber: 23 }, __self: this }, msg.message), /*#__PURE__*/ React.createElement("span", { className: "text-xs text-gray-500 mt-1", __source: { fileName: "", lineNumber: 361, columnNumber: 23 }, __self: this }, formatMessageTime(msg.timestamp))))), /*#__PURE__*/ React.createElement("div", { className: "absolute bottom-0 left-0 right-0 p-4 bg-white border-t", __source: { fileName: "", lineNumber: 367, columnNumber: 17 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "flex gap-2", __source: { fileName: "", lineNumber: 368, columnNumber: 19 }, __self: this }, /*#__PURE__*/ React.createElement("input", { type: "text", value: newMessage, onChange: (e)=>setNewMessage(e.target.value), placeholder: "Type a message...", className: "flex-1 px-3 py-2 rounded-lg border focus:outline-none focus:border-[#00ff00]", onKeyPress: (e)=>{ if (e.key === "Enter" && !e.shiftKey) { e.preventDefault(); handleSendMessage(); } }, __source: { fileName: "", lineNumber: 369, columnNumber: 21 }, __self: this }), /*#__PURE__*/ React.createElement("button", { onClick: handleSendMessage, disabled: sendingMessage || !newMessage.trim(), className: "bg-[#00ff00] text-black px-4 py-2 rounded-lg disabled:opacity-50", __source: { fileName: "", lineNumber: 382, columnNumber: 21 }, __self: this }, sendingMessage ? /*#__PURE__*/ React.createElement("i", { className: "fas fa-spinner fa-spin", __source: { fileName: "", lineNumber: 388, columnNumber: 25 }, __self: this }) : /*#__PURE__*/ React.createElement("i", { className: "fas fa-paper-plane", __source: { fileName: "", lineNumber: 390, columnNumber: 25 }, __self: this }))))))) : showMessages && !isLoggedIn ? /*#__PURE__*/ React.createElement("div", { className: "fixed bottom-4 right-4 w-96 bg-white rounded-lg shadow-xl border border-gray-200 p-4", __source: { fileName: "", lineNumber: 400, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("h3", { className: "font-bold mb-4", __source: { fileName: "", lineNumber: 401, columnNumber: 11 }, __self: this }, "Please log in to view messages"), /*#__PURE__*/ React.createElement("form", { onSubmit: handleLogin, className: "space-y-4", __source: { fileName: "", lineNumber: 402, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("input", { type: "email", placeholder: "Email", value: loginData.email, onChange: (e)=>setLoginData({ ...loginData, email: e.target.value }), className: "w-full px-3 py-2 rounded-lg border focus:outline-none focus:border-[#00ff00]", __source: { fileName: "", lineNumber: 403, columnNumber: 13 }, __self: this }), /*#__PURE__*/ React.createElement("input", { type: "password", placeholder: "Password", value: loginData.password, onChange: (e)=>setLoginData({ ...loginData, password: e.target.value }), className: "w-full px-3 py-2 rounded-lg border focus:outline-none focus:border-[#00ff00]", __source: { fileName: "", lineNumber: 412, columnNumber: 13 }, __self: this }), /*#__PURE__*/ React.createElement("button", { type: "submit", className: "w-full bg-[#00ff00] text-black px-4 py-2 rounded-lg", __source: { fileName: "", lineNumber: 421, columnNumber: 13 }, __self: this }, "Log In"), error && /*#__PURE__*/ React.createElement("div", { className: "text-red-500 text-sm", __source: { fileName: "", lineNumber: 427, columnNumber: 23 }, __self: this }, error))) : null); const BrandView = ()=>/*#__PURE__*/ React.createElement("div", { className: "text-center max-w-4xl mx-auto px-4 md:px-8", __source: { fileName: "", lineNumber: 435, columnNumber: 5 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "mb-6 md:mb-8", __source: { fileName: "", lineNumber: 436, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("h1", { className: "text-3xl md:text-6xl font-bold mb-3 md:mb-4", __source: { fileName: "", lineNumber: 437, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("span", { className: "block md:inline", __source: { fileName: "", lineNumber: 438, columnNumber: 11 }, __self: this }, "get"), /*#__PURE__*/ React.createElement("span", { className: "bg-[#ff4d79] px-3 md:px-4 mx-1 md:mx-2 rounded-full inline-block my-1 md:my-0", __source: { fileName: "", lineNumber: 439, columnNumber: 11 }, __self: this }, "noticed"), /*#__PURE__*/ React.createElement("span", { className: "block md:inline", __source: { fileName: "", lineNumber: 442, columnNumber: 11 }, __self: this }, "by the voices"), /*#__PURE__*/ React.createElement("div", { className: "mt-1 md:mt-0", __source: { fileName: "", lineNumber: 443, columnNumber: 11 }, __self: this }, "that", /*#__PURE__*/ React.createElement("span", { className: "bg-[#00ff00] px-3 md:px-4 mx-1 md:mx-2 rounded-full inline-block my-1 md:my-0", __source: { fileName: "", lineNumber: 445, columnNumber: 13 }, __self: this }, "matter"))), /*#__PURE__*/ React.createElement("p", { className: "text-lg md:text-2xl text-gray-600 mt-4 md:mt-6", __source: { fileName: "", lineNumber: 450, columnNumber: 9 }, __self: this }, "connect with authentic voices to ignite your brand's next viral UGC campaign.")), /*#__PURE__*/ React.createElement("a", { target: "_self", href: "https://trycreatorconnect.com/brand-onboard", className: "inline-block bg-[#00ff00] text-black font-bold py-2 md:py-3 px-6 md:px-8 rounded-full text-base md:text-xl shadow-lg hover:opacity-90 transition-opacity w-full md:w-auto", __source: { fileName: "", lineNumber: 455, columnNumber: 7 }, __self: this }, "Get Noticed →"), /*#__PURE__*/ React.createElement("div", { className: "flex flex-wrap justify-center gap-6 mt-20", __source: { fileName: "", lineNumber: 463, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "bg-white rounded-xl shadow-lg overflow-hidden w-[250px] hover:-translate-y-2 transition-transform", __source: { fileName: "", lineNumber: 464, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "p-4", __source: { fileName: "", lineNumber: 465, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "flex items-center gap-3", __source: { fileName: "", lineNumber: 466, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("i", { className: "fas fa-store text-[#ff4d79] text-xl", __source: { fileName: "", lineNumber: 467, columnNumber: 15 }, __self: this }), /*#__PURE__*/ React.createElement("h3", { className: "text-lg font-bold", __source: { fileName: "", lineNumber: 468, columnNumber: 15 }, __self: this }, "Nike"), /*#__PURE__*/ React.createElement("span", { className: "ml-auto text-xl font-bold", __source: { fileName: "", lineNumber: 469, columnNumber: 15 }, __self: this }, "150K")), /*#__PURE__*/ React.createElement("img", { src: "https://ucarecdn.com/45c8b920-7700-4a23-be38-08f9579ecb81/-/format/auto/", alt: "Nike brand showcase featuring athletic wear", className: "w-full h-[350px] object-cover rounded-lg mt-4", __source: { fileName: "", lineNumber: 471, columnNumber: 13 }, __self: this }))), /*#__PURE__*/ React.createElement("div", { className: "bg-white rounded-xl shadow-lg overflow-hidden w-[250px] hover:-translate-y-2 transition-transform", __source: { fileName: "", lineNumber: 478, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "p-4", __source: { fileName: "", lineNumber: 479, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "flex items-center gap-3", __source: { fileName: "", lineNumber: 480, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("i", { className: "fas fa-tshirt text-[#ff4d79] text-xl", __source: { fileName: "", lineNumber: 481, columnNumber: 15 }, __self: this }), /*#__PURE__*/ React.createElement("h3", { className: "text-lg font-bold", __source: { fileName: "", lineNumber: 482, columnNumber: 15 }, __self: this }, "Adidas"), /*#__PURE__*/ React.createElement("span", { className: "ml-auto text-xl font-bold", __source: { fileName: "", lineNumber: 483, columnNumber: 15 }, __self: this }, "200K")), /*#__PURE__*/ React.createElement("img", { src: "https://ucarecdn.com/45c8b920-7700-4a23-be38-08f9579ecb81/-/format/auto/", alt: "Adidas brand showcase featuring sportswear", className: "w-full h-[350px] object-cover rounded-lg mt-4", __source: { fileName: "", lineNumber: 485, columnNumber: 13 }, __self: this }))), /*#__PURE__*/ React.createElement("div", { className: "bg-white rounded-xl shadow-lg overflow-hidden w-[250px] hover:-translate-y-2 transition-transform", __source: { fileName: "", lineNumber: 492, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "p-4", __source: { fileName: "", lineNumber: 493, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "flex items-center gap-3", __source: { fileName: "", lineNumber: 494, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("i", { className: "fas fa-running text-[#ff4d79] text-xl", __source: { fileName: "", lineNumber: 495, columnNumber: 15 }, __self: this }), /*#__PURE__*/ React.createElement("h3", { className: "text-lg font-bold", __source: { fileName: "", lineNumber: 496, columnNumber: 15 }, __self: this }, "Puma"), /*#__PURE__*/ React.createElement("span", { className: "ml-auto text-xl font-bold", __source: { fileName: "", lineNumber: 497, columnNumber: 15 }, __self: this }, "175K")), /*#__PURE__*/ React.createElement("img", { src: "https://ucarecdn.com/97f9167d-1dfa-46a6-97a9-9165294aaa71/-/format/auto/", alt: "Puma brand showcase featuring athletic footwear", className: "w-full h-[350px] object-cover rounded-lg mt-4", __source: { fileName: "", lineNumber: 499, columnNumber: 13 }, __self: this }))))); return /*#__PURE__*/ React.createElement("div", { className: "min-h-screen bg-white", __source: { fileName: "", lineNumber: 511, columnNumber: 5 }, __self: this }, /*#__PURE__*/ React.createElement("nav", { className: "flex flex-col md:flex-row justify-between items-center py-4 md:py-6 px-4 max-w-6xl mx-auto", __source: { fileName: "", lineNumber: 512, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("a", { href: "/", className: "font-bold text-xl md:text-2xl bg-[#00ff00] px-3 md:px-4 py-1 rounded-lg mb-4 md:mb-0", __source: { fileName: "", lineNumber: 513, columnNumber: 9 }, __self: this }, "CreatorConnect"), /*#__PURE__*/ React.createElement("div", { className: "flex gap-4 md:space-x-8", __source: { fileName: "", lineNumber: 519, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("button", { onClick: ()=>setIsCreatorView(true), className: `text-base md:text-lg ${isCreatorView ? "font-bold" : "text-gray-500"}`, __source: { fileName: "", lineNumber: 520, columnNumber: 11 }, __self: this }, "For Creators"), /*#__PURE__*/ React.createElement("button", { onClick: ()=>setIsCreatorView(false), className: `text-base md:text-lg ${!isCreatorView ? "font-bold" : "text-gray-500"}`, __source: { fileName: "", lineNumber: 526, columnNumber: 11 }, __self: this }, "For Brands"), /*#__PURE__*/ React.createElement("button", { onClick: ()=>setShowMessages(!showMessages), className: "text-base md:text-lg text-gray-500 hover:text-gray-700", __source: { fileName: "", lineNumber: 532, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("i", { className: "fas fa-comments", __source: { fileName: "", lineNumber: 536, columnNumber: 13 }, __self: this })))), /*#__PURE__*/ React.createElement("main", { className: "flex items-center justify-center py-6 md:py-20", __source: { fileName: "", lineNumber: 541, columnNumber: 7 }, __self: this }, isCreatorView ? /*#__PURE__*/ React.createElement(CreatorView, { __source: { fileName: "", lineNumber: 542, columnNumber: 26 }, __self: this }) : /*#__PURE__*/ React.createElement(BrandView, { __source: { fileName: "", lineNumber: 542, columnNumber: 44 }, __self: this }))); }

connect andget paidto make content forbrands youlove

Realsify

Pudgy Penguins

The Visage Collection

connect andget paidto make content for
brands youlove