Initial commit: add .gitignore and README

frontend/components/dashboard/RecentActivity.tsx

@@ -0,0 +1,86 @@
+"use client";
+
+import { useEffect, useRef, useMemo } from "react";
+import { formatAddress } from "@/lib/utils";
+import { format } from "date-fns";
+import { gsap } from "gsap";
+
+interface Transaction {
+  id: string;
+  proposalId: number;
+  to: string;
+  value: string;
+  status: "pending" | "executed" | "rejected";
+  createdAt: Date;
+}
+
+export function RecentActivity() {
+  // TODO: Fetch recent transactions from backend/indexer
+  const transactions = useMemo<Transaction[]>(() => [], []); // Placeholder
+  const containerRef = useRef<HTMLDivElement>(null);
+
+  useEffect(() => {
+    if (containerRef.current && transactions.length > 0) {
+      const items = containerRef.current.children;
+      gsap.from(items, {
+        opacity: 0,
+        x: -20,
+        duration: 0.5,
+        stagger: 0.1,
+        ease: "power2.out",
+      });
+    }
+  }, [transactions]);
+
+  return (
+    <div>
+      <h2 className="text-2xl font-semibold mb-4">Recent Activity</h2>
+      <div className="bg-gray-900 rounded-xl p-6">
+        {transactions.length === 0 ? (
+          <div className="text-center py-8 text-gray-400">
+            No recent transactions
+          </div>
+        ) : (
+          <div ref={containerRef} className="space-y-4">
+            {transactions.map((tx) => (
+              <div
+                key={tx.id}
+                className="bg-gray-800 rounded-lg p-4 border border-gray-700 hover:border-gray-600 transition-colors"
+              >
+                <div className="flex justify-between items-start">
+                  <div className="flex-1">
+                    <div className="flex items-center gap-3 mb-2">
+                      <span className="text-sm font-mono text-gray-400">
+                        #{tx.proposalId}
+                      </span>
+                      <span
+                        className={`px-2 py-1 rounded text-xs font-semibold ${
+                          tx.status === "executed"
+                            ? "bg-green-900/30 text-green-400"
+                            : tx.status === "pending"
+                            ? "bg-yellow-900/30 text-yellow-400"
+                            : "bg-red-900/30 text-red-400"
+                        }`}
+                      >
+                        {tx.status}
+                      </span>
+                    </div>
+                    <div className="text-sm text-gray-300">
+                      <span className="text-gray-500">To:</span> {formatAddress(tx.to)}
+                    </div>
+                    <div className="text-sm text-gray-400 mt-1">
+                      {format(new Date(tx.createdAt), "MMM dd, yyyy HH:mm")}
+                    </div>
+                  </div>
+                  <div className="text-right">
+                    <div className="text-lg font-semibold">{tx.value} ETH</div>
+                  </div>
+                </div>
+              </div>
+            ))}
+          </div>
+        )}
+      </div>
+    </div>
+  );
+}