@greatapps/common 1.1.699 → 1.1.701

package/src/components/modals/HexaPromoModalGate.tsx

@@ -0,0 +1,80 @@
+'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;
+}

package/src/index.ts

@@ -199,9 +199,12 @@ export {
 export { useBuyCreditsModal } from "./store/useBuyCreditsModal";
 export { useCreditsDisabledModal } from "./store/useCreditsDisabledModal";
 export { usePaidPlanRequiredModal } from "./store/usePaidPlanRequiredModal";
+export { useHexaPromoModal } from "./store/useHexaPromoModal";
 export { default as BuyCreditsModal } from "./components/modals/BuyCreditsModal";
 export { default as CreditsDisabledModal } from "./components/modals/CreditsDisabledModal";
 export { default as PaidPlanRequiredModal } from "./components/modals/PaidPlanRequiredModal";
+export { default as HexaPromoModal } from "./components/modals/HexaPromoModal";
+export { default as HexaPromoModalGate } from "./components/modals/HexaPromoModalGate";
 export { default as AddCardModal } from "./components/modals/cards/AddCardModal";
 export { DeleteCardModal } from "./components/modals/cards/DeleteCardModal";
 export { CannotDeleteCardModal } from "./components/modals/cards/CannotDeleteCardModal";

package/src/providers/auth.provider.tsx

@@ -46,6 +46,7 @@ import { useWhitelabelUrls, useWhitelabel } from "./whitelabel.provider";
 import { useWlQueryKey } from "../hooks/useAuthQueryKey";
 import { normalizeLocale } from "../i18n/normalize";
 import { setLocaleCookie } from "../utils/intl/locale-cookie";
+import { clearHexaPromo } from "../utils/cookies/hexa-promo";
 
 interface AuthContextProps extends AuthState {
   login: (credentials: LoginRequest) => Promise<LoginResult>;
@@ -220,6 +221,8 @@ export function AuthProvider({ children, publicRoutes = [] }: AuthProviderProps)
     } catch {
       // cookie já removido no servidor mesmo se a API falhou
     } finally {
+      // Limpa o estado da promo "Rumo ao Hexa" para reabrir a modal no próximo login.
+      clearHexaPromo();
       queryClient.clear();
       window.location.assign(resolveLogoutRedirect());
     }

package/src/store/useHexaPromoModal.ts

@@ -0,0 +1,13 @@
+import { useModalManager } from './useModalManager';
+
+const HEXA_PROMO_MODAL_KEY = 'hexaPromoModal';
+
+export const useHexaPromoModal = () => {
+  const { activeModal, openModal, closeModal } = useModalManager();
+
+  return {
+    open: activeModal === HEXA_PROMO_MODAL_KEY,
+    openModal: () => openModal(HEXA_PROMO_MODAL_KEY),
+    closeModal,
+  };
+};

package/src/utils/cookies/hexa-promo.ts

@@ -0,0 +1,114 @@
+/**
+ * Estado do "Rumo ao Hexa" promo modal — persistido em **cookies no domínio registrável
+ * pai** (ex.: `accounts.greatpages.dev.br` → `.greatpages.dev.br`) para serem compartilhados
+ * entre os subdomínios dos apps (accounts/gapps ↔ pages/gpages). Assim a janela de "3 minutos
+ * online" é cumulativa entre os apps e a modal abre **uma única vez** por sessão/dia,
+ * independente de em qual app o usuário esteja.
+ *
+ * São dois cookies:
+ * - `gpromo-hexa-since` = `<dia>|<timestampMs>` — início da janela de 3 min (gravado uma vez).
+ * - `gpromo-hexa-seen`  = `<dia>` — dia em que a modal já foi exibida.
+ *
+ * `<dia>` é a data local `YYYY-MM-DD`: vira automaticamente no dia seguinte, fazendo a modal
+ * reaparecer. No logout, ambos os cookies são limpos (ver `auth.provider`), então um novo
+ * login também faz a modal reaparecer.
+ *
+ * Em localhost (sem subdomínio) caem em cookies host-scoped — equivalente ao localStorage;
+ * cross-port não compartilha (limitação aceita no dev local).
+ */
+
+const SINCE_COOKIE = 'gpromo-hexa-since';
+const SEEN_COOKIE = 'gpromo-hexa-seen';
+const MAX_AGE_SECONDS = 60 * 60 * 24 * 2; // 2 dias — folga sobre a janela de 1 dia.
+
+function parentCookieDomain(): string | undefined {
+  if (typeof window === 'undefined') return undefined;
+  const host = window.location.hostname;
+  if (!host || host === 'localhost') return undefined;
+  // IP literal → sem atributo Domain (cookie host-scoped)
+  if (/^\d+\.\d+\.\d+\.\d+$/.test(host)) return undefined;
+  const parts = host.split('.');
+  if (parts.length < 2) return undefined;
+  // Tira o subdomínio mais à esquerda — `accounts.greatpages.dev.br` → `.greatpages.dev.br`
+  return '.' + parts.slice(1).join('.');
+}
+
+function readCookie(name: string): string | null {
+  if (typeof document === 'undefined') return null;
+  const m = document.cookie.match(new RegExp(`(?:^|;\\s*)${name}=([^;]+)`));
+  if (!m) return null;
+  try {
+    return decodeURIComponent(m[1]);
+  } catch {
+    return null;
+  }
+}
+
+function writeCookie(name: string, value: string): void {
+  if (typeof document === 'undefined' || typeof window === 'undefined') return;
+  const domain = parentCookieDomain();
+  const parts = [
+    `${name}=${encodeURIComponent(value)}`,
+    'Path=/',
+    `Max-Age=${MAX_AGE_SECONDS}`,
+    'SameSite=Lax',
+    domain ? `Domain=${domain}` : '',
+    window.location.protocol === 'https:' ? 'Secure' : '',
+  ].filter(Boolean);
+  try {
+    document.cookie = parts.join('; ');
+  } catch {
+    // Se o navegador bloquear cookies, seguimos com a exibição única por sessão (timer no Gate).
+  }
+}
+
+function expireCookie(name: string): void {
+  if (typeof document === 'undefined' || typeof window === 'undefined') return;
+  const domain = parentCookieDomain();
+  const parts = [
+    `${name}=`,
+    'Path=/',
+    'Max-Age=0',
+    'SameSite=Lax',
+    domain ? `Domain=${domain}` : '',
+    window.location.protocol === 'https:' ? 'Secure' : '',
+  ].filter(Boolean);
+  try {
+    document.cookie = parts.join('; ');
+  } catch {
+    // noop
+  }
+}
+
+/** Chave do dia local (`YYYY-MM-DD`) usada para reabrir a modal a cada novo dia. */
+export function hexaPromoDayKey(): string {
+  const d = new Date();
+  return `${d.getFullYear()}-${String(d.getMonth() + 1).padStart(2, '0')}-${String(d.getDate()).padStart(2, '0')}`;
+}
+
+export function getHexaPromoSeenDay(): string | null {
+  return readCookie(SEEN_COOKIE);
+}
+
+export function setHexaPromoSeenDay(day: string): void {
+  writeCookie(SEEN_COOKIE, day);
+}
+
+export function getHexaPromoSince(): { day: string; ms: number } | null {
+  const raw = readCookie(SINCE_COOKIE);
+  if (!raw) return null;
+  const [day, msRaw] = raw.split('|');
+  const ms = Number(msRaw);
+  if (!day || !Number.isFinite(ms)) return null;
+  return { day, ms };
+}
+
+export function setHexaPromoSince(day: string, ms: number): void {
+  writeCookie(SINCE_COOKIE, `${day}|${ms}`);
+}
+
+/** Limpa o estado da promo (chamado no logout para reabrir a modal no próximo login). */
+export function clearHexaPromo(): void {
+  expireCookie(SINCE_COOKIE);
+  expireCookie(SEEN_COOKIE);
+}