chore: add project files and setup gitignore

reserva-mesa-dashboard/components/dashboard/OccupancyPieChart.tsx

@@ -0,0 +1,48 @@
+"use client";
+
+import React from "react";
+import { PieChart, Pie, Cell, ResponsiveContainer, Legend, Tooltip } from "recharts";
+
+interface OccupancyPieChartProps {
+  data: { name: string; value: number; color: string }[];
+}
+
+export function OccupancyPieChart({ data }: OccupancyPieChartProps) {
+  const [mounted, setMounted] = React.useState(false);
+
+  React.useEffect(() => {
+    setMounted(true);
+  }, []);
+
+  if (!mounted) return <div className="h-[300px] w-full flex items-center justify-center bg-muted/10 animate-pulse rounded-lg" />;
+
+  return (
+    <ResponsiveContainer width="100%" height={300}>
+      <PieChart>
+        <Pie
+          data={data}
+          cx="50%"
+          cy="50%"
+          innerRadius={60}
+          outerRadius={80}
+          paddingAngle={5}
+          dataKey="value"
+        >
+          {data.map((entry, index) => (
+            <Cell key={`cell-${index}`} fill={entry.color} />
+          ))}
+        </Pie>
+        <Tooltip 
+          contentStyle={{ backgroundColor: "#1A1814", border: "1px solid #2A261E", borderRadius: "8px" }}
+          itemStyle={{ color: "#fff" }}
+        />
+        <Legend 
+          verticalAlign="bottom" 
+          align="center"
+          iconType="circle"
+          formatter={(value) => <span className="text-xs text-muted-foreground">{value}</span>}
+        />
+      </PieChart>
+    </ResponsiveContainer>
+  );
+}