@greatapps/common 1.1.790 → 1.1.792

package/dist/components/account/sections/subscription/SubscriptionFlows.mjs

@@ -0,0 +1,40 @@
+"use client";
+import { Fragment, jsx, jsxs } from "react/jsx-runtime";
+import { BillingAddressSheet } from "./BillingAddressSheet";
+import { BoletoGeneratedDialog } from "./BoletoGeneratedDialog";
+import { CancelPlanDialog } from "./CancelPlanDialog";
+import { PayChargeDialog } from "./PayChargeDialog";
+import { PaymentConfirmationDialog } from "./PaymentConfirmationDialog";
+import { PendingChangeDialog } from "./PendingChangeDialog";
+import { PixPaymentDialog } from "./PixPaymentDialog";
+import { PlanDetailsSheet } from "./PlanDetailsSheet";
+import { ReceiptDetailsSheet } from "./ReceiptDetailsSheet";
+import { UsageReportSheet } from "./UsageReportSheet";
+import { ChangePlanSheet } from "./change-plan/ChangePlanSheet";
+import { CannotDowngradeDialog } from "./downgrade/CannotDowngradeDialog";
+import { DowngradeReasonDialog } from "./downgrade/DowngradeReasonDialog";
+import { OverdueReceiptOpener } from "./OverdueReceiptOpener";
+import { PlansCatalogDialog } from "./plans/PlansCatalogDialog";
+function SubscriptionFlows() {
+  return /* @__PURE__ */ jsxs(Fragment, { children: [
+    /* @__PURE__ */ jsx(OverdueReceiptOpener, {}),
+    /* @__PURE__ */ jsx(ReceiptDetailsSheet, {}),
+    /* @__PURE__ */ jsx(PayChargeDialog, {}),
+    /* @__PURE__ */ jsx(PlanDetailsSheet, {}),
+    /* @__PURE__ */ jsx(BillingAddressSheet, {}),
+    /* @__PURE__ */ jsx(UsageReportSheet, {}),
+    /* @__PURE__ */ jsx(CancelPlanDialog, {}),
+    /* @__PURE__ */ jsx(PendingChangeDialog, {}),
+    /* @__PURE__ */ jsx(ChangePlanSheet, {}),
+    /* @__PURE__ */ jsx(PlansCatalogDialog, {}),
+    /* @__PURE__ */ jsx(DowngradeReasonDialog, {}),
+    /* @__PURE__ */ jsx(CannotDowngradeDialog, {}),
+    /* @__PURE__ */ jsx(PixPaymentDialog, {}),
+    /* @__PURE__ */ jsx(BoletoGeneratedDialog, {}),
+    /* @__PURE__ */ jsx(PaymentConfirmationDialog, {})
+  ] });
+}
+export {
+  SubscriptionFlows
+};
+//# sourceMappingURL=SubscriptionFlows.mjs.map

package/dist/components/account/sections/subscription/SubscriptionFlows.mjs.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../../../src/components/account/sections/subscription/SubscriptionFlows.tsx"],"sourcesContent":["'use client';\n\nimport { BillingAddressSheet } from './BillingAddressSheet';\nimport { BoletoGeneratedDialog } from './BoletoGeneratedDialog';\nimport { CancelPlanDialog } from './CancelPlanDialog';\nimport { PayChargeDialog } from './PayChargeDialog';\nimport { PaymentConfirmationDialog } from './PaymentConfirmationDialog';\nimport { PendingChangeDialog } from './PendingChangeDialog';\nimport { PixPaymentDialog } from './PixPaymentDialog';\nimport { PlanDetailsSheet } from './PlanDetailsSheet';\nimport { ReceiptDetailsSheet } from './ReceiptDetailsSheet';\nimport { UsageReportSheet } from './UsageReportSheet';\nimport { ChangePlanSheet } from './change-plan/ChangePlanSheet';\nimport { CannotDowngradeDialog } from './downgrade/CannotDowngradeDialog';\nimport { DowngradeReasonDialog } from './downgrade/DowngradeReasonDialog';\nimport { OverdueReceiptOpener } from './OverdueReceiptOpener';\nimport { PlansCatalogDialog } from './plans/PlansCatalogDialog';\n\n/** Fluxos da aba Assinatura, abertos por cima do modal Minha conta. */\nexport function SubscriptionFlows() {\n  return (\n    <>\n      <OverdueReceiptOpener />\n      <ReceiptDetailsSheet />\n      <PayChargeDialog />\n      <PlanDetailsSheet />\n      <BillingAddressSheet />\n      <UsageReportSheet />\n      <CancelPlanDialog />\n      <PendingChangeDialog />\n      <ChangePlanSheet />\n      <PlansCatalogDialog />\n      <DowngradeReasonDialog />\n      <CannotDowngradeDialog />\n      <PixPaymentDialog />\n      <BoletoGeneratedDialog />\n      <PaymentConfirmationDialog />\n    </>\n  );\n}\n"],"mappings":";AAqBI,mBACE,KADF;AAnBJ,SAAS,2BAA2B;AACpC,SAAS,6BAA6B;AACtC,SAAS,wBAAwB;AACjC,SAAS,uBAAuB;AAChC,SAAS,iCAAiC;AAC1C,SAAS,2BAA2B;AACpC,SAAS,wBAAwB;AACjC,SAAS,wBAAwB;AACjC,SAAS,2BAA2B;AACpC,SAAS,wBAAwB;AACjC,SAAS,uBAAuB;AAChC,SAAS,6BAA6B;AACtC,SAAS,6BAA6B;AACtC,SAAS,4BAA4B;AACrC,SAAS,0BAA0B;AAG5B,SAAS,oBAAoB;AAClC,SACE,iCACE;AAAA,wBAAC,wBAAqB;AAAA,IACtB,oBAAC,uBAAoB;AAAA,IACrB,oBAAC,mBAAgB;AAAA,IACjB,oBAAC,oBAAiB;AAAA,IAClB,oBAAC,uBAAoB;AAAA,IACrB,oBAAC,oBAAiB;AAAA,IAClB,oBAAC,oBAAiB;AAAA,IAClB,oBAAC,uBAAoB;AAAA,IACrB,oBAAC,mBAAgB;AAAA,IACjB,oBAAC,sBAAmB;AAAA,IACpB,oBAAC,yBAAsB;AAAA,IACvB,oBAAC,yBAAsB;AAAA,IACvB,oBAAC,oBAAiB;AAAA,IAClB,oBAAC,yBAAsB;AAAA,IACvB,oBAAC,6BAA0B;AAAA,KAC7B;AAEJ;","names":[]}

package/dist/components/account/sections/subscription/SubscriptionPlanCard.mjs

@@ -0,0 +1,303 @@
+"use client";
+import { Fragment, jsx, jsxs } from "react/jsx-runtime";
+import { IconAlertTriangle, IconBolt, IconChevronRight, IconChevronsDown, IconPencil } from "@tabler/icons-react";
+import { useTranslations } from "next-intl";
+import { Button } from "../../../ui/buttons/Button";
+import { Progress } from "../../../ui/feedback/Progress";
+import { Skeleton } from "../../../ui/feedback/Skeleton";
+import { cn } from "../../../../infra/utils/clsx";
+import { daysBetween, formatShortDate, toCalendarDate } from "../../../../infra/utils/date";
+import { useWhitelabel } from "../../../../providers/whitelabel.provider";
+import { useManagementPermissions } from "../../../../modules/auth/hooks/useManagementPermissions";
+import { useCurrencyFormatter } from "../../../../modules/accounts/hooks/use-currency-formatter.hook";
+import { useCharges } from "../../../../modules/charges/hooks/charges.hook";
+import { useCurrentSubscription } from "../../../../modules/subscriptions/hooks/use-current-subscription.hook";
+import { useAccountFreeze } from "../../../../modules/subscriptions/hooks/use-account-freeze.hook";
+import { ADDON_IDS } from "../../../../modules/subscriptions/constants/addons.constants";
+import { SUBSCRIPTION_GRACE_PERIOD_DAYS } from "../../../../modules/subscriptions/constants/subscription.constants";
+import { hasSubscriptionExpired } from "../../../../modules/subscriptions/utils/has-subscription-expired";
+import { getPeriodicityLabel } from "../../../../modules/subscriptions/utils/periodicity";
+import { isFreeSubscription } from "../../../../modules/subscriptions/utils/is-free-subscription";
+import { isApiSubscription } from "../../../../modules/subscriptions/utils/is-api-subscription";
+import { resolveSubscriptionPlanName } from "../../../../modules/subscriptions/utils/resolve-subscription-plan-name";
+import useSubscriptionActions from "../../hooks/useSubscriptionActions";
+import { AiCreditsPromo, AiCreditsUsage } from "./AiCreditsUsage";
+import { IconBox } from "../shared/IconBox";
+import { RowActionsMenu } from "../shared/RowActionsMenu";
+import { StatusBadge } from "../shared/StatusBadge";
+const UPCOMING_CHARGE_DETAILS_WINDOW_DAYS = 7;
+function PlanCardShell({ children, className }) {
+  return /* @__PURE__ */ jsx("div", { className: cn("flex flex-col border border-zinc-200 rounded-lg min-w-0 bg-white", className), children });
+}
+function MoreDetailsButton({ onClick }) {
+  const translate = useTranslations();
+  return /* @__PURE__ */ jsxs(
+    "button",
+    {
+      type: "button",
+      onClick,
+      className: "flex items-center gap-0.5 paragraph-small-semibold text-zinc-950 underline cursor-pointer hover:text-zinc-700 transition-colors w-fit",
+      children: [
+        translate("common.account.workspace.subscription.planCard.moreDetails"),
+        /* @__PURE__ */ jsx(IconChevronRight, { size: 14, strokeWidth: 2.7 })
+      ]
+    }
+  );
+}
+function PlanPrice({ value, muted = false }) {
+  const colorClasses = muted ? "text-zinc-950 opacity-20" : "text-zinc-950";
+  return /* @__PURE__ */ jsxs(Fragment, { children: [
+    /* @__PURE__ */ jsx("span", { className: cn("md:hidden paragraph-xlarge-semibold", colorClasses), children: value }),
+    /* @__PURE__ */ jsx("span", { className: cn("hidden md:inline title-large-semibold", colorClasses), children: value })
+  ] });
+}
+function SubscriptionPlanCard() {
+  const translate = useTranslations();
+  const {
+    data: { data: [subscription] = [] } = {},
+    isPending: isLoading,
+    isError,
+    refetch
+  } = useCurrentSubscription();
+  const { isOwnerOrAdmin: canManage } = useManagementPermissions();
+  const { whitelabel } = useWhitelabel();
+  const isMainWhitelabel = whitelabel?.id === 1;
+  const { formatCurrencyNumber } = useCurrencyFormatter();
+  const actions = useSubscriptionActions();
+  const { data: pendingChargesData } = useCharges({ page: 1, limit: 1, status: [0] });
+  const pendingCharge = pendingChargesData?.data?.[0] ?? null;
+  const { isFrozen } = useAccountFreeze();
+  const today = toCalendarDate(/* @__PURE__ */ new Date());
+  const dueCalendarDate = toCalendarDate(subscription?.date_due);
+  const hiringCalendarDate = toCalendarDate(subscription?.date_hiring);
+  const trialDaysRemaining = today && dueCalendarDate ? Math.max(0, daysBetween(today, dueCalendarDate)) : 0;
+  const trialTotalDays = hiringCalendarDate && dueCalendarDate ? Math.max(1, daysBetween(hiringCalendarDate, dueCalendarDate)) : trialDaysRemaining;
+  const trialProgressPercentage = trialTotalDays > 0 ? (trialTotalDays - trialDaysRemaining) / trialTotalDays * 100 : 0;
+  const hasNoSubscription = !subscription;
+  const isFreePlan = !!subscription && isFreeSubscription(subscription) && subscription.active;
+  const isTrialPlan = subscription?.type === "trial" && trialDaysRemaining > 0;
+  const isApiPlan = isApiSubscription(subscription);
+  if (!isLoading && isError) {
+    return /* @__PURE__ */ jsx(PlanCardShell, { children: /* @__PURE__ */ jsx("div", { className: "p-2 flex-1", children: /* @__PURE__ */ jsxs("div", { className: "flex flex-col justify-between gap-6 p-5 lg:p-6 bg-zinc-50 rounded-lg h-full", children: [
+      /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-4", children: [
+        /* @__PURE__ */ jsx(IconBox, { icon: IconAlertTriangle }),
+        /* @__PURE__ */ jsx("span", { className: "paragraph-medium-semibold text-zinc-950", children: translate("common.account.workspace.subscription.planCard.readFailed") })
+      ] }),
+      /* @__PURE__ */ jsx(Button, { variant: "secondary", onClick: () => refetch(), className: "w-fit h-10!", children: translate("common.account.workspace.subscription.planCard.readFailedRetry") })
+    ] }) }) });
+  }
+  if (!isLoading && !isTrialPlan && (hasNoSubscription || isFreePlan)) {
+    return /* @__PURE__ */ jsxs(PlanCardShell, { children: [
+      /* @__PURE__ */ jsx("div", { className: "p-2 flex-1", children: /* @__PURE__ */ jsxs("div", { className: "flex flex-col justify-between gap-6 p-5 lg:p-6 bg-zinc-50 rounded-lg h-full", children: [
+        /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-4", children: [
+          /* @__PURE__ */ jsx(IconBox, { icon: IconBolt }),
+          /* @__PURE__ */ jsx("span", { className: "paragraph-medium-semibold text-zinc-950", children: hasNoSubscription ? translate("common.account.workspace.subscription.planCard.noSubscription") : translate("common.account.workspace.subscription.planCard.freePlan") })
+        ] }),
+        canManage && /* @__PURE__ */ jsx(Button, { onClick: actions.choosePlan, className: "w-fit h-10!", children: translate("common.account.workspace.subscription.planCard.choosePlan") })
+      ] }) }),
+      isMainWhitelabel && /* @__PURE__ */ jsx(AiCreditsPromo, { isMainWhitelabel })
+    ] });
+  }
+  if (!isLoading && isTrialPlan) {
+    const trialHasAiCredits = subscription?.items?.some((item) => item.id_addon === ADDON_IDS.AI) ?? false;
+    return /* @__PURE__ */ jsxs(PlanCardShell, { children: [
+      /* @__PURE__ */ jsx("div", { className: "p-2", children: /* @__PURE__ */ jsxs("div", { className: "flex flex-col gap-6 p-5 lg:p-6 bg-zinc-50 rounded-lg", children: [
+        /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-4", children: [
+          /* @__PURE__ */ jsx(IconBox, { icon: IconBolt }),
+          /* @__PURE__ */ jsxs("div", { className: "flex flex-col gap-0.5", children: [
+            /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-2 flex-wrap", children: [
+              /* @__PURE__ */ jsx("span", { className: "paragraph-medium-semibold text-zinc-950", children: translate("common.account.workspace.subscription.planCard.planName", {
+                name: resolveSubscriptionPlanName(subscription, translate)
+              }) }),
+              /* @__PURE__ */ jsx("span", { className: "paragraph-medium-regular text-zinc-400", children: translate("common.account.workspace.subscription.planCard.trialBadge") })
+            ] }),
+            isMainWhitelabel && /* @__PURE__ */ jsx(MoreDetailsButton, { onClick: actions.viewPlanDetails })
+          ] })
+        ] }),
+        /* @__PURE__ */ jsxs("div", { className: "flex flex-col gap-3", children: [
+          /* @__PURE__ */ jsx("span", { className: "paragraph-small-regular text-zinc-600", children: translate("common.account.workspace.subscription.planCard.trialDaysRemaining", {
+            days: String(trialDaysRemaining)
+          }) }),
+          /* @__PURE__ */ jsx(Progress, { value: trialProgressPercentage, indicatorColor: "bg-zinc-950", className: "bg-zinc-200 h-2" })
+        ] }),
+        canManage && /* @__PURE__ */ jsx(Button, { onClick: actions.choosePlan, className: "w-fit h-10!", children: translate("common.account.workspace.subscription.planCard.hirePlan") })
+      ] }) }),
+      isMainWhitelabel && (trialHasAiCredits ? /* @__PURE__ */ jsx(
+        AiCreditsUsage,
+        {
+          canManage,
+          isApiPlan: false,
+          cancelled: false,
+          onViewUsageReport: actions.viewUsageReport
+        }
+      ) : /* @__PURE__ */ jsx(AiCreditsPromo, { isMainWhitelabel }))
+    ] });
+  }
+  const pendingChange = subscription?.pending_change ?? null;
+  const hasPendingDowngrade = !!pendingChange?.takes_effect_at_iso && !!pendingChange.new_plan && new Date(pendingChange.takes_effect_at_iso) > /* @__PURE__ */ new Date();
+  const planName = translate("common.account.workspace.subscription.planCard.planName", {
+    name: resolveSubscriptionPlanName(
+      subscription,
+      translate,
+      translate("common.account.workspace.subscription.planCard.noName")
+    )
+  });
+  const cancelled = !!subscription?.date_cancellation;
+  const isPartnerPlan = subscription?.type === "partner";
+  const isEffectivelyCancelled = !subscription?.active;
+  const planPrice = formatCurrencyNumber(subscription?.value ?? 0);
+  const periodicityLabel = getPeriodicityLabel(subscription?.periodicity, translate);
+  const cancellationDate = toCalendarDate(subscription?.date_cancellation);
+  const hasFutureCancellation = !!subscription?.date_cancellation && !!cancellationDate && !!today && cancellationDate.getTime() > today.getTime();
+  const daysToDue = today && dueCalendarDate ? daysBetween(today, dueCalendarDate) : null;
+  const daysSinceDue = today && dueCalendarDate ? daysBetween(dueCalendarDate, today) : null;
+  const isWithinChargeDetailsWindow = daysToDue != null && daysSinceDue != null && (daysToDue >= 0 && daysToDue <= UPCOMING_CHARGE_DETAILS_WINDOW_DAYS || daysSinceDue > 0 && daysSinceDue <= SUBSCRIPTION_GRACE_PERIOD_DAYS);
+  const isOverdue = !!today && !!dueCalendarDate && today.getTime() > dueCalendarDate.getTime();
+  const isExpired = hasSubscriptionExpired(subscription?.date_due);
+  const canOpenChargeDetails = !!pendingCharge && !hasFutureCancellation && isWithinChargeDetailsWindow;
+  const handleOpenChargeDetails = () => {
+    if (!canOpenChargeDetails || !pendingCharge) return;
+    actions.viewCharge(pendingCharge);
+  };
+  const renewalDateLabel = isExpired ? translate("common.account.workspace.subscription.planCard.expired") : isOverdue ? translate("common.account.workspace.subscription.planCard.overdueDate", {
+    date: formatShortDate(subscription?.date_due)
+  }) : translate("common.account.workspace.subscription.planCard.expiresOn", {
+    date: formatShortDate(subscription?.date_due)
+  });
+  const statusBadge = cancelled ? /* @__PURE__ */ jsx(StatusBadge, { tone: "red", children: translate("common.account.workspace.subscription.planCard.cancelled") }) : isFrozen ? /* @__PURE__ */ jsx(StatusBadge, { tone: "red", children: translate("common.account.workspace.subscription.planCard.frozen") }) : /* @__PURE__ */ jsx(StatusBadge, { tone: "blue", children: periodicityLabel });
+  const planActionsMenu = /* @__PURE__ */ jsx(
+    RowActionsMenu,
+    {
+      width: 220,
+      items: [
+        {
+          icon: /* @__PURE__ */ jsx(IconPencil, { size: 20 }),
+          label: translate("common.account.workspace.subscription.planCard.billingAddress"),
+          onClick: actions.editBillingAddress
+        },
+        {
+          icon: /* @__PURE__ */ jsx(IconAlertTriangle, { size: 20, className: "text-red-600" }),
+          label: translate("common.account.workspace.subscription.planCard.cancelPlan"),
+          onClick: actions.cancelPlan,
+          destructive: true
+        }
+      ]
+    }
+  );
+  const payButton = canOpenChargeDetails && /* @__PURE__ */ jsx(Button, { variant: "secondary", className: "h-10! flex-1 md:flex-none min-w-0", onClick: handleOpenChargeDetails, children: translate("common.account.workspace.subscription.planCard.paySubscription") });
+  if (hasPendingDowngrade && pendingChange?.new_plan) {
+    const pendingPlanName = translate("common.account.workspace.subscription.planCard.planName", {
+      name: pendingChange.new_plan.name
+    });
+    const pendingPlanPrice = formatCurrencyNumber(pendingChange.new_plan.value);
+    const pendingPeriodicityLabel = getPeriodicityLabel(pendingChange.new_plan.periodicity, translate);
+    const pendingDateLabel = translate("common.account.workspace.subscription.planCard.pendingDate", {
+      date: formatShortDate(pendingChange.takes_effect_at_iso)
+    });
+    return /* @__PURE__ */ jsxs(PlanCardShell, { children: [
+      /* @__PURE__ */ jsx("div", { className: "p-2", children: /* @__PURE__ */ jsxs("div", { className: "flex flex-col p-5 lg:p-6 bg-zinc-50 rounded-lg justify-between gap-3", children: [
+        /* @__PURE__ */ jsxs("div", { className: "flex flex-col gap-1", children: [
+          /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-1.5 flex-wrap", children: [
+            /* @__PURE__ */ jsx("span", { className: "paragraph-small-regular text-zinc-500", children: translate("common.account.workspace.subscription.planCard.current") }),
+            /* @__PURE__ */ jsx("span", { className: "paragraph-small-regular text-zinc-500", children: "\u2022" }),
+            /* @__PURE__ */ jsx("span", { className: "paragraph-small-semibold text-zinc-950", children: planName }),
+            /* @__PURE__ */ jsx(StatusBadge, { tone: "blue", children: periodicityLabel })
+          ] }),
+          isMainWhitelabel && /* @__PURE__ */ jsx(MoreDetailsButton, { onClick: actions.viewPlanDetails }),
+          /* @__PURE__ */ jsx(PlanPrice, { value: planPrice })
+        ] }),
+        /* @__PURE__ */ jsx("div", { className: "flex items-center gap-2 py-1", children: /* @__PURE__ */ jsxs("div", { className: "flex flex-col items-center", children: [
+          /* @__PURE__ */ jsx("div", { className: "w-px h-4 border-l border-dashed border-zinc-300" }),
+          /* @__PURE__ */ jsx("div", { className: "size-7 rounded-full border border-zinc-200 bg-white flex items-center justify-center", children: /* @__PURE__ */ jsx(IconChevronsDown, { size: 16, className: "text-zinc-400" }) }),
+          /* @__PURE__ */ jsx("div", { className: "w-px h-4 border-l border-dashed border-zinc-300" })
+        ] }) }),
+        /* @__PURE__ */ jsxs("div", { className: "flex flex-col md:flex-row md:items-end justify-between gap-4", children: [
+          /* @__PURE__ */ jsxs("div", { className: "flex flex-col gap-1", children: [
+            /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-1.5 flex-wrap", children: [
+              /* @__PURE__ */ jsx("span", { className: "paragraph-small-regular text-zinc-500", children: pendingDateLabel }),
+              /* @__PURE__ */ jsx("span", { className: "paragraph-small-regular text-zinc-500", children: "\u2022" }),
+              /* @__PURE__ */ jsx("span", { className: "paragraph-small-semibold text-zinc-950", children: pendingPlanName }),
+              /* @__PURE__ */ jsx(StatusBadge, { tone: "blue", children: pendingPeriodicityLabel })
+            ] }),
+            /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-2", children: [
+              /* @__PURE__ */ jsx(PlanPrice, { value: pendingPlanPrice }),
+              /* @__PURE__ */ jsx(
+                "button",
+                {
+                  type: "button",
+                  onClick: () => actions.viewPendingChange(pendingChange),
+                  className: "paragraph-xsmall-medium text-zinc-500 underline cursor-pointer hover:text-zinc-700 transition-colors",
+                  children: translate("common.account.workspace.subscription.planCard.details")
+                }
+              )
+            ] })
+          ] }),
+          canManage && /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-2 shrink-0", children: [
+            /* @__PURE__ */ jsx(Button, { className: "h-10! flex-1 md:flex-none min-w-0", onClick: actions.changePlan, children: translate("common.account.workspace.subscription.planCard.changePlan") }),
+            payButton,
+            planActionsMenu
+          ] })
+        ] })
+      ] }) }),
+      !isApiPlan && isMainWhitelabel && /* @__PURE__ */ jsx(
+        AiCreditsUsage,
+        {
+          canManage,
+          isApiPlan,
+          cancelled,
+          onViewUsageReport: actions.viewUsageReport
+        }
+      )
+    ] });
+  }
+  return /* @__PURE__ */ jsxs(PlanCardShell, { children: [
+    /* @__PURE__ */ jsx("div", { className: cn("p-2", isApiPlan && "flex-1 flex flex-col"), children: /* @__PURE__ */ jsxs(
+      "div",
+      {
+        className: cn(
+          "flex flex-col p-5 lg:p-6 bg-zinc-50 rounded-lg min-h-56.25 justify-between gap-8 md:gap-3",
+          isApiPlan && "flex-1"
+        ),
+        children: [
+          /* @__PURE__ */ jsxs("div", { className: "flex flex-col md:flex-row md:items-center justify-between gap-4 md:gap-3", children: [
+            /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-4", children: [
+              /* @__PURE__ */ jsx(IconBox, { icon: IconBolt }),
+              /* @__PURE__ */ jsxs("div", { className: "flex flex-col gap-0.5", children: [
+                /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-2 flex-wrap", children: [
+                  isLoading ? /* @__PURE__ */ jsx(Skeleton, { className: "h-4 w-28 rounded" }) : /* @__PURE__ */ jsx("span", { className: "paragraph-medium-semibold text-zinc-950", children: planName }),
+                  !isLoading && statusBadge
+                ] }),
+                !isLoading && isMainWhitelabel && /* @__PURE__ */ jsx(MoreDetailsButton, { onClick: actions.viewPlanDetails })
+              ] })
+            ] }),
+            isLoading ? /* @__PURE__ */ jsx(Skeleton, { className: "h-4 w-28 rounded" }) : !isPartnerPlan && !isEffectivelyCancelled ? /* @__PURE__ */ jsx("span", { className: "text-zinc-500 paragraph-small-medium", children: renewalDateLabel }) : null
+          ] }),
+          canManage && /* @__PURE__ */ jsxs("div", { className: "flex flex-col md:flex-row md:items-center justify-between gap-4", children: [
+            isLoading ? /* @__PURE__ */ jsx(Skeleton, { className: "h-7 w-28 rounded" }) : /* @__PURE__ */ jsx(PlanPrice, { value: planPrice, muted: cancelled }),
+            cancelled ? /* @__PURE__ */ jsxs("div", { className: "flex flex-col md:flex-row md:items-center gap-2", children: [
+              /* @__PURE__ */ jsx(Button, { className: "h-10!", onClick: actions.choosePlan, children: translate("common.account.workspace.subscription.planCard.choosePlan") }),
+              payButton
+            ] }) : /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-2", children: [
+              /* @__PURE__ */ jsx(Button, { className: "h-10! flex-1 md:flex-none min-w-0", onClick: actions.changePlan, children: translate("common.account.workspace.subscription.planCard.changePlan") }),
+              payButton,
+              planActionsMenu
+            ] })
+          ] })
+        ]
+      }
+    ) }),
+    !isApiPlan && isMainWhitelabel && /* @__PURE__ */ jsx(
+      AiCreditsUsage,
+      {
+        canManage,
+        isApiPlan,
+        cancelled,
+        onViewUsageReport: actions.viewUsageReport
+      }
+    )
+  ] });
+}
+export {
+  SubscriptionPlanCard
+};
+//# sourceMappingURL=SubscriptionPlanCard.mjs.map

package/dist/components/account/sections/subscription/SubscriptionPlanCard.mjs.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../../../src/components/account/sections/subscription/SubscriptionPlanCard.tsx"],"sourcesContent":["'use client';\n\nimport type { ReactNode } from 'react';\nimport { IconAlertTriangle, IconBolt, IconChevronRight, IconChevronsDown, IconPencil } from '@tabler/icons-react';\nimport { useTranslations } from 'next-intl';\nimport { Button } from '../../../ui/buttons/Button';\nimport { Progress } from '../../../ui/feedback/Progress';\nimport { Skeleton } from '../../../ui/feedback/Skeleton';\nimport { cn } from '../../../../infra/utils/clsx';\nimport { daysBetween, formatShortDate, toCalendarDate } from '../../../../infra/utils/date';\nimport { useWhitelabel } from '../../../../providers/whitelabel.provider';\nimport { useManagementPermissions } from '../../../../modules/auth/hooks/useManagementPermissions';\nimport { useCurrencyFormatter } from '../../../../modules/accounts/hooks/use-currency-formatter.hook';\nimport { useCharges } from '../../../../modules/charges/hooks/charges.hook';\nimport { useCurrentSubscription } from '../../../../modules/subscriptions/hooks/use-current-subscription.hook';\nimport { useAccountFreeze } from '../../../../modules/subscriptions/hooks/use-account-freeze.hook';\nimport { ADDON_IDS } from '../../../../modules/subscriptions/constants/addons.constants';\nimport { SUBSCRIPTION_GRACE_PERIOD_DAYS } from '../../../../modules/subscriptions/constants/subscription.constants';\nimport { hasSubscriptionExpired } from '../../../../modules/subscriptions/utils/has-subscription-expired';\nimport { getPeriodicityLabel } from '../../../../modules/subscriptions/utils/periodicity';\nimport { isFreeSubscription } from '../../../../modules/subscriptions/utils/is-free-subscription';\nimport { isApiSubscription } from '../../../../modules/subscriptions/utils/is-api-subscription';\nimport { resolveSubscriptionPlanName } from '../../../../modules/subscriptions/utils/resolve-subscription-plan-name';\nimport useSubscriptionActions from '../../hooks/useSubscriptionActions';\nimport { AiCreditsPromo, AiCreditsUsage } from './AiCreditsUsage';\nimport { IconBox } from '../shared/IconBox';\nimport { RowActionsMenu } from '../shared/RowActionsMenu';\nimport { StatusBadge } from '../shared/StatusBadge';\n\nconst UPCOMING_CHARGE_DETAILS_WINDOW_DAYS = 7;\n\nfunction PlanCardShell({ children, className }: { children: ReactNode; className?: string }) {\n  return (\n    <div className={cn('flex flex-col border border-zinc-200 rounded-lg min-w-0 bg-white', className)}>\n      {children}\n    </div>\n  );\n}\n\nfunction MoreDetailsButton({ onClick }: { onClick: () => void }) {\n  const translate = useTranslations();\n\n  return (\n    <button\n      type=\"button\"\n      onClick={onClick}\n      className=\"flex items-center gap-0.5 paragraph-small-semibold text-zinc-950 underline cursor-pointer hover:text-zinc-700 transition-colors w-fit\"\n    >\n      {translate('common.account.workspace.subscription.planCard.moreDetails')}\n      <IconChevronRight size={14} strokeWidth={2.7} />\n    </button>\n  );\n}\n\nfunction PlanPrice({ value, muted = false }: { value: string; muted?: boolean }) {\n  const colorClasses = muted ? 'text-zinc-950 opacity-20' : 'text-zinc-950';\n\n  return (\n    <>\n      <span className={cn('md:hidden paragraph-xlarge-semibold', colorClasses)}>{value}</span>\n      <span className={cn('hidden md:inline title-large-semibold', colorClasses)}>{value}</span>\n    </>\n  );\n}\n\nexport function SubscriptionPlanCard() {\n  const translate = useTranslations();\n  const {\n    data: { data: [subscription] = [] } = {},\n    isPending: isLoading,\n    isError,\n    refetch,\n  } = useCurrentSubscription();\n\n  const { isOwnerOrAdmin: canManage } = useManagementPermissions();\n  const { whitelabel } = useWhitelabel();\n  const isMainWhitelabel = whitelabel?.id === 1;\n  const { formatCurrencyNumber } = useCurrencyFormatter();\n  const actions = useSubscriptionActions();\n  const { data: pendingChargesData } = useCharges({ page: 1, limit: 1, status: [0] });\n  const pendingCharge = pendingChargesData?.data?.[0] ?? null;\n  const { isFrozen } = useAccountFreeze();\n\n  const today = toCalendarDate(new Date());\n  const dueCalendarDate = toCalendarDate(subscription?.date_due);\n  const hiringCalendarDate = toCalendarDate(subscription?.date_hiring);\n  const trialDaysRemaining =\n    today && dueCalendarDate ? Math.max(0, daysBetween(today, dueCalendarDate)) : 0;\n  const trialTotalDays =\n    hiringCalendarDate && dueCalendarDate\n      ? Math.max(1, daysBetween(hiringCalendarDate, dueCalendarDate))\n      : trialDaysRemaining;\n  const trialProgressPercentage =\n    trialTotalDays > 0 ? ((trialTotalDays - trialDaysRemaining) / trialTotalDays) * 100 : 0;\n\n  const hasNoSubscription = !subscription;\n  const isFreePlan = !!subscription && isFreeSubscription(subscription) && subscription.active;\n  const isTrialPlan = subscription?.type === 'trial' && trialDaysRemaining > 0;\n  const isApiPlan = isApiSubscription(subscription);\n\n  if (!isLoading && isError) {\n    return (\n      <PlanCardShell>\n        <div className=\"p-2 flex-1\">\n          <div className=\"flex flex-col justify-between gap-6 p-5 lg:p-6 bg-zinc-50 rounded-lg h-full\">\n            <div className=\"flex items-center gap-4\">\n              <IconBox icon={IconAlertTriangle} />\n              <span className=\"paragraph-medium-semibold text-zinc-950\">\n                {translate('common.account.workspace.subscription.planCard.readFailed')}\n              </span>\n            </div>\n            <Button variant=\"secondary\" onClick={() => refetch()} className=\"w-fit h-10!\">\n              {translate('common.account.workspace.subscription.planCard.readFailedRetry')}\n            </Button>\n          </div>\n        </div>\n      </PlanCardShell>\n    );\n  }\n\n  if (!isLoading && !isTrialPlan && (hasNoSubscription || isFreePlan)) {\n    return (\n      <PlanCardShell>\n        <div className=\"p-2 flex-1\">\n          <div className=\"flex flex-col justify-between gap-6 p-5 lg:p-6 bg-zinc-50 rounded-lg h-full\">\n            <div className=\"flex items-center gap-4\">\n              <IconBox icon={IconBolt} />\n              <span className=\"paragraph-medium-semibold text-zinc-950\">\n                {hasNoSubscription\n                  ? translate('common.account.workspace.subscription.planCard.noSubscription')\n                  : translate('common.account.workspace.subscription.planCard.freePlan')}\n              </span>\n            </div>\n            {canManage && (\n              <Button onClick={actions.choosePlan} className=\"w-fit h-10!\">\n                {translate('common.account.workspace.subscription.planCard.choosePlan')}\n              </Button>\n            )}\n          </div>\n        </div>\n        {isMainWhitelabel && <AiCreditsPromo isMainWhitelabel={isMainWhitelabel} />}\n      </PlanCardShell>\n    );\n  }\n\n  if (!isLoading && isTrialPlan) {\n    // Contas trial têm créditos de IA inclusos (id_addon=6): mostram o mesmo uso/relatório\n    // do plano pago quando a assinatura tem item de crédito de IA.\n    const trialHasAiCredits = subscription?.items?.some((item) => item.id_addon === ADDON_IDS.AI) ?? false;\n\n    return (\n      <PlanCardShell>\n        <div className=\"p-2\">\n          <div className=\"flex flex-col gap-6 p-5 lg:p-6 bg-zinc-50 rounded-lg\">\n            <div className=\"flex items-center gap-4\">\n              <IconBox icon={IconBolt} />\n              <div className=\"flex flex-col gap-0.5\">\n                <div className=\"flex items-center gap-2 flex-wrap\">\n                  <span className=\"paragraph-medium-semibold text-zinc-950\">\n                    {translate('common.account.workspace.subscription.planCard.planName', {\n                      name: resolveSubscriptionPlanName(subscription, translate),\n                    })}\n                  </span>\n                  <span className=\"paragraph-medium-regular text-zinc-400\">\n                    {translate('common.account.workspace.subscription.planCard.trialBadge')}\n                  </span>\n                </div>\n                {isMainWhitelabel && <MoreDetailsButton onClick={actions.viewPlanDetails} />}\n              </div>\n            </div>\n            <div className=\"flex flex-col gap-3\">\n              <span className=\"paragraph-small-regular text-zinc-600\">\n                {translate('common.account.workspace.subscription.planCard.trialDaysRemaining', {\n                  days: String(trialDaysRemaining),\n                })}\n              </span>\n              <Progress value={trialProgressPercentage} indicatorColor=\"bg-zinc-950\" className=\"bg-zinc-200 h-2\" />\n            </div>\n            {canManage && (\n              <Button onClick={actions.choosePlan} className=\"w-fit h-10!\">\n                {translate('common.account.workspace.subscription.planCard.hirePlan')}\n              </Button>\n            )}\n          </div>\n        </div>\n        {isMainWhitelabel &&\n          (trialHasAiCredits ? (\n            <AiCreditsUsage\n              canManage={canManage}\n              isApiPlan={false}\n              cancelled={false}\n              onViewUsageReport={actions.viewUsageReport}\n            />\n          ) : (\n            <AiCreditsPromo isMainWhitelabel={isMainWhitelabel} />\n          ))}\n      </PlanCardShell>\n    );\n  }\n\n  const pendingChange = subscription?.pending_change ?? null;\n  const hasPendingDowngrade =\n    !!pendingChange?.takes_effect_at_iso &&\n    !!pendingChange.new_plan &&\n    new Date(pendingChange.takes_effect_at_iso) > new Date();\n\n  const planName = translate('common.account.workspace.subscription.planCard.planName', {\n    name: resolveSubscriptionPlanName(\n      subscription,\n      translate,\n      translate('common.account.workspace.subscription.planCard.noName')\n    ),\n  });\n  const cancelled = !!subscription?.date_cancellation;\n  const isPartnerPlan = subscription?.type === 'partner';\n  // Assinatura efetivamente cancelada (active === false, ex.: baixa por falha de pagamento):\n  // a linha de data não faz sentido, o badge \"Cancelado\" já cobre.\n  const isEffectivelyCancelled = !subscription?.active;\n\n  const planPrice = formatCurrencyNumber(subscription?.value ?? 0);\n  const periodicityLabel = getPeriodicityLabel(subscription?.periodicity, translate);\n  const cancellationDate = toCalendarDate(subscription?.date_cancellation);\n  const hasFutureCancellation =\n    !!subscription?.date_cancellation &&\n    !!cancellationDate &&\n    !!today &&\n    cancellationDate.getTime() > today.getTime();\n  const daysToDue = today && dueCalendarDate ? daysBetween(today, dueCalendarDate) : null;\n  const daysSinceDue = today && dueCalendarDate ? daysBetween(dueCalendarDate, today) : null;\n  const isWithinChargeDetailsWindow =\n    daysToDue != null &&\n    daysSinceDue != null &&\n    ((daysToDue >= 0 && daysToDue <= UPCOMING_CHARGE_DETAILS_WINDOW_DAYS) ||\n      (daysSinceDue > 0 && daysSinceDue <= SUBSCRIPTION_GRACE_PERIOD_DAYS));\n  const isOverdue = !!today && !!dueCalendarDate && today.getTime() > dueCalendarDate.getTime();\n  const isExpired = hasSubscriptionExpired(subscription?.date_due);\n\n  const canOpenChargeDetails = !!pendingCharge && !hasFutureCancellation && isWithinChargeDetailsWindow;\n\n  const handleOpenChargeDetails = () => {\n    if (!canOpenChargeDetails || !pendingCharge) return;\n    actions.viewCharge(pendingCharge);\n  };\n\n  const renewalDateLabel = isExpired\n    ? translate('common.account.workspace.subscription.planCard.expired')\n    : isOverdue\n      ? translate('common.account.workspace.subscription.planCard.overdueDate', {\n          date: formatShortDate(subscription?.date_due),\n        })\n      : translate('common.account.workspace.subscription.planCard.expiresOn', {\n          date: formatShortDate(subscription?.date_due),\n        });\n\n  const statusBadge = cancelled ? (\n    <StatusBadge tone=\"red\">{translate('common.account.workspace.subscription.planCard.cancelled')}</StatusBadge>\n  ) : isFrozen ? (\n    <StatusBadge tone=\"red\">{translate('common.account.workspace.subscription.planCard.frozen')}</StatusBadge>\n  ) : (\n    <StatusBadge tone=\"blue\">{periodicityLabel}</StatusBadge>\n  );\n\n  const planActionsMenu = (\n    <RowActionsMenu\n      width={220}\n      items={[\n        {\n          icon: <IconPencil size={20} />,\n          label: translate('common.account.workspace.subscription.planCard.billingAddress'),\n          onClick: actions.editBillingAddress,\n        },\n        {\n          icon: <IconAlertTriangle size={20} className=\"text-red-600\" />,\n          label: translate('common.account.workspace.subscription.planCard.cancelPlan'),\n          onClick: actions.cancelPlan,\n          destructive: true,\n        },\n      ]}\n    />\n  );\n\n  const payButton = canOpenChargeDetails && (\n    <Button variant=\"secondary\" className=\"h-10! flex-1 md:flex-none min-w-0\" onClick={handleOpenChargeDetails}>\n      {translate('common.account.workspace.subscription.planCard.paySubscription')}\n    </Button>\n  );\n\n  if (hasPendingDowngrade && pendingChange?.new_plan) {\n    const pendingPlanName = translate('common.account.workspace.subscription.planCard.planName', {\n      name: pendingChange.new_plan.name,\n    });\n    const pendingPlanPrice = formatCurrencyNumber(pendingChange.new_plan.value);\n    const pendingPeriodicityLabel = getPeriodicityLabel(pendingChange.new_plan.periodicity, translate);\n    const pendingDateLabel = translate('common.account.workspace.subscription.planCard.pendingDate', {\n      date: formatShortDate(pendingChange.takes_effect_at_iso),\n    });\n\n    return (\n      <PlanCardShell>\n        <div className=\"p-2\">\n          <div className=\"flex flex-col p-5 lg:p-6 bg-zinc-50 rounded-lg justify-between gap-3\">\n            <div className=\"flex flex-col gap-1\">\n              <div className=\"flex items-center gap-1.5 flex-wrap\">\n                <span className=\"paragraph-small-regular text-zinc-500\">\n                  {translate('common.account.workspace.subscription.planCard.current')}\n                </span>\n                <span className=\"paragraph-small-regular text-zinc-500\">•</span>\n                <span className=\"paragraph-small-semibold text-zinc-950\">{planName}</span>\n                <StatusBadge tone=\"blue\">{periodicityLabel}</StatusBadge>\n              </div>\n              {isMainWhitelabel && <MoreDetailsButton onClick={actions.viewPlanDetails} />}\n              <PlanPrice value={planPrice} />\n            </div>\n\n            <div className=\"flex items-center gap-2 py-1\">\n              <div className=\"flex flex-col items-center\">\n                <div className=\"w-px h-4 border-l border-dashed border-zinc-300\" />\n                <div className=\"size-7 rounded-full border border-zinc-200 bg-white flex items-center justify-center\">\n                  <IconChevronsDown size={16} className=\"text-zinc-400\" />\n                </div>\n                <div className=\"w-px h-4 border-l border-dashed border-zinc-300\" />\n              </div>\n            </div>\n\n            <div className=\"flex flex-col md:flex-row md:items-end justify-between gap-4\">\n              <div className=\"flex flex-col gap-1\">\n                <div className=\"flex items-center gap-1.5 flex-wrap\">\n                  <span className=\"paragraph-small-regular text-zinc-500\">{pendingDateLabel}</span>\n                  <span className=\"paragraph-small-regular text-zinc-500\">•</span>\n                  <span className=\"paragraph-small-semibold text-zinc-950\">{pendingPlanName}</span>\n                  <StatusBadge tone=\"blue\">{pendingPeriodicityLabel}</StatusBadge>\n                </div>\n                <div className=\"flex items-center gap-2\">\n                  <PlanPrice value={pendingPlanPrice} />\n                  <button\n                    type=\"button\"\n                    onClick={() => actions.viewPendingChange(pendingChange)}\n                    className=\"paragraph-xsmall-medium text-zinc-500 underline cursor-pointer hover:text-zinc-700 transition-colors\"\n                  >\n                    {translate('common.account.workspace.subscription.planCard.details')}\n                  </button>\n                </div>\n              </div>\n\n              {canManage && (\n                <div className=\"flex items-center gap-2 shrink-0\">\n                  <Button className=\"h-10! flex-1 md:flex-none min-w-0\" onClick={actions.changePlan}>\n                    {translate('common.account.workspace.subscription.planCard.changePlan')}\n                  </Button>\n                  {payButton}\n                  {planActionsMenu}\n                </div>\n              )}\n            </div>\n          </div>\n        </div>\n        {!isApiPlan && isMainWhitelabel && (\n          <AiCreditsUsage\n            canManage={canManage}\n            isApiPlan={isApiPlan}\n            cancelled={cancelled}\n            onViewUsageReport={actions.viewUsageReport}\n          />\n        )}\n      </PlanCardShell>\n    );\n  }\n\n  return (\n    <PlanCardShell>\n      <div className={cn('p-2', isApiPlan && 'flex-1 flex flex-col')}>\n        <div\n          className={cn(\n            'flex flex-col p-5 lg:p-6 bg-zinc-50 rounded-lg min-h-56.25 justify-between gap-8 md:gap-3',\n            isApiPlan && 'flex-1'\n          )}\n        >\n          <div className=\"flex flex-col md:flex-row md:items-center justify-between gap-4 md:gap-3\">\n            <div className=\"flex items-center gap-4\">\n              <IconBox icon={IconBolt} />\n              <div className=\"flex flex-col gap-0.5\">\n                <div className=\"flex items-center gap-2 flex-wrap\">\n                  {isLoading ? (\n                    <Skeleton className=\"h-4 w-28 rounded\" />\n                  ) : (\n                    <span className=\"paragraph-medium-semibold text-zinc-950\">{planName}</span>\n                  )}\n                  {!isLoading && statusBadge}\n                </div>\n                {!isLoading && isMainWhitelabel && <MoreDetailsButton onClick={actions.viewPlanDetails} />}\n              </div>\n            </div>\n            {isLoading ? (\n              <Skeleton className=\"h-4 w-28 rounded\" />\n            ) : !isPartnerPlan && !isEffectivelyCancelled ? (\n              <span className=\"text-zinc-500 paragraph-small-medium\">{renewalDateLabel}</span>\n            ) : null}\n          </div>\n\n          {canManage && (\n            <div className=\"flex flex-col md:flex-row md:items-center justify-between gap-4\">\n              {isLoading ? <Skeleton className=\"h-7 w-28 rounded\" /> : <PlanPrice value={planPrice} muted={cancelled} />}\n              {cancelled ? (\n                <div className=\"flex flex-col md:flex-row md:items-center gap-2\">\n                  <Button className=\"h-10!\" onClick={actions.choosePlan}>\n                    {translate('common.account.workspace.subscription.planCard.choosePlan')}\n                  </Button>\n                  {payButton}\n                </div>\n              ) : (\n                <div className=\"flex items-center gap-2\">\n                  <Button className=\"h-10! flex-1 md:flex-none min-w-0\" onClick={actions.changePlan}>\n                    {translate('common.account.workspace.subscription.planCard.changePlan')}\n                  </Button>\n                  {payButton}\n                  {planActionsMenu}\n                </div>\n              )}\n            </div>\n          )}\n        </div>\n      </div>\n      {!isApiPlan && isMainWhitelabel && (\n        <AiCreditsUsage\n          canManage={canManage}\n          isApiPlan={isApiPlan}\n          cancelled={cancelled}\n          onViewUsageReport={actions.viewUsageReport}\n        />\n      )}\n    </PlanCardShell>\n  );\n}\n"],"mappings":"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","names":[]}

package/dist/components/account/sections/subscription/UsageReportSheet.mjs

@@ -0,0 +1,163 @@
+"use client";
+import { jsx, jsxs } from "react/jsx-runtime";
+import { IconCornerDownRight, IconExternalLink } from "@tabler/icons-react";
+import { useTranslations } from "next-intl";
+import { Button } from "../../../ui/buttons/Button";
+import { Separator } from "../../../ui/data-display/Separator";
+import { Skeleton } from "../../../ui/feedback/Skeleton";
+import { Sheet, SheetContent, SheetHeader, SheetTitle } from "../../../ui/overlay/Sheet";
+import { Tooltip, TooltipContent, TooltipTrigger } from "../../../ui/overlay/Tooltip";
+import { useIaCreditOperations } from "../../../../modules/ia-credits/hooks/ia-credit-operations.hook";
+import { useWhitelabel } from "../../../../providers/whitelabel.provider";
+import useIsMobile from "../../../../hooks/useIsMobile";
+import { cn } from "../../../../infra/utils/clsx";
+import { useSubscriptionFlows } from "../../../../store/useSubscriptionFlows";
+function extractPageId(description) {
+  const pageId = description.split("-")[1]?.replace("P\xE1gina ID: ", " ").trim();
+  return pageId || null;
+}
+function UsageItemRow({ item }) {
+  const translate = useTranslations("common.account.workspace.subscription.usageReport");
+  const { whitelabel } = useWhitelabel();
+  const pageId = extractPageId(item.description);
+  const pageUrl = pageId && whitelabel?.pages_url ? `${whitelabel.pages_url}/pages/${pageId}` : null;
+  return /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-4", children: [
+    /* @__PURE__ */ jsx(IconCornerDownRight, { size: 18, className: "text-zinc-400 shrink-0" }),
+    /* @__PURE__ */ jsxs("div", { className: "flex flex-col gap-1 flex-1", children: [
+      /* @__PURE__ */ jsx("span", { className: "paragraph-small-semibold text-zinc-950", children: item.description.split("-")[0] }),
+      /* @__PURE__ */ jsx("p", { className: "paragraph-small-regular text-zinc-600", children: translate.rich("madeBy", {
+        author: item.author,
+        b: (chunks) => /* @__PURE__ */ jsx("span", { className: "paragraph-small-medium", children: chunks })
+      }) })
+    ] }),
+    /* @__PURE__ */ jsx("span", { className: "paragraph-small-semibold text-zinc-950 text-right shrink-0", children: translate("creditsLabel", { credits: String(item.credits) }) }),
+    pageUrl && /* @__PURE__ */ jsxs(Tooltip, { delayDuration: 300, children: [
+      /* @__PURE__ */ jsx(TooltipTrigger, { asChild: true, children: /* @__PURE__ */ jsx(
+        Button,
+        {
+          variant: "secondary",
+          size: "icon-lg",
+          className: "size-8 shrink-0",
+          onClick: () => window.open(pageUrl, "_blank", "noopener,noreferrer"),
+          children: /* @__PURE__ */ jsx(IconExternalLink, { size: 16, className: "text-zinc-950" })
+        }
+      ) }),
+      /* @__PURE__ */ jsx(TooltipContent, { children: translate("viewPage") })
+    ] })
+  ] });
+}
+function PurchaseSection({ purchase }) {
+  const translate = useTranslations("common.account.workspace.subscription.usageReport");
+  const expiresLabel = purchase.expired ? translate("expired") : purchase.expiresInDays != null ? purchase.expiresInDays === 1 ? translate("expiresInOneDay") : translate("expiresInDays", { days: String(purchase.expiresInDays) }) : "";
+  return /* @__PURE__ */ jsxs("div", { className: "flex flex-col gap-4", children: [
+    /* @__PURE__ */ jsxs("div", { className: "flex flex-col gap-1", children: [
+      /* @__PURE__ */ jsx("span", { className: "paragraph-medium-semibold text-zinc-950", children: translate("creditsAdded", { count: String(purchase.addedCredits) }) }),
+      /* @__PURE__ */ jsx("span", { className: "paragraph-small-regular text-zinc-600", children: purchase.purchaseDateLabel })
+    ] }),
+    /* @__PURE__ */ jsxs("div", { className: "flex items-start justify-between", children: [
+      /* @__PURE__ */ jsx("span", { className: "paragraph-small-regular text-zinc-600", children: translate("creditsUsed", {
+        consumed: String(purchase.consumedCredits),
+        total: String(purchase.addedCredits)
+      }) }),
+      expiresLabel && /* @__PURE__ */ jsx("span", { className: "paragraph-small-medium text-zinc-950", children: expiresLabel })
+    ] }),
+    purchase.groups.map((group) => /* @__PURE__ */ jsxs("div", { className: "flex flex-col gap-5 p-4 bg-zinc-50 rounded-lg", children: [
+      /* @__PURE__ */ jsx("span", { className: "paragraph-small-semibold text-zinc-600", children: group.date }),
+      group.items.map((item, index) => /* @__PURE__ */ jsxs("div", { children: [
+        index > 0 && /* @__PURE__ */ jsx(Separator, { className: "mb-5" }),
+        /* @__PURE__ */ jsx(UsageItemRow, { item })
+      ] }, `${group.date}-${index}`))
+    ] }, group.date))
+  ] });
+}
+function UsageReportSheet() {
+  const translate = useTranslations("common.account.workspace.subscription.usageReport");
+  const isMobile = useIsMobile();
+  const isOpen = useSubscriptionFlows((state) => state.isUsageReportOpen);
+  const close = useSubscriptionFlows((state) => state.closeUsageReport);
+  const { operations, isLoading } = useIaCreditOperations();
+  const adds = operations.filter((operation) => operation.operation === "add");
+  const subtracts = operations.filter((operation) => operation.operation === "subtract");
+  const purchases = adds.map((add) => {
+    const purchaseDate = add.datetime_add ? new Date(add.datetime_add) : /* @__PURE__ */ new Date();
+    const today = /* @__PURE__ */ new Date();
+    const todayDate = new Date(today.getFullYear(), today.getMonth(), today.getDate());
+    const expiration = add.expiration_time ? new Date(add.expiration_time) : null;
+    const expirationDate = expiration && new Date(expiration.getFullYear(), expiration.getMonth(), expiration.getDate());
+    const expired = add.has_expired || expirationDate != null && expirationDate.getTime() < todayDate.getTime();
+    let expiresInDays = null;
+    if (!expired && expirationDate) {
+      const diffMs = expirationDate.getTime() - todayDate.getTime();
+      expiresInDays = Math.max(0, Math.ceil(diffMs / (1e3 * 60 * 60 * 24)));
+    }
+    const relatedSubtracts = subtracts.filter(
+      (subtract) => String(subtract.consumed_from_add_id) === String(add.id)
+    );
+    const consumedCredits = relatedSubtracts.reduce(
+      (sum, subtract) => sum + subtract.operation_value,
+      0
+    );
+    const groupsMap = /* @__PURE__ */ new Map();
+    for (const subtract of relatedSubtracts) {
+      const date = subtract.datetime_add ? new Date(subtract.datetime_add) : /* @__PURE__ */ new Date();
+      const dateLabel = date.toLocaleDateString("pt-BR");
+      const item = {
+        description: subtract.operation_ref || translate("defaultRef"),
+        author: subtract.user_name || translate("defaultUser"),
+        credits: subtract.operation_value
+      };
+      const existing = groupsMap.get(dateLabel);
+      if (existing) existing.items.push(item);
+      else groupsMap.set(dateLabel, { date: dateLabel, items: [item] });
+    }
+    return {
+      id: String(add.id),
+      addedCredits: add.operation_value,
+      consumedCredits,
+      purchaseDateLabel: purchaseDate.toLocaleDateString("pt-BR"),
+      expiresInDays,
+      expired,
+      groups: Array.from(groupsMap.values())
+    };
+  });
+  return /* @__PURE__ */ jsx(Sheet, { open: isOpen, onOpenChange: (nextOpen) => !nextOpen && close(), children: /* @__PURE__ */ jsxs(
+    SheetContent,
+    {
+      side: isMobile ? "bottom" : "right",
+      onOpenAutoFocus: (event) => event.preventDefault(),
+      className: cn(
+        "flex flex-col gap-0 p-0",
+        isMobile ? "h-dvh w-full max-w-full rounded-none pt-[env(safe-area-inset-top)] pb-[env(safe-area-inset-bottom)]" : "w-[480px]! sm:max-w-[480px]!"
+      ),
+      children: [
+        /* @__PURE__ */ jsx(SheetHeader, { className: "px-4 sm:px-5 py-3 border-b border-zinc-200", children: /* @__PURE__ */ jsx(SheetTitle, { className: "paragraph-medium-semibold text-zinc-950", children: translate("title") }) }),
+        /* @__PURE__ */ jsxs("div", { className: "flex flex-col gap-5 sm:gap-6 flex-1 overflow-y-auto [scrollbar-width:auto] [&::-webkit-scrollbar]:w-1.5 [&::-webkit-scrollbar-track]:bg-transparent [&::-webkit-scrollbar-thumb]:rounded-full [&::-webkit-scrollbar-thumb]:bg-zinc-300 px-4 sm:px-5 py-5 sm:py-6", children: [
+          isLoading && purchases.length === 0 && /* @__PURE__ */ jsx("div", { className: "flex flex-col gap-6", children: [0, 1, 2].map((key) => /* @__PURE__ */ jsxs("div", { className: "flex flex-col gap-4", children: [
+            /* @__PURE__ */ jsxs("div", { className: "flex flex-col gap-2", children: [
+              /* @__PURE__ */ jsx(Skeleton, { className: "h-4 w-40 rounded" }),
+              /* @__PURE__ */ jsx(Skeleton, { className: "h-3 w-28 rounded" })
+            ] }),
+            /* @__PURE__ */ jsxs("div", { className: "flex items-center justify-between", children: [
+              /* @__PURE__ */ jsx(Skeleton, { className: "h-3 w-40 rounded" }),
+              /* @__PURE__ */ jsx(Skeleton, { className: "h-3 w-24 rounded" })
+            ] }),
+            /* @__PURE__ */ jsxs("div", { className: "flex flex-col gap-3 p-4 bg-zinc-50 rounded-lg", children: [
+              /* @__PURE__ */ jsx(Skeleton, { className: "h-3 w-32 rounded" }),
+              /* @__PURE__ */ jsx(Skeleton, { className: "h-3 w-full rounded" }),
+              /* @__PURE__ */ jsx(Skeleton, { className: "h-3 w-2/3 rounded" })
+            ] })
+          ] }, key)) }),
+          !isLoading && purchases.length === 0 && /* @__PURE__ */ jsx("span", { className: "paragraph-small-regular text-zinc-500", children: translate("noHistory") }),
+          purchases.map((purchase, index) => /* @__PURE__ */ jsxs("div", { children: [
+            index > 0 && /* @__PURE__ */ jsx(Separator, { className: "mb-6" }),
+            /* @__PURE__ */ jsx(PurchaseSection, { purchase })
+          ] }, purchase.id))
+        ] })
+      ]
+    }
+  ) });
+}
+export {
+  UsageReportSheet
+};
+//# sourceMappingURL=UsageReportSheet.mjs.map