@greatapps/common 1.1.6 → 1.1.8

package/dist/modules/whitelabel/services/whitelabel.service.mjs.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../../src/modules/whitelabel/services/whitelabel.service.ts"],"sourcesContent":["\r\nimport greatCache from '@greatapps/cache';\r\nimport { ApiError } from '../../../infra/api/types';\r\nimport { WhitelabelTokenApiResponse, WhitelabelTokenData } from '../schema';\r\n\r\nclass WhitelabelService {\r\n  private getApiUrl(): string {\r\n    const apiUrl = process.env.R3_API_URL;\r\n    if (!apiUrl) {\r\n      throw new ApiError('R3_API_URL not configured', 'CONFIG_ERROR', 500);\r\n    }\r\n    return apiUrl;\r\n  }\r\n\r\n  private getToken(): string {\r\n    const token = process.env.WHITELABEL_TOKEN_MASTER;\r\n    if (!token) {\r\n      throw new ApiError('WHITELABEL_TOKEN_MASTER not configured', 'CONFIG_ERROR', 500);\r\n    }\r\n    return token;\r\n  }\r\n\r\n  async getTokenByDomain(hostname: string): Promise<WhitelabelTokenData> {\r\n    hostname = 'greatapps.com.br';\r\n\r\n    const apiUrl = this.getApiUrl();\r\n    const whitelabelMasterToken = this.getToken();\r\n\r\n    const url = `${apiUrl}/v1/pt-br/1/whitelabel/${hostname}/token`;\r\n\r\n    console.log('[WhitelabelService] Fetching token for domain', { url });\r\n\r\n    const cache = new greatCache({\r\n      service: 'whitelabel-service',\r\n      version: '1.0',\r\n      domain: 'whitelabel-cache.greatapps.com.br',\r\n      ambient: process.env.NODE_ENV || 'development',\r\n    });\r\n\r\n    const cachedData = await cache.select(`whitelabel-token-${hostname}`);\r\n\r\n    if (cachedData.status == 1 && 'data' in cachedData && cachedData.data) {\r\n      console.log('[WhitelabelService] Cache hit for domain', { hostname });\r\n\r\n      return JSON.parse(cachedData.data) as WhitelabelTokenData;\r\n    }\r\n\r\n    const response = await fetch(url, {\r\n      method: 'GET',\r\n      headers: {\r\n        authorization: whitelabelMasterToken,\r\n      },\r\n    });\r\n\r\n    if (!response.ok) {\r\n      console.error('[WhitelabelService] Failed to fetch whitelabel token', { response });\r\n      throw new ApiError(\r\n        `Failed to fetch whitelabel token: ${response.status}`,\r\n        'FETCH_ERROR',\r\n        response.status\r\n      );\r\n    }\r\n\r\n    const result: WhitelabelTokenApiResponse = await response.json();\r\n\r\n    if (result.status !== 1 || !result.data?.length) {\r\n      throw new ApiError('Whitelabel token not found', 'TOKEN_NOT_FOUND', 404);\r\n    }\r\n\r\n    await cache.insert(`whitelabel-token-${hostname}`, JSON.stringify(result.data[0]), 604800);\r\n\r\n    return result.data[0];\r\n  }\r\n}\r\n\r\nexport const whitelabelService = new WhitelabelService();\r\n"],"mappings":"AACA,OAAO,gBAAgB;AACvB,SAAS,gBAAgB;AAGzB,MAAM,kBAAkB;AAAA,EACd,YAAoB;AAC1B,UAAM,SAAS,QAAQ,IAAI;AAC3B,QAAI,CAAC,QAAQ;AACX,YAAM,IAAI,SAAS,6BAA6B,gBAAgB,GAAG;AAAA,IACrE;AACA,WAAO;AAAA,EACT;AAAA,EAEQ,WAAmB;AACzB,UAAM,QAAQ,QAAQ,IAAI;AAC1B,QAAI,CAAC,OAAO;AACV,YAAM,IAAI,SAAS,0CAA0C,gBAAgB,GAAG;AAAA,IAClF;AACA,WAAO;AAAA,EACT;AAAA,EAEA,MAAM,iBAAiB,UAAgD;AACrE,eAAW;AAEX,UAAM,SAAS,KAAK,UAAU;AAC9B,UAAM,wBAAwB,KAAK,SAAS;AAE5C,UAAM,MAAM,GAAG,MAAM,0BAA0B,QAAQ;AAEvD,YAAQ,IAAI,iDAAiD,EAAE,IAAI,CAAC;AAEpE,UAAM,QAAQ,IAAI,WAAW;AAAA,MAC3B,SAAS;AAAA,MACT,SAAS;AAAA,MACT,QAAQ;AAAA,MACR,SAAS,QAAQ,IAAI,YAAY;AAAA,IACnC,CAAC;AAED,UAAM,aAAa,MAAM,MAAM,OAAO,oBAAoB,QAAQ,EAAE;AAEpE,QAAI,WAAW,UAAU,KAAK,UAAU,cAAc,WAAW,MAAM;AACrE,cAAQ,IAAI,4CAA4C,EAAE,SAAS,CAAC;AAEpE,aAAO,KAAK,MAAM,WAAW,IAAI;AAAA,IACnC;AAEA,UAAM,WAAW,MAAM,MAAM,KAAK;AAAA,MAChC,QAAQ;AAAA,MACR,SAAS;AAAA,QACP,eAAe;AAAA,MACjB;AAAA,IACF,CAAC;AAED,QAAI,CAAC,SAAS,IAAI;AAChB,cAAQ,MAAM,wDAAwD,EAAE,SAAS,CAAC;AAClF,YAAM,IAAI;AAAA,QACR,qCAAqC,SAAS,MAAM;AAAA,QACpD;AAAA,QACA,SAAS;AAAA,MACX;AAAA,IACF;AAEA,UAAM,SAAqC,MAAM,SAAS,KAAK;AAE/D,QAAI,OAAO,WAAW,KAAK,CAAC,OAAO,MAAM,QAAQ;AAC/C,YAAM,IAAI,SAAS,8BAA8B,mBAAmB,GAAG;AAAA,IACzE;AAEA,UAAM,MAAM,OAAO,oBAAoB,QAAQ,IAAI,KAAK,UAAU,OAAO,KAAK,CAAC,CAAC,GAAG,MAAM;AAEzF,WAAO,OAAO,KAAK,CAAC;AAAA,EACtB;AACF;AAEO,MAAM,oBAAoB,IAAI,kBAAkB;","names":[]}
+{"version":3,"sources":["../../../../src/modules/whitelabel/services/whitelabel.service.ts"],"sourcesContent":["\r\nimport greatCache from '@greatapps/cache';\r\nimport { ApiError } from '../../../infra/api/types';\r\nimport { WhitelabelTokenApiResponse, WhitelabelTokenData } from '../schema';\r\n\r\nclass WhitelabelService {\r\n  private getApiUrl(): string {\r\n    const apiUrl = process.env.GAPPS_R3_API_URL;\r\n    if (!apiUrl) {\r\n      throw new ApiError('GAPPS_R3_API_URL not configured', 'CONFIG_ERROR', 500);\r\n    }\r\n    return apiUrl;\r\n  }\r\n\r\n  private getToken(): string {\r\n    const token = process.env.WHITELABEL_TOKEN_MASTER;\r\n    if (!token) {\r\n      throw new ApiError('WHITELABEL_TOKEN_MASTER not configured', 'CONFIG_ERROR', 500);\r\n    }\r\n    return token;\r\n  }\r\n\r\n  async getTokenByDomain(hostname: string): Promise<WhitelabelTokenData> {\r\n    hostname = 'greatapps.com.br';\r\n\r\n    const apiUrl = this.getApiUrl();\r\n    const whitelabelMasterToken = this.getToken();\r\n\r\n    const url = `${apiUrl}/v1/pt-br/1/whitelabel/${hostname}/token`;\r\n\r\n    console.log('[WhitelabelService] Fetching token for domain', { url });\r\n\r\n    const cache = new greatCache({\r\n      service: 'whitelabel-service',\r\n      version: '1.0',\r\n      domain: 'whitelabel-cache.greatapps.com.br',\r\n      ambient: process.env.NODE_ENV || 'development',\r\n    });\r\n\r\n    const cachedData = await cache.select(`whitelabel-token-${hostname}`);\r\n\r\n    if (cachedData.status == 1 && 'data' in cachedData && cachedData.data) {\r\n      console.log('[WhitelabelService] Cache hit for domain', { hostname });\r\n\r\n      return JSON.parse(cachedData.data) as WhitelabelTokenData;\r\n    }\r\n\r\n    const response = await fetch(url, {\r\n      method: 'GET',\r\n      headers: {\r\n        authorization: whitelabelMasterToken,\r\n      },\r\n    });\r\n\r\n    if (!response.ok) {\r\n      console.error('[WhitelabelService] Failed to fetch whitelabel token', { response });\r\n      throw new ApiError(\r\n        `Failed to fetch whitelabel token: ${response.status}`,\r\n        'FETCH_ERROR',\r\n        response.status\r\n      );\r\n    }\r\n\r\n    const result: WhitelabelTokenApiResponse = await response.json();\r\n\r\n    if (result.status !== 1 || !result.data?.length) {\r\n      throw new ApiError('Whitelabel token not found', 'TOKEN_NOT_FOUND', 404);\r\n    }\r\n\r\n    await cache.insert(`whitelabel-token-${hostname}`, JSON.stringify(result.data[0]), 604800);\r\n\r\n    return result.data[0];\r\n  }\r\n}\r\n\r\nexport const whitelabelService = new WhitelabelService();\r\n"],"mappings":"AACA,OAAO,gBAAgB;AACvB,SAAS,gBAAgB;AAGzB,MAAM,kBAAkB;AAAA,EACd,YAAoB;AAC1B,UAAM,SAAS,QAAQ,IAAI;AAC3B,QAAI,CAAC,QAAQ;AACX,YAAM,IAAI,SAAS,mCAAmC,gBAAgB,GAAG;AAAA,IAC3E;AACA,WAAO;AAAA,EACT;AAAA,EAEQ,WAAmB;AACzB,UAAM,QAAQ,QAAQ,IAAI;AAC1B,QAAI,CAAC,OAAO;AACV,YAAM,IAAI,SAAS,0CAA0C,gBAAgB,GAAG;AAAA,IAClF;AACA,WAAO;AAAA,EACT;AAAA,EAEA,MAAM,iBAAiB,UAAgD;AACrE,eAAW;AAEX,UAAM,SAAS,KAAK,UAAU;AAC9B,UAAM,wBAAwB,KAAK,SAAS;AAE5C,UAAM,MAAM,GAAG,MAAM,0BAA0B,QAAQ;AAEvD,YAAQ,IAAI,iDAAiD,EAAE,IAAI,CAAC;AAEpE,UAAM,QAAQ,IAAI,WAAW;AAAA,MAC3B,SAAS;AAAA,MACT,SAAS;AAAA,MACT,QAAQ;AAAA,MACR,SAAS,QAAQ,IAAI,YAAY;AAAA,IACnC,CAAC;AAED,UAAM,aAAa,MAAM,MAAM,OAAO,oBAAoB,QAAQ,EAAE;AAEpE,QAAI,WAAW,UAAU,KAAK,UAAU,cAAc,WAAW,MAAM;AACrE,cAAQ,IAAI,4CAA4C,EAAE,SAAS,CAAC;AAEpE,aAAO,KAAK,MAAM,WAAW,IAAI;AAAA,IACnC;AAEA,UAAM,WAAW,MAAM,MAAM,KAAK;AAAA,MAChC,QAAQ;AAAA,MACR,SAAS;AAAA,QACP,eAAe;AAAA,MACjB;AAAA,IACF,CAAC;AAED,QAAI,CAAC,SAAS,IAAI;AAChB,cAAQ,MAAM,wDAAwD,EAAE,SAAS,CAAC;AAClF,YAAM,IAAI;AAAA,QACR,qCAAqC,SAAS,MAAM;AAAA,QACpD;AAAA,QACA,SAAS;AAAA,MACX;AAAA,IACF;AAEA,UAAM,SAAqC,MAAM,SAAS,KAAK;AAE/D,QAAI,OAAO,WAAW,KAAK,CAAC,OAAO,MAAM,QAAQ;AAC/C,YAAM,IAAI,SAAS,8BAA8B,mBAAmB,GAAG;AAAA,IACzE;AAEA,UAAM,MAAM,OAAO,oBAAoB,QAAQ,IAAI,KAAK,UAAU,OAAO,KAAK,CAAC,CAAC,GAAG,MAAM;AAEzF,WAAO,OAAO,KAAK,CAAC;AAAA,EACtB;AACF;AAEO,MAAM,oBAAoB,IAAI,kBAAkB;","names":[]}

package/dist/server.mjs

@@ -1,16 +1,27 @@
 import "server-only";
-import { apiClient, ApiClient } from "./infra/api/client";
+import { ApiClient, api, apiClient } from "./infra/api/client";
 import { authService } from "./modules/auth/services/auth.service";
 import { whitelabelService } from "./modules/whitelabel/services/whitelabel.service";
+import { subscriptionsService } from "./modules/subscriptions/services/subscriptions.service";
+import { iaCreditsService } from "./modules/ia-credits/services/ia-credits.service";
 import { findWhitelabel } from "./modules/whitelabel/actions/find-whitelabel.action";
 import { validateSessionAction } from "./modules/auth/actions/validate-session.action";
+import { listSubscriptionsAction } from "./modules/subscriptions/actions/list-subscriptions.action";
+import { listIaCreditsAction } from "./modules/ia-credits/actions/list-ia-credits.action";
 import { getClientInfoFromRequest } from "./infra/utils/client-info";
+import { getUserContext } from "./modules/auth/utils/get-user-context";
 export {
   ApiClient,
+  api,
   apiClient,
   authService,
   findWhitelabel,
   getClientInfoFromRequest,
+  getUserContext,
+  iaCreditsService,
+  listIaCreditsAction,
+  listSubscriptionsAction,
+  subscriptionsService,
   validateSessionAction,
   whitelabelService
 };

package/dist/server.mjs.map

@@ -1 +1 @@
-{"version":3,"sources":["../src/server.ts"],"sourcesContent":["import 'server-only';\r\n\r\n// API Client\r\nexport { apiClient, ApiClient } from './infra/api/client';\r\n\r\n// Services\r\nexport { authService } from './modules/auth/services/auth.service';\r\nexport { whitelabelService } from './modules/whitelabel/services/whitelabel.service';\r\n\r\n// Actions\r\nexport { findWhitelabel } from './modules/whitelabel/actions/find-whitelabel.action';\r\nexport { validateSessionAction } from './modules/auth/actions/validate-session.action';\r\n\r\n// Server Utils\r\nexport { getClientInfoFromRequest } from './infra/utils/client-info';\r\n"],"mappings":"AAAA,OAAO;AAGP,SAAS,WAAW,iBAAiB;AAGrC,SAAS,mBAAmB;AAC5B,SAAS,yBAAyB;AAGlC,SAAS,sBAAsB;AAC/B,SAAS,6BAA6B;AAGtC,SAAS,gCAAgC;","names":[]}
+{"version":3,"sources":["../src/server.ts"],"sourcesContent":["import 'server-only';\r\n\r\n// API Client\r\nexport { ApiClient, api, apiClient } from './infra/api/client';\r\n\r\n// Services\r\nexport { authService } from './modules/auth/services/auth.service';\r\nexport { whitelabelService } from './modules/whitelabel/services/whitelabel.service';\r\nexport { subscriptionsService } from './modules/subscriptions/services/subscriptions.service';\r\nexport { iaCreditsService } from './modules/ia-credits/services/ia-credits.service';\r\n\r\n// Actions\r\nexport { findWhitelabel } from './modules/whitelabel/actions/find-whitelabel.action';\r\nexport { validateSessionAction } from './modules/auth/actions/validate-session.action';\r\nexport { listSubscriptionsAction } from './modules/subscriptions/actions/list-subscriptions.action';\r\nexport { listIaCreditsAction } from './modules/ia-credits/actions/list-ia-credits.action';\r\n\r\n// Server Utils\r\nexport { getClientInfoFromRequest } from './infra/utils/client-info';\r\nexport { getUserContext } from './modules/auth/utils/get-user-context';\r\n"],"mappings":"AAAA,OAAO;AAGP,SAAS,WAAW,KAAK,iBAAiB;AAG1C,SAAS,mBAAmB;AAC5B,SAAS,yBAAyB;AAClC,SAAS,4BAA4B;AACrC,SAAS,wBAAwB;AAGjC,SAAS,sBAAsB;AAC/B,SAAS,6BAA6B;AACtC,SAAS,+BAA+B;AACxC,SAAS,2BAA2B;AAGpC,SAAS,gCAAgC;AACzC,SAAS,sBAAsB;","names":[]}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@greatapps/common",
-  "version": "1.1.6",
+  "version": "1.1.8",
   "description": "Shared library for GreatApps frontend applications",
   "main": "./dist/index.mjs",
   "types": "./src/index.ts",

package/src/components/layouts/ProfilePopover.tsx

@@ -1,16 +1,17 @@
-"use client"
+"use client";
 
-import { useState } from 'react';
-import { useRouter } from 'next/navigation';
-import * as PopoverPrimitive from '@radix-ui/react-popover';
-import { Popover } from '../ui/overlay/Popover';
-import { Button } from '../ui/buttons/Button';
-import { Progress } from '../ui/feedback/Progress';
-import { Separator } from '../ui/data-display/Separator';
-import { NavBarItem } from './NavBarItem';
-import { UserAvatar } from '../ui/data-display/UserAvatar';
-import { useAuth } from '../../providers/auth.provider';
-import { cn } from '../../infra/utils/clsx';
+import { useState } from "react";
+import { useRouter } from "next/navigation";
+import * as PopoverPrimitive from "@radix-ui/react-popover";
+import { Popover } from "../ui/overlay/Popover";
+import { Button } from "../ui/buttons/Button";
+import { Progress } from "../ui/feedback/Progress";
+import { Separator } from "../ui/data-display/Separator";
+import { NavBarItem } from "./NavBarItem";
+import { UserAvatar } from "../ui/data-display/UserAvatar";
+import { useAuth } from "../../providers/auth.provider";
+import { cn } from "../../infra/utils/clsx";
+import { useIaCredits } from "../../modules/ia-credits/hooks/ia-credits.hook";
 
 export interface ProfileMenuItem {
   icon?: React.ReactNode;
@@ -19,11 +20,10 @@ export interface ProfileMenuItem {
 }
 
 export interface ProfilePopoverProps {
-  side?: 'top' | 'bottom' | 'left' | 'right';
-  align?: 'start' | 'center' | 'end';
+  side?: "top" | "bottom" | "left" | "right";
+  align?: "start" | "center" | "end";
   contentClassName?: string;
   onEditProfile?: () => void;
-  credits?: { used: number; total: number };
   onCreditsClick?: () => void;
   menuItems?: ProfileMenuItem[];
   logoutRedirect?: string;
@@ -31,35 +31,41 @@ export interface ProfilePopoverProps {
 }
 
 function ProfilePopover({
-  side = 'top',
-  align = 'start',
-  contentClassName = 'absolute bottom-2 left-[26px]',
+  side = "top",
+  align = "start",
+  contentClassName = "absolute bottom-2 left-[26px]",
   onEditProfile,
-  credits,
   onCreditsClick,
   menuItems = [],
-  logoutRedirect = '/login',
+  logoutRedirect = "/login",
   logoutOverlay,
 }: ProfilePopoverProps) {
   const router = useRouter();
   const { user, logout } = useAuth();
   const [isLoggingOut, setIsLoggingOut] = useState(false);
 
+  const { summary, subscription, isSubscriptionLoading, isCreditsLoading } =
+    useIaCredits();
+
   const handleLogout = async () => {
     try {
       setIsLoggingOut(true);
       await logout();
       router.push(logoutRedirect);
     } catch (error) {
-      console.error('Erro ao fazer logout:', error);
+      console.error("Erro ao fazer logout:", error);
     } finally {
       setIsLoggingOut(false);
     }
   };
 
+  const hasSubscription = !isSubscriptionLoading && subscription !== null;
+  const showCreditsSkeleton = hasSubscription && isCreditsLoading;
+  const showCredits =
+    hasSubscription && !isCreditsLoading && summary.totalCredits > 0;
   const creditsPercentage =
-    credits && credits.total > 0
-      ? (credits.used / credits.total) * 100
+    showCredits && summary.totalCredits > 0
+      ? (summary.usedCredits / summary.totalCredits) * 100
       : 0;
 
   return (
@@ -78,89 +84,101 @@ function ProfilePopover({
         </PopoverPrimitive.Trigger>
 
         <PopoverPrimitive.Portal>
-        <PopoverPrimitive.Content
-          className={cn(
-            'w-64.75 p-0 bg-white rounded-2xl shadow-md border border-gray-200 z-99',
-            contentClassName
-          )}
-          side={side}
-          align={align}
-          sideOffset={8}
-        >
-          <div className="grid grid-cols-[32px_1fr_auto] items-center gap-3 p-3 w-full">
-            {user && (
-              <UserAvatar
-                key={user.id}
-                photo={user.photo}
-                name={user.name}
-                size={32}
-              />
+          <PopoverPrimitive.Content
+            className={cn(
+              "w-64.75 p-0 bg-white rounded-2xl shadow-md border border-gray-200 z-99",
+              contentClassName,
             )}
+            side={side}
+            align={align}
+            sideOffset={8}
+          >
+            <div className="grid grid-cols-[32px_1fr_auto] items-center gap-3 p-3 w-full">
+              {user && (
+                <UserAvatar
+                  key={user.id}
+                  photo={user.photo}
+                  name={user.name}
+                  size={32}
+                />
+              )}
 
-            <div className="flex flex-col gap-0.5 min-w-0">
-              <span className="paragraph-small-semibold text-gray-950 truncate">
-                {user?.name || ''}
-              </span>
-              <span className="paragraph-xsmall-medium text-gray-500 truncate">
-                {user?.email || ''}
-              </span>
-            </div>
+              <div className="flex flex-col gap-0.5 min-w-0">
+                <span className="paragraph-small-semibold text-gray-950 truncate">
+                  {user?.name || ""}
+                </span>
+                <span className="paragraph-xsmall-medium text-gray-500 truncate">
+                  {user?.email || ""}
+                </span>
+              </div>
 
-            {onEditProfile && (
-              <Button
-                variant="secondary"
-                className="paragraph-small-semibold h-8! whitespace-nowrap px-3 w-fit"
-                onClick={onEditProfile}
-              >
-                Editar Perfil
-              </Button>
-            )}
-          </div>
+              {onEditProfile && (
+                <Button
+                  variant="secondary"
+                  className="paragraph-small-semibold h-8! whitespace-nowrap px-3 w-fit"
+                  onClick={onEditProfile}
+                >
+                  Editar Perfil
+                </Button>
+              )}
+            </div>
 
-          <div className="flex flex-col gap-2 border-t border-gray-200 rounded-2xl p-1.5">
-            {credits && (
-              <div
-                className={cn(
-                  'flex flex-col bg-gray-950 rounded-lg gap-4 w-full p-4 transition-colors',
-                  onCreditsClick && 'cursor-pointer hover:bg-gray-900'
-                )}
-                onClick={onCreditsClick}
-              >
-                <div className="flex items-center justify-between gap-2">
-                  <span className="paragraph-xsmall-semibold text-white truncate">
-                    Créditos usados
-                  </span>
-                  <span className="paragraph-xsmall-medium text-white/50">
-                    {credits.used.toLocaleString('pt-BR')}/
-                    {credits.total.toLocaleString('pt-BR')}
-                  </span>
+            <div className="flex flex-col gap-2 border-t border-gray-200 rounded-2xl p-1.5">
+              {showCreditsSkeleton && (
+                <div className="flex flex-col bg-gray-950 rounded-lg gap-4 w-full p-4">
+                  <div className="flex items-center justify-between gap-2">
+                    <span className="paragraph-xsmall-semibold text-white truncate">
+                      Créditos usados
+                    </span>
+                    <div className="h-3.5 w-16 rounded bg-white/20 animate-pulse" />
+                  </div>
+                  <div className="h-1.5 w-full rounded-full bg-white/20 animate-pulse" />
                 </div>
-                <Progress
-                  className="bg-white/10"
-                  indicatorColor="bg-white"
-                  value={creditsPercentage}
-                />
-              </div>
-            )}
+              )}
 
-            <div className="flex flex-col gap-2">
-              {menuItems.length > 0 && (
-                <div className="flex flex-col">
-                  {menuItems.map((item, index) => (
-                    <NavBarItem
-                      key={index}
-                      icon={item.icon}
-                      label={item.label}
-                      onClick={item.onClick}
-                    />
-                  ))}
+              {showCredits && (
+                <div
+                  className={cn(
+                    "flex flex-col bg-gray-950 rounded-lg gap-4 w-full p-4 transition-colors",
+                    onCreditsClick && "cursor-pointer hover:bg-gray-900",
+                  )}
+                  onClick={onCreditsClick}
+                >
+                  <div className="flex items-center justify-between gap-2">
+                    <span className="paragraph-xsmall-semibold text-white truncate">
+                      Créditos usados
+                    </span>
+                    <span className="paragraph-xsmall-medium text-white/50">
+                      {summary.usedCredits.toLocaleString("pt-BR")}/
+                      {summary.totalCredits.toLocaleString("pt-BR")}
+                    </span>
+                  </div>
+                  <Progress
+                    className="bg-white/10"
+                    indicatorColor="bg-white"
+                    value={creditsPercentage}
+                  />
                 </div>
               )}
-              <Separator />
-              <NavBarItem label="Sair" onClick={handleLogout} />
+
+              <div className="flex flex-col gap-2">
+                {menuItems.length > 0 && (
+                  <div className="flex flex-col">
+                    {menuItems.map((item, index) => (
+                      <NavBarItem
+                        key={index}
+                        icon={item.icon}
+                        label={item.label}
+                        onClick={item.onClick}
+                      />
+                    ))}
+                  </div>
+                )}
+                <Separator />
+                <NavBarItem label="Sair" onClick={handleLogout} />
+              </div>
             </div>
-          </div>
-        </PopoverPrimitive.Content>
+          </PopoverPrimitive.Content>
         </PopoverPrimitive.Portal>
       </Popover>
     </>

package/src/index.ts

@@ -11,6 +11,10 @@ export * from './providers/whitelabel.provider';
 
 // Hooks
 export { useUserQuery, useUserValidateSession, useInvalidateUser, useSetUserData, USER_QUERY_KEY } from './modules/auth/hooks/useUserQuery';
+export { useActiveSubscription } from './modules/subscriptions/hooks/list-subscriptions.hook';
+export { useIaCredits } from './modules/ia-credits/hooks/ia-credits.hook';
+export type { IaCreditsSummary, IaCreditOperation } from './modules/ia-credits/types';
+export type { Subscription, FindSubscriptionsParams } from './modules/subscriptions/types';
 
 // Providers
 export { QueryProvider } from './providers/query.provider';

package/src/infra/api/client.ts

@@ -1,19 +1,23 @@
 import { ApiError } from './types';
 import { findWhitelabel } from '../../modules/whitelabel/actions/find-whitelabel.action';
 
-const API_BASE_URL = process.env.R3_API_URL || 'https://r3-api.greatapps.dev.br';
-const API_VERSION = 'v1';
-const API_LOCALE = 'pt-br';
-
 interface RequestConfig extends RequestInit {
   timeout?: number;
 }
 
 class ApiClient {
+  private readonly baseUrl: string;
+  private readonly apiVersion = 'v1';
+  private readonly apiLocale = 'pt-br';
+
+  constructor(baseUrl: string) {
+    this.baseUrl = baseUrl;
+  }
+
   private async buildUrl(endpoint: string, whiteLabelId: number): Promise<string> {
-    const url = `${API_BASE_URL}/${API_VERSION}/${API_LOCALE}/${whiteLabelId}${endpoint}`;
+    const url = `${this.baseUrl}/${this.apiVersion}/${this.apiLocale}/${whiteLabelId}${endpoint}`;
     console.log('[ApiClient] buildUrl', {
-      baseURL: API_BASE_URL,
+      baseURL: this.baseUrl,
       whiteLabelId,
       endpoint,
       fullUrl: url,
@@ -135,5 +139,12 @@ class ApiClient {
   }
 }
 
-export { ApiClient };
-export const apiClient = new ApiClient();
+const api = {
+  apps: new ApiClient(process.env.GAPPS_R3_API_URL || 'https://r3-api.greatapps.dev.br'),
+  pages: new ApiClient(process.env.GPAGES_R3_API_URL || 'https://r3-api.greatpages.dev.br'),
+}
+
+/** @deprecated use api.apps */
+export const apiClient = api.apps;
+
+export { api, ApiClient };

package/src/modules/auth/utils/get-user-context.ts

@@ -0,0 +1,29 @@
+import 'server-only';
+
+import { cookies } from 'next/headers';
+import { ApiError, JWTPayload } from '../../../infra/api/types';
+
+const AUTH_COOKIE_NAME = 'greatapps';
+
+export async function getUserContext(): Promise<{
+  id_account: number;
+  id_user: number;
+}> {
+  const cookieStore = await cookies();
+  const token = cookieStore.get(AUTH_COOKIE_NAME)?.value;
+
+  if (!token) {
+    throw new ApiError('Usuário não autenticado', 'NOT_AUTHENTICATED', 401);
+  }
+
+  try {
+    const payload = JSON.parse(atob(token.split('.')[1])) as JWTPayload;
+
+    return {
+      id_account: payload.id_account,
+      id_user: payload.id_user,
+    };
+  } catch {
+    throw new ApiError('Token inválido', 'INVALID_TOKEN', 401);
+  }
+}

package/src/modules/ia-credits/actions/list-ia-credits.action.ts

@@ -0,0 +1,11 @@
+'use server';
+
+import { PaginatedSuccessResult } from '../../../infra/api/types';
+import type { IaCreditOperation } from '../types';
+import { iaCreditsService } from '../services/ia-credits.service';
+
+export async function listIaCreditsAction(
+  subscriptionId: number | string
+): Promise<PaginatedSuccessResult<IaCreditOperation>> {
+  return iaCreditsService.listOperations(subscriptionId);
+}

package/src/modules/ia-credits/hooks/ia-credits.hook.ts

@@ -0,0 +1,96 @@
+'use client';
+
+import { useMemo } from 'react';
+import { useQuery } from '@tanstack/react-query';
+import { useActiveSubscription } from '../../subscriptions/hooks/list-subscriptions.hook';
+import { listIaCreditsAction } from '../actions/list-ia-credits.action';
+import type { IaCreditOperation, IaCreditsSummary } from '../types';
+
+function calculateSummary(operations: IaCreditOperation[]): IaCreditsSummary {
+  const today = new Date();
+  const todayDate = new Date(today.getFullYear(), today.getMonth(), today.getDate());
+
+  const adds = operations.filter((op) => op.operation === 'add');
+  const subtracts = operations.filter((op) => op.operation === 'subtract');
+
+  let totalCredits = 0;
+  let usedCredits = 0;
+  let nextExpirationInDays: number | null = null;
+  let nextExpiringCredits: number | null = null;
+
+  for (const add of adds) {
+    const expirationRaw = add.expiration_time;
+    if (!expirationRaw) continue;
+
+    const expiration = new Date(expirationRaw);
+    const expirationDate = new Date(
+      expiration.getFullYear(),
+      expiration.getMonth(),
+      expiration.getDate()
+    );
+
+    const expiredByDate = expirationDate.getTime() < todayDate.getTime();
+    const hasExpired = add.has_expired || expiredByDate;
+
+    if (hasExpired) continue;
+
+    const addedCredits = add.operation_value;
+
+    const consumedForAdd = subtracts
+      .filter((sub) => String(sub.consumed_from_add_id) === String(add.id))
+      .reduce((sum, sub) => sum + sub.operation_value, 0);
+
+    const remainingForAdd = Math.max(0, addedCredits - consumedForAdd);
+
+    totalCredits += addedCredits;
+    usedCredits += consumedForAdd;
+
+    const diffMs = expirationDate.getTime() - todayDate.getTime();
+    const days = Math.max(0, Math.ceil(diffMs / (1000 * 60 * 60 * 24)));
+
+    if (remainingForAdd > 0) {
+      if (nextExpirationInDays === null || days < nextExpirationInDays) {
+        nextExpirationInDays = days;
+        nextExpiringCredits = remainingForAdd;
+      }
+    }
+  }
+
+  const availableCredits = Math.max(0, totalCredits - usedCredits);
+
+  return {
+    totalCredits,
+    usedCredits,
+    availableCredits,
+    nextExpiringCredits,
+    nextExpirationInDays,
+  };
+}
+
+export function useIaCredits() {
+  const { data: subscriptionData, isPending: isSubscriptionLoading } = useActiveSubscription();
+  const subscription = subscriptionData?.data?.[0] ?? null;
+  const subscriptionId = subscription?.id;
+
+  const query = useQuery({
+    queryKey: ['ia-credits', subscriptionId],
+    queryFn: () => listIaCreditsAction(subscriptionId!),
+    enabled: subscriptionId != null,
+  });
+
+  const operations = query.data?.data ?? [];
+
+  // eslint-disable-next-line react-hooks/exhaustive-deps
+  const summary = useMemo(() => calculateSummary(operations), [operations]);
+
+  return {
+    subscription,
+    operations,
+    summary,
+    isLoading: isSubscriptionLoading || query.isPending,
+    isSubscriptionLoading,
+    isCreditsLoading: query.isPending,
+    isError: query.isError,
+    error: query.error,
+  };
+}

package/src/modules/ia-credits/services/ia-credits.service.ts

@@ -0,0 +1,37 @@
+import 'server-only';
+
+import { api } from '../../../infra/api/client';
+import { ApiError, ApiPaginatedActionResult, PaginatedSuccessResult } from '../../../infra/api/types';
+import { getUserContext } from '../../auth/utils/get-user-context';
+import { IaCreditOperation, IaCreditOperationSchema } from '../types';
+
+class IaCreditsService {
+  async listOperations(
+    subscriptionId: number | string
+  ): Promise<PaginatedSuccessResult<IaCreditOperation>> {
+    const { id_account } = await getUserContext();
+
+    const endpoint = `/accounts/${id_account}/subscriptions/${subscriptionId}/items/balance/list?page=1&limit=20&sort=id:DESC`;
+
+    const response = await api.apps.get<ApiPaginatedActionResult<IaCreditOperation>>(endpoint);
+
+    if (response.status === 0) {
+      throw new ApiError(
+        response.message || 'Erro ao listar créditos de IA',
+        'LIST_IA_CREDITS_FAILED',
+        400
+      );
+    }
+
+    const raw = response.data ?? [];
+    const data = raw.map((item) => IaCreditOperationSchema.parse(item));
+
+    return {
+      data,
+      total: response.total ?? data.length,
+      success: true,
+    };
+  }
+}
+
+export const iaCreditsService = new IaCreditsService();

package/src/modules/ia-credits/types.ts

@@ -0,0 +1,33 @@
+import z from 'zod';
+
+export const IaCreditOperationSchema = z
+  .object({
+    id: z.union([z.number(), z.string()]),
+    deleted: z.number(),
+    datetime_add: z.string(),
+    id_wl: z.number(),
+    id_subscription: z.union([z.number(), z.string()]),
+    id_addon: z.number(),
+    operation: z.string(), // 'add' | 'subtract'
+    operation_value: z.union([z.number(), z.string()]).transform((v) => Number(v)),
+    balance_after_operation: z.union([z.number(), z.string()]).optional(),
+    balance_before_operation: z.union([z.number(), z.string()]).optional(),
+    operation_ref: z.string().nullable().optional(),
+    operation_origin: z.string().nullable().optional(),
+    expiration_time: z.string().nullable(),
+    has_expired: z.boolean(),
+    consumed_from_add_id: z.union([z.number(), z.string()]).nullable(),
+    id_user_add: z.union([z.number(), z.string()]).nullable(),
+    user_name: z.string().nullable().optional(),
+  })
+  .passthrough();
+
+export type IaCreditOperation = z.infer<typeof IaCreditOperationSchema>;
+
+export type IaCreditsSummary = {
+  totalCredits: number;
+  usedCredits: number;
+  availableCredits: number;
+  nextExpiringCredits: number | null;
+  nextExpirationInDays: number | null;
+};

package/src/modules/subscriptions/actions/list-subscriptions.action.ts

@@ -0,0 +1,11 @@
+'use server';
+
+import { PaginatedSuccessResult } from '../../../infra/api/types';
+import type { Subscription, FindSubscriptionsParams } from '../types';
+import { subscriptionsService } from '../services/subscriptions.service';
+
+export async function listSubscriptionsAction(
+  params?: Partial<FindSubscriptionsParams>
+): Promise<PaginatedSuccessResult<Subscription>> {
+  return subscriptionsService.listSubscriptions(params);
+}

package/src/modules/subscriptions/hooks/list-subscriptions.hook.ts

@@ -0,0 +1,14 @@
+'use client';
+
+import { useQuery } from '@tanstack/react-query';
+import { listSubscriptionsAction } from '../actions/list-subscriptions.action';
+import type { FindSubscriptionsParams } from '../types';
+
+const SUBSCRIPTIONS_QUERY_KEY = ['subscriptions'];
+
+export function useActiveSubscription() {
+  return useQuery({
+    queryKey: [...SUBSCRIPTIONS_QUERY_KEY, 'active'],
+    queryFn: () => listSubscriptionsAction({ active: true } as Partial<FindSubscriptionsParams>),
+  });
+}