refactor(support): replace mock data with real costs and simplify stats

Updated support page to use real data instead of mock values, including monthly costs

app/[locale]/apoiar/page.tsx

@@ -10,7 +10,7 @@ import {
   AccordionItem,
   AccordionTrigger,
 } from "@/components/ui/accordion";
-import { Heart, Server, Code, Shield, AlertTriangle } from "lucide-react";
+import { Heart } from "lucide-react";
 import { getTranslations } from "next-intl/server";
 import Link from "next/link";
 import { ShareButton } from "@/components/share-button";
@@ -36,44 +36,19 @@ export default async function SupportPage({
   const { locale } = await params;
   const t = await getTranslations({ locale, namespace: "donation" });
 
-  // Dados mockados para demonstração
+  // Dados REAIS para demonstração
   const stats = {
-    totalSupporters: 1247,
-    totalRaised: 18542,
-    monthsOnline: 12,
-    uptime: 99.8,
+    monthsOnline: 1,
+    uptime: 100,
   };
 
-  const transparencyData = [
-    {
-      icon: Server,
-      title: t("transparency.hosting"),
-      percentage: 40,
-      description: t("transparency.hostingDesc"),
-      color: "text-blue-500",
-    },
-    {
-      icon: Code,
-      title: t("transparency.development"),
-      percentage: 35,
-      description: t("transparency.developmentDesc"),
-      color: "text-green-500",
-    },
-    {
-      icon: Shield,
-      title: t("transparency.support"),
-      percentage: 15,
-      description: t("transparency.supportDesc"),
-      color: "text-purple-500",
-    },
-    {
-      icon: AlertTriangle,
-      title: t("transparency.emergency"),
-      percentage: 10,
-      description: t("transparency.emergencyDesc"),
-      color: "text-orange-500",
-    },
-  ];
+  // Custos mensais REAIS
+  const monthlyCosts = {
+    vps: 69, // R$ 69/mês
+    devHours: 40, // média horas/mês
+    devRate: 50, // R$ 50/hora
+    total: 2069, // R$ 69 + (40 * 50)
+  };
 
   const faqItems = [
     {
@@ -136,58 +111,39 @@ export default async function SupportPage({
           </div>
         </BlurFade>
 
-        {/* Transparência */}
+        {/* Custos Reais */}
         <BlurFade delay={0.3}>
           <div className="mb-20">
             <h2 className="text-3xl font-bold text-center mb-8">
-              {t("transparency.title")}
+              {t("costs.title")}
             </h2>
-            <div className="grid grid-cols-1 md:grid-cols-2 gap-6 max-w-4xl mx-auto">
-              {transparencyData.map((item, idx) => (
-                <div
-                  key={idx}
-                  className="p-6 rounded-xl border border-border/50 bg-card backdrop-blur-sm"
-                >
-                  <div className="flex items-start gap-4">
-                    <div className="p-3 rounded-lg bg-muted/50">
-                      <item.icon className={`w-6 h-6 ${item.color}`} />
-                    </div>
-                    <div className="flex-1">
-                      <div className="flex items-center justify-between mb-2">
-                        <h3 className="font-semibold">{item.title}</h3>
-                        <Badge variant="secondary">{item.percentage}%</Badge>
-                      </div>
-                      <p className="text-sm text-muted-foreground">
-                        {item.description}
-                      </p>
-                    </div>
-                  </div>
-                </div>
-              ))}
+            <div className="max-w-2xl mx-auto space-y-4">
+              <div className="flex justify-between items-center p-4 rounded-lg bg-card border">
+                <span className="text-lg">{t("costs.vps")}</span>
+                <Badge variant="secondary" className="text-lg">
+                  {t("costs.vpsValue")}
+                </Badge>
+              </div>
+              <div className="flex justify-between items-center p-4 rounded-lg bg-card border">
+                <span className="text-lg">{t("costs.dev")}</span>
+                <Badge variant="secondary" className="text-lg">
+                  {t("costs.devValue")}
+                </Badge>
+              </div>
+              <div className="flex justify-between items-center p-6 rounded-lg bg-primary/10 border-2 border-primary">
+                <span className="text-xl font-bold">{t("costs.total")}</span>
+                <Badge className="text-xl bg-primary">
+                  {t("costs.totalValue")}
+                </Badge>
+              </div>
             </div>
           </div>
         </BlurFade>
 
-        {/* Prova Social */}
+        {/* Estatísticas Simplificadas */}
         <BlurFade delay={0.4}>
           <div className="mb-20">
-            <div className="grid grid-cols-2 md:grid-cols-4 gap-8 text-center">
-              <div>
-                <p className="text-3xl font-bold text-primary mb-2">
-                  <NumberTicker value={stats.totalSupporters} />
-                </p>
-                <p className="text-sm text-muted-foreground">
-                  {t("social.supporters")}
-                </p>
-              </div>
-              <div>
-                <p className="text-3xl font-bold text-primary mb-2">
-                  R$ <NumberTicker value={stats.totalRaised} />
-                </p>
-                <p className="text-sm text-muted-foreground">
-                  {t("social.raised")}
-                </p>
-              </div>
+            <div className="grid grid-cols-2 gap-8 text-center max-w-md mx-auto">
               <div>
                 <p className="text-3xl font-bold text-primary mb-2">
                   <NumberTicker value={stats.monthsOnline} />

app/api/donations/create/route.ts

@@ -17,22 +17,24 @@ export async function POST(request: NextRequest) {
       );
     }
 
-    const billing = await abacatePay.createBilling({
+    const billing = await abacatePay.createDonationBilling({
       amount: body.amount,
-      metadata: {
-        donorName: body.donorName,
-        donorEmail: body.donorEmail,
-        message: body.message,
-      },
-      returnUrl: `${process.env.NEXT_PUBLIC_BASE_URL}/apoiar/obrigado`,
-      completionUrl: `${process.env.NEXT_PUBLIC_BASE_URL}/api/donations/verify`,
+      donorEmail: body.donorEmail,
+      donorName: body.donorName,
+      message: body.message,
     });
 
+    // AbacatePay pode retornar diferentes formatos
+    const pixCode = billing.pixCode || billing.qrCode;
+    const pixQrCode = billing.pixQrCode || billing.qrCode;
+    const paymentUrl = billing.url || billing.paymentUrl;
+
     return NextResponse.json({
       success: true,
       billingId: billing.id,
-      pixCode: billing.pixCode,
-      pixQrCode: billing.pixQrCode,
+      paymentUrl, // URL para redirecionar
+      pixCode,
+      pixQrCode,
       expiresAt: billing.expiresAt,
     });
   } catch (error) {