function PromptTypeStats({ userEmail }) { const [stats, setStats] = useState({ academic: 0, eli5: 0, roleplay: 0, debate: 0 }); useEffect(()=>{ const fetchStats = async ()=>{ try { const response = await fetch(`/api/db/${process.env.NEXT_PUBLIC_CREATE_AUTH_DB_SLUG}`, { method: "POST", headers: { "Content-Type": "application/json" }, body: JSON.stringify({ query: "SELECT type, COUNT(*) as count FROM prompt_history WHERE user_email = ? GROUP BY type", values: [ userEmail ] }) }); const data = await response.json(); const newStats = { academic: 0, eli5: 0, roleplay: 0, debate: 0 }; data.forEach((item)=>{ newStats[item.type] = item.count; }); setStats(newStats); } catch (error) { console.error("Failed to fetch prompt stats:", error); } }; if (userEmail) { fetchStats(); } }, [ userEmail ]); return /*#__PURE__*/ React.createElement("div", { className: "grid grid-cols-2 md:grid-cols-4 gap-4", __source: { fileName: "", lineNumber: 42, columnNumber: 5 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "bg-gray-800/50 backdrop-blur-md border border-gray-700 rounded-lg p-4", __source: { fileName: "", lineNumber: 43, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "flex items-center justify-between mb-2", __source: { fileName: "", lineNumber: 44, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("span", { className: "text-blue-400", __source: { fileName: "", lineNumber: 45, columnNumber: 11 }, __self: this }, "Academic"), /*#__PURE__*/ React.createElement("i", { className: "fas fa-graduation-cap text-blue-400", __source: { fileName: "", lineNumber: 46, columnNumber: 11 }, __self: this })), /*#__PURE__*/ React.createElement("p", { className: "text-2xl font-bold text-white", __source: { fileName: "", lineNumber: 48, columnNumber: 9 }, __self: this }, stats.academic), /*#__PURE__*/ React.createElement("p", { className: "text-xs text-gray-400", __source: { fileName: "", lineNumber: 49, columnNumber: 9 }, __self: this }, "Scholarly analysis")), /*#__PURE__*/ React.createElement("div", { className: "bg-gray-800/50 backdrop-blur-md border border-gray-700 rounded-lg p-4", __source: { fileName: "", lineNumber: 52, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "flex items-center justify-between mb-2", __source: { fileName: "", lineNumber: 53, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("span", { className: "text-green-400", __source: { fileName: "", lineNumber: 54, columnNumber: 11 }, __self: this }, "ELI5"), /*#__PURE__*/ React.createElement("i", { className: "fas fa-child text-green-400", __source: { fileName: "", lineNumber: 55, columnNumber: 11 }, __self: this })), /*#__PURE__*/ React.createElement("p", { className: "text-2xl font-bold text-white", __source: { fileName: "", lineNumber: 57, columnNumber: 9 }, __self: this }, stats.eli5), /*#__PURE__*/ React.createElement("p", { className: "text-xs text-gray-400", __source: { fileName: "", lineNumber: 58, columnNumber: 9 }, __self: this }, "Simple explanations")), /*#__PURE__*/ React.createElement("div", { className: "bg-gray-800/50 backdrop-blur-md border border-gray-700 rounded-lg p-4", __source: { fileName: "", lineNumber: 61, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "flex items-center justify-between mb-2", __source: { fileName: "", lineNumber: 62, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("span", { className: "text-purple-400", __source: { fileName: "", lineNumber: 63, columnNumber: 11 }, __self: this }, "Roleplay"), /*#__PURE__*/ React.createElement("i", { className: "fas fa-theater-masks text-purple-400", __source: { fileName: "", lineNumber: 64, columnNumber: 11 }, __self: this })), /*#__PURE__*/ React.createElement("p", { className: "text-2xl font-bold text-white", __source: { fileName: "", lineNumber: 66, columnNumber: 9 }, __self: this }, stats.roleplay), /*#__PURE__*/ React.createElement("p", { className: "text-xs text-gray-400", __source: { fileName: "", lineNumber: 67, columnNumber: 9 }, __self: this }, "Character perspectives")), /*#__PURE__*/ React.createElement("div", { className: "bg-gray-800/50 backdrop-blur-md border border-gray-700 rounded-lg p-4", __source: { fileName: "", lineNumber: 70, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "flex items-center justify-between mb-2", __source: { fileName: "", lineNumber: 71, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("span", { className: "text-yellow-400", __source: { fileName: "", lineNumber: 72, columnNumber: 11 }, __self: this }, "Debate"), /*#__PURE__*/ React.createElement("i", { className: "fas fa-balance-scale text-yellow-400", __source: { fileName: "", lineNumber: 73, columnNumber: 11 }, __self: this })), /*#__PURE__*/ React.createElement("p", { className: "text-2xl font-bold text-white", __source: { fileName: "", lineNumber: 75, columnNumber: 9 }, __self: this }, stats.debate), /*#__PURE__*/ React.createElement("p", { className: "text-xs text-gray-400", __source: { fileName: "", lineNumber: 76, columnNumber: 9 }, __self: this }, "Balanced arguments"))); } function PromptTypeStatsStory() { return /*#__PURE__*/ React.createElement("div", { className: "p-4", style: { backgroundImage: "url('https://ucarecdn.com/4c859008-3e25-4c6c-b8c7-34dc737a377b/-/format/auto/-/quality/smart/-/scale_crop/1920x1080/center/')", backgroundSize: "cover", backgroundPosition: "center" }, __source: { fileName: "", lineNumber: 84, columnNumber: 5 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "mb-8", __source: { fileName: "", lineNumber: 93, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("h2", { className: "text-xl font-bold text-white mb-4", __source: { fileName: "", lineNumber: 94, columnNumber: 9 }, __self: this }, "Active User Stats"), /*#__PURE__*/ React.createElement(PromptTypeStats, { userEmail: "active@example.com", __source: { fileName: "", lineNumber: 95, columnNumber: 9 }, __self: this })), /*#__PURE__*/ React.createElement("div", { className: "mb-8", __source: { fileName: "", lineNumber: 98, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("h2", { className: "text-xl font-bold text-white mb-4", __source: { fileName: "", lineNumber: 99, columnNumber: 9 }, __self: this }, "New User Stats"), /*#__PURE__*/ React.createElement(PromptTypeStats, { userEmail: "new@example.com", __source: { fileName: "", lineNumber: 100, columnNumber: 9 }, __self: this })), /*#__PURE__*/ React.createElement("div", { __source: { fileName: "", lineNumber: 103, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("h2", { className: "text-xl font-bold text-white mb-4", __source: { fileName: "", lineNumber: 104, columnNumber: 9 }, __self: this }, "Loading State"), /*#__PURE__*/ React.createElement(PromptTypeStats, { userEmail: null, __source: { fileName: "", lineNumber: 105, columnNumber: 9 }, __self: this }))); } function PasswordResetForm() { const [email, setEmail] = useState(""); const [loading, setLoading] = useState(false); const [error, setError] = useState(""); const [success, setSuccess] = useState(""); const handleSubmit = async (e)=>{ e.preventDefault(); setLoading(true); setError(""); try { const response = await fetch("/api/reset-password", { method: "POST", headers: { "Content-Type": "application/json" }, body: JSON.stringify({ email }) }); const data = await response.json(); if (data.status === 200) { setSuccess(data.message); } else { setError(data.error || "Failed to process request"); } } catch (error) { setError("Network error. Please try again."); } finally{ setLoading(false); } }; return /*#__PURE__*/ React.createElement("div", { className: "min-h-screen flex items-center justify-center font-['EB_Garamond']", style: { backgroundImage: "url('https://ucarecdn.com/64a524ae-bc59-487f-bf29-308b59b027a7/-/format/auto/')", backgroundSize: "cover", backgroundPosition: "center", backgroundRepeat: "no-repeat" }, __source: { fileName: "", lineNumber: 34, columnNumber: 5 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "absolute inset-0 bg-gradient-to-br from-gray-900/95 via-[#1a1a2e]/90 to-black/95", __source: { fileName: "", lineNumber: 44, columnNumber: 7 }, __self: this }), /*#__PURE__*/ React.createElement("div", { className: "w-full max-w-md p-8 rounded-2xl bg-gray-800/50 backdrop-blur-md border border-gray-700 shadow-xl relative z-10", __source: { fileName: "", lineNumber: 46, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "text-center mb-8", __source: { fileName: "", lineNumber: 47, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("img", { src: "https://ucarecdn.com/5dddbb29-06d1-49a2-b1a8-1ca786833ef6/-/format/auto/", alt: "Loera Logo", className: "h-16 rounded-lg mx-auto mb-4", __source: { fileName: "", lineNumber: 48, columnNumber: 11 }, __self: this }), /*#__PURE__*/ React.createElement("h2", { className: "text-3xl font-semibold text-white mb-2", __source: { fileName: "", lineNumber: 53, columnNumber: 11 }, __self: this }, "Reset Password"), /*#__PURE__*/ React.createElement("p", { className: "text-gray-400 italic", __source: { fileName: "", lineNumber: 56, columnNumber: 11 }, __self: this }, "Enter your email to receive reset instructions")), /*#__PURE__*/ React.createElement("form", { onSubmit: handleSubmit, className: "space-y-6", __source: { fileName: "", lineNumber: 61, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("div", { __source: { fileName: "", lineNumber: 62, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("label", { className: "block text-sm font-medium text-gray-300 mb-2", __source: { fileName: "", lineNumber: 63, columnNumber: 13 }, __self: this }, "Email Address"), /*#__PURE__*/ React.createElement("input", { type: "email", value: email, onChange: (e)=>setEmail(e.target.value), className: "w-full p-3 rounded-lg bg-gray-700/50 border border-gray-600 text-white placeholder-gray-400 focus:border-[#a45ee9] focus:ring-1 focus:ring-[#a45ee9] outline-none", placeholder: "you@example.com", required: true, __source: { fileName: "", lineNumber: 66, columnNumber: 13 }, __self: this })), error && /*#__PURE__*/ React.createElement("div", { className: "p-4 bg-red-500/10 border border-red-500/20 rounded-lg", __source: { fileName: "", lineNumber: 77, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("p", { className: "text-red-400 text-sm text-center", __source: { fileName: "", lineNumber: 78, columnNumber: 15 }, __self: this }, error)), success && /*#__PURE__*/ React.createElement("div", { className: "p-4 bg-green-500/10 border border-green-500/20 rounded-lg space-y-3", __source: { fileName: "", lineNumber: 83, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("p", { className: "text-green-400 text-sm text-center", __source: { fileName: "", lineNumber: 84, columnNumber: 15 }, __self: this }, success), /*#__PURE__*/ React.createElement("div", { className: "text-gray-400 text-xs text-center", __source: { fileName: "", lineNumber: 85, columnNumber: 15 }, __self: this }, /*#__PURE__*/ React.createElement("p", { __source: { fileName: "", lineNumber: 86, columnNumber: 17 }, __self: this }, "Please check your email (including spam/junk folders) for instructions from promptiansre.tech"), /*#__PURE__*/ React.createElement("p", { className: "mt-2", __source: { fileName: "", lineNumber: 90, columnNumber: 17 }, __self: this }, "The reset link will expire in 24 hours for security reasons."))), /*#__PURE__*/ React.createElement("button", { type: "submit", disabled: loading, className: "w-full py-3 rounded-lg bg-[#a45ee9] hover:bg-[#8f51cc] text-white transition-colors flex items-center justify-center gap-2 disabled:opacity-50 disabled:cursor-not-allowed", __source: { fileName: "", lineNumber: 97, columnNumber: 11 }, __self: this }, loading ? /*#__PURE__*/ React.createElement("div", { className: "flex items-center justify-center space-x-2", __source: { fileName: "", lineNumber: 103, columnNumber: 15 }, __self: this }, /*#__PURE__*/ React.createElement("i", { className: "fas fa-circle-notch fa-spin", __source: { fileName: "", lineNumber: 104, columnNumber: 17 }, __self: this }), /*#__PURE__*/ React.createElement("span", { __source: { fileName: "", lineNumber: 105, columnNumber: 17 }, __self: this }, "Sending Reset Instructions...")) : /*#__PURE__*/ React.createElement("span", { className: "flex items-center", __source: { fileName: "", lineNumber: 108, columnNumber: 15 }, __self: this }, /*#__PURE__*/ React.createElement("i", { className: "fas fa-paper-plane mr-2", __source: { fileName: "", lineNumber: 109, columnNumber: 17 }, __self: this }), "Send Reset Instructions"))))); } function PasswordResetFormStory() { return /*#__PURE__*/ React.createElement("div", { className: "space-y-4", __source: { fileName: "", lineNumber: 122, columnNumber: 5 }, __self: this }, /*#__PURE__*/ React.createElement(PasswordResetForm, { __source: { fileName: "", lineNumber: 123, columnNumber: 7 }, __self: this })); } function EmailGate({ email = "", password = "", onEmailChange, onPasswordChange, onSubmit, error = "", success = "", isSubmitting = false, mode = "signin", onModeChange }) { const [detailedError, setDetailedError] = useState(""); useEffect(()=>{ if (error.includes("SendGrid API Error")) { setDetailedError("Our email service is temporarily unavailable. Please try again in a few minutes."); } else { setDetailedError(error); } }, [ error ]); return /*#__PURE__*/ React.createElement("div", { className: "fixed inset-0 flex items-center justify-center z-50 font-['EB_Garamond']", style: { backgroundImage: "url('https://ucarecdn.com/64a524ae-bc59-487f-bf29-308b59b027a7/-/format/auto/')", backgroundSize: "cover", backgroundPosition: "center", backgroundRepeat: "no-repeat" }, __source: { fileName: "", lineNumber: 26, columnNumber: 5 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "absolute inset-0 bg-gradient-to-br from-gray-900/95 via-[#1a1a2e]/90 to-black/95", __source: { fileName: "", lineNumber: 36, columnNumber: 7 }, __self: this }), /*#__PURE__*/ React.createElement("div", { className: "relative z-10 bg-gray-800/50 backdrop-blur-md border border-gray-700 rounded-lg p-8 max-w-md w-full mx-4", __source: { fileName: "", lineNumber: 38, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "text-center mb-8", __source: { fileName: "", lineNumber: 39, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("img", { src: "https://ucarecdn.com/b6548fb4-3d2e-4e3c-a3e9-43a5ec110578/-/format/auto/", alt: "Promptians RE Logo", className: "h-16 mx-auto mb-4 rounded-lg", __source: { fileName: "", lineNumber: 40, columnNumber: 11 }, __self: this }), /*#__PURE__*/ React.createElement("h1", { className: "text-3xl font-bold mb-1", style: { background: "linear-gradient(to right, #a45ee9, #8f51cc)", WebkitBackgroundClip: "text", WebkitTextFillColor: "transparent" }, __source: { fileName: "", lineNumber: 45, columnNumber: 11 }, __self: this }, "Promptians RE"), /*#__PURE__*/ React.createElement("p", { className: "text-gray-400 italic", __source: { fileName: "", lineNumber: 55, columnNumber: 11 }, __self: this }, mode === "signin" ? "Sign in to create better prompts" : mode === "signup" ? "Create account to start crafting prompts" : "Reset password to continue crafting")), /*#__PURE__*/ React.createElement("form", { onSubmit: onSubmit, className: "space-y-6", __source: { fileName: "", lineNumber: 64, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("input", { type: "email", value: email, onChange: onEmailChange, placeholder: "Enter your email", className: "w-full p-3 rounded-lg bg-gray-700/50 border border-gray-600 text-white placeholder-gray-400 focus:border-[#a45ee9] focus:ring-1 focus:ring-[#a45ee9] outline-none", required: true, __source: { fileName: "", lineNumber: 65, columnNumber: 11 }, __self: this }), mode !== "reset" && /*#__PURE__*/ React.createElement("input", { type: "password", value: password, onChange: onPasswordChange, placeholder: "Enter your password", className: "w-full p-3 rounded-lg bg-gray-700/50 border border-gray-600 text-white placeholder-gray-400 focus:border-[#a45ee9] focus:ring-1 focus:ring-[#a45ee9] outline-none", required: true, __source: { fileName: "", lineNumber: 75, columnNumber: 13 }, __self: this }), detailedError && /*#__PURE__*/ React.createElement("div", { className: "text-red-400 text-sm bg-red-900/20 border border-red-500/50 p-3 rounded-lg", __source: { fileName: "", lineNumber: 86, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("p", { className: "font-medium", __source: { fileName: "", lineNumber: 87, columnNumber: 15 }, __self: this }, "Error:"), /*#__PURE__*/ React.createElement("p", { __source: { fileName: "", lineNumber: 88, columnNumber: 15 }, __self: this }, detailedError)), success && /*#__PURE__*/ React.createElement("div", { className: "text-green-400 text-sm bg-green-900/20 border border-green-500/50 p-3 rounded-lg", __source: { fileName: "", lineNumber: 93, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("p", { className: "font-medium", __source: { fileName: "", lineNumber: 94, columnNumber: 15 }, __self: this }, "Success:"), /*#__PURE__*/ React.createElement("p", { __source: { fileName: "", lineNumber: 95, columnNumber: 15 }, __self: this }, success)), /*#__PURE__*/ React.createElement("button", { type: "submit", disabled: isSubmitting, className: `w-full py-3 rounded-lg ${isSubmitting ? "bg-gray-600 cursor-not-allowed" : "bg-[#a45ee9] hover:bg-[#8f51cc]"} text-white transition-colors`, __source: { fileName: "", lineNumber: 99, columnNumber: 11 }, __self: this }, isSubmitting ? /*#__PURE__*/ React.createElement("span", { className: "flex items-center justify-center", __source: { fileName: "", lineNumber: 109, columnNumber: 15 }, __self: this }, /*#__PURE__*/ React.createElement("i", { className: "fas fa-circle-notch fa-spin mr-2", __source: { fileName: "", lineNumber: 110, columnNumber: 17 }, __self: this }), "Processing...") : mode === "signin" ? "Sign In" : mode === "signup" ? "Create Account" : "Send Reset Link"), /*#__PURE__*/ React.createElement("div", { className: "flex flex-col items-center gap-2 text-sm text-gray-400", __source: { fileName: "", lineNumber: 122, columnNumber: 11 }, __self: this }, mode === "signin" && /*#__PURE__*/ React.createElement(React.Fragment, null, /*#__PURE__*/ React.createElement("button", { type: "button", onClick: ()=>onModeChange("reset"), className: "hover:text-white transition-colors", __source: { fileName: "", lineNumber: 125, columnNumber: 17 }, __self: this }, "Forgot Password?"), /*#__PURE__*/ React.createElement("button", { type: "button", onClick: ()=>onModeChange("signup"), className: "hover:text-white transition-colors", __source: { fileName: "", lineNumber: 132, columnNumber: 17 }, __self: this }, "Don't have an account? Sign Up")), mode === "signup" && /*#__PURE__*/ React.createElement("button", { type: "button", onClick: ()=>onModeChange("signin"), className: "hover:text-white transition-colors", __source: { fileName: "", lineNumber: 142, columnNumber: 15 }, __self: this }, "Already have an account? Sign In"), mode === "reset" && /*#__PURE__*/ React.createElement("button", { type: "button", onClick: ()=>onModeChange("signin"), className: "hover:text-white transition-colors", __source: { fileName: "", lineNumber: 151, columnNumber: 15 }, __self: this }, "Back to Sign In"))), mode !== "reset" && /*#__PURE__*/ React.createElement("div", { className: "mt-8 flex items-center justify-center space-x-4 text-sm text-gray-400", __source: { fileName: "", lineNumber: 163, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("span", { className: "flex items-center", __source: { fileName: "", lineNumber: 164, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("i", { className: "fas fa-check-circle text-[#a45ee9] mr-2", __source: { fileName: "", lineNumber: 165, columnNumber: 15 }, __self: this }), "3 Free Credits"), /*#__PURE__*/ React.createElement("span", { className: "text-gray-600", __source: { fileName: "", lineNumber: 168, columnNumber: 13 }, __self: this }, "|"), /*#__PURE__*/ React.createElement("span", { className: "flex items-center", __source: { fileName: "", lineNumber: 169, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("i", { className: "fas fa-bolt text-[#a45ee9] mr-2", __source: { fileName: "", lineNumber: 170, columnNumber: 15 }, __self: this }), "No Credit Card")))); } function EmailGateStory() { const [email, setEmail] = useState(""); const [password, setPassword] = useState(""); const [error, setError] = useState(""); const [success, setSuccess] = useState(""); const [isSubmitting, setIsSubmitting] = useState(false); const [mode, setMode] = useState("signin"); const handleSubmit = async (e)=>{ e.preventDefault(); setError(""); setSuccess(""); setIsSubmitting(true); try { if (mode === "reset") { const response = await fetch("/api/reset-password", { method: "POST", headers: { "Content-Type": "application/json" }, body: JSON.stringify({ email }) }); const data = await response.json(); if (data.status === 200) { setSuccess(data.message); setEmail(""); } else if (data.status === 404) { setError(data.error); setTimeout(()=>setMode("signup"), 3000); } else { setError(data.error); } } else { const response = await fetch(mode === "signin" ? "/api/signin" : "/api/signup", { method: "POST", headers: { "Content-Type": "application/json" }, body: JSON.stringify({ email, password }) }); const data = await response.json(); if (data.status === 200) { localStorage.setItem("userEmail", email); window.location.href = "/home"; } else if (data.status === 404 && data.action === "signup") { setError(data.error); setTimeout(()=>setMode("signup"), 3000); } else if (data.status === 401 && data.action === "reset") { setError(data.error); setTimeout(()=>setMode("reset"), 3000); } else { setError(data.error || "Authentication failed"); } } } catch (error) { setError("Something went wrong. Please try again."); } finally{ setIsSubmitting(false); } }; return /*#__PURE__*/ React.createElement(EmailGate, { email: email, password: password, onEmailChange: (e)=>setEmail(e.target.value), onPasswordChange: (e)=>setPassword(e.target.value), onSubmit: handleSubmit, error: error, success: success, isSubmitting: isSubmitting, mode: mode, onModeChange: setMode, __source: { fileName: "", lineNumber: 246, columnNumber: 5 }, __self: this }); } function UseProStatus() { const [isProVerified, setIsProVerified] = useState(false); const [isChecking, setIsChecking] = useState(true); const { data: user } = useUser(); const [topic, setTopic] = useState(""); const [refinedPrompts, setRefinedPrompts] = useState([]); const [isRefining, setIsRefining] = useState(false); const [showPreferences, setShowPreferences] = useState(false); const [promptType, setPromptType] = useState("academic"); const [currentPage, setCurrentPage] = useState(1); const [inputError, setInputError] = useState(""); const [showUpgrade, setShowUpgrade] = useState(false); const [promptCount, setPromptCount] = useState(0); const FREE_LIMIT = 3; const MIN_CHARS = 30; const promptsPerPage = 3; const [userPreferences, setUserPreferences] = useState(()=>{ const savedPrefs = localStorage.getItem("promptPreferences"); return savedPrefs ? JSON.parse(savedPrefs) : { tone: "formal", detailLevel: "detailed", wordLimit: "medium", outputStyle: "paragraphs" }; }); useEffect(()=>{ const verifyProStatus = async ()=>{ if (!user) return; try { const billingClient = await window.BillingClient.initialize(); const purchases = await billingClient.queryPurchases(); const activePurchase = purchases.find((p)=>p.productId === "pro_subscription" && p.userEmail === user.email); if (activePurchase) { const response = await fetch("/api/verify-purchase", { method: "POST", headers: { "Content-Type": "application/json" }, body: JSON.stringify({ purchaseToken: activePurchase.purchaseToken }) }); const data = await response.json(); if (data.success) { setIsProVerified(true); localStorage.setItem("purchaseToken", activePurchase.purchaseToken); } } } catch (error) { console.error("Failed to verify pro status:", error); } finally{ setIsChecking(false); } }; verifyProStatus(); }, [ user ]); useEffect(()=>{ const count = localStorage.getItem("promptCount") || 0; setPromptCount(parseInt(count)); }, []); const handlePurchase = async ()=>{ window.location.href = `/account/signin?callbackUrl=${encodeURIComponent(window.location.pathname)}`; }; const handleRefine = useCallback(async ()=>{ if (!isProVerified && promptCount >= FREE_LIMIT) { setShowUpgrade(true); return; } if (topic.length < MIN_CHARS) { setInputError(`Please enter at least ${MIN_CHARS} characters`); return; } setIsRefining(true); setInputError(""); try { const response = await fetch("/api/process-prompt", { method: "POST", headers: { "Content-Type": "application/json" }, body: JSON.stringify({ prompt: topic, preferences: { promptType, ...userPreferences } }) }); const data = await response.json(); if (data.error) { setInputError(data.error); return; } setRefinedPrompts((prev)=>[ ...prev, { title: "Refined Prompt", prompt: data.result, timestamp: new Date().toISOString() } ]); if (!isProVerified) { const newCount = promptCount + 1; setPromptCount(newCount); localStorage.setItem("promptCount", newCount.toString()); } } catch (error) { console.error("Refinement Error:", error); setInputError("Failed to refine prompt. Please try again."); } finally{ setIsRefining(false); } }, [ topic, promptType, userPreferences, isProVerified, promptCount ]); if (isChecking) { return /*#__PURE__*/ React.createElement("div", { className: "min-h-screen flex items-center justify-center bg-gray-50", __source: { fileName: "", lineNumber: 135, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "text-center", __source: { fileName: "", lineNumber: 136, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("i", { className: "fas fa-circle-notch fa-spin text-[#a45ee9] text-3xl mb-4", __source: { fileName: "", lineNumber: 137, columnNumber: 11 }, __self: this }), /*#__PURE__*/ React.createElement("p", { className: "text-gray-600", __source: { fileName: "", lineNumber: 138, columnNumber: 11 }, __self: this }, "Verifying subscription status..."))); } const userEmail = localStorage.getItem("userEmail"); if (!userEmail) { return /*#__PURE__*/ React.createElement(React.Fragment, null); } return /*#__PURE__*/ React.createElement("div", { className: "min-h-screen text-[#2C5282] font-eb-garamond p-4 relative flex flex-col", style: { backgroundImage: "url('https://images.unsplash.com/photo-1451187580459-43490279c0fa?ixlib=rb-1.2.1&auto=format&fit=crop&w=1920&q=80')", backgroundSize: "cover", backgroundPosition: "center", backgroundRepeat: "no-repeat" }, __source: { fileName: "", lineNumber: 150, columnNumber: 5 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "flex items-center mb-8", __source: { fileName: "", lineNumber: 160, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("img", { src: "https://ucarecdn.com/b6548fb4-3d2e-4e3c-a3e9-43a5ec110578/-/format/auto/", alt: "Loera Logo", className: "h-16 mr-4 rounded-lg", __source: { fileName: "", lineNumber: 161, columnNumber: 9 }, __self: this }), /*#__PURE__*/ React.createElement("div", { className: "flex flex-col", __source: { fileName: "", lineNumber: 166, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "flex items-center gap-4", __source: { fileName: "", lineNumber: 167, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("h1", { className: "text-3xl font-bold mb-1", style: { background: "linear-gradient(to right, #a45ee9, #8f51cc)", WebkitBackgroundClip: "text", WebkitTextFillColor: "transparent", color: "#a45ee9" }, __source: { fileName: "", lineNumber: 168, columnNumber: 13 }, __self: this }, "Promptians RE"), /*#__PURE__*/ React.createElement("button", { onClick: ()=>setShowPreferences(true), className: "px-3 py-1 rounded-lg bg-[#EDF2F7] text-[#2D3748] hover:bg-[#E2E8F0] flex items-center gap-2", __source: { fileName: "", lineNumber: 179, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("i", { className: "fas fa-cog", __source: { fileName: "", lineNumber: 183, columnNumber: 15 }, __self: this }), /*#__PURE__*/ React.createElement("span", { className: "text-sm", __source: { fileName: "", lineNumber: 184, columnNumber: 15 }, __self: this }, "Preferences"))), /*#__PURE__*/ React.createElement("p", { className: "text-md italic text-gray-400", __source: { fileName: "", lineNumber: 187, columnNumber: 11 }, __self: this }, "Sharper Prompts, Deeper Insights")), !isProVerified && /*#__PURE__*/ React.createElement("div", { className: "ml-auto flex items-center gap-2", __source: { fileName: "", lineNumber: 192, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("span", { className: "text-sm text-gray-500", __source: { fileName: "", lineNumber: 193, columnNumber: 13 }, __self: this }, FREE_LIMIT - promptCount, " prompts remaining"), /*#__PURE__*/ React.createElement("button", { onClick: ()=>setShowUpgrade(true), className: "px-4 py-2 bg-[#a45ee9] text-white rounded-lg hover:bg-[#8f51cc] transition-colors", __source: { fileName: "", lineNumber: 196, columnNumber: 13 }, __self: this }, "Upgrade to Pro"))), showUpgrade && /*#__PURE__*/ React.createElement("div", { className: "fixed inset-0 bg-black bg-opacity-50 flex items-center justify-center z-50", __source: { fileName: "", lineNumber: 207, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "bg-white rounded-lg p-8 max-w-md w-full mx-4", __source: { fileName: "", lineNumber: 208, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "text-center mb-6", __source: { fileName: "", lineNumber: 209, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("i", { className: "fas fa-crown text-[#a45ee9] text-4xl mb-4", __source: { fileName: "", lineNumber: 210, columnNumber: 15 }, __self: this }), /*#__PURE__*/ React.createElement("h2", { className: "text-2xl font-bold text-[#2D3748] mb-4", __source: { fileName: "", lineNumber: 211, columnNumber: 15 }, __self: this }, "Upgrade to Pro"), /*#__PURE__*/ React.createElement("p", { className: "text-gray-600", __source: { fileName: "", lineNumber: 214, columnNumber: 15 }, __self: this }, "Get unlimited prompts and advanced features with Pro version")), /*#__PURE__*/ React.createElement("div", { className: "space-y-4 mb-6", __source: { fileName: "", lineNumber: 218, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "flex items-center gap-3", __source: { fileName: "", lineNumber: 219, columnNumber: 15 }, __self: this }, /*#__PURE__*/ React.createElement("i", { className: "fas fa-infinity text-[#a45ee9]", __source: { fileName: "", lineNumber: 220, columnNumber: 17 }, __self: this }), /*#__PURE__*/ React.createElement("span", { __source: { fileName: "", lineNumber: 221, columnNumber: 17 }, __self: this }, "Unlimited prompt generations")), /*#__PURE__*/ React.createElement("div", { className: "flex items-center gap-3", __source: { fileName: "", lineNumber: 223, columnNumber: 15 }, __self: this }, /*#__PURE__*/ React.createElement("i", { className: "fas fa-magic text-[#a45ee9]", __source: { fileName: "", lineNumber: 224, columnNumber: 17 }, __self: this }), /*#__PURE__*/ React.createElement("span", { __source: { fileName: "", lineNumber: 225, columnNumber: 17 }, __self: this }, "Advanced customization options")), /*#__PURE__*/ React.createElement("div", { className: "flex items-center gap-3", __source: { fileName: "", lineNumber: 227, columnNumber: 15 }, __self: this }, /*#__PURE__*/ React.createElement("i", { className: "fas fa-bolt text-[#a45ee9]", __source: { fileName: "", lineNumber: 228, columnNumber: 17 }, __self: this }), /*#__PURE__*/ React.createElement("span", { __source: { fileName: "", lineNumber: 229, columnNumber: 17 }, __self: this }, "Priority processing"))), /*#__PURE__*/ React.createElement("button", { onClick: handlePurchase, className: "w-full py-3 rounded-lg bg-[#a45ee9] hover:bg-[#8f51cc] text-white transition-colors", __source: { fileName: "", lineNumber: 232, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("i", { className: "fas fa-arrow-right mr-2", __source: { fileName: "", lineNumber: 236, columnNumber: 15 }, __self: this }), "Upgrade Now - MYR 9.90/month"), /*#__PURE__*/ React.createElement("button", { onClick: ()=>setShowUpgrade(false), className: "w-full mt-4 py-3 rounded-lg border border-gray-300 hover:bg-gray-50 transition-colors", __source: { fileName: "", lineNumber: 239, columnNumber: 13 }, __self: this }, "Maybe Later")))); } function UseProStatusStory() { return /*#__PURE__*/ React.createElement("div", { __source: { fileName: "", lineNumber: 254, columnNumber: 5 }, __self: this }, /*#__PURE__*/ React.createElement(UseProStatus, { __source: { fileName: "", lineNumber: 255, columnNumber: 7 }, __self: this })); } function SubscriptionUpsell({ redirectURL }) { const [loading, setLoading] = useState(false); const [error, setError] = useState(""); const { data: user, loading: userLoading } = useUser(); const handlePurchase = async ()=>{ if (!userLoading && user) { setLoading(true); setError(""); try { const response = await fetch("/api/create-checkout-session", { method: "POST", headers: { "Content-Type": "application/json" }, body: JSON.stringify({ productId: process.env.NEXT_PUBLIC_SUBSCRIPTION_PRODUCT_ID, userEmail: user.email }) }); const data = await response.json(); if (data.error) { throw new Error(data.error.message || "Failed to start checkout"); } if (data.success && data.purchaseToken) { localStorage.setItem("purchaseToken", data.purchaseToken); window.location.href = "/payment-success"; } } catch (err) { setError("Failed to process payment. Please try again."); console.error("Purchase failed:", err); } finally{ setLoading(false); } } }; return /*#__PURE__*/ React.createElement("div", { className: "bg-gray-800/50 backdrop-blur-md border border-gray-700 rounded-lg p-8 max-w-md w-full mx-4", __source: { fileName: "", lineNumber: 40, columnNumber: 5 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "text-center mb-6", __source: { fileName: "", lineNumber: 41, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("i", { className: "fas fa-crown text-[#a45ee9] text-4xl mb-4", __source: { fileName: "", lineNumber: 42, columnNumber: 9 }, __self: this }), /*#__PURE__*/ React.createElement("h2", { className: "text-2xl font-bold text-white mb-4", __source: { fileName: "", lineNumber: 43, columnNumber: 9 }, __self: this }, "Upgrade to Pro"), /*#__PURE__*/ React.createElement("p", { className: "text-gray-400", __source: { fileName: "", lineNumber: 44, columnNumber: 9 }, __self: this }, "Get unlimited prompts and lifetime access to all features")), /*#__PURE__*/ React.createElement("div", { className: "space-y-4 mb-6", __source: { fileName: "", lineNumber: 49, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "flex items-center gap-3 text-white", __source: { fileName: "", lineNumber: 50, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("i", { className: "fas fa-infinity text-[#a45ee9]", __source: { fileName: "", lineNumber: 51, columnNumber: 11 }, __self: this }), /*#__PURE__*/ React.createElement("span", { __source: { fileName: "", lineNumber: 52, columnNumber: 11 }, __self: this }, "Unlimited prompt generations")), /*#__PURE__*/ React.createElement("div", { className: "flex items-center gap-3 text-white", __source: { fileName: "", lineNumber: 54, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("i", { className: "fas fa-magic text-[#a45ee9]", __source: { fileName: "", lineNumber: 55, columnNumber: 11 }, __self: this }), /*#__PURE__*/ React.createElement("span", { __source: { fileName: "", lineNumber: 56, columnNumber: 11 }, __self: this }, "Advanced customization options")), /*#__PURE__*/ React.createElement("div", { className: "flex items-center gap-3 text-white", __source: { fileName: "", lineNumber: 58, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("i", { className: "fas fa-bolt text-[#a45ee9]", __source: { fileName: "", lineNumber: 59, columnNumber: 11 }, __self: this }), /*#__PURE__*/ React.createElement("span", { __source: { fileName: "", lineNumber: 60, columnNumber: 11 }, __self: this }, "Priority processing")), /*#__PURE__*/ React.createElement("div", { className: "flex items-center gap-3 text-white", __source: { fileName: "", lineNumber: 62, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("i", { className: "fas fa-clock text-[#a45ee9]", __source: { fileName: "", lineNumber: 63, columnNumber: 11 }, __self: this }), /*#__PURE__*/ React.createElement("span", { __source: { fileName: "", lineNumber: 64, columnNumber: 11 }, __self: this }, "Lifetime access"))), error && /*#__PURE__*/ React.createElement("div", { className: "text-red-400 text-sm text-center mb-4", __source: { fileName: "", lineNumber: 69, columnNumber: 9 }, __self: this }, error), /*#__PURE__*/ React.createElement("button", { onClick: handlePurchase, disabled: loading || userLoading, className: "w-full py-3 rounded-lg bg-[#a45ee9] hover:bg-[#8f51cc] text-white transition-colors disabled:opacity-50 disabled:cursor-not-allowed", __source: { fileName: "", lineNumber: 72, columnNumber: 7 }, __self: this }, loading ? /*#__PURE__*/ React.createElement("span", { className: "flex items-center justify-center", __source: { fileName: "", lineNumber: 78, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("i", { className: "fas fa-circle-notch fa-spin mr-2", __source: { fileName: "", lineNumber: 79, columnNumber: 13 }, __self: this }), "Processing...") : userLoading ? /*#__PURE__*/ React.createElement("span", { className: "flex items-center justify-center", __source: { fileName: "", lineNumber: 83, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("i", { className: "fas fa-circle-notch fa-spin mr-2", __source: { fileName: "", lineNumber: 84, columnNumber: 13 }, __self: this }), "Loading...") : user ? /*#__PURE__*/ React.createElement("span", { className: "flex items-center justify-center", __source: { fileName: "", lineNumber: 88, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("i", { className: "fas fa-crown mr-2", __source: { fileName: "", lineNumber: 89, columnNumber: 13 }, __self: this }), "Upgrade to Lifetime Access") : /*#__PURE__*/ React.createElement("span", { className: "flex items-center justify-center", __source: { fileName: "", lineNumber: 93, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("i", { className: "fas fa-sign-in-alt mr-2", __source: { fileName: "", lineNumber: 94, columnNumber: 13 }, __self: this }), "Sign in to upgrade")), !user && /*#__PURE__*/ React.createElement("p", { className: "text-sm text-gray-400 text-center mt-4", __source: { fileName: "", lineNumber: 101, columnNumber: 9 }, __self: this }, "You need to be signed in to purchase lifetime access")); } function SubscriptionUpsellStory() { return /*#__PURE__*/ React.createElement("div", { className: "min-h-screen p-4 flex items-center justify-center", style: { backgroundImage: "url('https://ucarecdn.com/64a524ae-bc59-487f-bf29-308b59b027a7/-/format/auto/')", backgroundSize: "cover", backgroundPosition: "center", backgroundRepeat: "no-repeat" }, __source: { fileName: "", lineNumber: 111, columnNumber: 5 }, __self: this }, /*#__PURE__*/ React.createElement(SubscriptionUpsell, { redirectURL: "/account", __source: { fileName: "", lineNumber: 121, columnNumber: 7 }, __self: this })); } function PromptTypeInstructions({ type }) { const instructions = { academic: { title: "Academic Prompt", description: "Transforms your input into rigorous academic language suitable for research and scholarly work.", tips: [ "Use discipline-specific terminology", "Include methodological details", "Reference theoretical frameworks", "Specify research context" ] }, eli5: { title: "Explain Like I'm 5", description: "Simplifies complex topics into easy-to-understand explanations using simple language and analogies.", tips: [ "Use simple vocabulary", "Include relatable examples", "Break down complex ideas", "Use everyday analogies" ] }, roleplay: { title: "Roleplay Perspective", description: "Presents information from a specific character or expert's viewpoint for engaging explanations.", tips: [ "Define the character clearly", "Stay in character voice", "Include relevant experiences", "Use field-specific insights" ] }, debate: { title: "Debate Format", description: "Structures content as balanced arguments examining multiple viewpoints.", tips: [ "Present both sides fairly", "Include supporting evidence", "Address counterarguments", "Maintain neutral tone" ] } }; const current = instructions[type] || instructions.academic; return /*#__PURE__*/ React.createElement("div", { className: "bg-gray-800/50 backdrop-blur-md border border-gray-700 rounded-lg p-4 mb-4", __source: { fileName: "", lineNumber: 52, columnNumber: 5 }, __self: this }, /*#__PURE__*/ React.createElement("h3", { className: "text-lg font-semibold text-white mb-2", __source: { fileName: "", lineNumber: 53, columnNumber: 7 }, __self: this }, current.title), /*#__PURE__*/ React.createElement("p", { className: "text-gray-400 mb-3", __source: { fileName: "", lineNumber: 54, columnNumber: 7 }, __self: this }, current.description), /*#__PURE__*/ React.createElement("div", { className: "grid grid-cols-2 gap-2", __source: { fileName: "", lineNumber: 55, columnNumber: 7 }, __self: this }, current.tips.map((tip, index)=>/*#__PURE__*/ React.createElement("div", { key: index, className: "flex items-center gap-2 text-sm text-gray-300", __source: { fileName: "", lineNumber: 57, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("i", { className: "fas fa-check text-[#a45ee9]", __source: { fileName: "", lineNumber: 61, columnNumber: 13 }, __self: this }), /*#__PURE__*/ React.createElement("span", { __source: { fileName: "", lineNumber: 62, columnNumber: 13 }, __self: this }, tip))))); } function PromptTypeInstructionsStory() { return /*#__PURE__*/ React.createElement("div", { className: "min-h-screen p-4", style: { backgroundImage: "url('https://ucarecdn.com/4c859008-3e25-4c6c-b8c7-34dc737a377b/-/format/auto/-/quality/smart/-/scale_crop/1920x1080/center/')", backgroundSize: "cover", backgroundPosition: "center" }, __source: { fileName: "", lineNumber: 72, columnNumber: 5 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "max-w-2xl mx-auto space-y-6", __source: { fileName: "", lineNumber: 81, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("div", { __source: { fileName: "", lineNumber: 82, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("h2", { className: "text-xl font-bold text-white mb-4", __source: { fileName: "", lineNumber: 83, columnNumber: 11 }, __self: this }, "Academic Type"), /*#__PURE__*/ React.createElement(PromptTypeInstructions, { type: "academic", __source: { fileName: "", lineNumber: 84, columnNumber: 11 }, __self: this })), /*#__PURE__*/ React.createElement("div", { __source: { fileName: "", lineNumber: 87, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("h2", { className: "text-xl font-bold text-white mb-4", __source: { fileName: "", lineNumber: 88, columnNumber: 11 }, __self: this }, "ELI5 Type"), /*#__PURE__*/ React.createElement(PromptTypeInstructions, { type: "eli5", __source: { fileName: "", lineNumber: 89, columnNumber: 11 }, __self: this })), /*#__PURE__*/ React.createElement("div", { __source: { fileName: "", lineNumber: 92, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("h2", { className: "text-xl font-bold text-white mb-4", __source: { fileName: "", lineNumber: 93, columnNumber: 11 }, __self: this }, "Roleplay Type"), /*#__PURE__*/ React.createElement(PromptTypeInstructions, { type: "roleplay", __source: { fileName: "", lineNumber: 94, columnNumber: 11 }, __self: this })), /*#__PURE__*/ React.createElement("div", { __source: { fileName: "", lineNumber: 97, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("h2", { className: "text-xl font-bold text-white mb-4", __source: { fileName: "", lineNumber: 98, columnNumber: 11 }, __self: this }, "Debate Type"), /*#__PURE__*/ React.createElement(PromptTypeInstructions, { type: "debate", __source: { fileName: "", lineNumber: 99, columnNumber: 11 }, __self: this })))); } function MainComponent() { console.log("Component rendering"); const [topic, setTopic] = useState(""); const [refinedPrompts, setRefinedPrompts] = useState([]); const [isRefining, setIsRefining] = useState(false); const [promptType, setPromptType] = useState("academic"); const [currentPage, setCurrentPage] = useState(1); const [inputError, setInputError] = useState(""); const [showUpgrade, setShowUpgrade] = useState(false); const [promptCount, setPromptCount] = useState(0); const { data: user } = useUser(); const colors = { academic: { text: "text-blue-400", border: "border-blue-500", hover: "hover:bg-blue-500/20 hover:shadow-lg hover:shadow-blue-500/50", icon: "text-blue-400" }, eli5: { text: "text-green-400", border: "border-green-500", hover: "hover:bg-green-500/20 hover:shadow-lg hover:shadow-green-500/50", icon: "text-green-400" }, roleplay: { text: "text-red-400", border: "border-red-500", hover: "hover:bg-red-500/20 hover:shadow-lg hover:shadow-red-500/50", icon: "text-red-400" }, debate: { text: "text-yellow-400", border: "border-yellow-500", hover: "hover:bg-yellow-500/20 hover:shadow-lg hover:shadow-yellow-500/50", icon: "text-yellow-400" } }; const promptTypes = [ { id: "academic", label: "Academic", icon: "fa-graduation-cap", color: "blue" }, { id: "eli5", label: "ELI5", icon: "fa-child", color: "green" }, { id: "roleplay", label: "Roleplay", icon: "fa-theater-masks", color: "red" }, { id: "debate", label: "Debate", icon: "fa-balance-scale", color: "yellow" } ]; const MIN_CHARS = 30; const FREE_LIMIT = 3; const promptsPerPage = 3; const handleRefine = useCallback(async ()=>{ if (!user?.subscription_status && promptCount >= FREE_LIMIT) { setShowUpgrade(true); return; } if (topic.length < MIN_CHARS) { setInputError(`Please enter at least ${MIN_CHARS} characters`); return; } setIsRefining(true); setInputError(""); try { const response = await fetch("/api/process-prompt", { method: "POST", headers: { "Content-Type": "application/json" }, body: JSON.stringify({ prompt: topic, preferences: { promptType }, userEmail: user?.email }) }); const data = await response.json(); if (data.error) { if (data.shouldUpgrade) { setShowUpgrade(true); } else { setInputError(data.error); } return; } setRefinedPrompts((prev)=>[ ...prev, data ]); if (!user?.subscription_status) { const newCount = promptCount + 1; setPromptCount(newCount); localStorage.setItem("promptCount", newCount.toString()); } } catch (error) { console.error("Refinement Error:", error); setInputError("Failed to refine prompt. Please try again."); } finally{ setIsRefining(false); } }, [ topic, promptType, user, promptCount ]); return /*#__PURE__*/ React.createElement("div", { className: "min-h-screen font-eb-garamond p-4 relative flex flex-col", style: { backgroundImage: "url('https://ucarecdn.com/64a524ae-bc59-487f-bf29-308b59b027a7/-/format/auto/')", backgroundSize: "cover", backgroundPosition: "center", backgroundRepeat: "no-repeat" }, __source: { fileName: "", lineNumber: 116, columnNumber: 5 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "absolute inset-0 bg-gradient-to-br from-gray-900/95 via-[#1a1a2e]/90 to-black/95", __source: { fileName: "", lineNumber: 126, columnNumber: 7 }, __self: this }), /*#__PURE__*/ React.createElement("div", { className: "relative z-10 flex-1", __source: { fileName: "", lineNumber: 128, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "flex flex-col md:flex-row items-start md:items-center mb-8 gap-4", __source: { fileName: "", lineNumber: 129, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "flex items-center", __source: { fileName: "", lineNumber: 130, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("img", { src: "https://ucarecdn.com/b6548fb4-3d2e-4e3c-a3e9-43a5ec110578/-/format/auto/", alt: "Loera Logo", className: "h-12 md:h-16 mr-4 rounded-lg", __source: { fileName: "", lineNumber: 131, columnNumber: 13 }, __self: this }), /*#__PURE__*/ React.createElement("div", { className: "flex flex-col", __source: { fileName: "", lineNumber: 136, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("h1", { className: "text-2xl md:text-3xl font-bold mb-1", style: { background: "linear-gradient(to right, #a45ee9, #8f51cc)", WebkitBackgroundClip: "text", WebkitTextFillColor: "transparent", textShadow: "0 0 20px rgba(164, 94, 233, 0.5)" }, __source: { fileName: "", lineNumber: 137, columnNumber: 15 }, __self: this }, "Promptians RE"), /*#__PURE__*/ React.createElement("p", { className: "text-sm md:text-md italic text-gray-400", __source: { fileName: "", lineNumber: 148, columnNumber: 15 }, __self: this }, "Sharper Prompts, Deeper Insights"))), /*#__PURE__*/ React.createElement("div", { className: "flex flex-wrap gap-2 mt-2 md:mt-0 md:ml-auto", __source: { fileName: "", lineNumber: 154, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("button", { onClick: ()=>{ if (navigator.share) { navigator.share({ title: "Promptians RE", text: "Check out this amazing prompt refinement tool!", url: window.location.origin }); } else { navigator.clipboard.writeText(window.location.origin); } }, className: "px-3 py-1 rounded-lg bg-[#EDF2F7] text-[#2D3748] hover:bg-[#E2E8F0] flex items-center gap-2", __source: { fileName: "", lineNumber: 155, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("i", { className: "fas fa-share-alt", __source: { fileName: "", lineNumber: 169, columnNumber: 15 }, __self: this }), /*#__PURE__*/ React.createElement("span", { className: "text-sm", __source: { fileName: "", lineNumber: 170, columnNumber: 15 }, __self: this }, "Share")))), /*#__PURE__*/ React.createElement("div", { className: "mt-8 max-w-3xl mx-auto space-y-6", __source: { fileName: "", lineNumber: 174, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "grid grid-cols-2 md:grid-cols-4 gap-4", __source: { fileName: "", lineNumber: 175, columnNumber: 11 }, __self: this }, promptTypes.map((type)=>/*#__PURE__*/ React.createElement("button", { key: type.id, onClick: ()=>setPromptType(type.id), className: `p-4 rounded-lg border transition-all duration-300 flex items-center gap-3 bg-gray-800/50 ${colors[type.id].text} ${colors[type.id].border} ${colors[type.id].hover} `, __source: { fileName: "", lineNumber: 177, columnNumber: 15 }, __self: this }, /*#__PURE__*/ React.createElement("i", { className: `fas ${type.icon} ${colors[type.id].icon}`, __source: { fileName: "", lineNumber: 187, columnNumber: 17 }, __self: this }), /*#__PURE__*/ React.createElement("span", { className: "text-sm md:text-base", __source: { fileName: "", lineNumber: 188, columnNumber: 17 }, __self: this }, type.label)))), /*#__PURE__*/ React.createElement(PromptTypeInstructions, { type: promptType, __source: { fileName: "", lineNumber: 193, columnNumber: 11 }, __self: this })), /*#__PURE__*/ React.createElement("div", { className: "max-w-3xl mx-auto", __source: { fileName: "", lineNumber: 196, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("textarea", { value: topic, onChange: (e)=>setTopic(e.target.value), placeholder: "Enter your topic or concept to get refined prompts...", className: "w-full p-4 rounded-lg bg-gray-800/50 border border-gray-700 text-white placeholder-gray-400 focus:border-[#a45ee9] focus:ring-1 focus:ring-[#a45ee9] outline-none resize-none shadow-lg", rows: 4, __source: { fileName: "", lineNumber: 197, columnNumber: 11 }, __self: this }), inputError && /*#__PURE__*/ React.createElement("div", { className: "mt-4 p-4 bg-red-900/20 border border-red-500/50 rounded-lg", __source: { fileName: "", lineNumber: 206, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("p", { className: "text-red-400 text-sm", __source: { fileName: "", lineNumber: 207, columnNumber: 15 }, __self: this }, inputError)), /*#__PURE__*/ React.createElement("button", { onClick: handleRefine, disabled: isRefining, className: `mt-4 w-full py-3 rounded-lg ${isRefining ? "bg-gray-600 cursor-not-allowed" : "bg-gradient-to-r from-[#a45ee9] to-[#8f51cc] hover:from-[#8f51cc] hover:to-[#a45ee9]"} text-white transition-all duration-300 shadow-lg hover:shadow-xl`, __source: { fileName: "", lineNumber: 211, columnNumber: 11 }, __self: this }, isRefining ? /*#__PURE__*/ React.createElement("span", { className: "flex items-center justify-center", __source: { fileName: "", lineNumber: 221, columnNumber: 15 }, __self: this }, /*#__PURE__*/ React.createElement("i", { className: "fas fa-circle-notch fa-spin mr-2", __source: { fileName: "", lineNumber: 222, columnNumber: 17 }, __self: this }), "Refining...") : /*#__PURE__*/ React.createElement("span", { __source: { fileName: "", lineNumber: 226, columnNumber: 15 }, __self: this }, "Refine Prompt"))), refinedPrompts.length > 0 && /*#__PURE__*/ React.createElement("div", { className: "mt-8 space-y-4", __source: { fileName: "", lineNumber: 232, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "grid grid-cols-1 md:grid-cols-3 gap-4", __source: { fileName: "", lineNumber: 233, columnNumber: 13 }, __self: this }, refinedPrompts[refinedPrompts.length - 1].result.map((prompt, index)=>/*#__PURE__*/ React.createElement("div", { key: index, className: `bg-gray-800/50 backdrop-blur-md border ${colors[promptType].border} rounded-lg p-6 hover:shadow-lg transition-all duration-300 ${colors[promptType].hover}`, __source: { fileName: "", lineNumber: 236, columnNumber: 19 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "flex items-center justify-between mb-4", __source: { fileName: "", lineNumber: 244, columnNumber: 21 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "flex items-center gap-2", __source: { fileName: "", lineNumber: 245, columnNumber: 23 }, __self: this }, /*#__PURE__*/ React.createElement("i", { className: `fas ${promptTypes.find((t)=>t.id === promptType).icon} ${colors[promptType].icon}`, __source: { fileName: "", lineNumber: 246, columnNumber: 25 }, __self: this }), /*#__PURE__*/ React.createElement("span", { className: `${colors[promptType].text} text-sm`, __source: { fileName: "", lineNumber: 249, columnNumber: 25 }, __self: this }, "Variation ", prompt.variation)), /*#__PURE__*/ React.createElement("span", { className: "text-gray-400 text-xs", __source: { fileName: "", lineNumber: 253, columnNumber: 23 }, __self: this }, new Date(prompt.timestamp).toLocaleString())), /*#__PURE__*/ React.createElement("div", { className: "h-px bg-gray-700 mb-4", __source: { fileName: "", lineNumber: 258, columnNumber: 21 }, __self: this }), /*#__PURE__*/ React.createElement("p", { className: "text-white mb-4 whitespace-pre-wrap", __source: { fileName: "", lineNumber: 260, columnNumber: 21 }, __self: this }, prompt.content), /*#__PURE__*/ React.createElement("div", { className: "flex items-center justify-between border-t border-gray-700 pt-4", __source: { fileName: "", lineNumber: 264, columnNumber: 21 }, __self: this }, /*#__PURE__*/ React.createElement("button", { onClick: ()=>{ navigator.clipboard.writeText(prompt.content); }, className: "text-sm text-gray-400 hover:text-white transition-colors flex items-center gap-2", __source: { fileName: "", lineNumber: 265, columnNumber: 23 }, __self: this }, /*#__PURE__*/ React.createElement("i", { className: "fas fa-copy", __source: { fileName: "", lineNumber: 271, columnNumber: 25 }, __self: this }), /*#__PURE__*/ React.createElement("span", { __source: { fileName: "", lineNumber: 272, columnNumber: 25 }, __self: this }, "Copy")), /*#__PURE__*/ React.createElement("button", { onClick: ()=>{ setTopic(prompt.content); window.scrollTo({ top: 0, behavior: "smooth" }); }, className: "text-sm text-gray-400 hover:text-white transition-colors flex items-center gap-2", __source: { fileName: "", lineNumber: 274, columnNumber: 23 }, __self: this }, /*#__PURE__*/ React.createElement("i", { className: "fas fa-redo", __source: { fileName: "", lineNumber: 281, columnNumber: 25 }, __self: this }), /*#__PURE__*/ React.createElement("span", { __source: { fileName: "", lineNumber: 282, columnNumber: 25 }, __self: this }, "Refine Again"))))))), /*#__PURE__*/ React.createElement("div", { className: "mt-8 text-center text-gray-400 text-sm", __source: { fileName: "", lineNumber: 292, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("p", { __source: { fileName: "", lineNumber: 293, columnNumber: 11 }, __self: this }, "Designed by Dr. WZM, Institut Kanser Negara, Malaysia")))); }