From a11edadae5b21892d64a03de0220799991744069 Mon Sep 17 00:00:00 2001
From: Ruan Bueno <rbcr4z1@gmail.com>
Date: Mon, 1 Dec 2025 11:44:24 -0300
Subject: [PATCH 1/2] refactor: corrigindo produtos

---
 src/app/(authenticated)/shop/page.tsx   | 26 ++++++------
 src/components/dashboard-shell.tsx      |  2 +-
 src/components/shop/product-card.tsx    | 22 +++++-----
 src/components/shop/product-grid.tsx    |  6 +--
 src/components/shop/shopping-cart.tsx   | 53 +++++++++++++------------
 src/server/api/routers/product-order.ts | 13 +++++-
 6 files changed, 66 insertions(+), 56 deletions(-)

diff --git a/src/app/(authenticated)/shop/page.tsx b/src/app/(authenticated)/shop/page.tsx
index c137b94a..5a983876 100644
--- a/src/app/(authenticated)/shop/page.tsx
+++ b/src/app/(authenticated)/shop/page.tsx
@@ -138,7 +138,7 @@ function ShopPageContent() {
 
   return (
     <DashboardShell>
-      <div className="space-y-6">
+      <div className="space-y-6 w-full max-w-full overflow-x-hidden">
         <div>
           <h1 className="text-3xl font-bold">
             Lojinha RHenz
@@ -146,11 +146,11 @@ function ShopPageContent() {
           <h2 className="text-lg text-muted-foreground">
             Compre itens com as marcas do Grupo RHenz
           </h2>
-          <h4 className="text-sm text-muted-foreground">*Possibilidade de compra de brinde de ambas empresas, mas em pedidos <strong> distintos.</strong></h4>
+          <h4 className="text-sm text-muted-foreground break-words">*Possibilidade de compra de brinde de ambas empresas, mas em pedidos <strong> distintos.</strong></h4>
         </div>
 
-        <Tabs defaultValue="products" className="space-y-4">
-          <TabsList className="flex overflow-x-auto justify-center sm:justify-start">
+        <Tabs defaultValue="products" className="space-y-4 w-full max-w-full">
+          <TabsList className="flex overflow-x-auto justify-center sm:justify-start w-full max-w-full">
             <TabsTrigger value="products" className="flex items-center gap-2">
               <ShoppingBag className="h-4 w-4" />
               Produtos
@@ -177,9 +177,9 @@ function ShopPageContent() {
             </TabsTrigger>
           </TabsList>
 
-          <TabsContent value="products">
-            <div className="mb-4 flex flex-col sm:flex-row items-center gap-3">
-              <div className="w-full sm:w-64">
+          <TabsContent value="products" className="w-full max-w-full overflow-x-hidden">
+            <div className="mb-4 flex flex-col sm:flex-row items-center gap-3 w-full max-w-full">
+              <div className="w-full sm:w-64 max-w-full">
                 <Select
                   value={enterprise}
                   onValueChange={(v) => setEnterprise(v as typeof enterprise)}
@@ -196,7 +196,7 @@ function ShopPageContent() {
                   </SelectContent>
                 </Select>
                 {cartEnterprise && (
-                  <p className="text-sm text-muted-foreground">
+                  <p className="text-sm text-muted-foreground break-words">
                     Filtro automático: mostrando apenas produtos de {cartEnterprise}
                   </p>
                 )}
@@ -205,16 +205,16 @@ function ShopPageContent() {
             <ProductGrid size="sm" enterpriseFilter={enterprise} />
           </TabsContent>
 
-          <TabsContent value="cart" className="flex justify-center">
-            <div className="w-full max-w-lg">
+          <TabsContent value="cart" className="flex justify-center w-full max-w-full overflow-x-hidden">
+            <div className="w-full max-w-lg px-2">
               <ShoppingCart />
             </div>
           </TabsContent>
 
-          <TabsContent value="orders" className="overflow-y-auto max-h-[calc(100vh-200px)] p-2 md:p-0">
+          <TabsContent value="orders" className="overflow-y-auto overflow-x-hidden max-h-[calc(100vh-200px)] p-2 md:p-0 w-full max-w-full">
             {/* Filtro de pedidos */}
-            <div className="mb-4 flex flex-col sm:flex-row items-center gap-3">
-              <div className="w-full sm:w-64">
+            <div className="mb-4 flex flex-col sm:flex-row items-center gap-3 w-full max-w-full">
+              <div className="w-full sm:w-64 max-w-full">
                 <Select value={orderFilter} onValueChange={(v) => setOrderFilter(v as typeof orderFilter)}>
                   <SelectTrigger>
                     <SelectValue placeholder="Filtrar por status" />
diff --git a/src/components/dashboard-shell.tsx b/src/components/dashboard-shell.tsx
index 99ab3bc4..073a6435 100644
--- a/src/components/dashboard-shell.tsx
+++ b/src/components/dashboard-shell.tsx
@@ -8,7 +8,7 @@ export function DashboardShell({
   ...props
 }: DashboardShellProps) {
   return (
-    <div className={cn("flex-1 space-y-4 p-8 pt-6", className)} {...props}>
+    <div className={cn("flex-1 space-y-4 p-8 pt-6 w-full max-w-full overflow-x-hidden", className)} {...props}>
       {children}
     </div>
   )
diff --git a/src/components/shop/product-card.tsx b/src/components/shop/product-card.tsx
index bd67a531..cce9e93c 100644
--- a/src/components/shop/product-card.tsx
+++ b/src/components/shop/product-card.tsx
@@ -51,25 +51,25 @@ function ProductCard({ product, size = "md" }: ProductCardProps) {
           />
         </div>
       </div>
-      <CardHeader className="pb-2">
-        <div className="flex items-start justify-between">
-          <div>
-            <CardTitle>{product.name}</CardTitle>
+      <CardHeader className="pb-2 min-w-0">
+        <div className="flex items-start justify-between gap-2 min-w-0">
+          <div className="flex-1 min-w-0">
+            <CardTitle className="break-words line-clamp-2">{product.name}</CardTitle>
           </div>
-          <div className="flex flex-col gap-2 items-end">
-            <Badge>{product.enterprise}</Badge>
+          <div className="flex flex-col gap-2 items-end flex-shrink-0">
+            <Badge className="whitespace-nowrap">{product.enterprise}</Badge>
           </div>
         </div>
         <div className="mt-2">
-          <p className="text-2xl font-bold text-primary">
+          <p className="text-2xl font-bold text-primary truncate">
             R$ {product.price.toLocaleString('pt-BR', { minimumFractionDigits: 2, maximumFractionDigits: 2 })}
           </p>
         </div>
       </CardHeader>
-      <CardContent className="pb-2 flex-1">
-        <div className="flex items-center gap-2 text-sm text-muted-foreground">
-          <LucideBadgeInfo className="h-4 w-4" />
-          <span>{product.description}</span>
+      <CardContent className="pb-2 flex-1 min-w-0">
+        <div className="flex items-center gap-2 text-sm text-muted-foreground min-w-0">
+          <LucideBadgeInfo className="h-4 w-4 flex-shrink-0" />
+          <span className="line-clamp-2 break-words">{product.description}</span>
         </div>
       </CardContent>
       <CardFooter>
diff --git a/src/components/shop/product-grid.tsx b/src/components/shop/product-grid.tsx
index 424d4a64..5b13317c 100644
--- a/src/components/shop/product-grid.tsx
+++ b/src/components/shop/product-grid.tsx
@@ -21,7 +21,7 @@ function ProductGrid({ size = "md", enterpriseFilter = "ALL" }: ProductGridProps
             skeletonItems.push(i)
         }
         return (
-            <div className="grid grid-cols-1 sm:grid-cols-2 md:grid-cols-3 lg:grid-cols-4 xl:grid-cols-5 gap-3">
+            <div className="grid grid-cols-1 sm:grid-cols-2 md:grid-cols-3 lg:grid-cols-4 xl:grid-cols-5 gap-3 w-full max-w-full overflow-x-hidden">
                 {skeletonItems.map((i) => (
                     <div key={i} className="col-span-1 h-56 bg-muted animate-pulse rounded-lg" />
                 ))}
@@ -42,10 +42,10 @@ function ProductGrid({ size = "md", enterpriseFilter = "ALL" }: ProductGridProps
     ) || []
 
     return (
-        <div className="grid grid-cols-1 sm:grid-cols-2 md:grid-cols-3 lg:grid-cols-4 xl:grid-cols-5 gap-3 items-stretch">
+        <div className="grid grid-cols-1 sm:grid-cols-2 md:grid-cols-3 lg:grid-cols-4 xl:grid-cols-5 gap-3 items-stretch w-full max-w-full overflow-x-hidden">
             {
                 filtered.map((p) => (
-                    <div key={p.id} className="col-span-1 h-full">
+                    <div key={p.id} className="col-span-1 h-full w-full max-w-full">
                         <ProductCard product={p} size={size}/>
                     </div>
                 ))
diff --git a/src/components/shop/shopping-cart.tsx b/src/components/shop/shopping-cart.tsx
index 0b0955b5..78338c6c 100644
--- a/src/components/shop/shopping-cart.tsx
+++ b/src/components/shop/shopping-cart.tsx
@@ -12,6 +12,7 @@ import { useCart } from "@/hooks/use-cart"
 import { CreateOrderModal } from "./create-order-modal"
 import { OrderSuccessModal } from "./order-success-modal"
 import type { Product } from "@prisma/client"
+import { cn } from "@/lib/utils"
 
 interface ShoppingCartProps {
   className?: string
@@ -55,18 +56,18 @@ const ShoppingCart = memo(function ShoppingCart({ className }: ShoppingCartProps
 
   if (totalItems === 0) {
     return (
-      <Card className={className}>
+      <Card className={cn("w-full max-w-full overflow-hidden", className)}>
         <CardHeader className="pb-3">
           <CardTitle className="flex items-center gap-2">
-            <ShoppingCartIcon className="h-5 w-5" />
-            Carrinho
+            <ShoppingCartIcon className="h-5 w-5 flex-shrink-0" />
+            <span className="truncate">Carrinho</span>
           </CardTitle>
         </CardHeader>
-        <CardContent>
+        <CardContent className="w-full max-w-full">
           <div className="text-center py-8 text-muted-foreground">
             <ShoppingCartIcon className="h-12 w-12 mx-auto mb-4 opacity-50" />
-            <p>Seu carrinho está vazio</p>
-            <p className="text-sm mt-1">Adicione produtos para começar</p>
+            <p className="break-words">Seu carrinho está vazio</p>
+            <p className="text-sm mt-1 break-words">Adicione produtos para começar</p>
           </div>
         </CardContent>
       </Card>
@@ -74,13 +75,13 @@ const ShoppingCart = memo(function ShoppingCart({ className }: ShoppingCartProps
   }
   return (
     <>
-      <Card className={className}>
+      <Card className={cn("w-full max-w-full overflow-hidden", className)}>
         <CardHeader className="pb-3">
-          <div className="flex items-center justify-between">
-            <CardTitle className="flex items-center gap-2">
-              <ShoppingCartIcon className="h-5 w-5" />
-              Carrinho
-              {enterprise && <Badge variant="outline">{enterprise}</Badge>}
+          <div className="flex items-center justify-between gap-2 min-w-0">
+            <CardTitle className="flex items-center gap-2 min-w-0 flex-1">
+              <ShoppingCartIcon className="h-5 w-5 flex-shrink-0" />
+              <span className="truncate">Carrinho</span>
+              {enterprise && <Badge variant="outline" className="flex-shrink-0">{enterprise}</Badge>}
             </CardTitle>
             <Button
               variant="ghost"
@@ -92,11 +93,11 @@ const ShoppingCart = memo(function ShoppingCart({ className }: ShoppingCartProps
             </Button>
           </div>
         </CardHeader>
-        <CardContent className="p-0">
-          <ScrollArea className="max-h-96">
-            <div className="space-y-3 p-4">
+        <CardContent className="p-0 w-full max-w-full overflow-hidden">
+          <ScrollArea className="max-h-96 w-full">
+            <div className="space-y-3 p-4 w-full max-w-full">
               {items.map((item) => (
-                <div key={item.product.id} className="flex gap-3">
+                <div key={item.product.id} className="flex gap-3 w-full max-w-full min-w-0">
                   {item.product.imageUrl && item.product.imageUrl.length > 0 && (
                     <div className="relative h-16 w-16 rounded-md overflow-hidden border flex-shrink-0">
                       <Image
@@ -109,9 +110,9 @@ const ShoppingCart = memo(function ShoppingCart({ className }: ShoppingCartProps
                     </div>
                   )}
 
-                  <div className="flex-1 min-w-0">
-                    <h4 className="font-medium text-sm line-clamp-2">{item.product.name}</h4>
-                    <p className="text-sm text-muted-foreground">
+                  <div className="flex-1 min-w-0 overflow-hidden">
+                    <h4 className="font-medium text-sm line-clamp-2 break-words">{item.product.name}</h4>
+                    <p className="text-sm text-muted-foreground truncate">
                       R$ {item.product.price.toLocaleString("pt-BR", { minimumFractionDigits: 2, maximumFractionDigits: 2 })}
                     </p>
 
@@ -157,21 +158,21 @@ const ShoppingCart = memo(function ShoppingCart({ className }: ShoppingCartProps
 
           <Separator />
 
-          <div className="p-4 space-y-4">
-            <div className="flex items-center justify-between text-lg font-semibold">
-              <span>Total:</span>
-              <span className="text-primary">
+          <div className="p-4 space-y-4 w-full max-w-full">
+            <div className="flex items-center justify-between text-lg font-semibold gap-2 min-w-0">
+              <span className="flex-shrink-0">Total:</span>
+              <span className="text-primary truncate">
                 R$ {totalPrice.toLocaleString("pt-BR", { minimumFractionDigits: 2, maximumFractionDigits: 2 })}
               </span>
             </div>
 
             <Button
               onClick={handleCheckout}
-              className="w-full"
+              className="w-full max-w-full"
               size="lg"
             >
-              <CreditCard className="mr-2 h-4 w-4" />
-              Finalizar Pedido ({totalItems} {totalItems === 1 ? 'item' : 'itens'})
+              <CreditCard className="mr-2 h-4 w-4 flex-shrink-0" />
+              <span className="truncate">Finalizar Pedido ({totalItems} {totalItems === 1 ? 'item' : 'itens'})</span>
             </Button>
           </div>
         </CardContent>
diff --git a/src/server/api/routers/product-order.ts b/src/server/api/routers/product-order.ts
index c9cc22ca..97df8ecd 100644
--- a/src/server/api/routers/product-order.ts
+++ b/src/server/api/routers/product-order.ts
@@ -148,7 +148,11 @@ export const productOrderRouter = createTRPCRouter({
                         : (order.user.firstName ?? order.user.email ?? "Usuário")
                     
                     const userEmail = order.user.email
-                    const dataPedido = new Date().toLocaleString('pt-BR', {
+                    // Usar a data do pedido criado e formatar no timezone de São Paulo (UTC-3)
+                    // Garantir que estamos usando a data/hora exata do pedido
+                    const orderDate = order.orderTimestamp || order.createdAt || new Date()
+                    // Formatar a data no timezone de São Paulo usando Intl.DateTimeFormat para maior precisão
+                    const dateFormatter = new Intl.DateTimeFormat('pt-BR', {
                         day: '2-digit',
                         month: '2-digit',
                         year: 'numeric',
@@ -156,6 +160,7 @@ export const productOrderRouter = createTRPCRouter({
                         minute: '2-digit',
                         timeZone: 'America/Sao_Paulo' // UTC-3
                     })
+                    const dataPedido = dateFormatter.format(new Date(orderDate))
 
                     const precoTotal = order.product.price * order.quantity
 
@@ -415,7 +420,10 @@ export const productOrderRouter = createTRPCRouter({
                             : (firstOrder?.user.firstName ?? firstOrder?.user.email ?? "Usuário")
 
                         const userEmail = firstOrder?.user.email
-                        const dataPedido = new Date().toLocaleString('pt-BR', {
+                        // Usar a data do primeiro pedido criado e formatar no timezone de São Paulo
+                        const orderDate = firstOrder?.orderTimestamp || firstOrder?.createdAt || new Date()
+                        // Formatar a data no timezone de São Paulo usando Intl.DateTimeFormat para maior precisão
+                        const dateFormatter = new Intl.DateTimeFormat('pt-BR', {
                             day: '2-digit',
                             month: '2-digit',
                             year: 'numeric',
@@ -423,6 +431,7 @@ export const productOrderRouter = createTRPCRouter({
                             minute: '2-digit',
                             timeZone: 'America/Sao_Paulo' // UTC-3
                         })
+                        const dataPedido = dateFormatter.format(new Date(orderDate))
 
                         // Calcular total de todos os pedidos
                         const totalGeral = orders.reduce((total, order) => {

From abf4ab1f4613132093f720d0f12cf1893393863c Mon Sep 17 00:00:00 2001
From: Ruan Bueno <rbcr4z1@gmail.com>
Date: Mon, 1 Dec 2025 11:59:44 -0300
Subject: [PATCH 2/2] refactor: corrigindo produtos

---
 src/server/api/routers/product-order.ts | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/src/server/api/routers/product-order.ts b/src/server/api/routers/product-order.ts
index 97df8ecd..98557987 100644
--- a/src/server/api/routers/product-order.ts
+++ b/src/server/api/routers/product-order.ts
@@ -150,7 +150,7 @@ export const productOrderRouter = createTRPCRouter({
                     const userEmail = order.user.email
                     // Usar a data do pedido criado e formatar no timezone de São Paulo (UTC-3)
                     // Garantir que estamos usando a data/hora exata do pedido
-                    const orderDate = order.orderTimestamp || order.createdAt || new Date()
+                    const orderDate = (order.orderTimestamp ?? order.createdAt) || new Date()
                     // Formatar a data no timezone de São Paulo usando Intl.DateTimeFormat para maior precisão
                     const dateFormatter = new Intl.DateTimeFormat('pt-BR', {
                         day: '2-digit',
@@ -421,7 +421,7 @@ export const productOrderRouter = createTRPCRouter({
 
                         const userEmail = firstOrder?.user.email
                         // Usar a data do primeiro pedido criado e formatar no timezone de São Paulo
-                        const orderDate = firstOrder?.orderTimestamp || firstOrder?.createdAt || new Date()
+                        const orderDate = firstOrder?.orderTimestamp ?? firstOrder?.createdAt ?? new Date()
                         // Formatar a data no timezone de São Paulo usando Intl.DateTimeFormat para maior precisão
                         const dateFormatter = new Intl.DateTimeFormat('pt-BR', {
                             day: '2-digit',