@greatapps/common 1.1.674 → 1.1.675

package/src/components/navigation/UpcomingInvoiceBanner.tsx

@@ -3,7 +3,6 @@
 import { useState, useEffect, useCallback } from 'react';
 import { IconAlertTriangle, IconX } from '@tabler/icons-react';
 import { formatShortDate } from '../../infra/utils/date';
-import { useTranslations } from 'next-intl';
 
 interface UpcomingInvoiceBannerProps {
   dueDate?: Date | null;
@@ -11,7 +10,6 @@ interface UpcomingInvoiceBannerProps {
 }
 
 export function UpcomingInvoiceBanner({ dueDate, onDetails }: UpcomingInvoiceBannerProps) {
-  const translate = useTranslations();
   const [visible, setVisible] = useState(true);
   const [animated, setAnimated] = useState(false);
 
@@ -34,7 +32,7 @@ export function UpcomingInvoiceBanner({ dueDate, onDetails }: UpcomingInvoiceBan
         <div className="flex items-center gap-2 flex-1 w-full sm:w-auto">
           <IconAlertTriangle size={16} className="text-zinc-950 shrink-0" />
           <span className="paragraph-xsmall-semibold text-zinc-950">
-            {translate('common.navigation.banners.upcoming.message', { dueDate: formattedDueDate ?? '' })}
+            Fatura em aberto. Pague até {formattedDueDate} para evitar a suspensão das suas páginas.
           </span>
         </div>
         <div className="flex items-center gap-1.5 w-full sm:w-auto justify-between sm:justify-start">
@@ -43,7 +41,7 @@ export function UpcomingInvoiceBanner({ dueDate, onDetails }: UpcomingInvoiceBan
             className="flex items-center justify-center p-1.5 cursor-pointer"
             onClick={onDetails}
           >
-            <span className="paragraph-xsmall-semibold text-zinc-950 underline">{translate('common.navigation.banners.upcoming.details')}</span>
+            <span className="paragraph-xsmall-semibold text-zinc-950 underline">Detalhes</span>
           </button>
           <button type="button" className="cursor-pointer shrink-0" onClick={dismiss}>
             <IconX size={18} className="text-zinc-700" />

package/src/components/navigation/subcomponents/BottomLinks.tsx

@@ -2,7 +2,6 @@
 
 import { IconHelp, IconBulb, IconStar, type TablerIcon } from '@tabler/icons-react';
 import { useIsDefaultWhitelabel, useWhitelabel } from '../../../providers/whitelabel.provider';
-import { useTranslations } from 'next-intl';
 
 interface BottomLink {
   label: string;
@@ -18,7 +17,6 @@ function openFrillWidget() {
 }
 
 export function BottomLinks() {
-  const translate = useTranslations();
   const { whitelabel } = useWhitelabel();
   const isMainWhitelabel = useIsDefaultWhitelabel();
 
@@ -28,7 +26,7 @@ export function BottomLinks() {
     ...(isMainWhitelabel
       ? [
           {
-            label: translate('common.navigation.bottomLinks.news'),
+            label: 'Novidades',
             icon: IconStar,
             className: 'novidades',
             onClick: openFrillWidget,
@@ -36,14 +34,14 @@ export function BottomLinks() {
         ]
       : []),
     {
-      label: translate('common.navigation.bottomLinks.helpCenter'),
+      label: 'Central de ajuda',
       icon: IconHelp,
       href: helpUrl,
     },
     ...(isMainWhitelabel
       ? [
           {
-            label: translate('common.navigation.bottomLinks.sendSuggestions'),
+            label: 'Enviar sugestões',
             icon: IconBulb,
             href: 'https://ideias.greatpages.com.br/b/y0geg1ve/feature-ideas',
           },

package/src/components/navigation/subcomponents/CreditsCard.tsx

@@ -2,7 +2,6 @@
 
 import { useAppNavigationContext } from '../AppNavigationContext';
 import { Progress } from '../../../index';
-import { useTranslations } from 'next-intl';
 import { useBuyCreditsModal } from '../../../store/useBuyCreditsModal';
 import { useCreditsDisabledModal } from '../../../store/useCreditsDisabledModal';
 import { useAuth } from '../../../providers/auth.provider';
@@ -14,7 +13,6 @@ export interface CreditsCardProps {
 }
 
 export function CreditsCard({ used, total, onClick }: CreditsCardProps) {
-  const translate = useTranslations();
   const { breakpoint } = useAppNavigationContext();
   const { openModal } = useBuyCreditsModal();
   const { openModal: openDisabledModal } = useCreditsDisabledModal();
@@ -37,7 +35,7 @@ export function CreditsCard({ used, total, onClick }: CreditsCardProps) {
       onClick={handleClick}
     >
       <div className="flex items-center justify-between">
-        <span className="paragraph-xsmall-semibold text-white">{translate('common.navigation.creditsCard.label')}</span>
+        <span className="paragraph-xsmall-semibold text-white">Créditos usados</span>
         <span className="paragraph-xsmall-medium text-white/50">{used} / {total}</span>
       </div>
       <Progress className="bg-white/10 h-[6px]" indicatorColor="bg-white" value={Math.round((used / total) * 100)} />

package/src/components/navigation/subcomponents/PlanCard.tsx

@@ -1,7 +1,6 @@
 'use client';
 
 import { Button, Progress } from '../../../index';
-import { useTranslations } from 'next-intl';
 
 export interface PlanCardProps {
   planName: string;
@@ -11,7 +10,6 @@ export interface PlanCardProps {
 }
 
 export function PlanCard({ planName, trialLabel, progressValue, onKnowPlans }: PlanCardProps) {
-  const translate = useTranslations();
   return (
     <div className="flex flex-col rounded-md p-4 gap-4 bg-gray-50">
       <div className="flex flex-col gap-1">
@@ -24,7 +22,7 @@ export function PlanCard({ planName, trialLabel, progressValue, onKnowPlans }: P
         className="paragraph-small-semibold text-gray-950"
         onClick={onKnowPlans}
       >
-        {translate('common.navigation.planCard.knowPlans')}
+        Conheça os planos
       </Button>
     </div>
   );

package/src/components/navigation/subcomponents/ProjectSelector.tsx

@@ -1,7 +1,6 @@
 'use client';
 
 import { useState, useRef, useEffect, useMemo, RefObject } from 'react';
-import { useTranslations } from 'next-intl';
 import { useMobileNavbarSheet } from '../../../store/useMobileNavbarSheet';
 import { useAppNavigationContext } from '../AppNavigationContext';
 import { ProjectSelectorPopover } from '../ProjectSelectorPopover';
@@ -31,7 +30,6 @@ export function ProjectSelector({
   onSelectProject,
   onManageProjects,
 }: ProjectSelectorProps) {
-  const translate = useTranslations();
   const isMainWhitelabel = useIsDefaultWhitelabel();
   const { breakpoint } = useAppNavigationContext();
   const [isPopoverOpen, setIsPopoverOpen] = useState(false);
@@ -126,10 +124,10 @@ export function ProjectSelector({
       {activeSection === 'projects' && (
         <div className="flex flex-col p-3 gap-2 border border-gray-200 rounded-lg animate-in fade-in duration-400">
           <div className="flex items-center justify-between">
-            <span className="paragraph-small-semibold">{translate('common.navigation.projectSelector.title')}</span>
+            <span className="paragraph-small-semibold">Projetos</span>
           </div>
           <Command className="gap-2" shouldFilter={false}>
-            <CommandInput placeholder={translate('common.navigation.projectSelector.searchPlaceholder')} value={search} onValueChange={setSearch} />
+            <CommandInput placeholder="Busque aqui" value={search} onValueChange={setSearch} />
             <CommandList
               className="custom-scrollbar paragraph-small-medium text-gray-600 h-[227px]"
               onScroll={(event) => {
@@ -143,7 +141,7 @@ export function ProjectSelector({
                 }
               }}
             >
-              <CommandEmpty>{translate('common.navigation.projectSelector.noResults')}</CommandEmpty>
+              <CommandEmpty>Nenhum resultado encontrado.</CommandEmpty>
               {showListSkeleton ? (
                 <>
                   <ProjectItemSkeleton />

package/src/components/pages/NotFoundPage.tsx

@@ -2,7 +2,6 @@
 
 import Image from "next/image";
 import { useEffect } from "react";
-import { useTranslations } from "next-intl";
 import { useRouter } from "next/navigation";
 import { useWhitelabel, useIsDefaultWhitelabel } from "../../providers/whitelabel.provider";
 import { Button } from "../ui/buttons/Button";
@@ -19,7 +18,6 @@ function GreatAppsLogo() {
 }
 
 export function NotFoundPage() {
-  const translate = useTranslations();
   const router = useRouter();
 
   useEffect(() => {
@@ -49,11 +47,11 @@ export function NotFoundPage() {
         </div>
 
         <h1 className="max-w-[554px] px-6 font-[family-name:var(--font-outfit)] text-[32px] leading-[36px] font-semibold text-zinc-950 sm:px-0 sm:text-[56px] sm:leading-[56px]">
-          {translate('common.notFound.title')}
+          Página não foi encontrada!
         </h1>
 
         <p className="max-w-[496px] px-6 paragraph-medium-medium text-zinc-950 sm:px-0">
-          {translate('common.notFound.description')}
+          A página que você está procurando não existe. Verifique se digitou corretamente o link que está procurando.
         </p>
 
         <Button
@@ -67,7 +65,7 @@ export function NotFoundPage() {
             }
           }}
         >
-          {translate('common.notFound.backToHome')}
+          Voltar para o início
         </Button>
       </div>
     </div>

package/src/components/pages/notifications/Notifications.tsx

@@ -1,7 +1,6 @@
 'use client';
 
 import { IconBell, IconCheck, IconLoader2 } from '@tabler/icons-react';
-import { useTranslations } from 'next-intl';
 import { Button } from "../../ui/buttons/Button";
 import {
   Tabs,
@@ -35,7 +34,6 @@ function NotificationsList({
   hasNextPage: boolean;
   fetchNextPage: () => void;
 }) {
-  const translate = useTranslations();
   const notifications = pages?.pages.flatMap((p) => p.data) ?? [];
 
   const handleScroll = (e: React.UIEvent<HTMLDivElement>) => {
@@ -52,7 +50,7 @@ function NotificationsList({
     return (
       <div className="rounded-lg border border-zinc-200 bg-white">
         <div className="flex flex-col items-center justify-center py-16 gap-2">
-          <span className="paragraph-medium-regular text-zinc-500">{translate('common.notifications.page.empty')}</span>
+          <span className="paragraph-medium-regular text-zinc-500">Nenhuma notificação encontrada.</span>
         </div>
       </div>
     );
@@ -82,7 +80,7 @@ function NotificationsList({
             actions={
               detailsUrl ? (
                 <Button asChild variant="secondary" className="h-8! px-3! paragraph-small-semibold">
-                  <Link href={detailsUrl}>{translate('common.notifications.page.details')}</Link>
+                  <Link href={detailsUrl}>Detalhes</Link>
                 </Button>
               ) : undefined
             }
@@ -99,7 +97,6 @@ function NotificationsList({
 }
 
 export function NotificationPageContent() {
-  const translate = useTranslations();
   const unreadNotifications = useInfiniteMessages({
     readed: false,
     type: "notification",
@@ -119,12 +116,12 @@ export function NotificationPageContent() {
     markAllAsRead(undefined, {
       onSuccess: () => {
         toast.custom((t) => (
-          <Toast variant="success" message={translate('common.notifications.page.markAllSuccess')} toastId={t} />
+          <Toast variant="success" message="Todas as notificações foram marcadas como lidas" toastId={t} />
         ));
       },
       onError: () => {
         toast.custom((t) => (
-          <Toast variant="error" message={translate('common.notifications.page.markAllError')} toastId={t} />
+          <Toast variant="error" message="Erro ao marcar notificações como lidas" toastId={t} />
         ));
       },
     });
@@ -135,10 +132,10 @@ export function NotificationPageContent() {
       <div className="flex items-center justify-between gap-4">
         <div className="flex flex-col gap-2">
           <h1 className="title-large-semibold text-gray-950">
-            {translate('common.notifications.page.title')}
+            Notificações
           </h1>
           <p className="paragraph-small-regular text-gray-600 hidden lg:block">
-            {translate('common.notifications.page.subtitle')}
+            Tenha controle total sobre páginas, experiências e conversões.
           </p>
         </div>
         <Button
@@ -148,8 +145,8 @@ export function NotificationPageContent() {
           disabled={isMarkingAll || totalUnread === 0}
         >
           {isMarkingAll ? <IconLoader2 size={20} className="animate-spin" /> : <IconCheck size={20} />}
-          <span className="lg:block hidden">{translate('common.notifications.page.markAllReadDesktop')}</span>
-          <span className="lg:hidden">{translate('common.notifications.page.markAllReadMobile')}</span>
+          <span className="lg:block hidden">Marcar todos como lidos</span>
+          <span className="lg:hidden">Marcar como lidos</span>
         </Button>
       </div>
       <Tabs
@@ -158,11 +155,11 @@ export function NotificationPageContent() {
       >
         <TabsList className="h-auto pb-0 bg-transparent">
           <TabsTrigger className="gap-2" value="all">
-            {translate('common.notifications.page.tabAll')}{" "}
+            Todas as notificações{" "}
             <span className="text-gray-500">({totalAll})</span>
           </TabsTrigger>
           <TabsTrigger className="gap-2" value="unreads" disabled={totalUnread === 0}>
-            {translate('common.notifications.page.tabUnread')}{" "}
+            Não lidas{" "}
             <span className="text-gray-500">({totalUnread})</span>
           </TabsTrigger>
         </TabsList>

package/src/components/ui/buttons/CopyButton.tsx

@@ -1,6 +1,5 @@
 'use client';
 
-import { useTranslations } from 'next-intl';
 import { IconCheck, IconCopy } from '@tabler/icons-react';
 import { toast } from "sonner";
 import { Toast } from "../feedback/Toast";
@@ -20,22 +19,18 @@ export function CopyButton({
   textToCopy,
   size = 14,
   className,
-  tooltipText,
-  successMessage,
+  tooltipText = "Copiar link",
+  successMessage = "Link copiado",
 }: CopyButtonProps) {
-  const translate = useTranslations();
-  const resolvedTooltipText = tooltipText ?? translate('common.forms.copyButton.tooltipDefault');
-  const resolvedSuccessMessage = successMessage ?? translate('common.forms.copyButton.successDefault');
-
   const { isCopied, copy } = useCopyToClipboard({
     onSuccess: () => {
       toast.custom((t) => (
-        <Toast variant="success" message={resolvedSuccessMessage} toastId={t} />
+        <Toast variant="success" message={successMessage} toastId={t} />
       ));
     },
     onError: () => {
       toast.custom((t) => (
-        <Toast variant="error" message={translate('common.forms.copyButton.errorMessage')} toastId={t} />
+        <Toast variant="error" message="Não foi possível copiar o link" toastId={t} />
       ));
     },
   });
@@ -53,7 +48,7 @@ export function CopyButton({
           {isCopied ? <IconCheck size={size} /> : <IconCopy size={size} />}
         </span>
       </TooltipTrigger>
-      <TooltipContent>{isCopied ? translate('common.actions.copied') : resolvedTooltipText}</TooltipContent>
+      <TooltipContent>{isCopied ? "Copiado!" : tooltipText}</TooltipContent>
     </Tooltip>
   );
 }

package/src/components/ui/data-display/CardItem.tsx

@@ -10,7 +10,6 @@ import { CardBrandIcon } from './CardBrandIcons';
 import { useSetDefaultCard } from '../../../modules/cards/hooks/set-default-card.hook';
 import { useHandleDeleteCard } from '../../../modules/cards/hooks/handle-delete-card.hook';
 import type { Card } from '../../../modules/cards/types';
-import { useTranslations } from 'next-intl';
 
 type CardItemProps = {
   card: Card;
@@ -33,7 +32,6 @@ export function CardItem({
   onAfterDelete,
   onAfterSetDefault,
 }: CardItemProps) {
-  const translate = useTranslations();
   const [popoverOpen, setPopoverOpen] = useState(false);
 
   const setDefaultCardMutation = useSetDefaultCard();
@@ -46,7 +44,7 @@ export function CardItem({
         toast.custom((t) => (
           <Toast
             variant="success"
-            message={translate('common.cards.item.setDefaultSuccess')}
+            message="Cartão definido como padrão"
             toastId={t}
           />
         ));
@@ -56,7 +54,7 @@ export function CardItem({
         toast.custom((t) => (
           <Toast
             variant="error"
-            message={translate('common.cards.item.setDefaultError')}
+            message="Erro ao definir cartão padrão"
             toastId={t}
           />
         ));
@@ -88,7 +86,7 @@ export function CardItem({
       </div>
       {card.is_default && (
         <span className="paragraph-xsmall-semibold text-zinc-600 bg-zinc-100 px-2 py-0.5 rounded-lg whitespace-nowrap">
-          {translate('common.cards.item.defaultBadge')}
+          Padrão
         </span>
       )}
       <CardBrandIcon brand={card.brand} />
@@ -110,7 +108,7 @@ export function CardItem({
             {menuHasSetDefault && (
               <NavBarItem
                 icon={<IconStar size={18} className="text-zinc-400" />}
-                label={translate('common.cards.item.makeDefault')}
+                label="Tornar padrão"
                 onClick={() => {
                   setPopoverOpen(false);
                   handleSetDefault();
@@ -120,7 +118,7 @@ export function CardItem({
             {menuHasDelete && (
               <NavBarItem
                 icon={<IconTrash size={18} className="text-zinc-400" />}
-                label={translate('common.actions.delete')}
+                label="Excluir"
                 onClick={() => {
                   setPopoverOpen(false);
                   handleDeleteCard(card);

package/src/components/ui/data-display/PaymentInfoCard.tsx

@@ -9,7 +9,6 @@ import { useCards } from '../../../modules/cards/hooks/cards.hook';
 import { useModalManager } from '../../../store/useModalManager';
 import { useIsDefaultWhitelabel } from '../../../providers/whitelabel.provider';
 import type { Card } from '../../../modules/cards/types';
-import { useTranslations } from 'next-intl';
 
 type PaymentInfoCardProps = {
   email?: string;
@@ -30,7 +29,6 @@ export function PaymentInfoCard({
   hideDelete,
   hideSetDefault,
 }: PaymentInfoCardProps) {
-  const translate = useTranslations();
   const isMobile = useIsMobile();
   const { openModal } = useModalManager();
   const isDefaultWl = useIsDefaultWhitelabel();
@@ -85,19 +83,19 @@ export function PaymentInfoCard({
       <div className="border border-zinc-200 rounded-lg overflow-hidden">
         {email && (
           <div className="flex items-center h-[60px] px-4 border-b border-zinc-200 gap-3">
-            <span className="paragraph-small-medium text-zinc-500 w-[100px]">{translate('common.cards.paymentInfo.email')}</span>
+            <span className="paragraph-small-medium text-zinc-500 w-[100px]">E-mail</span>
             <span className="paragraph-small-medium text-zinc-950 flex-1">{email}</span>
           </div>
         )}
         <div className="flex items-center h-[60px] px-4 gap-3">
-          <span className="paragraph-small-medium text-zinc-500 w-[100px]">{translate('common.cards.paymentInfo.payment')}</span>
+          <span className="paragraph-small-medium text-zinc-500 w-[100px]">Pagamento</span>
           <button
             type="button"
             onClick={handleOpenAddCardModal}
             className="flex items-center h-8 px-2 paragraph-small-semibold text-zinc-950 border border-zinc-200 rounded-md hover:border-zinc-400 transition-colors cursor-pointer w-fit"
           >
             <IconPlus className="size-[18px]" />
-            <span className="px-1.5">{translate('common.cards.paymentInfo.addCard')}</span>
+            <span className="px-1.5">Adicionar cartão</span>
           </button>
         </div>
       </div>
@@ -109,7 +107,7 @@ export function PaymentInfoCard({
       <div className="border border-zinc-200 rounded-lg overflow-hidden">
         {email && (
           <div className="flex items-center h-[60px] px-4 border-b border-zinc-200 gap-3">
-            <span className="paragraph-small-medium text-zinc-500 w-[100px]">{translate('common.cards.paymentInfo.email')}</span>
+            <span className="paragraph-small-medium text-zinc-500 w-[100px]">E-mail</span>
             <span className="paragraph-small-medium text-zinc-950 flex-1">{email}</span>
           </div>
         )}
@@ -120,7 +118,7 @@ export function PaymentInfoCard({
         >
           {!isExpanded ? (
             <>
-              <span className="paragraph-small-medium text-zinc-500 w-[100px]">{translate('common.cards.paymentInfo.payment')}</span>
+              <span className="paragraph-small-medium text-zinc-500 w-[100px]">Pagamento</span>
               <div className="flex flex-col gap-0.5 flex-1 min-w-0">
                 <span className="paragraph-small-semibold text-zinc-950 truncate">
                   {selectedCard?.name}
@@ -137,7 +135,7 @@ export function PaymentInfoCard({
           ) : (
             <>
               <span className="paragraph-small-semibold text-zinc-950 flex-1">
-                {translate('common.cards.paymentInfo.selectPaymentMethod')}
+                Selecione a forma de pagamento
               </span>
               <div className="size-8 flex items-center justify-center rounded-lg">
                 <IconChevronDown className="size-[18px] text-zinc-500 rotate-180" />
@@ -172,7 +170,7 @@ export function PaymentInfoCard({
                   : 'text-zinc-600 border border-zinc-200 hover:bg-zinc-50'
               }`}
             >
-              {translate('common.cards.paymentInfo.manageCards')}
+              Gerenciar cartões
             </button>
           )}
         </div>
@@ -185,7 +183,7 @@ export function PaymentInfoCard({
       >
         <IconPlus className="size-[18px]" />
         <span className="px-1.5">
-          {isExpanded ? translate('common.cards.paymentInfo.addCard') : translate('common.cards.paymentInfo.newPaymentMethod')}
+          {isExpanded ? 'Adicionar cartão' : 'Nova forma de pagamento'}
         </span>
       </button>
     </div>

package/src/components/ui/feedback/CircularProgress.tsx

@@ -34,10 +34,6 @@ export default function CircularProgress({
       aria-valuenow={current}
       aria-valuemin={0}
       aria-valuemax={total}
-      // i18n-TODO: aria-label hardcoded — CircularProgress has no 'use client' directive and
-      // receives no translate prop, so useTranslations() cannot be called here without
-      // converting it to a client component. Key to use: common.forms.progressAriaLabel ('Progresso').
-      // Either add 'use client' + useTranslations(), or accept a translate prop from the caller.
       aria-label="Progresso"
     >
       <svg width={size} height={size} className="absolute">

package/src/components/ui/feedback/DefaultCircularProgress.tsx

@@ -1,6 +1,5 @@
 'use client';
 
-import { useTranslations } from 'next-intl';
 import {
   calculateRadius,
   calculateCircumference,
@@ -22,7 +21,6 @@ export default function DefaultCircularProgress({
   size = 62,
   strokeWidth = 3,
 }: CircularProgressProps) {
-  const translate = useTranslations();
   const isDefaultWl = useIsDefaultWhitelabel();
   const radius = calculateRadius(size, strokeWidth);
   const circumference = calculateCircumference(radius);
@@ -37,7 +35,7 @@ export default function DefaultCircularProgress({
       aria-valuenow={current}
       aria-valuemin={0}
       aria-valuemax={total}
-      aria-label={translate('common.forms.circularProgress.ariaLabel')}
+      aria-label="Progresso de exportação"
     >
       <svg width={size} height={size} className="absolute">
         <circle

package/src/components/ui/form/ComboboxField.tsx

@@ -1,7 +1,6 @@
 'use client';
 
 import { useState, useMemo } from 'react';
-import { useTranslations } from 'next-intl';
 import { IconCheck, IconChevronDown, IconSearch } from '@tabler/icons-react';
 import { Popover, PopoverContent, PopoverTrigger } from '../overlay/Popover';
 import { cn } from '../../../infra/utils/clsx';
@@ -29,9 +28,9 @@ interface ComboboxFieldProps {
 export function ComboboxField({
   options,
   label,
-  placeholder,
-  searchPlaceholder,
-  emptyMessage,
+  placeholder = 'Selecione uma opção',
+  searchPlaceholder = 'Buscar...',
+  emptyMessage = 'Nenhuma opção encontrada.',
   value,
   onChange,
   disabled = false,
@@ -39,10 +38,6 @@ export function ComboboxField({
   className,
   containerClassName,
 }: ComboboxFieldProps) {
-  const translate = useTranslations();
-  const resolvedPlaceholder = placeholder ?? translate('common.forms.combobox.placeholder');
-  const resolvedSearchPlaceholder = searchPlaceholder ?? translate('common.forms.combobox.searchPlaceholder');
-  const resolvedEmptyMessage = emptyMessage ?? translate('common.forms.combobox.emptyMessage');
   const [open, setOpen] = useState(false);
   const [search, setSearch] = useState('');
 
@@ -95,7 +90,7 @@ export function ComboboxField({
             <span className={cn('truncate text-left', !selectedOption && 'text-gray-400')}>
               {selectedOption
                 ? (selectedOption.displayValue ?? selectedOption.label)
-                : resolvedPlaceholder}
+                : placeholder}
             </span>
             {icon ?? (
               <IconChevronDown
@@ -119,7 +114,7 @@ export function ComboboxField({
             <IconSearch className="size-4 shrink-0 opacity-50 text-gray-500" />
             <input
               autoFocus
-              placeholder={resolvedSearchPlaceholder}
+              placeholder={searchPlaceholder}
               value={search}
               onChange={(e) => setSearch(e.target.value)}
               className="flex h-full w-full bg-transparent text-sm outline-none placeholder:text-gray-400 paragraph-small-medium text-gray-950"
@@ -128,7 +123,7 @@ export function ComboboxField({
 
           <div className="overflow-y-auto max-h-[280px] p-1">
             {filteredOptions.length === 0 ? (
-              <p className="py-6 text-center paragraph-small-medium text-gray-500">{resolvedEmptyMessage}</p>
+              <p className="py-6 text-center paragraph-small-medium text-gray-500">{emptyMessage}</p>
             ) : (
               filteredOptions.map((option) => {
                 const isSelected = value === option.value;

package/src/components/ui/form/DatePicker.tsx

@@ -1,7 +1,6 @@
 "use client";
 
 import { useState, forwardRef, useEffect } from "react";
-import { useTranslations } from "next-intl";
 import { format } from "date-fns";
 import { Calendar } from "./Calendar";
 import { Popover, PopoverContent, PopoverTrigger } from "../overlay/Popover";
@@ -24,11 +23,9 @@ interface DatePickerProps {
 
 export const DatePicker = forwardRef<HTMLButtonElement, DatePickerProps>(
   (
-    { value, onChange, placeholder, className, disabled },
+    { value, onChange, placeholder = "Selecione a data", className, disabled },
     ref,
   ) => {
-    const translate = useTranslations();
-    const resolvedPlaceholder = placeholder ?? translate('common.forms.datePicker.placeholder');
     const [open, setOpen] = useState(false);
     const [date, setDate] = useState<Date | undefined>(() => {
       return value ? isoParaDataLocal(value) : undefined;
@@ -54,7 +51,7 @@ export const DatePicker = forwardRef<HTMLButtonElement, DatePickerProps>(
       }
     };
 
-    const displayText = date ? format(date, "dd/MM/yyyy") : resolvedPlaceholder;
+    const displayText = date ? format(date, "dd/MM/yyyy") : placeholder;
 
     return (
       <Popover open={open} onOpenChange={setOpen}>

package/src/components/ui/form/DateRangePicker.tsx

@@ -1,7 +1,6 @@
 "use client";
 
 import { useState, forwardRef, useEffect } from "react";
-import { useTranslations } from "next-intl";
 import { format } from "date-fns";
 import { IconCalendar } from '@tabler/icons-react';
 import { DateRange } from "react-day-picker";
@@ -25,9 +24,7 @@ interface DateRangePickerProps {
 }
 
 export const DateRangePicker = forwardRef<HTMLButtonElement, DateRangePickerProps>(
-  ({ value, onChange, placeholder, className, disabled }, ref) => {
-    const translate = useTranslations();
-    const resolvedPlaceholder = placeholder ?? translate('common.forms.dateRangePicker.placeholder');
+  ({ value, onChange, placeholder = "Selecione o período", className, disabled }, ref) => {
     const [open, setOpen] = useState(false);
     const [range, setRange] = useState<DateRange | undefined>(() => {
       if (value?.from && value?.to) {
@@ -65,7 +62,7 @@ export const DateRangePicker = forwardRef<HTMLButtonElement, DateRangePickerProp
 
     const displayText = range?.from && range?.to
       ? `${format(range.from, "dd/MM/yyyy")} - ${format(range.to, "dd/MM/yyyy")}`
-      : resolvedPlaceholder;
+      : placeholder;
 
     return (
       <Popover open={open} onOpenChange={setOpen}>