@windrun-huaiin/third-ui 7.5.1 → 7.5.3

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@windrun-huaiin/third-ui",
-  "version": "7.5.1",
+  "version": "7.5.3",
   "description": "Third-party integrated UI components for windrun-huaiin projects",
   "main": "./dist/index.js",
   "module": "./dist/index.mjs",

package/src/main/money-price/money-price-interactive.tsx

@@ -24,17 +24,30 @@ export function MoneyPriceInteractive({
   const { redirectToSignIn, user } = useClerk();
   const router = useRouter();
   
-  // 根据用户订阅状态确定初始 billing type
-  const getInitialBillingType = useCallback((): 'monthly' | 'yearly' => {
-    // 如果用户有活跃订阅，使用订阅的计费周期
+  const [billingType, setBillingType] = useState<'monthly' | 'yearly'>(() => {
+    // 懒初始化：只在组件首次渲染时计算一次
+    // 如果用户有活跃订阅，通过 priceId 精确匹配计费周期
     if (fingerprintContext?.xSubscription?.status === 'active' && fingerprintContext.xSubscription.priceId) {
-      return fingerprintContext.xSubscription.priceId.includes('yearly') ? 'yearly' : 'monthly';
+      const userPriceId = fingerprintContext.xSubscription.priceId;
+      const providerConfig = getActiveProviderConfig(config);
+      
+      // 检查所有年付计划的 priceId
+      const yearlyPriceIds = [
+        providerConfig.products.free.plans.yearly.priceId,
+        providerConfig.products.pro.plans.yearly.priceId,
+        providerConfig.products.ultra.plans.yearly.priceId
+      ];
+      
+      // 如果匹配到年付计划，返回 yearly，否则返回 monthly
+      if (yearlyPriceIds.includes(userPriceId)) {
+        return 'yearly';
+      } else {
+        return 'monthly';
+      }
     }
     // 否则使用默认值
     return data.billingSwitch.defaultKey as 'monthly' | 'yearly';
-  }, [fingerprintContext, data.billingSwitch.defaultKey]);
-  
-  const [billingType, setBillingType] = useState<'monthly' | 'yearly'>(getInitialBillingType());
+  });
   const [isProcessing, setIsProcessing] = useState(false);
   const [tooltip, setTooltip] = useState<{
     show: boolean;
@@ -248,20 +261,6 @@ export function MoneyPriceInteractive({
   // State for button portals
   const [buttonPortals, setButtonPortals] = useState<React.ReactElement[]>([]);
 
-  // 当 fingerprint context 变化时，更新 billing type 以匹配用户的订阅状态
-  useEffect(() => {
-    const newBillingType = getInitialBillingType();
-    if (newBillingType !== billingType) {
-      setBillingType(newBillingType);
-      // 延迟执行以确保 DOM 已渲染
-      setTimeout(() => {
-        updatePriceDisplay(newBillingType);
-        updateButtonStyles(newBillingType);
-        updateDiscountInfo(newBillingType);
-      }, 0);
-    }
-  }, [fingerprintContext, getInitialBillingType, billingType, updatePriceDisplay, updateButtonStyles, updateDiscountInfo]);
-
   // 处理月付/年付切换和 tooltip 功能
   useEffect(() => {
     const monthlyButton = document.querySelector('[data-billing-button="monthly"]') as HTMLButtonElement;