feat: add bitrate visualization with file analysis

Add comprehensive bitrate data extraction and visualization capabilities:
- Implement analyze_files command for file candidacy detection
- Add extract_bitrate_data command using ffprobe
- Create BitrateData, BitrateFrame, File, and FileCandidacy types with TS bindings
- Update App to fetch and display bitrate data from dropped files
- Refactor DropOverlay to use new file analysis system
- Configure Graph component for packet size visualization
- Simplify drag-drop flow to trigger on drop event only

src/App.tsx

@@ -1,13 +1,45 @@
+import { useEffect, useState } from "react";
 import { useDragDropPaths } from "@/hooks/useDragDropPaths";
 import Graph from "@/components/graph";
 import DropOverlay from "@/components/drop-overlay";
 import type { Frame } from "@/types/graph";
+import { commands } from "@/bindings";
+import type { BitrateData } from "@/bindings";
 
 function App() {
-	const data: Frame[] = [];
-
+	const [data, setData] = useState<Frame[]>([]);
+	const [isLoading, setIsLoading] = useState(false);
 	const paths = useDragDropPaths();
 
+	useEffect(() => {
+		if (paths.length === 0) {
+			return;
+		}
+
+		// For minimal prototype, just process the first file
+		const firstPath = paths[0];
+		setIsLoading(true);
+
+		commands
+			.extractBitrateData(firstPath)
+			.then((bitrateData: BitrateData) => {
+				// Transform BitrateData to Nivo's Frame format
+				const frame: Frame = {
+					id: bitrateData.id,
+					data: bitrateData.frames.map((frame) => ({
+						x: frame.frame_num,
+						y: Number(frame.packet_size),
+					})),
+				};
+				setData([frame]);
+				setIsLoading(false);
+			})
+			.catch((error) => {
+				console.error("Failed to extract bitrate data:", error);
+				setIsLoading(false);
+			});
+	}, [paths]);
+
 	const graph = <Graph data={data} />;
 
 	return (
@@ -17,6 +49,11 @@ function App() {
 			style={{ "--wails-drop-target": "drop" } as React.CSSProperties}
 		>
 			<DropOverlay paths={paths} />
+			{isLoading && (
+				<div className="absolute z-20 top-4 right-4 text-white bg-blue-600 px-4 py-2 rounded-lg">
+					Extracting bitrate data...
+				</div>
+			)}
 			{graph}
 		</div>
 	);