diff --git a/src/components/DragAndDrop.tsx b/src/components/DragAndDrop.tsx index c27faef..e96f591 100644 --- a/src/components/DragAndDrop.tsx +++ b/src/components/DragAndDrop.tsx @@ -19,11 +19,20 @@ export default function DragAndDrop({ className, onFile }: DragAndDropProps) { const [isHovering, setIsHovering] = useState("off"); async function isValid(paths: string[]): Promise { - console.log({ paths }); return paths.length === 1 && paths[0].endsWith(".zip") && exists(paths[0]); } useEffect(() => { + const unlistenDrop = listen( + "tauri://drag-drop", + async (event) => { + setIsHovering("off"); + if (await isValid(event.payload.paths)) { + onFile(event.payload.paths[0]); + } + } + ).then((fn) => fn); + const unlistenEnter = listen( "tauri://drag-enter", async (event) => { @@ -37,8 +46,11 @@ export default function DragAndDrop({ className, onFile }: DragAndDropProps) { }).then((fn) => fn); return () => { - unlistenEnter.then(() => {}); - unlistenLeave.then(() => {}); + Promise.all([unlistenDrop, unlistenEnter, unlistenLeave]).then( + (results) => { + console.log("DragAndDrop listeners removed.", results); + } + ); }; }); @@ -54,13 +66,13 @@ export default function DragAndDrop({ className, onFile }: DragAndDropProps) { title: "Select a save file", filters: [ { - name: "ZIP Archive", + name: "Factorio Save File", extensions: ["zip"], }, ], }); - if (selectedFile !== null) { + if (selectedFile !== null && (await exists(selectedFile))) { onFile(selectedFile); } } @@ -76,7 +88,8 @@ export default function DragAndDrop({ className, onFile }: DragAndDropProps) { { "hover:bg-zinc-800 hover:border-zinc-500": isHovering === "off", "bg-zinc-800 border-zinc-500": isHovering === "valid", - "bg-red-800/25 border-red-700/25": isHovering === "invalid", + "bg-red-800/25 border-red-700/25 cursor-not-allowed": + isHovering === "invalid", } )} >