wip: dialog to choose folder to watch

frontend/src/components/ImageViewer.tsx

@@ -1,37 +1,40 @@
 import { createEffect, createSignal } from "solid-js";
 import { listen } from "@tauri-apps/api/event";
 import { FolderPicker } from "./FolderPicker";
+import { sendImage } from "../network";
 
 export function ImageViewer() {
-	const [latestImage, setLatestImage] = createSignal<string | null>(null);
+    const [latestImage, setLatestImage] = createSignal<string | null>(null);
 
-	createEffect(() => {
-		// Listen for PNG processing events
-		const unlisten = listen("png-processed", (event) => {
-			console.log("Received processed PNG");
-			const base64Data = event.payload as string;
-			setLatestImage(`data:image/png;base64,${base64Data}`);
-		});
+    createEffect(() => {
+        // Listen for PNG processing events
+        const unlisten = listen("png-processed", (event) => {
+            console.log("Received processed PNG");
+            const base64Data = event.payload as string;
+            setLatestImage(`data:image/png;base64,${base64Data}`);
 
-		return () => {
-			unlisten.then((fn) => fn()); // Cleanup listener
-		};
-	});
+            sendImage("test-image.png", base64Data);
+        });
 
-	return (
-		<div>
-			<FolderPicker />
+        return () => {
+            unlisten.then((fn) => fn()); // Cleanup listener
+        };
+    });
 
-			{latestImage() && (
-				<div class="mt-4">
-					<h3>Latest Processed Image:</h3>
-					<img
-						src={latestImage() || undefined}
-						alt="Latest processed"
-						class="max-w-md"
-					/>
-				</div>
-			)}
-		</div>
-	);
+    return (
+        <div>
+            <FolderPicker />
+
+            {latestImage() && (
+                <div class="mt-4">
+                    <h3>Latest Processed Image:</h3>
+                    <img
+                        src={latestImage() || undefined}
+                        alt="Latest processed"
+                        class="max-w-md"
+                    />
+                </div>
+            )}
+        </div>
+    );
 }