@@ -74,8 +73,7 @@ export function SubscriptionSection({ user, loading }: SubscriptionSectionProps)
);
}
- const currentPlan = user.plan || 'Gratuito';
- const isPaidPlan = currentPlan !== 'Gratuito';
+ // Los valores ya vienen del hook
return (
@@ -124,14 +122,22 @@ export function SubscriptionSection({ user, loading }: SubscriptionSectionProps)
)}
+ {isPaidPlan && !hasRealSubscription && (
+
+
+ Tienes un plan de prueba. Para gestionar tu suscripción, primero actualiza a un plan premium.
+
+
+ )}
+
@@ -142,4 +148,6 @@ export function SubscriptionSection({ user, loading }: SubscriptionSectionProps)
);
-}
+};
+
+export const SubscriptionSection = memo(SubscriptionSectionComponent);
diff --git a/app/store/hooks/useSubscriptionLogic.ts b/app/store/hooks/useSubscriptionLogic.ts
new file mode 100644
index 00000000..83371858
--- /dev/null
+++ b/app/store/hooks/useSubscriptionLogic.ts
@@ -0,0 +1,85 @@
+import { useEffect, useMemo, useRef, useCallback } from 'react';
+import { useSubscriptionStore } from '@/context/core/useSubscriptionStore';
+
+interface UseSubscriptionLogicResult {
+ subscription: any;
+ subscriptionLoading: boolean;
+ hasRealSubscription: boolean;
+ isPaidPlan: boolean;
+ currentPlan: string;
+}
+
+/**
+ * Hook personalizado para manejar la lógica de suscripciones
+ * Evita múltiples peticiones y proporciona datos limpios
+ */
+export function useSubscriptionLogic(userId?: string): UseSubscriptionLogicResult {
+ const { subscription, loading: subscriptionLoading, setCognitoUsername, fetchSubscription } = useSubscriptionStore();
+ const initializedUsers = useRef(new Set