first commit

src/components/dashboard/TaxaSucessoCard.tsx

@@ -0,0 +1,39 @@
+import React from 'react';
+import { useQuery } from 'react-query';
+import api from '../../services/api';
+
+export const TaxaSucessoCard: React.FC = () => {
+  const { data: stats } = useQuery('taxa-sucesso', async () => {
+    const response = await api.get('/dashboard/processos/taxa-sucesso');
+    return response.data;
+  });
+
+  if (!stats) return null;
+
+  const estatisticas = stats || [];
+  const total = estatisticas.reduce((acc: number, curr: any) => acc + (curr._count || 0), 0);
+  
+  return (
+    <div className="bg-white rounded-lg shadow p-6">
+      <h3 className="text-lg font-semibold mb-4">Taxa de Sucesso</h3>
+      <div className="flex items-center justify-between">
+        <div className="text-3xl font-bold text-green-600">
+          {estatisticas.find((s: any) => s.resultado === 'PROCEDENTE')?._count
+            ? Math.round((estatisticas.find((s: any) => s.resultado === 'PROCEDENTE')._count / total) * 100)
+            : 0}%
+        </div>
+        <div className="text-sm text-gray-500">
+          Total julgados: {total}
+        </div>
+      </div>
+      <div className="mt-4 space-y-2">
+        {estatisticas.map((item: any) => (
+          <div key={item.resultado} className="flex justify-between">
+            <span className="text-sm text-gray-600">{item.resultado}</span>
+            <span className="text-sm font-medium">{Math.round((item._count / total) * 100)}%</span>
+          </div>
+        ))}
+      </div>
+    </div>
+  );
+};