From d05d11148e0ea07519817eef28486fdf9430d50a Mon Sep 17 00:00:00 2001
From: "2569718930@qq.com" <2569718930@qq.com>
Date: Mon, 25 May 2026 02:02:05 +0800
Subject: [PATCH] =?UTF-8?q?=E5=88=A0=E9=99=A4=20ProFeaturePaywall=20?=
 =?UTF-8?q?=E7=BB=84=E4=BB=B6=EF=BC=8C=E6=A8=A1=E6=80=81=E6=A1=86=E5=86=85?=
 =?UTF-8?q?=E6=94=B9=E4=B8=BA=E7=AE=80=E6=B4=81=E8=AE=A2=E9=98=85=E6=8F=90?=
 =?UTF-8?q?=E7=A4=BA?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../dashboard/FutureForecastModalContent.tsx  | 26 ++++-
 .../dashboard/ProFeaturePaywall.tsx           | 98 -------------------
 2 files changed, 21 insertions(+), 103 deletions(-)
 delete mode 100644 frontend/components/dashboard/ProFeaturePaywall.tsx

diff --git a/frontend/components/dashboard/FutureForecastModalContent.tsx b/frontend/components/dashboard/FutureForecastModalContent.tsx
index f50e7f24..4008eabb 100644
--- a/frontend/components/dashboard/FutureForecastModalContent.tsx
+++ b/frontend/components/dashboard/FutureForecastModalContent.tsx
@@ -1,9 +1,10 @@
 "use client";
 
 import clsx from "clsx";
+import Link from "next/link";
+import { LockKeyhole } from "lucide-react";
 import { CSSProperties, useEffect, useMemo, useState } from "react";
 import type { Locale } from "@/lib/i18n";
-import { ProFeaturePaywall } from "@/components/dashboard/ProFeaturePaywall";
 import { getFutureModalView } from "@/lib/dashboard-utils";
 import { getModelView, getProbabilityView } from "@/lib/model-utils";
 import { getTodayPaceView } from "@/lib/pace-utils";
@@ -898,10 +899,25 @@ export function FutureForecastModalContent({
           </div>
         </div>
       ) : !isPro ? (
-        <ProFeaturePaywall
-          feature={isToday ? "today" : "future"}
-          onClose={modal.closeFutureModal}
-        />
+        <div className="flex h-full items-center justify-center p-8">
+          <div className="text-center">
+            <LockKeyhole size={32} className="mx-auto mb-3 text-slate-400" />
+            <p className="text-sm font-bold text-slate-700">
+              {locale === "en-US" ? "Pro subscription required" : "需要 Pro 订阅"}
+            </p>
+            <p className="mt-1 text-xs text-slate-500">
+              {locale === "en-US"
+                ? "Subscribe in Account Center to unlock full analysis."
+                : "请在账户中心订阅以解锁完整分析功能。"}
+            </p>
+            <Link
+              href="/account"
+              className="mt-4 inline-flex items-center gap-2 rounded-lg bg-slate-950 px-4 py-2 text-sm font-bold text-white hover:bg-slate-800"
+            >
+              {locale === "en-US" ? "Subscribe" : "去订阅"}
+            </Link>
+          </div>
+        </div>
       ) : (
         <div className="modal-content large future-modal">
           <FutureForecastModalHeader
diff --git a/frontend/components/dashboard/ProFeaturePaywall.tsx b/frontend/components/dashboard/ProFeaturePaywall.tsx
deleted file mode 100644
index fe2c6fe5..00000000
--- a/frontend/components/dashboard/ProFeaturePaywall.tsx
+++ /dev/null
@@ -1,98 +0,0 @@
-"use client";
-
-import { useEffect, useMemo, useState } from "react";
-import { useRouter } from "next/navigation";
-import { useI18n } from "@/hooks/useI18n";
-import { useProAccess } from "@/hooks/useDashboardStore";
-import { UnlockProOverlay } from "@/components/subscription/UnlockProOverlay";
-import { trackAppEvent } from "@/lib/app-analytics";
-
-const TELEGRAM_GROUP_URL = String(
-  process.env.NEXT_PUBLIC_TELEGRAM_GROUP_URL ||
-    "https://t.me/+Io5H9oVHFmVjOTQ5",
-).trim();
-const SUBSCRIPTION_HELP_HREF = "/subscription-help";
-
-type ProFeaturePaywallProps = {
-  feature: "today" | "history" | "future" | "assistant" | "scan";
-  onClose?: () => void;
-};
-
-export function ProFeaturePaywall({
-  feature,
-  onClose,
-}: ProFeaturePaywallProps) {
-  const router = useRouter();
-  const { locale } = useI18n();
-  const { proAccess } = useProAccess();
-  const [usePoints, setUsePoints] = useState(true);
-
-  const isEn = locale === "en-US";
-  const isAuthenticated = proAccess.authenticated;
-  const pointsAvailable = Number(proAccess.points || 0);
-
-  const PRO_PRICE_USD = 10;
-  const POINTS_PER_USD = 500;
-  const MAX_DISCOUNT_USD = 3;
-
-  const billing = useMemo(() => {
-    const isEligible = pointsAvailable >= POINTS_PER_USD;
-    const maxRedeemablePoints = MAX_DISCOUNT_USD * POINTS_PER_USD;
-    const boundedPoints = isEligible
-      ? Math.min(pointsAvailable, maxRedeemablePoints)
-      : 0;
-    const discountUnits = Math.floor(boundedPoints / POINTS_PER_USD);
-    const pointsUsed = discountUnits * POINTS_PER_USD;
-    const discountAmount = usePoints ? discountUnits : 0;
-
-    return {
-      pointsEnabled: true,
-      isEligible,
-      pointsPerUsd: POINTS_PER_USD,
-      maxDiscountUsd: MAX_DISCOUNT_USD,
-      pointsUsed: usePoints ? pointsUsed : 0,
-      discountAmount,
-      finalPrice: PRO_PRICE_USD - discountAmount,
-    };
-  }, [pointsAvailable, usePoints]);
-
-  const payLabel = isAuthenticated
-    ? isEn
-      ? "Open Pro in Account"
-      : "去账户中心开通 Pro"
-    : isEn
-      ? "Sign In to Unlock Pro"
-      : "先登录再开通 Pro";
-
-  useEffect(() => {
-    trackAppEvent("paywall_viewed", {
-      entry: "feature_gate",
-      feature,
-      user_state: isAuthenticated ? "logged_in" : "guest",
-    });
-  }, [feature, isAuthenticated]);
-
-  return (
-    <div className="flex w-full flex-col items-center justify-center py-6 md:py-10 z-30 p-4">
-      <UnlockProOverlay
-        locale={locale}
-        points={pointsAvailable}
-        planPriceUsd={PRO_PRICE_USD}
-        usePoints={usePoints}
-        onToggleUsePoints={() => setUsePoints((prev) => !prev)}
-        billing={billing}
-        onClose={onClose}
-        onPay={() => {
-          if (!isAuthenticated) {
-            router.push("/auth/login?next=%2Faccount");
-            return;
-          }
-          router.push("/account");
-        }}
-        payLabel={payLabel}
-        faqHref={SUBSCRIPTION_HELP_HREF}
-        telegramGroupUrl={TELEGRAM_GROUP_URL}
-      />
-    </div>
-  );
-}