@greatapps/common 1.1.700 → 1.1.702

package/src/components/modals/HexaPromoModalGate.tsx

@@ -1,80 +1,93 @@
-'use client';
-
-import { useEffect, useRef } from 'react';
-import { useActiveSubscription } from '../../modules/subscriptions/hooks/find-active-subscription.hook';
-import { useAuth } from '../../providers/auth.provider';
-import { useWhitelabel } from '../../providers/whitelabel.provider';
-import { useModalManager } from '../../store/useModalManager';
-import {
-  getHexaPromoSeenDay,
-  getHexaPromoSince,
-  hexaPromoDayKey,
-  setHexaPromoSeenDay,
-  setHexaPromoSince,
-} from '../../utils/cookies/hexa-promo';
-
-/** Janela de tempo online antes de abrir a modal (3 minutos). */
-const ONLINE_DELAY_MS = 3 * 60 * 1000;
-
-/**
- * TESTE: quando `true`, a modal abre imediatamente ao carregar o app, ignorando
- * trial / whitelabel / timer de 3 min / cookies. Manter `false` em produção.
- */
-const FORCE_OPEN_FOR_TEST = false;
-
-/**
- * Dispara a modal "Rumo ao Hexa" quando um usuário em **trial** da **whitelabel 1** fica
- * 3 minutos online. A janela é cumulativa entre gapps e gpages (timestamp compartilhado em
- * cookie no domínio pai) e a modal abre **uma única vez** — reabrindo só no dia seguinte ou
- * após logout/login. Montar este componente uma vez no layout de cada app consumidor.
- */
-export default function HexaPromoModalGate() {
-  const { isAuthenticated } = useAuth();
-  const { whitelabel } = useWhitelabel();
-  const { activeModal, openModal } = useModalManager();
-  const { data } = useActiveSubscription();
-
-  const subscription = data?.data?.[0] ?? null;
-  const eligible =
-    isAuthenticated && whitelabel?.id === 1 && subscription?.type === 'trial';
-
-  const forcedRef = useRef(false);
-
-  useEffect(() => {
-    if (typeof window === 'undefined') return;
-
-    // TESTE: abre uma vez ao carregar, sem nenhuma condição.
-    if (FORCE_OPEN_FOR_TEST) {
-      if (forcedRef.current || activeModal) return;
-      forcedRef.current = true;
-      openModal('hexaPromoModal');
-      return;
-    }
-
-    if (!eligible) return;
-    // Outra modal aberta: não empilha em cima. Reavalia quando ela fechar (dep `activeModal`).
-    if (activeModal) return;
-
-    const todayKey = hexaPromoDayKey();
-    if (getHexaPromoSeenDay() === todayKey) return; // já exibida hoje/nesta sessão
-
-    // Início da janela compartilhado entre os apps; reinicia a cada novo dia.
-    let since = getHexaPromoSince();
-    if (!since || since.day !== todayKey) {
-      since = { day: todayKey, ms: Date.now() };
-      setHexaPromoSince(since.day, since.ms);
-    }
-
-    const remaining = Math.max(0, since.ms + ONLINE_DELAY_MS - Date.now());
-    const timer = setTimeout(() => {
-      // Recheca o cookie no disparo: se o outro app já abriu, não reabre aqui.
-      if (getHexaPromoSeenDay() === todayKey) return;
-      setHexaPromoSeenDay(todayKey);
-      openModal('hexaPromoModal');
-    }, remaining);
-
-    return () => clearTimeout(timer);
-  }, [eligible, activeModal, openModal]);
-
-  return null;
-}
+'use client';
+
+import { useEffect, useRef } from 'react';
+import { useActiveSubscription } from '../../modules/subscriptions/hooks/find-active-subscription.hook';
+import { useAuth } from '../../providers/auth.provider';
+import { useWhitelabel } from '../../providers/whitelabel.provider';
+import { useModalManager } from '../../store/useModalManager';
+import {
+  getHexaPromoSeenDay,
+  getHexaPromoSince,
+  hexaPromoDayKey,
+  setHexaPromoSeenDay,
+  setHexaPromoSince,
+} from '../../utils/cookies/hexa-promo';
+
+/** Janela de tempo online antes de abrir a modal (3 minutos). */
+const ONLINE_DELAY_MS = 3 * 60 * 1000;
+
+/**
+ * TESTE: quando `true`, a modal abre imediatamente ao carregar o app, ignorando
+ * trial / whitelabel / timer de 3 min / cookies. Manter `false` em produção.
+ */
+const FORCE_OPEN_FOR_TEST = false;
+
+/**
+ * Dispara a modal "Rumo ao Hexa" quando um usuário em **trial** da **whitelabel 1** fica
+ * 3 minutos online. A janela é cumulativa entre gapps e gpages (timestamp compartilhado em
+ * cookie no domínio pai) e a modal abre **uma única vez** — reabrindo só no dia seguinte ou
+ * após logout/login. Montar este componente uma vez no layout de cada app consumidor.
+ */
+export default function HexaPromoModalGate() {
+  const { isAuthenticated } = useAuth();
+  const { whitelabel } = useWhitelabel();
+  const { activeModal, openModal, closeModal } = useModalManager();
+  const { data } = useActiveSubscription();
+
+  const subscription = data?.data?.[0] ?? null;
+  const eligible =
+    isAuthenticated && whitelabel?.id === 1 && subscription?.type === 'trial';
+
+  // Elegibilidade atual visível dentro do setTimeout (que captura o valor do agendamento).
+  const eligibleRef = useRef(eligible);
+  eligibleRef.current = eligible;
+
+  const forcedRef = useRef(false);
+
+  // Nunca deixa a modal aberta para usuário deslogado/inelegível: se ele abriu logado e
+  // depois deslogou (ou perdeu a elegibilidade), fecha.
+  useEffect(() => {
+    if (FORCE_OPEN_FOR_TEST) return;
+    if (!eligible && activeModal === 'hexaPromoModal') closeModal();
+  }, [eligible, activeModal, closeModal]);
+
+  useEffect(() => {
+    if (typeof window === 'undefined') return;
+
+    // TESTE: abre uma vez ao carregar, sem nenhuma condição.
+    if (FORCE_OPEN_FOR_TEST) {
+      if (forcedRef.current || activeModal) return;
+      forcedRef.current = true;
+      openModal('hexaPromoModal');
+      return;
+    }
+
+    if (!eligible) return;
+    // Outra modal aberta: não empilha em cima. Reavalia quando ela fechar (dep `activeModal`).
+    if (activeModal) return;
+
+    const todayKey = hexaPromoDayKey();
+    if (getHexaPromoSeenDay() === todayKey) return; // já exibida hoje/nesta sessão
+
+    // Início da janela compartilhado entre os apps; reinicia a cada novo dia.
+    let since = getHexaPromoSince();
+    if (!since || since.day !== todayKey) {
+      since = { day: todayKey, ms: Date.now() };
+      setHexaPromoSince(since.day, since.ms);
+    }
+
+    const remaining = Math.max(0, since.ms + ONLINE_DELAY_MS - Date.now());
+    const timer = setTimeout(() => {
+      // Revalida no disparo: o usuário pode ter deslogado durante a janela.
+      if (!eligibleRef.current) return;
+      // Recheca o cookie no disparo: se o outro app já abriu, não reabre aqui.
+      if (getHexaPromoSeenDay() === todayKey) return;
+      setHexaPromoSeenDay(todayKey);
+      openModal('hexaPromoModal');
+    }, remaining);
+
+    return () => clearTimeout(timer);
+  }, [eligible, activeModal, openModal]);
+
+  return null;
+}

package/src/components/modals/Modals.tsx

@@ -1,25 +1,25 @@
-'use client';
-
-import { ComponentType, useEffect } from 'react';
-import AccountModals from '../account/AccountModals';
-import { ModalManager } from './ModalManager';
-import { useAccountModals } from '../../store/useAccountModals';
-interface ModalsProps {
-  registry: Record<string, ComponentType>;
-  onGoToSubscription?: () => void;
-}
-
-export function Modals({ registry, onGoToSubscription }: ModalsProps) {
-  const { updateConfig } = useAccountModals();
-
-  useEffect(() => {
-    updateConfig({ onGoToSubscription });
-  }, [onGoToSubscription, updateConfig]);
-
-  return (
-    <>
-      <AccountModals />
-      <ModalManager registry={registry} />
-    </>
-  );
-}
+'use client';
+
+import { ComponentType, useEffect } from 'react';
+import AccountModals from '../account/AccountModals';
+import { ModalManager } from './ModalManager';
+import { useAccountModals } from '../../store/useAccountModals';
+interface ModalsProps {
+  registry: Record<string, ComponentType>;
+  onGoToSubscription?: () => void;
+}
+
+export function Modals({ registry, onGoToSubscription }: ModalsProps) {
+  const { updateConfig } = useAccountModals();
+
+  useEffect(() => {
+    updateConfig({ onGoToSubscription });
+  }, [onGoToSubscription, updateConfig]);
+
+  return (
+    <>
+      <AccountModals />
+      <ModalManager registry={registry} />
+    </>
+  );
+}

package/src/components/modals/PaidPlanRequiredModal.tsx

@@ -1,60 +1,60 @@
-"use client";
-
-import { IconLock } from '@tabler/icons-react';
-import { useTranslations } from 'next-intl';
-import { Button } from '../ui/buttons/Button';
-import {
-    Dialog,
-    DialogContent,
-    DialogDescription,
-    DialogHeader,
-    DialogTitle,
-} from '../ui/overlay/Dialog';
-import { useWhitelabelUrls, useExternalContracting } from '../../providers/whitelabel.provider';
-import { useModalManager } from '../../store/useModalManager';
-import type { ModalData } from '../../store/useModalManager';
-
-export default function PaidPlanRequiredModal() {
-    const translate = useTranslations();
-    const { activeModal, modalData, closeModal } = useModalManager();
-    const isOpen = activeModal === 'paidPlanRequiredModal';
-    const data = modalData as ModalData & { title?: string; description?: string };
-    const { accountsUrl } = useWhitelabelUrls();
-    const { redirectToExternal } = useExternalContracting();
-
-    const title = (data.title as string) ?? translate('common.credits.paidPlanRequired.defaultTitle');
-    const description = (data.description as string) ?? translate('common.credits.paidPlanRequired.defaultDescription');
-
-    const handleKnowPlans = () => {
-        if (redirectToExternal('plans')) return;
-        window.location.href = `${accountsUrl}/subscriptions?tab=plans`;
-    };
-
-    return (
-        <Dialog open={isOpen} onOpenChange={() => closeModal()}>
-            <DialogContent className="flex flex-col p-0 gap-0 w-full md:w-[410px] lg:w-[410px]">
-                <DialogHeader className="gap-3 text-left p-5">
-                    <div className="flex items-center justify-center w-10 h-10 bg-zinc-50 rounded-lg">
-                        <IconLock size={24} className="text-zinc-950" />
-                    </div>
-                    <div className="flex flex-col gap-2">
-                        <DialogTitle className="paragraph-medium-semibold text-zinc-950">
-                            {title}
-                        </DialogTitle>
-                        <DialogDescription className="paragraph-small-regular text-zinc-600">
-                            {description}
-                        </DialogDescription>
-                    </div>
-                </DialogHeader>
-                <div className="flex items-center gap-2 p-5 border-t border-zinc-200">
-                    <Button
-                        className="w-fit h-10!"
-                        onClick={handleKnowPlans}
-                    >
-                        {translate('common.credits.paidPlanRequired.knowPlans')}
-                    </Button>
-                </div>
-            </DialogContent>
-        </Dialog>
-    );
-}
+"use client";
+
+import { IconLock } from '@tabler/icons-react';
+import { useTranslations } from 'next-intl';
+import { Button } from '../ui/buttons/Button';
+import {
+    Dialog,
+    DialogContent,
+    DialogDescription,
+    DialogHeader,
+    DialogTitle,
+} from '../ui/overlay/Dialog';
+import { useWhitelabelUrls, useExternalContracting } from '../../providers/whitelabel.provider';
+import { useModalManager } from '../../store/useModalManager';
+import type { ModalData } from '../../store/useModalManager';
+
+export default function PaidPlanRequiredModal() {
+    const translate = useTranslations();
+    const { activeModal, modalData, closeModal } = useModalManager();
+    const isOpen = activeModal === 'paidPlanRequiredModal';
+    const data = modalData as ModalData & { title?: string; description?: string };
+    const { accountsUrl } = useWhitelabelUrls();
+    const { redirectToExternal } = useExternalContracting();
+
+    const title = (data.title as string) ?? translate('common.credits.paidPlanRequired.defaultTitle');
+    const description = (data.description as string) ?? translate('common.credits.paidPlanRequired.defaultDescription');
+
+    const handleKnowPlans = () => {
+        if (redirectToExternal('plans')) return;
+        window.location.href = `${accountsUrl}/subscriptions?tab=plans`;
+    };
+
+    return (
+        <Dialog open={isOpen} onOpenChange={() => closeModal()}>
+            <DialogContent className="flex flex-col p-0 gap-0 w-full md:w-[410px] lg:w-[410px]">
+                <DialogHeader className="gap-3 text-left p-5">
+                    <div className="flex items-center justify-center w-10 h-10 bg-zinc-50 rounded-lg">
+                        <IconLock size={24} className="text-zinc-950" />
+                    </div>
+                    <div className="flex flex-col gap-2">
+                        <DialogTitle className="paragraph-medium-semibold text-zinc-950">
+                            {title}
+                        </DialogTitle>
+                        <DialogDescription className="paragraph-small-regular text-zinc-600">
+                            {description}
+                        </DialogDescription>
+                    </div>
+                </DialogHeader>
+                <div className="flex items-center gap-2 p-5 border-t border-zinc-200">
+                    <Button
+                        className="w-fit h-10!"
+                        onClick={handleKnowPlans}
+                    >
+                        {translate('common.credits.paidPlanRequired.knowPlans')}
+                    </Button>
+                </div>
+            </DialogContent>
+        </Dialog>
+    );
+}