function SubscriptionUpsell({ redirectURL = window.location.origin, title = "Subscription Required", description = "Act requires a $10/month subscription to access all features. Please subscribe to continue.", buttonText = "Subscribe Now - $10/month" }) { const [loading, setLoading] = useState(false); const { data: user, loading: userLoading } = useUser(); const { isSubscribed, loading: subscriptionLoading } = useIsSubscribed(); const handleCheckout = async ()=>{ if (!userLoading && user) { setLoading(true); try { const fullRedirectURL = redirectURL.startsWith("http") ? redirectURL : `${window.location.origin}${redirectURL}`; const response = await fetch("/api/stripe-checkout-link", { method: "POST", headers: { "Content-Type": "application/json" }, body: JSON.stringify({ redirectURL: fullRedirectURL }) }); const data = await response.json(); if (data.url) { window.location.href = data.url; } } catch (error) { console.error("Error creating checkout session:", error); setLoading(false); } } }; if (subscriptionLoading || userLoading) { return /*#__PURE__*/ React.createElement("div", { className: "bg-gray-800 rounded-lg p-6 animate-pulse", __source: { fileName: "", lineNumber: 38, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "h-6 bg-gray-700 rounded w-3/4 mb-4", __source: { fileName: "", lineNumber: 39, columnNumber: 9 }, __self: this }), /*#__PURE__*/ React.createElement("div", { className: "h-4 bg-gray-700 rounded w-full mb-2", __source: { fileName: "", lineNumber: 40, columnNumber: 9 }, __self: this }), /*#__PURE__*/ React.createElement("div", { className: "h-4 bg-gray-700 rounded w-5/6 mb-4", __source: { fileName: "", lineNumber: 41, columnNumber: 9 }, __self: this }), /*#__PURE__*/ React.createElement("div", { className: "h-10 bg-gray-700 rounded w-1/3", __source: { fileName: "", lineNumber: 42, columnNumber: 9 }, __self: this })); } if (isSubscribed) { return null; } return /*#__PURE__*/ React.createElement("div", { className: "bg-gradient-to-br from-blue-900 to-purple-900 rounded-lg p-6 shadow-lg", __source: { fileName: "", lineNumber: 52, columnNumber: 5 }, __self: this }, /*#__PURE__*/ React.createElement("h3", { className: "text-xl font-bold mb-2", __source: { fileName: "", lineNumber: 53, columnNumber: 7 }, __self: this }, title), /*#__PURE__*/ React.createElement("p", { className: "text-gray-200 mb-4", __source: { fileName: "", lineNumber: 54, columnNumber: 7 }, __self: this }, description), /*#__PURE__*/ React.createElement("button", { onClick: handleCheckout, disabled: loading || !user, className: "px-4 py-2 bg-blue-600 text-white rounded-lg hover:bg-blue-700 transition-colors", __source: { fileName: "", lineNumber: 55, columnNumber: 7 }, __self: this }, loading ? "PROCESSING..." : !user ? "SIGN IN FIRST" : buttonText)); } function SubscriptionUpsellStory() { return /*#__PURE__*/ React.createElement("div", { className: "space-y-6", __source: { fileName: "", lineNumber: 68, columnNumber: 5 }, __self: this }, /*#__PURE__*/ React.createElement("div", { __source: { fileName: "", lineNumber: 69, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("h2", { className: "text-lg font-medium mb-2", __source: { fileName: "", lineNumber: 70, columnNumber: 9 }, __self: this }, "Default State:"), /*#__PURE__*/ React.createElement(SubscriptionUpsell, { redirectURL: "/account", __source: { fileName: "", lineNumber: 71, columnNumber: 9 }, __self: this })), /*#__PURE__*/ React.createElement("div", { __source: { fileName: "", lineNumber: 74, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("h2", { className: "text-lg font-medium mb-2", __source: { fileName: "", lineNumber: 75, columnNumber: 9 }, __self: this }, "With Custom Redirect:"), /*#__PURE__*/ React.createElement(SubscriptionUpsell, { redirectURL: "/dashboard", __source: { fileName: "", lineNumber: 76, columnNumber: 9 }, __self: this })), /*#__PURE__*/ React.createElement("div", { __source: { fileName: "", lineNumber: 79, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("h2", { className: "text-lg font-medium mb-2", __source: { fileName: "", lineNumber: 80, columnNumber: 9 }, __self: this }, "Premium Upgrade Variant:"), /*#__PURE__*/ React.createElement(SubscriptionUpsell, { redirectURL: "/dashboard", title: "Upgrade to Act Premium", description: "Get access to all challenge categories, advanced tracking, and personalized recommendations.", buttonText: "START", __source: { fileName: "", lineNumber: 81, columnNumber: 9 }, __self: this }))); } function useIsSubscribed() { const { data: user, refetch, loading: userLoading } = useUser(); const [isSubscribed, setIsSubscribed] = React.useState(false); const [loading, setLoading] = React.useState(true); const [subscriptionData, setSubscriptionData] = React.useState(null); const [fetchCount, setFetchCount] = React.useState(0); const stripeSessionId = React.useMemo(()=>{ if (typeof window !== "undefined") { const queryString = window.location.search; const urlParams = new URLSearchParams(queryString); return urlParams.get("session_id"); } return null; }, []); const checkSubscription = React.useCallback(async ()=>{ if (!userLoading && stripeSessionId && !isSubscribed && fetchCount < 5) { await new Promise((resolve)=>setTimeout(resolve, 1000 * fetchCount)); await refetch(); setFetchCount(fetchCount + 1); } }, [ stripeSessionId, isSubscribed, refetch, fetchCount, userLoading ]); React.useEffect(()=>{ checkSubscription(); }, [ checkSubscription ]); React.useEffect(()=>{ async function checkSubscriptionStatus() { if (!user) { setLoading(false); return; } try { const response = await fetch("/api/get-subscription-status", { method: "POST", body: JSON.stringify({}) }); if (!response.ok) { throw new Error("Failed to fetch subscription status"); } const data = await response.json(); setIsSubscribed(data.isSubscribed); setSubscriptionData(data); } catch (error) { console.error("Error checking subscription:", error); } finally{ setLoading(false); } } checkSubscriptionStatus(); }, [ user ]); return { isSubscribed, data: isSubscribed, loading: loading || userLoading || stripeSessionId && !isSubscribed && fetchCount < 5, subscriptionData }; } function UseIsSubscribedStory() { const { isSubscribed, loading, subscriptionData } = useIsSubscribed(); if (loading) { return /*#__PURE__*/ React.createElement("div", { __source: { fileName: "", lineNumber: 74, columnNumber: 12 }, __self: this }, "Loading..."); } if (isSubscribed) { return /*#__PURE__*/ React.createElement("div", { __source: { fileName: "", lineNumber: 79, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("div", { __source: { fileName: "", lineNumber: 80, columnNumber: 9 }, __self: this }, "Subscribed"), subscriptionData && /*#__PURE__*/ React.createElement("div", { className: "mt-2 text-sm text-gray-600", __source: { fileName: "", lineNumber: 82, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("div", { __source: { fileName: "", lineNumber: 83, columnNumber: 13 }, __self: this }, "Status: ", subscriptionData.status), subscriptionData.currentPeriodEnd && /*#__PURE__*/ React.createElement("div", { __source: { fileName: "", lineNumber: 85, columnNumber: 15 }, __self: this }, "Renews:", " ", new Date(subscriptionData.currentPeriodEnd).toLocaleDateString()))); } return /*#__PURE__*/ React.createElement("div", { __source: { fileName: "", lineNumber: 98, columnNumber: 10 }, __self: this }, "Not subscribed"); } function UseIsSubscribed() { return useIsSubscribed; } function MainComponent() { const [formData, setFormData] = React.useState({ email: "", password: "", confirmPassword: "" }); const [isLoading, setIsLoading] = React.useState(false); const [error, setError] = React.useState(""); const { signUpWithCredentials } = useAuth(); const [callbackUrl, setCallbackUrl] = React.useState("/"); React.useEffect(()=>{ const params = new URLSearchParams(window.location.search); const callback = params.get("callbackUrl"); if (callback) { setCallbackUrl(callback); } }, []); const handleChange = (e)=>{ const { name, value } = e.target; setFormData((prev)=>({ ...prev, [name]: value })); }; const handleSubmit = async (e)=>{ e.preventDefault(); setIsLoading(true); setError(""); if (formData.password !== formData.confirmPassword) { setError("Passwords do not match"); setIsLoading(false); return; } if (formData.password.length < 8) { setError("Password must be at least 8 characters long"); setIsLoading(false); return; } try { const result = await signUpWithCredentials({ email: formData.email, password: formData.password, callbackUrl: callbackUrl, redirect: false }); if (result.success) { try { const response = await fetch("/api/stripe-checkout-link", { method: "POST", headers: { "Content-Type": "application/json" }, body: JSON.stringify({ redirectURL: window.location.origin + "/dashboard" }) }); if (response.ok) { const data = await response.json(); window.location.href = data.url; } } catch (error) { console.error("Error creating checkout session:", error); window.location.href = callbackUrl || "/dashboard"; } } else { setError(result.error || "Failed to sign up"); setIsLoading(false); } } catch (error) { console.error("Sign up error:", error); setError("Failed to create account. This email might already be in use."); setIsLoading(false); } }; return /*#__PURE__*/ React.createElement("div", { className: "min-h-screen bg-gray-100 flex items-center justify-center py-12 px-4 sm:px-6 lg:px-8", __source: { fileName: "", lineNumber: 85, columnNumber: 5 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "max-w-md w-full space-y-8 bg-white p-8 rounded-lg shadow-lg", __source: { fileName: "", lineNumber: 86, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "text-center", __source: { fileName: "", lineNumber: 87, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("h1", { className: "text-3xl font-bold font-roboto mb-2", __source: { fileName: "", lineNumber: 88, columnNumber: 11 }, __self: this }, "Daily Growth"), /*#__PURE__*/ React.createElement("h2", { className: "text-2xl font-bold font-roboto", __source: { fileName: "", lineNumber: 89, columnNumber: 11 }, __self: this }, "Create Account"), /*#__PURE__*/ React.createElement("p", { className: "mt-2 text-gray-600 font-roboto", __source: { fileName: "", lineNumber: 90, columnNumber: 11 }, __self: this }, "Join Daily Growth and start your personal development journey")), error && /*#__PURE__*/ React.createElement("div", { className: "bg-red-100 border border-red-400 text-red-700 px-4 py-3 rounded relative", role: "alert", __source: { fileName: "", lineNumber: 96, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("span", { className: "block sm:inline font-roboto", __source: { fileName: "", lineNumber: 100, columnNumber: 13 }, __self: this }, error)), /*#__PURE__*/ React.createElement("form", { className: "mt-8 space-y-6", onSubmit: handleSubmit, __source: { fileName: "", lineNumber: 104, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "rounded-md shadow-sm -space-y-px", __source: { fileName: "", lineNumber: 105, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "mb-4", __source: { fileName: "", lineNumber: 106, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("label", { htmlFor: "email", className: "block text-gray-700 font-roboto mb-2", __source: { fileName: "", lineNumber: 107, columnNumber: 15 }, __self: this }, "Email Address"), /*#__PURE__*/ React.createElement("input", { id: "email", name: "email", type: "email", autoComplete: "email", required: true, value: formData.email, onChange: handleChange, className: "appearance-none relative block w-full px-3 py-3 border border-gray-300 placeholder-gray-500 text-gray-900 rounded-lg focus:outline-none focus:ring-blue-500 focus:border-blue-500 focus:z-10 sm:text-sm font-roboto", placeholder: "Email address", __source: { fileName: "", lineNumber: 113, columnNumber: 15 }, __self: this })), /*#__PURE__*/ React.createElement("div", { className: "mb-4", __source: { fileName: "", lineNumber: 125, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("label", { htmlFor: "password", className: "block text-gray-700 font-roboto mb-2", __source: { fileName: "", lineNumber: 126, columnNumber: 15 }, __self: this }, "Password"), /*#__PURE__*/ React.createElement("input", { id: "password", name: "password", type: "password", autoComplete: "new-password", required: true, value: formData.password, onChange: handleChange, className: "appearance-none relative block w-full px-3 py-3 border border-gray-300 placeholder-gray-500 text-gray-900 rounded-lg focus:outline-none focus:ring-blue-500 focus:border-blue-500 focus:z-10 sm:text-sm font-roboto", placeholder: "Password (min 8 characters)", __source: { fileName: "", lineNumber: 132, columnNumber: 15 }, __self: this })), /*#__PURE__*/ React.createElement("div", { __source: { fileName: "", lineNumber: 144, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("label", { htmlFor: "confirmPassword", className: "block text-gray-700 font-roboto mb-2", __source: { fileName: "", lineNumber: 145, columnNumber: 15 }, __self: this }, "Confirm Password"), /*#__PURE__*/ React.createElement("input", { id: "confirmPassword", name: "confirmPassword", type: "password", autoComplete: "new-password", required: true, value: formData.confirmPassword, onChange: handleChange, className: "appearance-none relative block w-full px-3 py-3 border border-gray-300 placeholder-gray-500 text-gray-900 rounded-lg focus:outline-none focus:ring-blue-500 focus:border-blue-500 focus:z-10 sm:text-sm font-roboto", placeholder: "Confirm password", __source: { fileName: "", lineNumber: 151, columnNumber: 15 }, __self: this }))), /*#__PURE__*/ React.createElement("div", { __source: { fileName: "", lineNumber: 165, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("button", { type: "submit", disabled: isLoading, className: "group relative w-full flex justify-center py-3 px-4 border border-transparent text-sm font-medium rounded-lg text-white bg-blue-600 hover:bg-blue-700 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-blue-500 font-roboto", __source: { fileName: "", lineNumber: 166, columnNumber: 13 }, __self: this }, isLoading ? /*#__PURE__*/ React.createElement("span", { className: "flex items-center", __source: { fileName: "", lineNumber: 172, columnNumber: 17 }, __self: this }, /*#__PURE__*/ React.createElement("svg", { className: "animate-spin -ml-1 mr-3 h-5 w-5 text-white", xmlns: "http://www.w3.org/2000/svg", fill: "none", viewBox: "0 0 24 24", __source: { fileName: "", lineNumber: 173, columnNumber: 19 }, __self: this }, /*#__PURE__*/ React.createElement("circle", { className: "opacity-25", cx: "12", cy: "12", r: "10", stroke: "currentColor", strokeWidth: "4", __source: { fileName: "", lineNumber: 179, columnNumber: 21 }, __self: this }), /*#__PURE__*/ React.createElement("path", { className: "opacity-75", fill: "currentColor", d: "M4 12a8 8 0 018-8V0C5.373 0 0 5.373 0 12h4zm2 5.291A7.962 7.962 0 014 12H0c0 3.042 1.135 5.824 3 7.938l3-2.647z", __source: { fileName: "", lineNumber: 187, columnNumber: 21 }, __self: this })), "Creating account...") : "Sign Up")), /*#__PURE__*/ React.createElement("div", { className: "text-center", __source: { fileName: "", lineNumber: 201, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("p", { className: "font-roboto text-gray-600", __source: { fileName: "", lineNumber: 202, columnNumber: 13 }, __self: this }, "Already have an account?", " ", /*#__PURE__*/ React.createElement("a", { href: "/account/signin", className: "text-blue-600 hover:text-blue-800 font-medium", __source: { fileName: "", lineNumber: 204, columnNumber: 15 }, __self: this }, "Sign in")))), /*#__PURE__*/ React.createElement("div", { className: "mt-6 text-center", __source: { fileName: "", lineNumber: 214, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("a", { href: "/", className: "text-blue-600 hover:text-blue-800 font-roboto", __source: { fileName: "", lineNumber: 215, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("i", { className: "fas fa-arrow-left mr-2", __source: { fileName: "", lineNumber: 216, columnNumber: 13 }, __self: this }), " Back to Home")))); } async function handler({ period = "week" }) { const session = getSession(); if (!session || !session.user) { return { error: "Unauthorized access" }; } const userId = session.user.id; try { // Get current date information const now = new Date(); const currentWeek = Math.ceil((now.getDate() + new Date(now.getFullYear(), now.getMonth(), 1).getDay()) / 7); const currentMonth = now.getMonth() + 1; const currentQuarter = Math.ceil((now.getMonth() + 1) / 3); const currentYear = now.getFullYear(); // Determine time period parameters based on selected period let timeFilter = {}; let previousTimeFilter = {}; if (period === "week") { timeFilter = { week_number: currentWeek, year: currentYear }; previousTimeFilter = currentWeek > 1 ? { week_number: currentWeek - 1, year: currentYear } : { week_number: 52, year: currentYear - 1 }; } else if (period === "month") { // For month, we'll get the last 4 weeks timeFilter = { year: currentYear }; previousTimeFilter = { year: currentYear }; } else if (period === "quarter") { // For quarter, we'll get the last 3 months timeFilter = { year: currentYear }; previousTimeFilter = { year: currentYear }; } else if (period === "year") { timeFilter = { year: currentYear }; previousTimeFilter = { year: currentYear - 1 }; } // Get current period metrics const currentMetricsQuery = await sql(` SELECT category, challenges_completed, average_rating, total_time_spent, completion_rate, category_completion_rates, improvement_percentage FROM user_progress_metrics WHERE user_id = $1 AND year = $2 ${period === "week" ? "AND week_number = $3" : ""} ORDER BY category `, period === "week" ? [ userId, timeFilter.year, timeFilter.week_number ] : [ userId, timeFilter.year ]); // Get previous period metrics for comparison const previousMetricsQuery = await sql(` SELECT category, challenges_completed, average_rating, total_time_spent, completion_rate FROM user_progress_metrics WHERE user_id = $1 AND year = $2 ${period === "week" ? "AND week_number = $3" : ""} ORDER BY category `, period === "week" ? [ userId, previousTimeFilter.year, previousTimeFilter.week_number ] : [ userId, previousTimeFilter.year ]); // Get challenge data for detailed metrics const challengesQuery = await sql(` SELECT category, task, completed, completed_at, created_at, impact_rating, time_spent_minutes, reflection_notes, status FROM challenges WHERE user_id = $1 AND created_at >= $2 ORDER BY created_at DESC `, [ userId, period === "week" ? new Date(now.getFullYear(), now.getMonth(), now.getDate() - 7) : period === "month" ? new Date(now.getFullYear(), now.getMonth() - 1, now.getDate()) : period === "quarter" ? new Date(now.getFullYear(), now.getMonth() - 3, now.getDate()) : new Date(now.getFullYear() - 1, now.getMonth(), now.getDate()) ]); // Process the data const categories = [ "health", "mind", "income", "social" ]; const current = {}; const previous = {}; const categoryMetrics = {}; // Initialize with zeros categories.forEach((category)=>{ current[category] = 0; previous[category] = 0; categoryMetrics[category] = []; }); // Process current metrics currentMetricsQuery.forEach((metric)=>{ if (categories.includes(metric.category)) { // Calculate a score out of 100 based on various metrics const completionScore = Math.min(metric.challenges_completed * 15, 40); const ratingScore = metric.average_rating ? Math.min(metric.average_rating * 10, 30) : 0; const timeScore = metric.total_time_spent ? Math.min(metric.total_time_spent / 60, 30) : 0; current[metric.category] = Math.round(completionScore + ratingScore + timeScore); // If no data, set a minimum score for better visualization if (current[metric.category] === 0) current[metric.category] = 10; } }); // Process previous metrics previousMetricsQuery.forEach((metric)=>{ if (categories.includes(metric.category)) { const completionScore = Math.min(metric.challenges_completed * 15, 40); const ratingScore = metric.average_rating ? Math.min(metric.average_rating * 10, 30) : 0; const timeScore = metric.total_time_spent ? Math.min(metric.total_time_spent / 60, 30) : 0; previous[metric.category] = Math.round(completionScore + ratingScore + timeScore); // If no data, set a minimum score for better visualization if (previous[metric.category] === 0) previous[metric.category] = 5; } }); // Process challenges for detailed metrics const challengesByCategory = {}; categories.forEach((category)=>{ challengesByCategory[category] = { total: 0, completed: 0, avgRating: 0, totalRating: 0, avgTime: 0, totalTime: 0 }; }); challengesQuery.forEach((challenge)=>{ if (categories.includes(challenge.category)) { const cat = challengesByCategory[challenge.category]; cat.total++; if (challenge.status === "completed") { cat.completed++; if (challenge.impact_rating) { cat.totalRating += challenge.impact_rating; } if (challenge.time_spent_minutes) { cat.totalTime += challenge.time_spent_minutes; } } } }); // Calculate averages and create metrics categories.forEach((category)=>{ const cat = challengesByCategory[category]; if (cat.completed > 0) { cat.avgRating = Math.round(cat.totalRating / cat.completed * 10) / 10; cat.avgTime = Math.round(cat.totalTime / cat.completed); } // Add metrics based on the data categoryMetrics[category] = [ { name: "Completion Rate", value: cat.total > 0 ? `${Math.round(cat.completed / cat.total * 100)}%` : "0%", change: calculateChange(current[category], previous[category]) } ]; if (category === "health") { categoryMetrics[category].push({ name: "Avg. Impact", value: cat.avgRating > 0 ? `${cat.avgRating}/5` : "N/A", change: "" }, { name: "Time Invested", value: cat.totalTime > 0 ? `${cat.totalTime} mins` : "0 mins", change: "" }); } else if (category === "mind") { categoryMetrics[category].push({ name: "Challenges Done", value: `${cat.completed}`, change: "" }, { name: "Avg. Session", value: cat.avgTime > 0 ? `${cat.avgTime} mins` : "N/A", change: "" }); } else if (category === "income") { categoryMetrics[category].push({ name: "Productivity", value: cat.avgRating > 0 ? `${cat.avgRating * 20}%` : "N/A", change: "" }, { name: "Time Invested", value: cat.totalTime > 0 ? `${cat.totalTime} mins` : "0 mins", change: "" }); } else if (category === "social") { categoryMetrics[category].push({ name: "Connections", value: `${cat.completed * 2}`, change: "" }, { name: "Engagement", value: cat.avgRating > 0 ? `${cat.avgRating * 20}%` : "N/A", change: "" }); } }); // Get streak data const streakQuery = await sql(` SELECT current_streak, longest_streak FROM streaks WHERE user_id = $1 `, [ userId ]); const streak = streakQuery.length > 0 ? { current: streakQuery[0].current_streak, longest: streakQuery[0].longest_streak } : { current: 0, longest: 0 }; // Get total challenges completed const totalCompletedQuery = await sql(` SELECT COUNT(*) as total FROM challenges WHERE user_id = $1 AND status = 'completed' `, [ userId ]); const totalCompleted = totalCompletedQuery.length > 0 ? parseInt(totalCompletedQuery[0].total) : 0; // Return the formatted data return { current, previous, categoryMetrics, streak, totalCompleted, period }; } catch (error) { console.error("Error fetching user progress radar data:", error); return { error: "Failed to fetch progress data" }; } } // Helper function to calculate change percentage function calculateChange(current, previous) { if (!previous || previous === 0) { return current > 0 ? "+100%" : "0%"; } const change = (current - previous) / previous * 100; return change > 0 ? `+${Math.round(change)}%` : `${Math.round(change)}%`; }