fix: deletePlaylist now works as intended

main/helpers/db/connectDB.ts

@@ -244,18 +244,31 @@ export const createPlaylist = async (data: any) => {
 };
 
 export const deletePlaylist = async (data: { id: number }) => {
-  await db.transaction(async (tx) => {
-    // Remove all links in playlistSongs
-    await tx.delete(playlistSongs).where(eq(playlistSongs.playlistId, data.id));
+  try {
+    sqlite.exec("BEGIN;");
+
+    // delete all songs from the playlist
+    await db
+      .delete(playlistSongs)
+      .where(eq(playlistSongs.playlistId, data.id));
 
-    // Now delete the playlist
-    const result = await tx.delete(playlists).where(eq(playlists.id, data.id));
+    // delete playlist itself
+    const result = await db
+      .delete(playlists)
+      .where(eq(playlists.id, data.id));
+
+    // check if no rows were affected, throw error if true
     if ("changes" in result && result.changes === 0) {
       throw new Error(`Playlist ${data.id} not found`);
     }
-  });
 
-  return { message: `Playlist ${data.id} deleted successfully` };
+    // commit on success
+    sqlite.exec("COMMIT;");
+    return { message: `Playlist ${data.id} deleted successfully` };
+  } catch (err: any) {
+    sqlite.exec("ROLLBACK;");
+    throw new Error(`Failed to delete playlist: ${err.message}`);
+  }
 };
 
 export const updatePlaylist = async (data: any) => {

renderer/pages/playlists.tsx

@@ -50,7 +50,9 @@ export default function Playlists() {
   useEffect(() => {
     const load = () =>
       window.ipc.invoke("getAllPlaylists").then((resp) => setPlaylists(resp));
+
     load();
+
     const resetListener = window.ipc.on("resetPlaylistsState", load);
     return () => {
       resetListener();
@@ -66,6 +68,7 @@ export default function Playlists() {
   const createPlaylist = async (data: z.infer<typeof formSchema>) => {
     setLoading(true);
     let playlistCoverPath = null;
+
     try {
       const files = data.playlistCover as FileList | undefined;
       if (files && files.length > 0) {
@@ -76,16 +79,19 @@ export default function Playlists() {
           data: Array.from(new Uint8Array(buffer)),
         });
       }
+
       const resp = await window.ipc.invoke("createPlaylist", {
         name: data.name,
         description: data.description,
         cover: playlistCoverPath,
       });
+
       setDialogOpen(false);
       setPreviewUrl("");
       form.reset();
       router.push(`/playlists/${resp.lastInsertRowid}`);
-    } catch {
+    } catch (err) {
+      console.error(err);
       toast(
         <div className="flex w-fit items-center gap-2 text-xs">
           <IconX className="text-red-500" stroke={2} size={16} />
@@ -110,6 +116,7 @@ export default function Playlists() {
           Create Playlist <IconPlus size={14} />
         </Button>
       </div>
+
       <div className="grid w-full grid-cols-5 gap-8">
         {playlists.map((pl) => (
           <Link key={pl.id} href={`/playlists/${pl.id}`} passHref>
@@ -139,6 +146,7 @@ export default function Playlists() {
           </Link>
         ))}
       </div>
+
       <Dialog open={dialogOpen} onOpenChange={setDialogOpen}>
         <DialogContent>
           <DialogHeader>
@@ -147,6 +155,7 @@ export default function Playlists() {
               Add a new playlist to your library.
             </DialogDescription>
           </DialogHeader>
+
           <Form {...form}>
             <form
               onSubmit={form.handleSubmit(createPlaylist)}
@@ -191,6 +200,7 @@ export default function Playlists() {
                   </FormItem>
                 )}
               />
+
               <div className="flex h-full w-full flex-col items-end justify-between gap-4">
                 <div className="flex w-full flex-col gap-2">
                   <FormField
@@ -218,6 +228,7 @@ export default function Playlists() {
                     )}
                   />
                 </div>
+
                 <Button
                   className="w-fit justify-between text-xs"
                   type="submit"